@khanacademy/wonder-blocks-link 3.8.17 → 3.9.1

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 (14) hide show
  1. package/CHANGELOG.md +23 -0
  2. package/dist/es/index.js +44 -18
  3. package/dist/index.js +44 -18
  4. package/dist/index.js.flow +1 -1
  5. package/package.json +5 -5
  6. package/src/__tests__/__snapshots__/custom-snapshot.test.js.snap +1445 -62
  7. package/src/__tests__/custom-snapshot.test.js +32 -29
  8. package/src/components/__docs__/link.argtypes.js +8 -0
  9. package/src/components/__docs__/link.stories.js +328 -38
  10. package/src/components/__tests__/link.flowtest.js +5 -3
  11. package/src/components/__tests__/link.test.js +103 -1
  12. package/src/components/link-core.js +63 -23
  13. package/src/components/link.js +34 -32
  14. package/src/index.js +1 -1
package/src/__tests__/__snapshots__/custom-snapshot.test.js.snap CHANGED
@@ -20,6 +20,9 @@ exports[`Link <Link tabIndex={-1}> 1`] = `
20
20
  {
21
21
  "color": "#1865f2",
22
22
  "cursor": "pointer",
23
+ "display": "inline-flex",
24
+ "fontSize": 16,
25
+ "lineHeight": "22px",
23
26
  "outline": "none",
24
27
  "textDecoration": "none",
25
28
  }
@@ -50,6 +53,9 @@ exports[`Link <Link tabIndex={0}> 1`] = `
50
53
  {
51
54
  "color": "#1865f2",
52
55
  "cursor": "pointer",
56
+ "display": "inline-flex",
57
+ "fontSize": 16,
58
+ "lineHeight": "22px",
53
59
  "outline": "none",
54
60
  "textDecoration": "none",
55
61
  }
@@ -80,6 +86,9 @@ exports[`Link <Link tabIndex={1}> 1`] = `
80
86
  {
81
87
  "color": "#1865f2",
82
88
  "cursor": "pointer",
89
+ "display": "inline-flex",
90
+ "fontSize": 16,
91
+ "lineHeight": "22px",
83
92
  "outline": "none",
84
93
  "textDecoration": "none",
85
94
  }
@@ -108,10 +117,48 @@ exports[`LinkCore kind:primary href:# light:false visitable:false focused 1`] =
108
117
  onTouchStart={[Function]}
109
118
  style={
110
119
  {
120
+ "borderRadius": 3,
111
121
  "color": "#1865f2",
112
122
  "cursor": "pointer",
113
- "outline": "none",
114
- "textDecoration": "underline currentcolor solid",
123
+ "display": "inline-flex",
124
+ "fontSize": 16,
125
+ "lineHeight": "22px",
126
+ "outline": "1px solid #1865f2",
127
+ "textDecoration": "none",
128
+ }
129
+ }
130
+ tabIndex={0}
131
+ >
132
+ Click me
133
+ </a>
134
+ `;
135
+
136
+ exports[`LinkCore kind:primary href:# light:false visitable:false focused 2`] = `
137
+ <a
138
+ className=""
139
+ href="#"
140
+ onBlur={[Function]}
141
+ onClick={[Function]}
142
+ onFocus={[Function]}
143
+ onKeyDown={[Function]}
144
+ onKeyUp={[Function]}
145
+ onMouseDown={[Function]}
146
+ onMouseEnter={[Function]}
147
+ onMouseLeave={[Function]}
148
+ onMouseUp={[Function]}
149
+ onTouchCancel={[Function]}
150
+ onTouchEnd={[Function]}
151
+ onTouchStart={[Function]}
152
+ style={
153
+ {
154
+ "borderRadius": 3,
155
+ "color": "#1865f2",
156
+ "cursor": "pointer",
157
+ "display": "inline-flex",
158
+ "fontSize": 16,
159
+ "lineHeight": "22px",
160
+ "outline": "1px solid #1865f2",
161
+ "textDecoration": "none",
115
162
  }
116
163
  }
117
164
  tabIndex={0}
@@ -140,8 +187,46 @@ exports[`LinkCore kind:primary href:# light:false visitable:false hovered 1`] =
140
187
  {
141
188
  "color": "#1865f2",
142
189
  "cursor": "pointer",
190
+ "display": "inline-flex",
191
+ "fontSize": 16,
192
+ "lineHeight": "22px",
193
+ "outline": "none",
194
+ "textDecoration": "underline currentcolor dashed 2px",
195
+ "textUnderlineOffset": 4,
196
+ }
197
+ }
198
+ tabIndex={0}
199
+ >
200
+ Click me
201
+ </a>
202
+ `;
203
+
204
+ exports[`LinkCore kind:primary href:# light:false visitable:false hovered 2`] = `
205
+ <a
206
+ className=""
207
+ href="#"
208
+ onBlur={[Function]}
209
+ onClick={[Function]}
210
+ onFocus={[Function]}
211
+ onKeyDown={[Function]}
212
+ onKeyUp={[Function]}
213
+ onMouseDown={[Function]}
214
+ onMouseEnter={[Function]}
215
+ onMouseLeave={[Function]}
216
+ onMouseUp={[Function]}
217
+ onTouchCancel={[Function]}
218
+ onTouchEnd={[Function]}
219
+ onTouchStart={[Function]}
220
+ style={
221
+ {
222
+ "color": "#1865f2",
223
+ "cursor": "pointer",
224
+ "display": "inline-flex",
225
+ "fontSize": 16,
226
+ "lineHeight": "22px",
143
227
  "outline": "none",
144
- "textDecoration": "underline currentcolor solid",
228
+ "textDecoration": "underline currentcolor dashed 2px",
229
+ "textUnderlineOffset": 4,
145
230
  }
146
231
  }
147
232
  tabIndex={0}
@@ -170,8 +255,46 @@ exports[`LinkCore kind:primary href:# light:false visitable:false pressed 1`] =
170
255
  {
171
256
  "color": "#1b50b3",
172
257
  "cursor": "pointer",
258
+ "display": "inline-flex",
259
+ "fontSize": 16,
260
+ "lineHeight": "22px",
261
+ "outline": "none",
262
+ "textDecoration": "underline currentcolor solid 1px",
263
+ "textUnderlineOffset": 4,
264
+ }
265
+ }
266
+ tabIndex={0}
267
+ >
268
+ Click me
269
+ </a>
270
+ `;
271
+
272
+ exports[`LinkCore kind:primary href:# light:false visitable:false pressed 2`] = `
273
+ <a
274
+ className=""
275
+ href="#"
276
+ onBlur={[Function]}
277
+ onClick={[Function]}
278
+ onFocus={[Function]}
279
+ onKeyDown={[Function]}
280
+ onKeyUp={[Function]}
281
+ onMouseDown={[Function]}
282
+ onMouseEnter={[Function]}
283
+ onMouseLeave={[Function]}
284
+ onMouseUp={[Function]}
285
+ onTouchCancel={[Function]}
286
+ onTouchEnd={[Function]}
287
+ onTouchStart={[Function]}
288
+ style={
289
+ {
290
+ "color": "#1b50b3",
291
+ "cursor": "pointer",
292
+ "display": "inline-flex",
293
+ "fontSize": 16,
294
+ "lineHeight": "22px",
173
295
  "outline": "none",
174
- "textDecoration": "underline currentcolor solid",
296
+ "textDecoration": "underline currentcolor solid 1px",
297
+ "textUnderlineOffset": 4,
175
298
  }
176
299
  }
177
300
  tabIndex={0}
@@ -201,10 +324,51 @@ exports[`LinkCore kind:primary href:# light:false visitable:true focused 1`] = `
201
324
  ":visited": {
202
325
  "color": "#8755ee",
203
326
  },
327
+ "borderRadius": 3,
204
328
  "color": "#1865f2",
205
329
  "cursor": "pointer",
206
- "outline": "none",
207
- "textDecoration": "underline currentcolor solid",
330
+ "display": "inline-flex",
331
+ "fontSize": 16,
332
+ "lineHeight": "22px",
333
+ "outline": "1px solid #1865f2",
334
+ "textDecoration": "none",
335
+ }
336
+ }
337
+ tabIndex={0}
338
+ >
339
+ Click me
340
+ </a>
341
+ `;
342
+
343
+ exports[`LinkCore kind:primary href:# light:false visitable:true focused 2`] = `
344
+ <a
345
+ className=""
346
+ href="#"
347
+ onBlur={[Function]}
348
+ onClick={[Function]}
349
+ onFocus={[Function]}
350
+ onKeyDown={[Function]}
351
+ onKeyUp={[Function]}
352
+ onMouseDown={[Function]}
353
+ onMouseEnter={[Function]}
354
+ onMouseLeave={[Function]}
355
+ onMouseUp={[Function]}
356
+ onTouchCancel={[Function]}
357
+ onTouchEnd={[Function]}
358
+ onTouchStart={[Function]}
359
+ style={
360
+ {
361
+ ":visited": {
362
+ "color": "#8755ee",
363
+ },
364
+ "borderRadius": 3,
365
+ "color": "#1865f2",
366
+ "cursor": "pointer",
367
+ "display": "inline-flex",
368
+ "fontSize": 16,
369
+ "lineHeight": "22px",
370
+ "outline": "1px solid #1865f2",
371
+ "textDecoration": "none",
208
372
  }
209
373
  }
210
374
  tabIndex={0}
@@ -236,8 +400,49 @@ exports[`LinkCore kind:primary href:# light:false visitable:true hovered 1`] = `
236
400
  },
237
401
  "color": "#1865f2",
238
402
  "cursor": "pointer",
403
+ "display": "inline-flex",
404
+ "fontSize": 16,
405
+ "lineHeight": "22px",
406
+ "outline": "none",
407
+ "textDecoration": "underline currentcolor dashed 2px",
408
+ "textUnderlineOffset": 4,
409
+ }
410
+ }
411
+ tabIndex={0}
412
+ >
413
+ Click me
414
+ </a>
415
+ `;
416
+
417
+ exports[`LinkCore kind:primary href:# light:false visitable:true hovered 2`] = `
418
+ <a
419
+ className=""
420
+ href="#"
421
+ onBlur={[Function]}
422
+ onClick={[Function]}
423
+ onFocus={[Function]}
424
+ onKeyDown={[Function]}
425
+ onKeyUp={[Function]}
426
+ onMouseDown={[Function]}
427
+ onMouseEnter={[Function]}
428
+ onMouseLeave={[Function]}
429
+ onMouseUp={[Function]}
430
+ onTouchCancel={[Function]}
431
+ onTouchEnd={[Function]}
432
+ onTouchStart={[Function]}
433
+ style={
434
+ {
435
+ ":visited": {
436
+ "color": "#8755ee",
437
+ },
438
+ "color": "#1865f2",
439
+ "cursor": "pointer",
440
+ "display": "inline-flex",
441
+ "fontSize": 16,
442
+ "lineHeight": "22px",
239
443
  "outline": "none",
240
- "textDecoration": "underline currentcolor solid",
444
+ "textDecoration": "underline currentcolor dashed 2px",
445
+ "textUnderlineOffset": 4,
241
446
  }
242
447
  }
243
448
  tabIndex={0}
@@ -269,8 +474,49 @@ exports[`LinkCore kind:primary href:# light:false visitable:true pressed 1`] = `
269
474
  },
270
475
  "color": "#1b50b3",
271
476
  "cursor": "pointer",
477
+ "display": "inline-flex",
478
+ "fontSize": 16,
479
+ "lineHeight": "22px",
480
+ "outline": "none",
481
+ "textDecoration": "underline currentcolor solid 1px",
482
+ "textUnderlineOffset": 4,
483
+ }
484
+ }
485
+ tabIndex={0}
486
+ >
487
+ Click me
488
+ </a>
489
+ `;
490
+
491
+ exports[`LinkCore kind:primary href:# light:false visitable:true pressed 2`] = `
492
+ <a
493
+ className=""
494
+ href="#"
495
+ onBlur={[Function]}
496
+ onClick={[Function]}
497
+ onFocus={[Function]}
498
+ onKeyDown={[Function]}
499
+ onKeyUp={[Function]}
500
+ onMouseDown={[Function]}
501
+ onMouseEnter={[Function]}
502
+ onMouseLeave={[Function]}
503
+ onMouseUp={[Function]}
504
+ onTouchCancel={[Function]}
505
+ onTouchEnd={[Function]}
506
+ onTouchStart={[Function]}
507
+ style={
508
+ {
509
+ ":visited": {
510
+ "color": "#6645b0",
511
+ },
512
+ "color": "#1b50b3",
513
+ "cursor": "pointer",
514
+ "display": "inline-flex",
515
+ "fontSize": 16,
516
+ "lineHeight": "22px",
272
517
  "outline": "none",
273
- "textDecoration": "underline currentcolor solid",
518
+ "textDecoration": "underline currentcolor solid 1px",
519
+ "textUnderlineOffset": 4,
274
520
  }
275
521
  }
276
522
  tabIndex={0}
@@ -297,10 +543,14 @@ exports[`LinkCore kind:primary href:# light:true visitable:false focused 1`] = `
297
543
  onTouchStart={[Function]}
298
544
  style={
299
545
  {
546
+ "borderRadius": 3,
300
547
  "color": "#ffffff",
301
548
  "cursor": "pointer",
302
- "outline": "none",
303
- "textDecoration": "underline currentcolor solid",
549
+ "display": "inline-flex",
550
+ "fontSize": 16,
551
+ "lineHeight": "22px",
552
+ "outline": "1px solid #ffffff",
553
+ "textDecoration": "none",
304
554
  }
305
555
  }
306
556
  tabIndex={0}
@@ -309,7 +559,7 @@ exports[`LinkCore kind:primary href:# light:true visitable:false focused 1`] = `
309
559
  </a>
310
560
  `;
311
561
 
312
- exports[`LinkCore kind:primary href:# light:true visitable:false hovered 1`] = `
562
+ exports[`LinkCore kind:primary href:# light:true visitable:false focused 2`] = `
313
563
  <a
314
564
  className=""
315
565
  href="#"
@@ -327,10 +577,14 @@ exports[`LinkCore kind:primary href:# light:true visitable:false hovered 1`] = `
327
577
  onTouchStart={[Function]}
328
578
  style={
329
579
  {
580
+ "borderRadius": 3,
330
581
  "color": "#ffffff",
331
582
  "cursor": "pointer",
332
- "outline": "none",
333
- "textDecoration": "underline currentcolor solid",
583
+ "display": "inline-flex",
584
+ "fontSize": 16,
585
+ "lineHeight": "22px",
586
+ "outline": "1px solid #ffffff",
587
+ "textDecoration": "none",
334
588
  }
335
589
  }
336
590
  tabIndex={0}
@@ -339,7 +593,7 @@ exports[`LinkCore kind:primary href:# light:true visitable:false hovered 1`] = `
339
593
  </a>
340
594
  `;
341
595
 
342
- exports[`LinkCore kind:primary href:# light:true visitable:false pressed 1`] = `
596
+ exports[`LinkCore kind:primary href:# light:true visitable:false hovered 1`] = `
343
597
  <a
344
598
  className=""
345
599
  href="#"
@@ -357,10 +611,14 @@ exports[`LinkCore kind:primary href:# light:true visitable:false pressed 1`] = `
357
611
  onTouchStart={[Function]}
358
612
  style={
359
613
  {
360
- "color": "#b5cefb",
614
+ "color": "#ffffff",
361
615
  "cursor": "pointer",
616
+ "display": "inline-flex",
617
+ "fontSize": 16,
618
+ "lineHeight": "22px",
362
619
  "outline": "none",
363
- "textDecoration": "underline currentcolor solid",
620
+ "textDecoration": "underline currentcolor dashed 2px",
621
+ "textUnderlineOffset": 4,
364
622
  }
365
623
  }
366
624
  tabIndex={0}
@@ -369,7 +627,7 @@ exports[`LinkCore kind:primary href:# light:true visitable:false pressed 1`] = `
369
627
  </a>
370
628
  `;
371
629
 
372
- exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:false focused 1`] = `
630
+ exports[`LinkCore kind:primary href:# light:true visitable:false hovered 2`] = `
373
631
  <a
374
632
  className=""
375
633
  href="#"
@@ -387,10 +645,14 @@ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:fal
387
645
  onTouchStart={[Function]}
388
646
  style={
389
647
  {
390
- "color": "#1865f2",
648
+ "color": "#ffffff",
391
649
  "cursor": "pointer",
650
+ "display": "inline-flex",
651
+ "fontSize": 16,
652
+ "lineHeight": "22px",
392
653
  "outline": "none",
393
- "textDecoration": "underline currentcolor solid",
654
+ "textDecoration": "underline currentcolor dashed 2px",
655
+ "textUnderlineOffset": 4,
394
656
  }
395
657
  }
396
658
  tabIndex={0}
@@ -399,7 +661,7 @@ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:fal
399
661
  </a>
400
662
  `;
401
663
 
402
- exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:false hovered 1`] = `
664
+ exports[`LinkCore kind:primary href:# light:true visitable:false pressed 1`] = `
403
665
  <a
404
666
  className=""
405
667
  href="#"
@@ -417,10 +679,14 @@ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:fal
417
679
  onTouchStart={[Function]}
418
680
  style={
419
681
  {
420
- "color": "#1865f2",
682
+ "color": "#b5cefb",
421
683
  "cursor": "pointer",
684
+ "display": "inline-flex",
685
+ "fontSize": 16,
686
+ "lineHeight": "22px",
422
687
  "outline": "none",
423
- "textDecoration": "underline currentcolor solid",
688
+ "textDecoration": "underline currentcolor solid 1px",
689
+ "textUnderlineOffset": 4,
424
690
  }
425
691
  }
426
692
  tabIndex={0}
@@ -429,7 +695,7 @@ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:fal
429
695
  </a>
430
696
  `;
431
697
 
432
- exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:false pressed 1`] = `
698
+ exports[`LinkCore kind:primary href:# light:true visitable:false pressed 2`] = `
433
699
  <a
434
700
  className=""
435
701
  href="#"
@@ -447,10 +713,14 @@ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:fal
447
713
  onTouchStart={[Function]}
448
714
  style={
449
715
  {
450
- "color": "#1b50b3",
716
+ "color": "#b5cefb",
451
717
  "cursor": "pointer",
718
+ "display": "inline-flex",
719
+ "fontSize": 16,
720
+ "lineHeight": "22px",
452
721
  "outline": "none",
453
- "textDecoration": "underline currentcolor solid",
722
+ "textDecoration": "underline currentcolor solid 1px",
723
+ "textUnderlineOffset": 4,
454
724
  }
455
725
  }
456
726
  tabIndex={0}
@@ -459,7 +729,7 @@ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:fal
459
729
  </a>
460
730
  `;
461
731
 
462
- exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:true focused 1`] = `
732
+ exports[`LinkCore kind:primary href:# light:true visitable:true focused 1`] = `
463
733
  <a
464
734
  className=""
465
735
  href="#"
@@ -478,12 +748,16 @@ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:tru
478
748
  style={
479
749
  {
480
750
  ":visited": {
481
- "color": "#8755ee",
751
+ "color": "#fa50ae",
482
752
  },
483
- "color": "#1865f2",
753
+ "borderRadius": 3,
754
+ "color": "#ffffff",
484
755
  "cursor": "pointer",
485
- "outline": "none",
486
- "textDecoration": "underline currentcolor solid",
756
+ "display": "inline-flex",
757
+ "fontSize": 16,
758
+ "lineHeight": "22px",
759
+ "outline": "1px solid #ffffff",
760
+ "textDecoration": "none",
487
761
  }
488
762
  }
489
763
  tabIndex={0}
@@ -492,7 +766,7 @@ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:tru
492
766
  </a>
493
767
  `;
494
768
 
495
- exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:true hovered 1`] = `
769
+ exports[`LinkCore kind:primary href:# light:true visitable:true focused 2`] = `
496
770
  <a
497
771
  className=""
498
772
  href="#"
@@ -511,12 +785,16 @@ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:tru
511
785
  style={
512
786
  {
513
787
  ":visited": {
514
- "color": "#8755ee",
788
+ "color": "#fa50ae",
515
789
  },
516
- "color": "#1865f2",
790
+ "borderRadius": 3,
791
+ "color": "#ffffff",
517
792
  "cursor": "pointer",
518
- "outline": "none",
519
- "textDecoration": "underline currentcolor solid",
793
+ "display": "inline-flex",
794
+ "fontSize": 16,
795
+ "lineHeight": "22px",
796
+ "outline": "1px solid #ffffff",
797
+ "textDecoration": "none",
520
798
  }
521
799
  }
522
800
  tabIndex={0}
@@ -525,7 +803,7 @@ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:tru
525
803
  </a>
526
804
  `;
527
805
 
528
- exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:true pressed 1`] = `
806
+ exports[`LinkCore kind:primary href:# light:true visitable:true hovered 1`] = `
529
807
  <a
530
808
  className=""
531
809
  href="#"
@@ -544,12 +822,16 @@ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:tru
544
822
  style={
545
823
  {
546
824
  ":visited": {
547
- "color": "#6645b0",
825
+ "color": "#fa50ae",
548
826
  },
549
- "color": "#1b50b3",
827
+ "color": "#ffffff",
550
828
  "cursor": "pointer",
829
+ "display": "inline-flex",
830
+ "fontSize": 16,
831
+ "lineHeight": "22px",
551
832
  "outline": "none",
552
- "textDecoration": "underline currentcolor solid",
833
+ "textDecoration": "underline currentcolor dashed 2px",
834
+ "textUnderlineOffset": 4,
553
835
  }
554
836
  }
555
837
  tabIndex={0}
@@ -558,7 +840,7 @@ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:tru
558
840
  </a>
559
841
  `;
560
842
 
561
- exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:false focused 1`] = `
843
+ exports[`LinkCore kind:primary href:# light:true visitable:true hovered 2`] = `
562
844
  <a
563
845
  className=""
564
846
  href="#"
@@ -576,10 +858,17 @@ exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:fals
576
858
  onTouchStart={[Function]}
577
859
  style={
578
860
  {
861
+ ":visited": {
862
+ "color": "#fa50ae",
863
+ },
579
864
  "color": "#ffffff",
580
865
  "cursor": "pointer",
866
+ "display": "inline-flex",
867
+ "fontSize": 16,
868
+ "lineHeight": "22px",
581
869
  "outline": "none",
582
- "textDecoration": "underline currentcolor solid",
870
+ "textDecoration": "underline currentcolor dashed 2px",
871
+ "textUnderlineOffset": 4,
583
872
  }
584
873
  }
585
874
  tabIndex={0}
@@ -588,7 +877,7 @@ exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:fals
588
877
  </a>
589
878
  `;
590
879
 
591
- exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:false hovered 1`] = `
880
+ exports[`LinkCore kind:primary href:# light:true visitable:true pressed 1`] = `
592
881
  <a
593
882
  className=""
594
883
  href="#"
@@ -606,10 +895,17 @@ exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:fals
606
895
  onTouchStart={[Function]}
607
896
  style={
608
897
  {
609
- "color": "#ffffff",
898
+ ":visited": {
899
+ "color": "#fc88c8",
900
+ },
901
+ "color": "#b5cefb",
610
902
  "cursor": "pointer",
903
+ "display": "inline-flex",
904
+ "fontSize": 16,
905
+ "lineHeight": "22px",
611
906
  "outline": "none",
612
- "textDecoration": "underline currentcolor solid",
907
+ "textDecoration": "underline currentcolor solid 1px",
908
+ "textUnderlineOffset": 4,
613
909
  }
614
910
  }
615
911
  tabIndex={0}
@@ -618,7 +914,7 @@ exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:fals
618
914
  </a>
619
915
  `;
620
916
 
621
- exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:false pressed 1`] = `
917
+ exports[`LinkCore kind:primary href:# light:true visitable:true pressed 2`] = `
622
918
  <a
623
919
  className=""
624
920
  href="#"
@@ -636,10 +932,17 @@ exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:fals
636
932
  onTouchStart={[Function]}
637
933
  style={
638
934
  {
935
+ ":visited": {
936
+ "color": "#fc88c8",
937
+ },
639
938
  "color": "#b5cefb",
640
939
  "cursor": "pointer",
940
+ "display": "inline-flex",
941
+ "fontSize": 16,
942
+ "lineHeight": "22px",
641
943
  "outline": "none",
642
- "textDecoration": "underline currentcolor solid",
944
+ "textDecoration": "underline currentcolor solid 1px",
945
+ "textUnderlineOffset": 4,
643
946
  }
644
947
  }
645
948
  tabIndex={0}
@@ -648,7 +951,7 @@ exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:fals
648
951
  </a>
649
952
  `;
650
953
 
651
- exports[`LinkCore kind:secondary href:# light:false visitable:false focused 1`] = `
954
+ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:false focused 1`] = `
652
955
  <a
653
956
  className=""
654
957
  href="#"
@@ -666,10 +969,14 @@ exports[`LinkCore kind:secondary href:# light:false visitable:false focused 1`]
666
969
  onTouchStart={[Function]}
667
970
  style={
668
971
  {
972
+ "borderRadius": 3,
669
973
  "color": "#1865f2",
670
974
  "cursor": "pointer",
671
- "outline": "none",
672
- "textDecoration": "underline currentcolor solid",
975
+ "display": "inline-flex",
976
+ "fontSize": 16,
977
+ "lineHeight": "22px",
978
+ "outline": "1px solid #1865f2",
979
+ "textDecoration": "none",
673
980
  }
674
981
  }
675
982
  tabIndex={0}
@@ -678,7 +985,7 @@ exports[`LinkCore kind:secondary href:# light:false visitable:false focused 1`]
678
985
  </a>
679
986
  `;
680
987
 
681
- exports[`LinkCore kind:secondary href:# light:false visitable:false hovered 1`] = `
988
+ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:false focused 2`] = `
682
989
  <a
683
990
  className=""
684
991
  href="#"
@@ -696,10 +1003,14 @@ exports[`LinkCore kind:secondary href:# light:false visitable:false hovered 1`]
696
1003
  onTouchStart={[Function]}
697
1004
  style={
698
1005
  {
1006
+ "borderRadius": 3,
699
1007
  "color": "#1865f2",
700
1008
  "cursor": "pointer",
701
- "outline": "none",
702
- "textDecoration": "underline currentcolor solid",
1009
+ "display": "inline-flex",
1010
+ "fontSize": 16,
1011
+ "lineHeight": "22px",
1012
+ "outline": "1px solid #1865f2",
1013
+ "textDecoration": "none",
703
1014
  }
704
1015
  }
705
1016
  tabIndex={0}
@@ -708,7 +1019,7 @@ exports[`LinkCore kind:secondary href:# light:false visitable:false hovered 1`]
708
1019
  </a>
709
1020
  `;
710
1021
 
711
- exports[`LinkCore kind:secondary href:# light:false visitable:false pressed 1`] = `
1022
+ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:false hovered 1`] = `
712
1023
  <a
713
1024
  className=""
714
1025
  href="#"
@@ -726,10 +1037,14 @@ exports[`LinkCore kind:secondary href:# light:false visitable:false pressed 1`]
726
1037
  onTouchStart={[Function]}
727
1038
  style={
728
1039
  {
729
- "color": "#1b50b3",
1040
+ "color": "#1865f2",
730
1041
  "cursor": "pointer",
1042
+ "display": "inline-flex",
1043
+ "fontSize": 16,
1044
+ "lineHeight": "22px",
731
1045
  "outline": "none",
732
- "textDecoration": "underline currentcolor solid",
1046
+ "textDecoration": "underline currentcolor dashed 2px",
1047
+ "textUnderlineOffset": 4,
733
1048
  }
734
1049
  }
735
1050
  tabIndex={0}
@@ -738,7 +1053,7 @@ exports[`LinkCore kind:secondary href:# light:false visitable:false pressed 1`]
738
1053
  </a>
739
1054
  `;
740
1055
 
741
- exports[`LinkCore kind:secondary href:#non-existent-link light:false visitable:false focused 1`] = `
1056
+ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:false hovered 2`] = `
742
1057
  <a
743
1058
  className=""
744
1059
  href="#"
@@ -758,8 +1073,12 @@ exports[`LinkCore kind:secondary href:#non-existent-link light:false visitable:f
758
1073
  {
759
1074
  "color": "#1865f2",
760
1075
  "cursor": "pointer",
1076
+ "display": "inline-flex",
1077
+ "fontSize": 16,
1078
+ "lineHeight": "22px",
761
1079
  "outline": "none",
762
- "textDecoration": "underline currentcolor solid",
1080
+ "textDecoration": "underline currentcolor dashed 2px",
1081
+ "textUnderlineOffset": 4,
763
1082
  }
764
1083
  }
765
1084
  tabIndex={0}
@@ -768,7 +1087,7 @@ exports[`LinkCore kind:secondary href:#non-existent-link light:false visitable:f
768
1087
  </a>
769
1088
  `;
770
1089
 
771
- exports[`LinkCore kind:secondary href:#non-existent-link light:false visitable:false hovered 1`] = `
1090
+ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:false pressed 1`] = `
772
1091
  <a
773
1092
  className=""
774
1093
  href="#"
@@ -786,10 +1105,14 @@ exports[`LinkCore kind:secondary href:#non-existent-link light:false visitable:f
786
1105
  onTouchStart={[Function]}
787
1106
  style={
788
1107
  {
789
- "color": "#1865f2",
1108
+ "color": "#1b50b3",
790
1109
  "cursor": "pointer",
1110
+ "display": "inline-flex",
1111
+ "fontSize": 16,
1112
+ "lineHeight": "22px",
791
1113
  "outline": "none",
792
- "textDecoration": "underline currentcolor solid",
1114
+ "textDecoration": "underline currentcolor solid 1px",
1115
+ "textUnderlineOffset": 4,
793
1116
  }
794
1117
  }
795
1118
  tabIndex={0}
@@ -798,7 +1121,7 @@ exports[`LinkCore kind:secondary href:#non-existent-link light:false visitable:f
798
1121
  </a>
799
1122
  `;
800
1123
 
801
- exports[`LinkCore kind:secondary href:#non-existent-link light:false visitable:false pressed 1`] = `
1124
+ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:false pressed 2`] = `
802
1125
  <a
803
1126
  className=""
804
1127
  href="#"
@@ -818,8 +1141,1068 @@ exports[`LinkCore kind:secondary href:#non-existent-link light:false visitable:f
818
1141
  {
819
1142
  "color": "#1b50b3",
820
1143
  "cursor": "pointer",
1144
+ "display": "inline-flex",
1145
+ "fontSize": 16,
1146
+ "lineHeight": "22px",
1147
+ "outline": "none",
1148
+ "textDecoration": "underline currentcolor solid 1px",
1149
+ "textUnderlineOffset": 4,
1150
+ }
1151
+ }
1152
+ tabIndex={0}
1153
+ >
1154
+ Click me
1155
+ </a>
1156
+ `;
1157
+
1158
+ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:true focused 1`] = `
1159
+ <a
1160
+ className=""
1161
+ href="#"
1162
+ onBlur={[Function]}
1163
+ onClick={[Function]}
1164
+ onFocus={[Function]}
1165
+ onKeyDown={[Function]}
1166
+ onKeyUp={[Function]}
1167
+ onMouseDown={[Function]}
1168
+ onMouseEnter={[Function]}
1169
+ onMouseLeave={[Function]}
1170
+ onMouseUp={[Function]}
1171
+ onTouchCancel={[Function]}
1172
+ onTouchEnd={[Function]}
1173
+ onTouchStart={[Function]}
1174
+ style={
1175
+ {
1176
+ ":visited": {
1177
+ "color": "#8755ee",
1178
+ },
1179
+ "borderRadius": 3,
1180
+ "color": "#1865f2",
1181
+ "cursor": "pointer",
1182
+ "display": "inline-flex",
1183
+ "fontSize": 16,
1184
+ "lineHeight": "22px",
1185
+ "outline": "1px solid #1865f2",
1186
+ "textDecoration": "none",
1187
+ }
1188
+ }
1189
+ tabIndex={0}
1190
+ >
1191
+ Click me
1192
+ </a>
1193
+ `;
1194
+
1195
+ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:true focused 2`] = `
1196
+ <a
1197
+ className=""
1198
+ href="#"
1199
+ onBlur={[Function]}
1200
+ onClick={[Function]}
1201
+ onFocus={[Function]}
1202
+ onKeyDown={[Function]}
1203
+ onKeyUp={[Function]}
1204
+ onMouseDown={[Function]}
1205
+ onMouseEnter={[Function]}
1206
+ onMouseLeave={[Function]}
1207
+ onMouseUp={[Function]}
1208
+ onTouchCancel={[Function]}
1209
+ onTouchEnd={[Function]}
1210
+ onTouchStart={[Function]}
1211
+ style={
1212
+ {
1213
+ ":visited": {
1214
+ "color": "#8755ee",
1215
+ },
1216
+ "borderRadius": 3,
1217
+ "color": "#1865f2",
1218
+ "cursor": "pointer",
1219
+ "display": "inline-flex",
1220
+ "fontSize": 16,
1221
+ "lineHeight": "22px",
1222
+ "outline": "1px solid #1865f2",
1223
+ "textDecoration": "none",
1224
+ }
1225
+ }
1226
+ tabIndex={0}
1227
+ >
1228
+ Click me
1229
+ </a>
1230
+ `;
1231
+
1232
+ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:true hovered 1`] = `
1233
+ <a
1234
+ className=""
1235
+ href="#"
1236
+ onBlur={[Function]}
1237
+ onClick={[Function]}
1238
+ onFocus={[Function]}
1239
+ onKeyDown={[Function]}
1240
+ onKeyUp={[Function]}
1241
+ onMouseDown={[Function]}
1242
+ onMouseEnter={[Function]}
1243
+ onMouseLeave={[Function]}
1244
+ onMouseUp={[Function]}
1245
+ onTouchCancel={[Function]}
1246
+ onTouchEnd={[Function]}
1247
+ onTouchStart={[Function]}
1248
+ style={
1249
+ {
1250
+ ":visited": {
1251
+ "color": "#8755ee",
1252
+ },
1253
+ "color": "#1865f2",
1254
+ "cursor": "pointer",
1255
+ "display": "inline-flex",
1256
+ "fontSize": 16,
1257
+ "lineHeight": "22px",
1258
+ "outline": "none",
1259
+ "textDecoration": "underline currentcolor dashed 2px",
1260
+ "textUnderlineOffset": 4,
1261
+ }
1262
+ }
1263
+ tabIndex={0}
1264
+ >
1265
+ Click me
1266
+ </a>
1267
+ `;
1268
+
1269
+ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:true hovered 2`] = `
1270
+ <a
1271
+ className=""
1272
+ href="#"
1273
+ onBlur={[Function]}
1274
+ onClick={[Function]}
1275
+ onFocus={[Function]}
1276
+ onKeyDown={[Function]}
1277
+ onKeyUp={[Function]}
1278
+ onMouseDown={[Function]}
1279
+ onMouseEnter={[Function]}
1280
+ onMouseLeave={[Function]}
1281
+ onMouseUp={[Function]}
1282
+ onTouchCancel={[Function]}
1283
+ onTouchEnd={[Function]}
1284
+ onTouchStart={[Function]}
1285
+ style={
1286
+ {
1287
+ ":visited": {
1288
+ "color": "#8755ee",
1289
+ },
1290
+ "color": "#1865f2",
1291
+ "cursor": "pointer",
1292
+ "display": "inline-flex",
1293
+ "fontSize": 16,
1294
+ "lineHeight": "22px",
1295
+ "outline": "none",
1296
+ "textDecoration": "underline currentcolor dashed 2px",
1297
+ "textUnderlineOffset": 4,
1298
+ }
1299
+ }
1300
+ tabIndex={0}
1301
+ >
1302
+ Click me
1303
+ </a>
1304
+ `;
1305
+
1306
+ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:true pressed 1`] = `
1307
+ <a
1308
+ className=""
1309
+ href="#"
1310
+ onBlur={[Function]}
1311
+ onClick={[Function]}
1312
+ onFocus={[Function]}
1313
+ onKeyDown={[Function]}
1314
+ onKeyUp={[Function]}
1315
+ onMouseDown={[Function]}
1316
+ onMouseEnter={[Function]}
1317
+ onMouseLeave={[Function]}
1318
+ onMouseUp={[Function]}
1319
+ onTouchCancel={[Function]}
1320
+ onTouchEnd={[Function]}
1321
+ onTouchStart={[Function]}
1322
+ style={
1323
+ {
1324
+ ":visited": {
1325
+ "color": "#6645b0",
1326
+ },
1327
+ "color": "#1b50b3",
1328
+ "cursor": "pointer",
1329
+ "display": "inline-flex",
1330
+ "fontSize": 16,
1331
+ "lineHeight": "22px",
1332
+ "outline": "none",
1333
+ "textDecoration": "underline currentcolor solid 1px",
1334
+ "textUnderlineOffset": 4,
1335
+ }
1336
+ }
1337
+ tabIndex={0}
1338
+ >
1339
+ Click me
1340
+ </a>
1341
+ `;
1342
+
1343
+ exports[`LinkCore kind:primary href:#non-existent-link light:false visitable:true pressed 2`] = `
1344
+ <a
1345
+ className=""
1346
+ href="#"
1347
+ onBlur={[Function]}
1348
+ onClick={[Function]}
1349
+ onFocus={[Function]}
1350
+ onKeyDown={[Function]}
1351
+ onKeyUp={[Function]}
1352
+ onMouseDown={[Function]}
1353
+ onMouseEnter={[Function]}
1354
+ onMouseLeave={[Function]}
1355
+ onMouseUp={[Function]}
1356
+ onTouchCancel={[Function]}
1357
+ onTouchEnd={[Function]}
1358
+ onTouchStart={[Function]}
1359
+ style={
1360
+ {
1361
+ ":visited": {
1362
+ "color": "#6645b0",
1363
+ },
1364
+ "color": "#1b50b3",
1365
+ "cursor": "pointer",
1366
+ "display": "inline-flex",
1367
+ "fontSize": 16,
1368
+ "lineHeight": "22px",
1369
+ "outline": "none",
1370
+ "textDecoration": "underline currentcolor solid 1px",
1371
+ "textUnderlineOffset": 4,
1372
+ }
1373
+ }
1374
+ tabIndex={0}
1375
+ >
1376
+ Click me
1377
+ </a>
1378
+ `;
1379
+
1380
+ exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:false focused 1`] = `
1381
+ <a
1382
+ className=""
1383
+ href="#"
1384
+ onBlur={[Function]}
1385
+ onClick={[Function]}
1386
+ onFocus={[Function]}
1387
+ onKeyDown={[Function]}
1388
+ onKeyUp={[Function]}
1389
+ onMouseDown={[Function]}
1390
+ onMouseEnter={[Function]}
1391
+ onMouseLeave={[Function]}
1392
+ onMouseUp={[Function]}
1393
+ onTouchCancel={[Function]}
1394
+ onTouchEnd={[Function]}
1395
+ onTouchStart={[Function]}
1396
+ style={
1397
+ {
1398
+ "borderRadius": 3,
1399
+ "color": "#ffffff",
1400
+ "cursor": "pointer",
1401
+ "display": "inline-flex",
1402
+ "fontSize": 16,
1403
+ "lineHeight": "22px",
1404
+ "outline": "1px solid #ffffff",
1405
+ "textDecoration": "none",
1406
+ }
1407
+ }
1408
+ tabIndex={0}
1409
+ >
1410
+ Click me
1411
+ </a>
1412
+ `;
1413
+
1414
+ exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:false focused 2`] = `
1415
+ <a
1416
+ className=""
1417
+ href="#"
1418
+ onBlur={[Function]}
1419
+ onClick={[Function]}
1420
+ onFocus={[Function]}
1421
+ onKeyDown={[Function]}
1422
+ onKeyUp={[Function]}
1423
+ onMouseDown={[Function]}
1424
+ onMouseEnter={[Function]}
1425
+ onMouseLeave={[Function]}
1426
+ onMouseUp={[Function]}
1427
+ onTouchCancel={[Function]}
1428
+ onTouchEnd={[Function]}
1429
+ onTouchStart={[Function]}
1430
+ style={
1431
+ {
1432
+ "borderRadius": 3,
1433
+ "color": "#ffffff",
1434
+ "cursor": "pointer",
1435
+ "display": "inline-flex",
1436
+ "fontSize": 16,
1437
+ "lineHeight": "22px",
1438
+ "outline": "1px solid #ffffff",
1439
+ "textDecoration": "none",
1440
+ }
1441
+ }
1442
+ tabIndex={0}
1443
+ >
1444
+ Click me
1445
+ </a>
1446
+ `;
1447
+
1448
+ exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:false hovered 1`] = `
1449
+ <a
1450
+ className=""
1451
+ href="#"
1452
+ onBlur={[Function]}
1453
+ onClick={[Function]}
1454
+ onFocus={[Function]}
1455
+ onKeyDown={[Function]}
1456
+ onKeyUp={[Function]}
1457
+ onMouseDown={[Function]}
1458
+ onMouseEnter={[Function]}
1459
+ onMouseLeave={[Function]}
1460
+ onMouseUp={[Function]}
1461
+ onTouchCancel={[Function]}
1462
+ onTouchEnd={[Function]}
1463
+ onTouchStart={[Function]}
1464
+ style={
1465
+ {
1466
+ "color": "#ffffff",
1467
+ "cursor": "pointer",
1468
+ "display": "inline-flex",
1469
+ "fontSize": 16,
1470
+ "lineHeight": "22px",
1471
+ "outline": "none",
1472
+ "textDecoration": "underline currentcolor dashed 2px",
1473
+ "textUnderlineOffset": 4,
1474
+ }
1475
+ }
1476
+ tabIndex={0}
1477
+ >
1478
+ Click me
1479
+ </a>
1480
+ `;
1481
+
1482
+ exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:false hovered 2`] = `
1483
+ <a
1484
+ className=""
1485
+ href="#"
1486
+ onBlur={[Function]}
1487
+ onClick={[Function]}
1488
+ onFocus={[Function]}
1489
+ onKeyDown={[Function]}
1490
+ onKeyUp={[Function]}
1491
+ onMouseDown={[Function]}
1492
+ onMouseEnter={[Function]}
1493
+ onMouseLeave={[Function]}
1494
+ onMouseUp={[Function]}
1495
+ onTouchCancel={[Function]}
1496
+ onTouchEnd={[Function]}
1497
+ onTouchStart={[Function]}
1498
+ style={
1499
+ {
1500
+ "color": "#ffffff",
1501
+ "cursor": "pointer",
1502
+ "display": "inline-flex",
1503
+ "fontSize": 16,
1504
+ "lineHeight": "22px",
1505
+ "outline": "none",
1506
+ "textDecoration": "underline currentcolor dashed 2px",
1507
+ "textUnderlineOffset": 4,
1508
+ }
1509
+ }
1510
+ tabIndex={0}
1511
+ >
1512
+ Click me
1513
+ </a>
1514
+ `;
1515
+
1516
+ exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:false pressed 1`] = `
1517
+ <a
1518
+ className=""
1519
+ href="#"
1520
+ onBlur={[Function]}
1521
+ onClick={[Function]}
1522
+ onFocus={[Function]}
1523
+ onKeyDown={[Function]}
1524
+ onKeyUp={[Function]}
1525
+ onMouseDown={[Function]}
1526
+ onMouseEnter={[Function]}
1527
+ onMouseLeave={[Function]}
1528
+ onMouseUp={[Function]}
1529
+ onTouchCancel={[Function]}
1530
+ onTouchEnd={[Function]}
1531
+ onTouchStart={[Function]}
1532
+ style={
1533
+ {
1534
+ "color": "#b5cefb",
1535
+ "cursor": "pointer",
1536
+ "display": "inline-flex",
1537
+ "fontSize": 16,
1538
+ "lineHeight": "22px",
1539
+ "outline": "none",
1540
+ "textDecoration": "underline currentcolor solid 1px",
1541
+ "textUnderlineOffset": 4,
1542
+ }
1543
+ }
1544
+ tabIndex={0}
1545
+ >
1546
+ Click me
1547
+ </a>
1548
+ `;
1549
+
1550
+ exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:false pressed 2`] = `
1551
+ <a
1552
+ className=""
1553
+ href="#"
1554
+ onBlur={[Function]}
1555
+ onClick={[Function]}
1556
+ onFocus={[Function]}
1557
+ onKeyDown={[Function]}
1558
+ onKeyUp={[Function]}
1559
+ onMouseDown={[Function]}
1560
+ onMouseEnter={[Function]}
1561
+ onMouseLeave={[Function]}
1562
+ onMouseUp={[Function]}
1563
+ onTouchCancel={[Function]}
1564
+ onTouchEnd={[Function]}
1565
+ onTouchStart={[Function]}
1566
+ style={
1567
+ {
1568
+ "color": "#b5cefb",
1569
+ "cursor": "pointer",
1570
+ "display": "inline-flex",
1571
+ "fontSize": 16,
1572
+ "lineHeight": "22px",
1573
+ "outline": "none",
1574
+ "textDecoration": "underline currentcolor solid 1px",
1575
+ "textUnderlineOffset": 4,
1576
+ }
1577
+ }
1578
+ tabIndex={0}
1579
+ >
1580
+ Click me
1581
+ </a>
1582
+ `;
1583
+
1584
+ exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:true focused 1`] = `
1585
+ <a
1586
+ className=""
1587
+ href="#"
1588
+ onBlur={[Function]}
1589
+ onClick={[Function]}
1590
+ onFocus={[Function]}
1591
+ onKeyDown={[Function]}
1592
+ onKeyUp={[Function]}
1593
+ onMouseDown={[Function]}
1594
+ onMouseEnter={[Function]}
1595
+ onMouseLeave={[Function]}
1596
+ onMouseUp={[Function]}
1597
+ onTouchCancel={[Function]}
1598
+ onTouchEnd={[Function]}
1599
+ onTouchStart={[Function]}
1600
+ style={
1601
+ {
1602
+ ":visited": {
1603
+ "color": "#fa50ae",
1604
+ },
1605
+ "borderRadius": 3,
1606
+ "color": "#ffffff",
1607
+ "cursor": "pointer",
1608
+ "display": "inline-flex",
1609
+ "fontSize": 16,
1610
+ "lineHeight": "22px",
1611
+ "outline": "1px solid #ffffff",
1612
+ "textDecoration": "none",
1613
+ }
1614
+ }
1615
+ tabIndex={0}
1616
+ >
1617
+ Click me
1618
+ </a>
1619
+ `;
1620
+
1621
+ exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:true focused 2`] = `
1622
+ <a
1623
+ className=""
1624
+ href="#"
1625
+ onBlur={[Function]}
1626
+ onClick={[Function]}
1627
+ onFocus={[Function]}
1628
+ onKeyDown={[Function]}
1629
+ onKeyUp={[Function]}
1630
+ onMouseDown={[Function]}
1631
+ onMouseEnter={[Function]}
1632
+ onMouseLeave={[Function]}
1633
+ onMouseUp={[Function]}
1634
+ onTouchCancel={[Function]}
1635
+ onTouchEnd={[Function]}
1636
+ onTouchStart={[Function]}
1637
+ style={
1638
+ {
1639
+ ":visited": {
1640
+ "color": "#fa50ae",
1641
+ },
1642
+ "borderRadius": 3,
1643
+ "color": "#ffffff",
1644
+ "cursor": "pointer",
1645
+ "display": "inline-flex",
1646
+ "fontSize": 16,
1647
+ "lineHeight": "22px",
1648
+ "outline": "1px solid #ffffff",
1649
+ "textDecoration": "none",
1650
+ }
1651
+ }
1652
+ tabIndex={0}
1653
+ >
1654
+ Click me
1655
+ </a>
1656
+ `;
1657
+
1658
+ exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:true hovered 1`] = `
1659
+ <a
1660
+ className=""
1661
+ href="#"
1662
+ onBlur={[Function]}
1663
+ onClick={[Function]}
1664
+ onFocus={[Function]}
1665
+ onKeyDown={[Function]}
1666
+ onKeyUp={[Function]}
1667
+ onMouseDown={[Function]}
1668
+ onMouseEnter={[Function]}
1669
+ onMouseLeave={[Function]}
1670
+ onMouseUp={[Function]}
1671
+ onTouchCancel={[Function]}
1672
+ onTouchEnd={[Function]}
1673
+ onTouchStart={[Function]}
1674
+ style={
1675
+ {
1676
+ ":visited": {
1677
+ "color": "#fa50ae",
1678
+ },
1679
+ "color": "#ffffff",
1680
+ "cursor": "pointer",
1681
+ "display": "inline-flex",
1682
+ "fontSize": 16,
1683
+ "lineHeight": "22px",
1684
+ "outline": "none",
1685
+ "textDecoration": "underline currentcolor dashed 2px",
1686
+ "textUnderlineOffset": 4,
1687
+ }
1688
+ }
1689
+ tabIndex={0}
1690
+ >
1691
+ Click me
1692
+ </a>
1693
+ `;
1694
+
1695
+ exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:true hovered 2`] = `
1696
+ <a
1697
+ className=""
1698
+ href="#"
1699
+ onBlur={[Function]}
1700
+ onClick={[Function]}
1701
+ onFocus={[Function]}
1702
+ onKeyDown={[Function]}
1703
+ onKeyUp={[Function]}
1704
+ onMouseDown={[Function]}
1705
+ onMouseEnter={[Function]}
1706
+ onMouseLeave={[Function]}
1707
+ onMouseUp={[Function]}
1708
+ onTouchCancel={[Function]}
1709
+ onTouchEnd={[Function]}
1710
+ onTouchStart={[Function]}
1711
+ style={
1712
+ {
1713
+ ":visited": {
1714
+ "color": "#fa50ae",
1715
+ },
1716
+ "color": "#ffffff",
1717
+ "cursor": "pointer",
1718
+ "display": "inline-flex",
1719
+ "fontSize": 16,
1720
+ "lineHeight": "22px",
1721
+ "outline": "none",
1722
+ "textDecoration": "underline currentcolor dashed 2px",
1723
+ "textUnderlineOffset": 4,
1724
+ }
1725
+ }
1726
+ tabIndex={0}
1727
+ >
1728
+ Click me
1729
+ </a>
1730
+ `;
1731
+
1732
+ exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:true pressed 1`] = `
1733
+ <a
1734
+ className=""
1735
+ href="#"
1736
+ onBlur={[Function]}
1737
+ onClick={[Function]}
1738
+ onFocus={[Function]}
1739
+ onKeyDown={[Function]}
1740
+ onKeyUp={[Function]}
1741
+ onMouseDown={[Function]}
1742
+ onMouseEnter={[Function]}
1743
+ onMouseLeave={[Function]}
1744
+ onMouseUp={[Function]}
1745
+ onTouchCancel={[Function]}
1746
+ onTouchEnd={[Function]}
1747
+ onTouchStart={[Function]}
1748
+ style={
1749
+ {
1750
+ ":visited": {
1751
+ "color": "#fc88c8",
1752
+ },
1753
+ "color": "#b5cefb",
1754
+ "cursor": "pointer",
1755
+ "display": "inline-flex",
1756
+ "fontSize": 16,
1757
+ "lineHeight": "22px",
1758
+ "outline": "none",
1759
+ "textDecoration": "underline currentcolor solid 1px",
1760
+ "textUnderlineOffset": 4,
1761
+ }
1762
+ }
1763
+ tabIndex={0}
1764
+ >
1765
+ Click me
1766
+ </a>
1767
+ `;
1768
+
1769
+ exports[`LinkCore kind:primary href:#non-existent-link light:true visitable:true pressed 2`] = `
1770
+ <a
1771
+ className=""
1772
+ href="#"
1773
+ onBlur={[Function]}
1774
+ onClick={[Function]}
1775
+ onFocus={[Function]}
1776
+ onKeyDown={[Function]}
1777
+ onKeyUp={[Function]}
1778
+ onMouseDown={[Function]}
1779
+ onMouseEnter={[Function]}
1780
+ onMouseLeave={[Function]}
1781
+ onMouseUp={[Function]}
1782
+ onTouchCancel={[Function]}
1783
+ onTouchEnd={[Function]}
1784
+ onTouchStart={[Function]}
1785
+ style={
1786
+ {
1787
+ ":visited": {
1788
+ "color": "#fc88c8",
1789
+ },
1790
+ "color": "#b5cefb",
1791
+ "cursor": "pointer",
1792
+ "display": "inline-flex",
1793
+ "fontSize": 16,
1794
+ "lineHeight": "22px",
1795
+ "outline": "none",
1796
+ "textDecoration": "underline currentcolor solid 1px",
1797
+ "textUnderlineOffset": 4,
1798
+ }
1799
+ }
1800
+ tabIndex={0}
1801
+ >
1802
+ Click me
1803
+ </a>
1804
+ `;
1805
+
1806
+ exports[`LinkCore kind:secondary href:# light:false visitable:false focused 1`] = `
1807
+ <a
1808
+ className=""
1809
+ href="#"
1810
+ onBlur={[Function]}
1811
+ onClick={[Function]}
1812
+ onFocus={[Function]}
1813
+ onKeyDown={[Function]}
1814
+ onKeyUp={[Function]}
1815
+ onMouseDown={[Function]}
1816
+ onMouseEnter={[Function]}
1817
+ onMouseLeave={[Function]}
1818
+ onMouseUp={[Function]}
1819
+ onTouchCancel={[Function]}
1820
+ onTouchEnd={[Function]}
1821
+ onTouchStart={[Function]}
1822
+ style={
1823
+ {
1824
+ "borderRadius": 3,
1825
+ "color": "#21242c",
1826
+ "cursor": "pointer",
1827
+ "display": "inline-flex",
1828
+ "fontSize": 16,
1829
+ "lineHeight": "22px",
1830
+ "outline": "1px solid #1865f2",
1831
+ "textDecoration": "none",
1832
+ }
1833
+ }
1834
+ tabIndex={0}
1835
+ >
1836
+ Click me
1837
+ </a>
1838
+ `;
1839
+
1840
+ exports[`LinkCore kind:secondary href:# light:false visitable:false focused 2`] = `
1841
+ <a
1842
+ className=""
1843
+ href="#"
1844
+ onBlur={[Function]}
1845
+ onClick={[Function]}
1846
+ onFocus={[Function]}
1847
+ onKeyDown={[Function]}
1848
+ onKeyUp={[Function]}
1849
+ onMouseDown={[Function]}
1850
+ onMouseEnter={[Function]}
1851
+ onMouseLeave={[Function]}
1852
+ onMouseUp={[Function]}
1853
+ onTouchCancel={[Function]}
1854
+ onTouchEnd={[Function]}
1855
+ onTouchStart={[Function]}
1856
+ style={
1857
+ {
1858
+ "borderRadius": 3,
1859
+ "color": "rgba(33,36,44,0.64)",
1860
+ "cursor": "pointer",
1861
+ "display": "inline-flex",
1862
+ "fontSize": 16,
1863
+ "lineHeight": "22px",
1864
+ "outline": "1px solid #1865f2",
1865
+ "textDecoration": "none",
1866
+ }
1867
+ }
1868
+ tabIndex={0}
1869
+ >
1870
+ Click me
1871
+ </a>
1872
+ `;
1873
+
1874
+ exports[`LinkCore kind:secondary href:# light:false visitable:false hovered 1`] = `
1875
+ <a
1876
+ className=""
1877
+ href="#"
1878
+ onBlur={[Function]}
1879
+ onClick={[Function]}
1880
+ onFocus={[Function]}
1881
+ onKeyDown={[Function]}
1882
+ onKeyUp={[Function]}
1883
+ onMouseDown={[Function]}
1884
+ onMouseEnter={[Function]}
1885
+ onMouseLeave={[Function]}
1886
+ onMouseUp={[Function]}
1887
+ onTouchCancel={[Function]}
1888
+ onTouchEnd={[Function]}
1889
+ onTouchStart={[Function]}
1890
+ style={
1891
+ {
1892
+ "color": "#21242c",
1893
+ "cursor": "pointer",
1894
+ "display": "inline-flex",
1895
+ "fontSize": 16,
1896
+ "lineHeight": "22px",
1897
+ "outline": "none",
1898
+ "textDecoration": "underline currentcolor dashed 2px",
1899
+ "textUnderlineOffset": 4,
1900
+ }
1901
+ }
1902
+ tabIndex={0}
1903
+ >
1904
+ Click me
1905
+ </a>
1906
+ `;
1907
+
1908
+ exports[`LinkCore kind:secondary href:# light:false visitable:false hovered 2`] = `
1909
+ <a
1910
+ className=""
1911
+ href="#"
1912
+ onBlur={[Function]}
1913
+ onClick={[Function]}
1914
+ onFocus={[Function]}
1915
+ onKeyDown={[Function]}
1916
+ onKeyUp={[Function]}
1917
+ onMouseDown={[Function]}
1918
+ onMouseEnter={[Function]}
1919
+ onMouseLeave={[Function]}
1920
+ onMouseUp={[Function]}
1921
+ onTouchCancel={[Function]}
1922
+ onTouchEnd={[Function]}
1923
+ onTouchStart={[Function]}
1924
+ style={
1925
+ {
1926
+ "color": "rgba(33,36,44,0.64)",
1927
+ "cursor": "pointer",
1928
+ "display": "inline-flex",
1929
+ "fontSize": 16,
1930
+ "lineHeight": "22px",
1931
+ "outline": "none",
1932
+ "textDecoration": "underline currentcolor dashed 2px",
1933
+ "textUnderlineOffset": 4,
1934
+ }
1935
+ }
1936
+ tabIndex={0}
1937
+ >
1938
+ Click me
1939
+ </a>
1940
+ `;
1941
+
1942
+ exports[`LinkCore kind:secondary href:# light:false visitable:false pressed 1`] = `
1943
+ <a
1944
+ className=""
1945
+ href="#"
1946
+ onBlur={[Function]}
1947
+ onClick={[Function]}
1948
+ onFocus={[Function]}
1949
+ onKeyDown={[Function]}
1950
+ onKeyUp={[Function]}
1951
+ onMouseDown={[Function]}
1952
+ onMouseEnter={[Function]}
1953
+ onMouseLeave={[Function]}
1954
+ onMouseUp={[Function]}
1955
+ onTouchCancel={[Function]}
1956
+ onTouchEnd={[Function]}
1957
+ onTouchStart={[Function]}
1958
+ style={
1959
+ {
1960
+ "color": "#1b50b3",
1961
+ "cursor": "pointer",
1962
+ "display": "inline-flex",
1963
+ "fontSize": 16,
1964
+ "lineHeight": "22px",
1965
+ "outline": "none",
1966
+ "textDecoration": "underline currentcolor solid 1px",
1967
+ "textUnderlineOffset": 4,
1968
+ }
1969
+ }
1970
+ tabIndex={0}
1971
+ >
1972
+ Click me
1973
+ </a>
1974
+ `;
1975
+
1976
+ exports[`LinkCore kind:secondary href:# light:false visitable:false pressed 2`] = `
1977
+ <a
1978
+ className=""
1979
+ href="#"
1980
+ onBlur={[Function]}
1981
+ onClick={[Function]}
1982
+ onFocus={[Function]}
1983
+ onKeyDown={[Function]}
1984
+ onKeyUp={[Function]}
1985
+ onMouseDown={[Function]}
1986
+ onMouseEnter={[Function]}
1987
+ onMouseLeave={[Function]}
1988
+ onMouseUp={[Function]}
1989
+ onTouchCancel={[Function]}
1990
+ onTouchEnd={[Function]}
1991
+ onTouchStart={[Function]}
1992
+ style={
1993
+ {
1994
+ "color": "#21242c",
1995
+ "cursor": "pointer",
1996
+ "display": "inline-flex",
1997
+ "fontSize": 16,
1998
+ "lineHeight": "22px",
1999
+ "outline": "none",
2000
+ "textDecoration": "underline currentcolor solid 1px",
2001
+ "textUnderlineOffset": 4,
2002
+ }
2003
+ }
2004
+ tabIndex={0}
2005
+ >
2006
+ Click me
2007
+ </a>
2008
+ `;
2009
+
2010
+ exports[`LinkCore kind:secondary href:#non-existent-link light:false visitable:false focused 1`] = `
2011
+ <a
2012
+ className=""
2013
+ href="#"
2014
+ onBlur={[Function]}
2015
+ onClick={[Function]}
2016
+ onFocus={[Function]}
2017
+ onKeyDown={[Function]}
2018
+ onKeyUp={[Function]}
2019
+ onMouseDown={[Function]}
2020
+ onMouseEnter={[Function]}
2021
+ onMouseLeave={[Function]}
2022
+ onMouseUp={[Function]}
2023
+ onTouchCancel={[Function]}
2024
+ onTouchEnd={[Function]}
2025
+ onTouchStart={[Function]}
2026
+ style={
2027
+ {
2028
+ "borderRadius": 3,
2029
+ "color": "#21242c",
2030
+ "cursor": "pointer",
2031
+ "display": "inline-flex",
2032
+ "fontSize": 16,
2033
+ "lineHeight": "22px",
2034
+ "outline": "1px solid #1865f2",
2035
+ "textDecoration": "none",
2036
+ }
2037
+ }
2038
+ tabIndex={0}
2039
+ >
2040
+ Click me
2041
+ </a>
2042
+ `;
2043
+
2044
+ exports[`LinkCore kind:secondary href:#non-existent-link light:false visitable:false focused 2`] = `
2045
+ <a
2046
+ className=""
2047
+ href="#"
2048
+ onBlur={[Function]}
2049
+ onClick={[Function]}
2050
+ onFocus={[Function]}
2051
+ onKeyDown={[Function]}
2052
+ onKeyUp={[Function]}
2053
+ onMouseDown={[Function]}
2054
+ onMouseEnter={[Function]}
2055
+ onMouseLeave={[Function]}
2056
+ onMouseUp={[Function]}
2057
+ onTouchCancel={[Function]}
2058
+ onTouchEnd={[Function]}
2059
+ onTouchStart={[Function]}
2060
+ style={
2061
+ {
2062
+ "borderRadius": 3,
2063
+ "color": "rgba(33,36,44,0.64)",
2064
+ "cursor": "pointer",
2065
+ "display": "inline-flex",
2066
+ "fontSize": 16,
2067
+ "lineHeight": "22px",
2068
+ "outline": "1px solid #1865f2",
2069
+ "textDecoration": "none",
2070
+ }
2071
+ }
2072
+ tabIndex={0}
2073
+ >
2074
+ Click me
2075
+ </a>
2076
+ `;
2077
+
2078
+ exports[`LinkCore kind:secondary href:#non-existent-link light:false visitable:false hovered 1`] = `
2079
+ <a
2080
+ className=""
2081
+ href="#"
2082
+ onBlur={[Function]}
2083
+ onClick={[Function]}
2084
+ onFocus={[Function]}
2085
+ onKeyDown={[Function]}
2086
+ onKeyUp={[Function]}
2087
+ onMouseDown={[Function]}
2088
+ onMouseEnter={[Function]}
2089
+ onMouseLeave={[Function]}
2090
+ onMouseUp={[Function]}
2091
+ onTouchCancel={[Function]}
2092
+ onTouchEnd={[Function]}
2093
+ onTouchStart={[Function]}
2094
+ style={
2095
+ {
2096
+ "color": "#21242c",
2097
+ "cursor": "pointer",
2098
+ "display": "inline-flex",
2099
+ "fontSize": 16,
2100
+ "lineHeight": "22px",
2101
+ "outline": "none",
2102
+ "textDecoration": "underline currentcolor dashed 2px",
2103
+ "textUnderlineOffset": 4,
2104
+ }
2105
+ }
2106
+ tabIndex={0}
2107
+ >
2108
+ Click me
2109
+ </a>
2110
+ `;
2111
+
2112
+ exports[`LinkCore kind:secondary href:#non-existent-link light:false visitable:false hovered 2`] = `
2113
+ <a
2114
+ className=""
2115
+ href="#"
2116
+ onBlur={[Function]}
2117
+ onClick={[Function]}
2118
+ onFocus={[Function]}
2119
+ onKeyDown={[Function]}
2120
+ onKeyUp={[Function]}
2121
+ onMouseDown={[Function]}
2122
+ onMouseEnter={[Function]}
2123
+ onMouseLeave={[Function]}
2124
+ onMouseUp={[Function]}
2125
+ onTouchCancel={[Function]}
2126
+ onTouchEnd={[Function]}
2127
+ onTouchStart={[Function]}
2128
+ style={
2129
+ {
2130
+ "color": "rgba(33,36,44,0.64)",
2131
+ "cursor": "pointer",
2132
+ "display": "inline-flex",
2133
+ "fontSize": 16,
2134
+ "lineHeight": "22px",
2135
+ "outline": "none",
2136
+ "textDecoration": "underline currentcolor dashed 2px",
2137
+ "textUnderlineOffset": 4,
2138
+ }
2139
+ }
2140
+ tabIndex={0}
2141
+ >
2142
+ Click me
2143
+ </a>
2144
+ `;
2145
+
2146
+ exports[`LinkCore kind:secondary href:#non-existent-link light:false visitable:false pressed 1`] = `
2147
+ <a
2148
+ className=""
2149
+ href="#"
2150
+ onBlur={[Function]}
2151
+ onClick={[Function]}
2152
+ onFocus={[Function]}
2153
+ onKeyDown={[Function]}
2154
+ onKeyUp={[Function]}
2155
+ onMouseDown={[Function]}
2156
+ onMouseEnter={[Function]}
2157
+ onMouseLeave={[Function]}
2158
+ onMouseUp={[Function]}
2159
+ onTouchCancel={[Function]}
2160
+ onTouchEnd={[Function]}
2161
+ onTouchStart={[Function]}
2162
+ style={
2163
+ {
2164
+ "color": "#1b50b3",
2165
+ "cursor": "pointer",
2166
+ "display": "inline-flex",
2167
+ "fontSize": 16,
2168
+ "lineHeight": "22px",
2169
+ "outline": "none",
2170
+ "textDecoration": "underline currentcolor solid 1px",
2171
+ "textUnderlineOffset": 4,
2172
+ }
2173
+ }
2174
+ tabIndex={0}
2175
+ >
2176
+ Click me
2177
+ </a>
2178
+ `;
2179
+
2180
+ exports[`LinkCore kind:secondary href:#non-existent-link light:false visitable:false pressed 2`] = `
2181
+ <a
2182
+ className=""
2183
+ href="#"
2184
+ onBlur={[Function]}
2185
+ onClick={[Function]}
2186
+ onFocus={[Function]}
2187
+ onKeyDown={[Function]}
2188
+ onKeyUp={[Function]}
2189
+ onMouseDown={[Function]}
2190
+ onMouseEnter={[Function]}
2191
+ onMouseLeave={[Function]}
2192
+ onMouseUp={[Function]}
2193
+ onTouchCancel={[Function]}
2194
+ onTouchEnd={[Function]}
2195
+ onTouchStart={[Function]}
2196
+ style={
2197
+ {
2198
+ "color": "#21242c",
2199
+ "cursor": "pointer",
2200
+ "display": "inline-flex",
2201
+ "fontSize": 16,
2202
+ "lineHeight": "22px",
821
2203
  "outline": "none",
822
- "textDecoration": "underline currentcolor solid",
2204
+ "textDecoration": "underline currentcolor solid 1px",
2205
+ "textUnderlineOffset": 4,
823
2206
  }
824
2207
  }
825
2208
  tabIndex={0}