@primer/primitives 7.17.0-rc.34cd1021 → 7.17.0-rc.37869577

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.
Files changed (76) hide show
  1. package/README.md +1 -1
  2. package/dist/css/functional/typography/typography.css +1 -1
  3. package/dist/docs/base/typography/typography.json +4 -52
  4. package/dist/docs/functional/themes/dark-colorblind.json +78 -78
  5. package/dist/docs/functional/themes/dark-dimmed.json +73 -73
  6. package/dist/docs/functional/themes/dark-high-contrast.json +75 -75
  7. package/dist/docs/functional/themes/dark-tritanopia.json +78 -78
  8. package/dist/docs/functional/themes/dark.json +73 -73
  9. package/dist/docs/functional/themes/light-colorblind.json +76 -76
  10. package/dist/docs/functional/themes/light-high-contrast.json +70 -70
  11. package/dist/docs/functional/themes/light-tritanopia.json +76 -76
  12. package/dist/docs/functional/themes/light.json +71 -71
  13. package/dist/docs/functional/typography/typography.json +35 -439
  14. package/dist/fallbacks/functional/typography/typography.json +1 -1
  15. package/dist/figma/figma.json +0 -8
  16. package/dist/figma/scales/dark-dimmed.json +20 -20
  17. package/dist/figma/scales/dark-high-constrast.json +20 -20
  18. package/dist/figma/scales/dark.json +20 -20
  19. package/dist/figma/scales/light-high-constrast.json +20 -20
  20. package/dist/figma/scales/light.json +20 -20
  21. package/dist/figma/themes/dark-colorblind.json +70 -70
  22. package/dist/figma/themes/dark-dimmed.json +65 -65
  23. package/dist/figma/themes/dark-high-contrast.json +69 -69
  24. package/dist/figma/themes/dark-tritanopia.json +70 -70
  25. package/dist/figma/themes/dark.json +65 -65
  26. package/dist/figma/themes/light-colorblind.json +59 -59
  27. package/dist/figma/themes/light-high-contrast.json +55 -55
  28. package/dist/figma/themes/light-tritanopia.json +59 -59
  29. package/dist/figma/themes/light.json +54 -54
  30. package/dist/figma/typography/typography.json +1 -329
  31. package/dist/internalCss/dark-colorblind.css +20 -20
  32. package/dist/internalCss/dark-dimmed.css +20 -20
  33. package/dist/internalCss/dark-high-contrast.css +20 -20
  34. package/dist/internalCss/dark-tritanopia.css +20 -20
  35. package/dist/internalCss/dark.css +20 -20
  36. package/dist/internalCss/light-colorblind.css +20 -20
  37. package/dist/internalCss/light-high-contrast.css +20 -20
  38. package/dist/internalCss/light-tritanopia.css +20 -20
  39. package/dist/internalCss/light.css +20 -20
  40. package/dist/styleLint/base/typography/typography.json +4 -52
  41. package/dist/styleLint/functional/themes/dark-colorblind.json +78 -78
  42. package/dist/styleLint/functional/themes/dark-dimmed.json +73 -73
  43. package/dist/styleLint/functional/themes/dark-high-contrast.json +75 -75
  44. package/dist/styleLint/functional/themes/dark-tritanopia.json +78 -78
  45. package/dist/styleLint/functional/themes/dark.json +73 -73
  46. package/dist/styleLint/functional/themes/light-colorblind.json +76 -76
  47. package/dist/styleLint/functional/themes/light-high-contrast.json +70 -70
  48. package/dist/styleLint/functional/themes/light-tritanopia.json +76 -76
  49. package/dist/styleLint/functional/themes/light.json +71 -71
  50. package/dist/styleLint/functional/typography/typography.json +35 -439
  51. package/package.json +2 -2
  52. package/src/platforms/figma.ts +0 -1
  53. package/src/tokens/base/color/dark/dark.dimmed.json5 +1 -1
  54. package/src/tokens/base/color/dark/dark.high-contrast.json5 +1 -1
  55. package/src/tokens/base/color/dark/dark.json5 +1 -1
  56. package/src/tokens/base/color/light/light.high-contrast.json5 +1 -1
  57. package/src/tokens/base/color/light/light.json5 +1 -1
  58. package/src/tokens/base/typography/typography.json +4 -28
  59. package/src/tokens/functional/color/dark/app-dark.json5 +5 -5
  60. package/src/tokens/functional/color/dark/overrides/dark.high-contrast.json5 +17 -17
  61. package/src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5 +5 -5
  62. package/src/tokens/functional/color/dark/overrides/dark.tritanopia.json5 +5 -5
  63. package/src/tokens/functional/color/dark/patterns-dark.json5 +42 -42
  64. package/src/tokens/functional/color/dark/primitives-dark.json5 +16 -16
  65. package/src/tokens/functional/color/dark/syntax-dark.json5 +13 -13
  66. package/src/tokens/functional/color/light/app-light.json5 +5 -5
  67. package/src/tokens/functional/color/light/overrides/light.high-contrast.json5 +25 -25
  68. package/src/tokens/functional/color/light/overrides/light.protanopia-deuteranopia.json5 +5 -5
  69. package/src/tokens/functional/color/light/overrides/light.tritanopia.json5 +5 -5
  70. package/src/tokens/functional/color/light/patterns-light.json5 +30 -30
  71. package/src/tokens/functional/color/light/primitives-light.json5 +15 -15
  72. package/src/tokens/functional/color/light/syntax-light.json5 +14 -14
  73. package/src/tokens/functional/shadow/dark.json5 +1 -1
  74. package/src/tokens/functional/shadow/light.json5 +11 -11
  75. package/src/tokens/functional/typography/typography.json +32 -234
  76. package/src/transformers/floatToPixel.ts +1 -1
@@ -2,7 +2,7 @@
2
2
  color: {
3
3
  ansi: {
4
4
  black: {
5
- $value: '{base.color.neutral.9}',
5
+ $value: '{base.color.gray.9}',
6
6
  $type: 'color',
7
7
  $extensions: {
8
8
  'org.primer.figma': {
@@ -13,7 +13,7 @@
13
13
  },
14
14
  },
15
15
  'black-bright': {
16
- $value: '{base.color.neutral.6}',
16
+ $value: '{base.color.gray.6}',
17
17
  $type: 'color',
18
18
  $extensions: {
19
19
  'org.primer.figma': {
@@ -24,7 +24,7 @@
24
24
  },
25
25
  },
26
26
  white: {
27
- $value: '{base.color.neutral.5}',
27
+ $value: '{base.color.gray.5}',
28
28
  $type: 'color',
29
29
  $extensions: {
30
30
  'org.primer.figma': {
@@ -35,7 +35,7 @@
35
35
  },
36
36
  },
37
37
  'white-bright': {
38
- $value: '{base.color.neutral.4}',
38
+ $value: '{base.color.gray.4}',
39
39
  $type: 'color',
40
40
  $extensions: {
41
41
  'org.primer.figma': {
@@ -46,7 +46,7 @@
46
46
  },
47
47
  },
48
48
  gray: {
49
- $value: '{base.color.neutral.5}',
49
+ $value: '{base.color.gray.5}',
50
50
  $type: 'color',
51
51
  $extensions: {
52
52
  'org.primer.figma': {
@@ -192,7 +192,7 @@
192
192
  prettylights: {
193
193
  syntax: {
194
194
  comment: {
195
- $value: '{base.color.neutral.6}',
195
+ $value: '{base.color.gray.6}',
196
196
  $type: 'color',
197
197
  $extensions: {
198
198
  'org.primer.figma': {
@@ -238,7 +238,7 @@
238
238
  storage: {
239
239
  modifier: {
240
240
  import: {
241
- $value: '{base.color.neutral.9}',
241
+ $value: '{base.color.gray.9}',
242
242
  $type: 'color',
243
243
  $extensions: {
244
244
  'org.primer.figma': {
@@ -307,7 +307,7 @@
307
307
  },
308
308
  },
309
309
  angle: {
310
- $value: '{base.color.neutral.6}',
310
+ $value: '{base.color.gray.6}',
311
311
  $type: 'color',
312
312
  $extensions: {
313
313
  'org.primer.figma': {
@@ -321,7 +321,7 @@
321
321
  invalid: {
322
322
  illegal: {
323
323
  text: {
324
- $value: '{base.color.neutral.0}',
324
+ $value: '{base.color.gray.0}',
325
325
  $type: 'color',
326
326
  $extensions: {
327
327
  'org.primer.figma': {
@@ -347,7 +347,7 @@
347
347
  carriage: {
348
348
  return: {
349
349
  text: {
350
- $value: '{base.color.neutral.0}',
350
+ $value: '{base.color.gray.0}',
351
351
  $type: 'color',
352
352
  $extensions: {
353
353
  'org.primer.figma': {
@@ -405,7 +405,7 @@
405
405
  },
406
406
  },
407
407
  italic: {
408
- $value: '{base.color.neutral.9}',
408
+ $value: '{base.color.gray.9}',
409
409
  $type: 'color',
410
410
  $extensions: {
411
411
  'org.primer.figma': {
@@ -416,7 +416,7 @@
416
416
  },
417
417
  },
418
418
  bold: {
419
- $value: '{base.color.neutral.9}',
419
+ $value: '{base.color.gray.9}',
420
420
  $type: 'color',
421
421
  $extensions: {
422
422
  'org.primer.figma': {
@@ -500,7 +500,7 @@
500
500
  },
501
501
  ignored: {
502
502
  text: {
503
- $value: '{base.color.neutral.1}',
503
+ $value: '{base.color.gray.1}',
504
504
  $type: 'color',
505
505
  $extensions: {
506
506
  'org.primer.figma': {
@@ -541,7 +541,7 @@
541
541
  sublimelinter: {
542
542
  gutter: {
543
543
  mark: {
544
- $value: '{base.color.neutral.4}',
544
+ $value: '{base.color.gray.4}',
545
545
  $type: 'color',
546
546
  $extensions: {
547
547
  'org.primer.figma': {
@@ -3,7 +3,7 @@
3
3
  shadow: {
4
4
  $value: [
5
5
  {
6
- color: '{base.color.neutral.9}',
6
+ color: '{base.color.gray.9}',
7
7
  alpha: 1,
8
8
  offsetX: '0px',
9
9
  offsetY: '0px',
@@ -187,7 +187,7 @@
187
187
  medium: {
188
188
  $value: [
189
189
  {
190
- color: '{base.color.neutral.7}',
190
+ color: '{base.color.gray.7}',
191
191
  alpha: 0.12,
192
192
  offsetX: '0px',
193
193
  offsetY: '3px',
@@ -217,7 +217,7 @@
217
217
  spread: '1px',
218
218
  },
219
219
  {
220
- color: '{base.color.neutral.7}',
220
+ color: '{base.color.gray.7}',
221
221
  alpha: 0.04,
222
222
  offsetX: '0px',
223
223
  offsetY: '6px',
@@ -225,7 +225,7 @@
225
225
  spread: '-3px',
226
226
  },
227
227
  {
228
- color: '{base.color.neutral.7}',
228
+ color: '{base.color.gray.7}',
229
229
  alpha: 0.12,
230
230
  offsetX: '0px',
231
231
  offsetY: '6px',
@@ -253,7 +253,7 @@
253
253
  spread: '1px',
254
254
  },
255
255
  {
256
- color: '{base.color.neutral.7}',
256
+ color: '{base.color.gray.7}',
257
257
  alpha: 0.08,
258
258
  offsetX: '0px',
259
259
  offsetY: '8px',
@@ -261,7 +261,7 @@
261
261
  spread: '-4px',
262
262
  },
263
263
  {
264
- color: '{base.color.neutral.7}',
264
+ color: '{base.color.gray.7}',
265
265
  alpha: 0.08,
266
266
  offsetX: '0px',
267
267
  offsetY: '4px',
@@ -269,7 +269,7 @@
269
269
  spread: '-4px',
270
270
  },
271
271
  {
272
- color: '{base.color.neutral.7}',
272
+ color: '{base.color.gray.7}',
273
273
  alpha: 0.08,
274
274
  offsetX: '0px',
275
275
  offsetY: '24px',
@@ -277,7 +277,7 @@
277
277
  spread: '-12px',
278
278
  },
279
279
  {
280
- color: '{base.color.neutral.7}',
280
+ color: '{base.color.gray.7}',
281
281
  alpha: 0.08,
282
282
  offsetX: '0px',
283
283
  offsetY: '48px',
@@ -305,7 +305,7 @@
305
305
  spread: '1px',
306
306
  },
307
307
  {
308
- color: '{base.color.neutral.7}',
308
+ color: '{base.color.gray.7}',
309
309
  alpha: 0.24,
310
310
  offsetX: '0px',
311
311
  offsetY: '40px',
@@ -333,7 +333,7 @@
333
333
  spread: '1px',
334
334
  },
335
335
  {
336
- color: '{base.color.neutral.7}',
336
+ color: '{base.color.gray.7}',
337
337
  alpha: 0.32,
338
338
  offsetX: '0px',
339
339
  offsetY: '56px',
@@ -353,7 +353,7 @@
353
353
  legacy: {
354
354
  $value: [
355
355
  {
356
- color: '{base.color.neutral.7}',
356
+ color: '{base.color.gray.7}',
357
357
  alpha: 0.04,
358
358
  offsetX: '0px',
359
359
  offsetY: '6px',
@@ -361,7 +361,7 @@
361
361
  spread: '-3px',
362
362
  },
363
363
  {
364
- color: '{base.color.neutral.7}',
364
+ color: '{base.color.gray.7}',
365
365
  alpha: 0.12,
366
366
  offsetX: '0px',
367
367
  offsetY: '6px',
@@ -34,51 +34,29 @@
34
34
  "text": {
35
35
  "display": {
36
36
  "lineBoxHeight": {
37
- "$value": 1.4,
38
- "$type": "number",
37
+ "$value": "56px",
38
+ "$type": "dimension",
39
39
  "$extensions": {
40
40
  "org.primer.data": {
41
41
  "fontSize": 40
42
42
  },
43
43
  "org.primer.figma": {
44
44
  "collection": "typography",
45
- "scopes": ["all"],
46
- "fontSizeInPx": 40
45
+ "scopes": ["all"]
47
46
  }
48
47
  }
49
48
  },
50
49
  "size": {
51
50
  "$value": "40px",
52
- "$type": "dimension",
53
- "$extensions": {
54
- "org.primer.figma": {
55
- "collection": "typography",
56
- "scopes": ["all"]
57
- }
58
- }
51
+ "$type": "dimension"
59
52
  },
60
53
  "lineHeight": {
61
54
  "$value": 1.4,
62
- "$type": "number",
63
- "$extensions": {
64
- "org.primer.data": {
65
- "fontSize": 40
66
- },
67
- "org.primer.figma": {
68
- "collection": "typography",
69
- "scopes": ["all"]
70
- }
71
- }
55
+ "$type": "number"
72
56
  },
73
57
  "weight": {
74
58
  "$value": "{base.text.weight.medium}",
75
- "$type": "fontWeight",
76
- "$extensions": {
77
- "org.primer.figma": {
78
- "collection": "typography",
79
- "scopes": ["all"]
80
- }
81
- }
59
+ "$type": "fontWeight"
82
60
  },
83
61
  "shorthand": {
84
62
  "$value": {
@@ -95,106 +73,43 @@
95
73
  "size": {
96
74
  "large": {
97
75
  "$value": "32px",
98
- "$type": "dimension",
99
- "$extensions": {
100
- "org.primer.figma": {
101
- "collection": "typography",
102
- "scopes": ["all"]
103
- }
104
- }
76
+ "$type": "dimension"
105
77
  },
106
78
  "medium": {
107
79
  "$value": "20px",
108
- "$type": "dimension",
109
- "$extensions": {
110
- "org.primer.figma": {
111
- "collection": "typography",
112
- "scopes": ["all"]
113
- }
114
- }
80
+ "$type": "dimension"
115
81
  },
116
82
  "small": {
117
83
  "$value": "16px",
118
- "$type": "dimension",
119
- "$extensions": {
120
- "org.primer.figma": {
121
- "collection": "typography",
122
- "scopes": ["all"]
123
- }
124
- }
84
+ "$type": "dimension"
125
85
  }
126
86
  },
127
87
  "lineHeight": {
128
88
  "large": {
129
89
  "$value": 1.5,
130
- "$type": "number",
131
- "$extensions": {
132
- "org.primer.data": {
133
- "fontSize": 32
134
- },
135
- "org.primer.figma": {
136
- "collection": "typography",
137
- "scopes": ["all"]
138
- }
139
- }
90
+ "$type": "number"
140
91
  },
141
92
  "medium": {
142
93
  "$value": 1.6,
143
- "$type": "number",
144
- "$extensions": {
145
- "org.primer.data": {
146
- "fontSize": 20
147
- },
148
- "org.primer.figma": {
149
- "collection": "typography",
150
- "scopes": ["all"]
151
- }
152
- }
94
+ "$type": "number"
153
95
  },
154
96
  "small": {
155
97
  "$value": 1.5,
156
- "$type": "number",
157
- "$extensions": {
158
- "org.primer.data": {
159
- "fontSize": 16
160
- },
161
- "org.primer.figma": {
162
- "collection": "typography",
163
- "scopes": ["all"]
164
- }
165
- }
98
+ "$type": "number"
166
99
  }
167
100
  },
168
101
  "weight": {
169
102
  "large": {
170
103
  "$value": "{base.text.weight.semibold}",
171
- "$type": "fontWeight",
172
- "$extensions": {
173
- "org.primer.figma": {
174
- "collection": "typography",
175
- "scopes": ["all"]
176
- }
177
- }
104
+ "$type": "fontWeight"
178
105
  },
179
106
  "medium": {
180
107
  "$value": "{base.text.weight.semibold}",
181
- "$type": "fontWeight",
182
- "$extensions": {
183
- "org.primer.figma": {
184
- "collection": "typography",
185
- "scopes": ["all"]
186
- }
187
- }
108
+ "$type": "fontWeight"
188
109
  },
189
110
  "small": {
190
111
  "$value": "{base.text.weight.semibold}",
191
- "$type": "fontWeight",
192
- "$extensions": {
193
- "org.primer.figma": {
194
- "collection": "typography",
195
- "scopes": ["all"]
196
- }
197
- }
112
+ "$type": "fontWeight"
198
113
  }
199
114
  },
200
115
  "shorthand": {
@@ -233,33 +148,15 @@
233
148
  "subtitle": {
234
149
  "size": {
235
150
  "$value": "20px",
236
- "$type": "dimension",
237
- "$extensions": {
238
- "org.primer.figma": {
239
- "collection": "typography",
240
- "scopes": ["all"]
241
- }
242
- }
151
+ "$type": "dimension"
243
152
  },
244
153
  "lineHeight": {
245
154
  "$value": 1.6,
246
- "$type": "number",
247
- "$extensions": {
248
- "org.primer.figma": {
249
- "collection": "typography",
250
- "scopes": ["all"]
251
- }
252
- }
155
+ "$type": "number"
253
156
  },
254
157
  "weight": {
255
158
  "$value": "{base.text.weight.normal}",
256
- "$type": "fontWeight",
257
- "$extensions": {
258
- "org.primer.figma": {
259
- "collection": "typography",
260
- "scopes": ["all"]
261
- }
262
- }
159
+ "$type": "fontWeight"
263
160
  },
264
161
  "shorthand": {
265
162
  "$value": {
@@ -276,74 +173,29 @@
276
173
  "size": {
277
174
  "large": {
278
175
  "$value": "16px",
279
- "$type": "dimension",
280
- "$extensions": {
281
- "org.primer.figma": {
282
- "collection": "typography",
283
- "scopes": ["all"]
284
- }
285
- }
176
+ "$type": "dimension"
286
177
  },
287
178
  "medium": {
288
179
  "$value": "14px",
289
- "$type": "dimension",
290
- "$extensions": {
291
- "org.primer.figma": {
292
- "collection": "typography",
293
- "scopes": ["all"]
294
- }
295
- }
180
+ "$type": "dimension"
296
181
  },
297
182
  "small": {
298
183
  "$value": "12px",
299
- "$type": "dimension",
300
- "$extensions": {
301
- "org.primer.figma": {
302
- "collection": "typography",
303
- "scopes": ["all"]
304
- }
305
- }
184
+ "$type": "dimension"
306
185
  }
307
186
  },
308
187
  "lineHeight": {
309
188
  "large": {
310
189
  "$value": 1.5,
311
- "$type": "number",
312
- "$extensions": {
313
- "org.primer.data": {
314
- "fontSize": 16
315
- },
316
- "org.primer.figma": {
317
- "collection": "typography",
318
- "scopes": ["all"]
319
- }
320
- }
190
+ "$type": "number"
321
191
  },
322
192
  "medium": {
323
193
  "$value": 1.4285,
324
- "$type": "number",
325
- "$extensions": {
326
- "org.primer.data": {
327
- "fontSize": 14
328
- },
329
- "org.primer.figma": {
330
- "collection": "typography",
331
- "scopes": ["all"]
332
- }
333
- }
194
+ "$type": "number"
334
195
  },
335
196
  "small": {
336
197
  "$value": 1.6666,
337
- "$type": "number",
338
- "$extensions": {
339
- "org.primer.data": {
340
- "fontSize": 12
341
- },
342
- "org.primer.figma": {
343
- "collection": "typography",
344
- "scopes": ["all"]
345
- }
346
- }
198
+ "$type": "number"
347
199
  }
348
200
  },
349
201
  "weight": {
@@ -386,36 +238,15 @@
386
238
  "caption": {
387
239
  "size": {
388
240
  "$value": "12px",
389
- "$type": "dimension",
390
- "$extensions": {
391
- "org.primer.figma": {
392
- "collection": "typography",
393
- "scopes": ["all"]
394
- }
395
- }
241
+ "$type": "dimension"
396
242
  },
397
243
  "lineHeight": {
398
244
  "$value": 1.3333,
399
- "$type": "number",
400
- "$extensions": {
401
- "org.primer.data": {
402
- "fontSize": 12
403
- },
404
- "org.primer.figma": {
405
- "collection": "typography",
406
- "scopes": ["all"]
407
- }
408
- }
245
+ "$type": "number"
409
246
  },
410
247
  "weight": {
411
248
  "$value": "{base.text.weight.normal}",
412
- "$type": "fontWeight",
413
- "$extensions": {
414
- "org.primer.figma": {
415
- "collection": "typography",
416
- "scopes": ["all"]
417
- }
418
- }
249
+ "$type": "fontWeight"
419
250
  },
420
251
  "shorthand": {
421
252
  "$value": {
@@ -431,36 +262,15 @@
431
262
  "codeBlock": {
432
263
  "size": {
433
264
  "$value": "13px",
434
- "$type": "dimension",
435
- "$extensions": {
436
- "org.primer.figma": {
437
- "collection": "typography",
438
- "scopes": ["all"]
439
- }
440
- }
265
+ "$type": "dimension"
441
266
  },
442
267
  "lineHeight": {
443
268
  "$value": 1.5385,
444
- "$type": "number",
445
- "$extensions": {
446
- "org.primer.data": {
447
- "fontSize": 13
448
- },
449
- "org.primer.figma": {
450
- "collection": "typography",
451
- "scopes": ["all"]
452
- }
453
- }
269
+ "$type": "number"
454
270
  },
455
271
  "weight": {
456
272
  "$value": "{base.text.weight.normal}",
457
- "$type": "fontWeight",
458
- "$extensions": {
459
- "org.primer.figma": {
460
- "collection": "typography",
461
- "scopes": ["all"]
462
- }
463
- }
273
+ "$type": "fontWeight"
464
274
  },
465
275
  "shorthand": {
466
276
  "$value": {
@@ -476,23 +286,11 @@
476
286
  "codeInline": {
477
287
  "size": {
478
288
  "$value": "0.9285em",
479
- "$type": "dimension",
480
- "$extensions": {
481
- "org.primer.figma": {
482
- "collection": "typography",
483
- "scopes": ["all"]
484
- }
485
- }
289
+ "$type": "dimension"
486
290
  },
487
291
  "weight": {
488
292
  "$value": "{base.text.weight.normal}",
489
- "$type": "fontWeight",
490
- "$extensions": {
491
- "org.primer.figma": {
492
- "collection": "typography",
493
- "scopes": ["all"]
494
- }
495
- }
293
+ "$type": "fontWeight"
496
294
  },
497
295
  "shorthand": {
498
296
  "$value": {
@@ -17,7 +17,7 @@ export const convertFloatToPixel = (token: StyleDictionary.TransformedToken) =>
17
17
  // convert value
18
18
  const convertedValue = token.$extensions?.['org.primer.data']?.fontSize * token.value
19
19
  // return converted value
20
- return convertedValue === 0 ? 0 : `${Math.round(convertedValue)}px`
20
+ return convertedValue === 0 ? 0 : `${convertedValue}px`
21
21
  }
22
22
  /**
23
23
  * @description converts a float value to a pixel value based on the provided fontSize on the tokersn extension