@ornikar/bumper 3.8.1 → 3.9.0

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 (49) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/definitions/system/actions/IconButton/IconButton.d.ts.map +1 -1
  3. package/dist/definitions/system/core/tokens/space.d.ts +12 -0
  4. package/dist/definitions/system/core/tokens/space.d.ts.map +1 -1
  5. package/dist/definitions/tamagui.config.d.ts +24 -0
  6. package/dist/definitions/tamagui.config.d.ts.map +1 -1
  7. package/dist/index-metro.es.android.js +19 -3
  8. package/dist/index-metro.es.android.js.map +1 -1
  9. package/dist/index-metro.es.ios.js +19 -3
  10. package/dist/index-metro.es.ios.js.map +1 -1
  11. package/dist/index-node-22.22.cjs.js +19 -3
  12. package/dist/index-node-22.22.cjs.js.map +1 -1
  13. package/dist/index-node-22.22.cjs.web.js +19 -3
  14. package/dist/index-node-22.22.cjs.web.js.map +1 -1
  15. package/dist/index-node-22.22.es.mjs +19 -3
  16. package/dist/index-node-22.22.es.mjs.map +1 -1
  17. package/dist/index-node-22.22.es.web.mjs +19 -3
  18. package/dist/index-node-22.22.es.web.mjs.map +1 -1
  19. package/dist/index.es.js +19 -3
  20. package/dist/index.es.js.map +1 -1
  21. package/dist/index.es.web.js +19 -3
  22. package/dist/index.es.web.js.map +1 -1
  23. package/dist/storybook-metro.es.android.js +13 -1
  24. package/dist/storybook-metro.es.android.js.map +1 -1
  25. package/dist/storybook-metro.es.ios.js +13 -1
  26. package/dist/storybook-metro.es.ios.js.map +1 -1
  27. package/dist/storybook-node-22.22.cjs.js +13 -1
  28. package/dist/storybook-node-22.22.cjs.js.map +1 -1
  29. package/dist/storybook-node-22.22.cjs.web.js +13 -1
  30. package/dist/storybook-node-22.22.cjs.web.js.map +1 -1
  31. package/dist/storybook-node-22.22.es.mjs +13 -1
  32. package/dist/storybook-node-22.22.es.mjs.map +1 -1
  33. package/dist/storybook-node-22.22.es.web.mjs +13 -1
  34. package/dist/storybook-node-22.22.es.web.mjs.map +1 -1
  35. package/dist/storybook.es.js +13 -1
  36. package/dist/storybook.es.js.map +1 -1
  37. package/dist/storybook.es.web.js +13 -1
  38. package/dist/storybook.es.web.js.map +1 -1
  39. package/dist/tsbuildinfo +1 -1
  40. package/package.json +1 -1
  41. package/src/system/actions/IconButton/IconButton.tsx +4 -0
  42. package/src/system/actions/IconButton/__snapshots__/IconButton.features.stories.tsx.snap +34 -0
  43. package/src/system/actions/IconButton/__snapshots__/IconButton.stories.tsx.snap +1 -0
  44. package/src/system/actions/IconButton/__snapshots_web__/IconButton.features.stories.tsx.snap +34 -34
  45. package/src/system/actions/IconButton/__snapshots_web__/IconButton.stories.tsx.snap +1 -1
  46. package/src/system/core/tokens/__snapshots__/space.stories.tsx.snap +828 -0
  47. package/src/system/core/tokens/__snapshots_web__/space.stories.tsx.snap +300 -0
  48. package/src/system/core/tokens/space.stories.tsx +6 -1
  49. package/src/system/core/tokens/space.ts +12 -0
@@ -358,6 +358,306 @@ exports[`Bumper/Core/Tokens Space 1`] = `
358
358
  class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _backgroundColor-bg--accent-1633109644 _height-t-size-size1385442 _width-80px _btlr-t-radius-ra1673638416 _btrr-t-radius-ra1673638416 _bbrr-t-radius-ra1673638416 _bblr-t-radius-ra1673638416"
359
359
  />
360
360
  </div>
361
+ <div
362
+ class="is_HStack _dsp-flex _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _fd-row _gap-t-space-spa1366020313 _alignItems-center"
363
+ >
364
+ <div
365
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-150px"
366
+ >
367
+ <span
368
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-bo3448 _col-content--ba907952141"
369
+ >
370
+ $space.-2
371
+ </span>
372
+ </div>
373
+ <div
374
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-60px"
375
+ >
376
+ <span
377
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-re98715119 _col-content--ba1918259606"
378
+ >
379
+ -2px
380
+ </span>
381
+ </div>
382
+ <div
383
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _backgroundColor-bg--accent-1633109644 _height-t-size-size1385442 _width-2px _btlr-t-radius-ra1673638416 _btrr-t-radius-ra1673638416 _bbrr-t-radius-ra1673638416 _bblr-t-radius-ra1673638416"
384
+ />
385
+ </div>
386
+ <div
387
+ class="is_HStack _dsp-flex _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _fd-row _gap-t-space-spa1366020313 _alignItems-center"
388
+ >
389
+ <div
390
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-150px"
391
+ >
392
+ <span
393
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-bo3448 _col-content--ba907952141"
394
+ >
395
+ $space.-4
396
+ </span>
397
+ </div>
398
+ <div
399
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-60px"
400
+ >
401
+ <span
402
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-re98715119 _col-content--ba1918259606"
403
+ >
404
+ -4px
405
+ </span>
406
+ </div>
407
+ <div
408
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _backgroundColor-bg--accent-1633109644 _height-t-size-size1385442 _width-4px _btlr-t-radius-ra1673638416 _btrr-t-radius-ra1673638416 _bbrr-t-radius-ra1673638416 _bblr-t-radius-ra1673638416"
409
+ />
410
+ </div>
411
+ <div
412
+ class="is_HStack _dsp-flex _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _fd-row _gap-t-space-spa1366020313 _alignItems-center"
413
+ >
414
+ <div
415
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-150px"
416
+ >
417
+ <span
418
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-bo3448 _col-content--ba907952141"
419
+ >
420
+ $space.-8
421
+ </span>
422
+ </div>
423
+ <div
424
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-60px"
425
+ >
426
+ <span
427
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-re98715119 _col-content--ba1918259606"
428
+ >
429
+ -8px
430
+ </span>
431
+ </div>
432
+ <div
433
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _backgroundColor-bg--accent-1633109644 _height-t-size-size1385442 _width-8px _btlr-t-radius-ra1673638416 _btrr-t-radius-ra1673638416 _bbrr-t-radius-ra1673638416 _bblr-t-radius-ra1673638416"
434
+ />
435
+ </div>
436
+ <div
437
+ class="is_HStack _dsp-flex _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _fd-row _gap-t-space-spa1366020313 _alignItems-center"
438
+ >
439
+ <div
440
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-150px"
441
+ >
442
+ <span
443
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-bo3448 _col-content--ba907952141"
444
+ >
445
+ $space.-12
446
+ </span>
447
+ </div>
448
+ <div
449
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-60px"
450
+ >
451
+ <span
452
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-re98715119 _col-content--ba1918259606"
453
+ >
454
+ -12px
455
+ </span>
456
+ </div>
457
+ <div
458
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _backgroundColor-bg--accent-1633109644 _height-t-size-size1385442 _width-12px _btlr-t-radius-ra1673638416 _btrr-t-radius-ra1673638416 _bbrr-t-radius-ra1673638416 _bblr-t-radius-ra1673638416"
459
+ />
460
+ </div>
461
+ <div
462
+ class="is_HStack _dsp-flex _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _fd-row _gap-t-space-spa1366020313 _alignItems-center"
463
+ >
464
+ <div
465
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-150px"
466
+ >
467
+ <span
468
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-bo3448 _col-content--ba907952141"
469
+ >
470
+ $space.-16
471
+ </span>
472
+ </div>
473
+ <div
474
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-60px"
475
+ >
476
+ <span
477
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-re98715119 _col-content--ba1918259606"
478
+ >
479
+ -16px
480
+ </span>
481
+ </div>
482
+ <div
483
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _backgroundColor-bg--accent-1633109644 _height-t-size-size1385442 _width-16px _btlr-t-radius-ra1673638416 _btrr-t-radius-ra1673638416 _bbrr-t-radius-ra1673638416 _bblr-t-radius-ra1673638416"
484
+ />
485
+ </div>
486
+ <div
487
+ class="is_HStack _dsp-flex _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _fd-row _gap-t-space-spa1366020313 _alignItems-center"
488
+ >
489
+ <div
490
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-150px"
491
+ >
492
+ <span
493
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-bo3448 _col-content--ba907952141"
494
+ >
495
+ $space.-24
496
+ </span>
497
+ </div>
498
+ <div
499
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-60px"
500
+ >
501
+ <span
502
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-re98715119 _col-content--ba1918259606"
503
+ >
504
+ -24px
505
+ </span>
506
+ </div>
507
+ <div
508
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _backgroundColor-bg--accent-1633109644 _height-t-size-size1385442 _width-24px _btlr-t-radius-ra1673638416 _btrr-t-radius-ra1673638416 _bbrr-t-radius-ra1673638416 _bblr-t-radius-ra1673638416"
509
+ />
510
+ </div>
511
+ <div
512
+ class="is_HStack _dsp-flex _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _fd-row _gap-t-space-spa1366020313 _alignItems-center"
513
+ >
514
+ <div
515
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-150px"
516
+ >
517
+ <span
518
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-bo3448 _col-content--ba907952141"
519
+ >
520
+ $space.-32
521
+ </span>
522
+ </div>
523
+ <div
524
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-60px"
525
+ >
526
+ <span
527
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-re98715119 _col-content--ba1918259606"
528
+ >
529
+ -32px
530
+ </span>
531
+ </div>
532
+ <div
533
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _backgroundColor-bg--accent-1633109644 _height-t-size-size1385442 _width-32px _btlr-t-radius-ra1673638416 _btrr-t-radius-ra1673638416 _bbrr-t-radius-ra1673638416 _bblr-t-radius-ra1673638416"
534
+ />
535
+ </div>
536
+ <div
537
+ class="is_HStack _dsp-flex _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _fd-row _gap-t-space-spa1366020313 _alignItems-center"
538
+ >
539
+ <div
540
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-150px"
541
+ >
542
+ <span
543
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-bo3448 _col-content--ba907952141"
544
+ >
545
+ $space.-40
546
+ </span>
547
+ </div>
548
+ <div
549
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-60px"
550
+ >
551
+ <span
552
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-re98715119 _col-content--ba1918259606"
553
+ >
554
+ -40px
555
+ </span>
556
+ </div>
557
+ <div
558
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _backgroundColor-bg--accent-1633109644 _height-t-size-size1385442 _width-40px _btlr-t-radius-ra1673638416 _btrr-t-radius-ra1673638416 _bbrr-t-radius-ra1673638416 _bblr-t-radius-ra1673638416"
559
+ />
560
+ </div>
561
+ <div
562
+ class="is_HStack _dsp-flex _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _fd-row _gap-t-space-spa1366020313 _alignItems-center"
563
+ >
564
+ <div
565
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-150px"
566
+ >
567
+ <span
568
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-bo3448 _col-content--ba907952141"
569
+ >
570
+ $space.-48
571
+ </span>
572
+ </div>
573
+ <div
574
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-60px"
575
+ >
576
+ <span
577
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-re98715119 _col-content--ba1918259606"
578
+ >
579
+ -48px
580
+ </span>
581
+ </div>
582
+ <div
583
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _backgroundColor-bg--accent-1633109644 _height-t-size-size1385442 _width-48px _btlr-t-radius-ra1673638416 _btrr-t-radius-ra1673638416 _bbrr-t-radius-ra1673638416 _bblr-t-radius-ra1673638416"
584
+ />
585
+ </div>
586
+ <div
587
+ class="is_HStack _dsp-flex _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _fd-row _gap-t-space-spa1366020313 _alignItems-center"
588
+ >
589
+ <div
590
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-150px"
591
+ >
592
+ <span
593
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-bo3448 _col-content--ba907952141"
594
+ >
595
+ $space.-56
596
+ </span>
597
+ </div>
598
+ <div
599
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-60px"
600
+ >
601
+ <span
602
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-re98715119 _col-content--ba1918259606"
603
+ >
604
+ -56px
605
+ </span>
606
+ </div>
607
+ <div
608
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _backgroundColor-bg--accent-1633109644 _height-t-size-size1385442 _width-56px _btlr-t-radius-ra1673638416 _btrr-t-radius-ra1673638416 _bbrr-t-radius-ra1673638416 _bblr-t-radius-ra1673638416"
609
+ />
610
+ </div>
611
+ <div
612
+ class="is_HStack _dsp-flex _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _fd-row _gap-t-space-spa1366020313 _alignItems-center"
613
+ >
614
+ <div
615
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-150px"
616
+ >
617
+ <span
618
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-bo3448 _col-content--ba907952141"
619
+ >
620
+ $space.-64
621
+ </span>
622
+ </div>
623
+ <div
624
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-60px"
625
+ >
626
+ <span
627
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-re98715119 _col-content--ba1918259606"
628
+ >
629
+ -64px
630
+ </span>
631
+ </div>
632
+ <div
633
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _backgroundColor-bg--accent-1633109644 _height-t-size-size1385442 _width-64px _btlr-t-radius-ra1673638416 _btrr-t-radius-ra1673638416 _bbrr-t-radius-ra1673638416 _bblr-t-radius-ra1673638416"
634
+ />
635
+ </div>
636
+ <div
637
+ class="is_HStack _dsp-flex _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _fd-row _gap-t-space-spa1366020313 _alignItems-center"
638
+ >
639
+ <div
640
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-150px"
641
+ >
642
+ <span
643
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-bo3448 _col-content--ba907952141"
644
+ >
645
+ $space.-80
646
+ </span>
647
+ </div>
648
+ <div
649
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-60px"
650
+ >
651
+ <span
652
+ class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _dsp-inline _bxs-border-box _ww-break-word _ws-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _ff-f-family _fs-f-size-body1510 _lh-f-lineHeigh201793153 _ls-f-letterSpa1099960310 _fw-f-weight-re98715119 _col-content--ba1918259606"
653
+ >
654
+ -80px
655
+ </span>
656
+ </div>
657
+ <div
658
+ class="_dsp-flex _alignItems-stretch _fd-column _fb-auto _bxs-border-box _pos-relative _minHeight-0px _minWidth-0px _flexShrink-0 _backgroundColor-bg--accent-1633109644 _height-t-size-size1385442 _width-80px _btlr-t-radius-ra1673638416 _btrr-t-radius-ra1673638416 _bbrr-t-radius-ra1673638416 _bblr-t-radius-ra1673638416"
659
+ />
660
+ </div>
361
661
  </div>
362
662
  </div>
363
663
  </span>
@@ -31,7 +31,12 @@ export const Space: Story = {
31
31
  {value}px
32
32
  </Typography.Text>
33
33
  </View>
34
- <View backgroundColor="$bg.accent.default" height="$size.24" width={value} borderRadius="$radius.s" />
34
+ <View
35
+ backgroundColor="$bg.accent.default"
36
+ height="$size.24"
37
+ width={Math.abs(value)}
38
+ borderRadius="$radius.s"
39
+ />
35
40
  </HStack>
36
41
  ))}
37
42
  </VStack>
@@ -12,4 +12,16 @@ export const spaceTokens = {
12
12
  'space.56': 56,
13
13
  'space.64': 64,
14
14
  'space.80': 80,
15
+ 'space.-2': -2,
16
+ 'space.-4': -4,
17
+ 'space.-8': -8,
18
+ 'space.-12': -12,
19
+ 'space.-16': -16,
20
+ 'space.-24': -24,
21
+ 'space.-32': -32,
22
+ 'space.-40': -40,
23
+ 'space.-48': -48,
24
+ 'space.-56': -56,
25
+ 'space.-64': -64,
26
+ 'space.-80': -80,
15
27
  };