@medusajs/ui-preset 3.0.0-preview-20250211091350 → 3.0.0-preview-20250406180144

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 (9) hide show
  1. package/.turbo/turbo-build.log +5 -5
  2. package/CHANGELOG.md +17 -1
  3. package/dist/index.js +33 -21
  4. package/dist/index.mjs +33 -21
  5. package/package.json +2 -2
  6. package/src/theme/extension/theme.ts +10 -2
  7. package/src/theme/tokens/colors.ts +6 -2
  8. package/src/theme/tokens/effects.ts +5 -5
  9. package/src/theme/tokens/typography.ts +12 -12
package/.turbo/turbo-build.log CHANGED
@@ -6,11 +6,11 @@
6
6
  CLI Cleaning output folder
7
7
  CJS Build start
8
8
  ESM Build start
9
- CJS dist/index.js 40.75 KB
10
- CJS ⚡️ Build success in 39ms
11
- ESM dist/index.mjs 44.63 KB
12
- ESM ⚡️ Build success in 40ms
9
+ ESM dist/index.mjs 45.04 KB
10
+ ESM ⚡️ Build success in 29ms
11
+ CJS dist/index.js 41.12 KB
12
+ CJS ⚡️ Build success in 31ms
13
13
  DTS Build start
14
- DTS ⚡️ Build success in 2980ms
14
+ DTS ⚡️ Build success in 2652ms
15
15
  DTS dist/index.d.ts 12.00 B
16
16
  DTS dist/index.d.mts 12.00 B
package/CHANGELOG.md CHANGED
@@ -1,6 +1,22 @@
1
1
  # @medusajs/ui-preset
2
2
 
3
- ## 3.0.0-preview-20250211091350
3
+ ## 3.0.0-preview-20250406180144
4
+
5
+ ### Patch Changes
6
+
7
+ - [#11734](https://github.com/medusajs/medusa/pull/11734) [`cc4c5c86e227a6693d53ea6b5b9e62d0a7c57fa2`](https://github.com/medusajs/medusa/commit/cc4c5c86e227a6693d53ea6b5b9e62d0a7c57fa2) Thanks [@kasperkristensen](https://github.com/kasperkristensen)! - chore(ui-preset,icons,dashboard): Sync with Figma, and update ArrowRight import
8
+
9
+ ## 2.6.1
10
+
11
+ ### Patch Changes
12
+
13
+ - [#11738](https://github.com/medusajs/medusa/pull/11738) [`3b470f41427e487c68f89b8ee8155de716ffe861`](https://github.com/medusajs/medusa/commit/3b470f41427e487c68f89b8ee8155de716ffe861) Thanks [@olivermrbl](https://github.com/olivermrbl)! - chore: Remove ranges on Medusa packages
14
+
15
+ ## 2.6.0
16
+
17
+ ## 2.5.1
18
+
19
+ ## 2.5.0
4
20
 
5
21
  ## 2.4.0
6
22
 
package/dist/index.js CHANGED
@@ -362,6 +362,14 @@ var theme = {
362
362
  "muted": {
363
363
  "DEFAULT": "var(--fg-muted)"
364
364
  }
365
+ },
366
+ "alpha": {
367
+ "250": {
368
+ "DEFAULT": "var(--alpha-250)"
369
+ },
370
+ "400": {
371
+ "DEFAULT": "var(--alpha-400)"
372
+ }
365
373
  }
366
374
  }
367
375
  },
@@ -386,9 +394,9 @@ var theme = {
386
394
  "elevation-flyout": "var(--elevation-flyout)",
387
395
  "elevation-tooltip": "var(--elevation-tooltip)",
388
396
  "elevation-modal": "var(--elevation-modal)",
389
- "elevation-commandbar": "var(--elevation-commandbar)",
390
397
  "elevation-code-block": "var(--elevation-code-block)",
391
- "buttons-inverted": "var(--buttons-inverted)"
398
+ "buttons-inverted": "var(--buttons-inverted)",
399
+ "elevation-commandbar": "var(--elevation-commandbar)"
392
400
  }
393
401
  }
394
402
  };
@@ -483,7 +491,9 @@ var colors = {
483
491
  "--bg-field-component-hover": "rgba(39, 39, 42, 1)",
484
492
  "--bg-subtle-pressed": "rgba(39, 39, 42, 1)",
485
493
  "--button-transparent-pressed": "rgba(255, 255, 255, 0.12)",
486
- "--fg-muted": "rgba(113, 113, 122, 1)"
494
+ "--fg-muted": "rgba(113, 113, 122, 1)",
495
+ "--alpha-400": "rgba(255, 255, 255, 0.24)",
496
+ "--alpha-250": "rgba(255, 255, 255, 0.1)"
487
497
  },
488
498
  "light": {
489
499
  "--tag-neutral-border": "rgba(228, 228, 231, 1)",
@@ -573,7 +583,9 @@ var colors = {
573
583
  "--contrast-border-top": "rgba(24, 24, 27, 1)",
574
584
  "--bg-overlay": "rgba(24, 24, 27, 0.4)",
575
585
  "--fg-disabled": "rgba(161, 161, 170, 1)",
576
- "--fg-muted": "rgba(113, 113, 122, 1)"
586
+ "--fg-muted": "rgba(113, 113, 122, 1)",
587
+ "--alpha-400": "rgba(24, 24, 27, 0.24)",
588
+ "--alpha-250": "rgba(24, 24, 27, 0.1)"
577
589
  }
578
590
  };
579
591
 
@@ -597,7 +609,6 @@ var effects = {
597
609
  "--buttons-danger-focus": "0px -1px 0px 0px rgba(255, 255, 255, 0.16), 0px 0px 0px 1px rgba(255, 255, 255, 0.12), 0px 0px 0px 1px rgba(159, 18, 57, 1), 0px 0px 0px 2px rgba(24, 24, 27, 1), 0px 0px 0px 4px rgba(96, 165, 250, 0.8)",
598
610
  "--details-switch-background": "0px 1px 1px 0px rgba(0, 0, 0, 0.1) inset, 0px 2px 4px 0px rgba(0, 0, 0, 0.1) inset, 0px 0px 0px 0.75px rgba(255, 255, 255, 0.12) inset, 0px 0px 8px 0px rgba(0, 0, 0, 0.1) inset",
599
611
  "--buttons-inverted-focus": "0px -1px 0px 0px rgba(255, 255, 255, 0.12), 0px 0px 0px 1px rgba(255, 255, 255, 0.12), 0px 0px 0px 1px rgba(82, 82, 91, 1), 0px 0px 0px 2px rgba(24, 24, 27, 1), 0px 0px 0px 4px rgba(96, 165, 250, 0.8)",
600
- "--elevation-tooltip": "0px -1px 0px 0px rgba(255, 255, 255, 0.04), 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 2px 4px 0px rgba(0, 0, 0, 0.32), 0px 4px 8px 0px rgba(0, 0, 0, 0.32)",
601
612
  "--elevation-flyout": "0px -1px 0px 0px rgba(255, 255, 255, 0.04), 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 4px 8px 0px rgba(0, 0, 0, 0.32), 0px 8px 16px 0px rgba(0, 0, 0, 0.32)",
602
613
  "--borders-error": "0px 0px 0px 1px rgba(244, 63, 94, 1), 0px 0px 0px 3px rgba(225, 29, 72, 0.25)",
603
614
  "--buttons-inverted": "0px -1px 0px 0px rgba(255, 255, 255, 0.12), 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 0px 0px 1px rgba(82, 82, 91, 1), 0px 0px 1px 1.5px rgba(0, 0, 0, 0.24), 0px 2px 2px 0px rgba(0, 0, 0, 0.24)",
@@ -607,8 +618,9 @@ var effects = {
607
618
  "--buttons-neutral": "0px -1px 0px 0px rgba(255, 255, 255, 0.06), 0px 0px 0px 1px rgba(255, 255, 255, 0.06), 0px 0px 0px 1px rgba(39, 39, 42, 1), 0px 0px 1px 1.5px rgba(0, 0, 0, 0.24), 0px 2px 2px 0px rgba(0, 0, 0, 0.24)",
608
619
  "--elevation-code-block": "0px -1px 0px 0px rgba(255, 255, 255, 0.06), 0px 0px 0px 1px rgba(255, 255, 255, 0.06), 0px 0px 0px 1px rgba(39, 39, 42, 1), 0px 1px 2px 0px rgba(0, 0, 0, 0.32), 0px 2px 4px 0px rgba(0, 0, 0, 0.32)",
609
620
  "--buttons-neutral-focus": "0px -1px 0px 0px rgba(255, 255, 255, 0.06), 0px 0px 0px 1px rgba(255, 255, 255, 0.06), 0px 0px 0px 1px rgba(39, 39, 42, 1), 0px 0px 0px 2px rgba(24, 24, 27, 1), 0px 0px 0px 4px rgba(96, 165, 250, 0.8)",
610
- "--elevation-commandbar": "0px 0px 0px 1px rgba(39, 39, 42, 1) inset, 0px 0px 0px 1.5px rgba(255, 255, 255, 0.1) inset, 0px 4px 8px 0px rgba(0, 0, 0, 0.32), 0px 8px 16px 0px rgba(0, 0, 0, 0.32)",
611
- "--elevation-modal": "0px 0px 0px 1px rgba(24, 24, 27, 1) inset, 0px 0px 0px 1.5px rgba(255, 255, 255, 0.06) inset, 0px -1px 0px 0px rgba(255, 255, 255, 0.04), 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 4px 8px 0px rgba(0, 0, 0, 0.32), 0px 8px 16px 0px rgba(0, 0, 0, 0.32)"
621
+ "--elevation-modal": "0px 0px 0px 1px rgba(24, 24, 27, 1) inset, 0px 0px 0px 1.5px rgba(255, 255, 255, 0.06) inset, 0px -1px 0px 0px rgba(255, 255, 255, 0.04), 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 4px 8px 0px rgba(0, 0, 0, 0.32), 0px 8px 16px 0px rgba(0, 0, 0, 0.32)",
622
+ "--elevation-commandbar": "0px 0px 0px 0.75px rgba(24, 24, 27, 1) inset, 0px 0px 0px 1.25px rgba(255, 255, 255, 0.1) inset, 0px 4px 8px 0px rgba(0, 0, 0, 0.32), 0px 8px 16px 0px rgba(0, 0, 0, 0.32)",
623
+ "--elevation-tooltip": "0px -1px 0px 0px rgba(255, 255, 255, 0.04), 0px 2px 4px 0px rgba(0, 0, 0, 0.32), 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 4px 8px 0px rgba(0, 0, 0, 0.32)"
612
624
  },
613
625
  "light": {
614
626
  "--borders-interactive-with-active": "0px 0px 0px 1px rgba(59, 130, 246, 1), 0px 0px 0px 4px rgba(59, 130, 246, 0.2)",
@@ -631,9 +643,9 @@ var effects = {
631
643
  "--elevation-flyout": "0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 4px 8px 0px rgba(0, 0, 0, 0.08), 0px 8px 16px 0px rgba(0, 0, 0, 0.08)",
632
644
  "--elevation-tooltip": "0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 2px 4px 0px rgba(0, 0, 0, 0.08), 0px 4px 8px 0px rgba(0, 0, 0, 0.08)",
633
645
  "--elevation-modal": "0px 0px 0px 1px rgba(255, 255, 255, 1) inset, 0px 0px 0px 1.5px rgba(228, 228, 231, 0.6) inset, 0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 8px 16px 0px rgba(0, 0, 0, 0.08), 0px 16px 32px 0px rgba(0, 0, 0, 0.08)",
634
- "--elevation-commandbar": "0px 0px 0px 1px rgba(39, 39, 42, 1) inset, 0px 0px 0px 1.5px rgba(255, 255, 255, 0.3) inset, 0px 8px 16px 0px rgba(0, 0, 0, 0.08), 0px 16px 32px 0px rgba(0, 0, 0, 0.08)",
635
646
  "--elevation-code-block": "0px 0px 0px 1px rgba(24, 24, 27, 1) inset, 0px 0px 0px 1.5px rgba(255, 255, 255, 0.2) inset",
636
- "--buttons-inverted": "0px 0.75px 0px 0px rgba(255, 255, 255, 0.2) inset, 0px 1px 2px 0px rgba(0, 0, 0, 0.4), 0px 0px 0px 1px rgba(24, 24, 27, 1)"
647
+ "--buttons-inverted": "0px 0.75px 0px 0px rgba(255, 255, 255, 0.2) inset, 0px 1px 2px 0px rgba(0, 0, 0, 0.4), 0px 0px 0px 1px rgba(24, 24, 27, 1)",
648
+ "--elevation-commandbar": "0px 0px 0px 0.75px rgba(39, 39, 42, 1) inset, 0px 0px 0px 1.25px rgba(255, 255, 255, 0.3) inset, 0px 8px 16px 0px rgba(0, 0, 0, 0.08), 0px 16px 32px 0px rgba(0, 0, 0, 0.08)"
637
649
  }
638
650
  };
639
651
 
@@ -777,24 +789,12 @@ var typography = {
777
789
  "fontWeight": "500",
778
790
  "fontFamily": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji"
779
791
  },
780
- ".code-label": {
781
- "fontSize": "0.75rem",
782
- "lineHeight": "1.25rem",
783
- "fontWeight": "400",
784
- "fontFamily": "Roboto Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace"
785
- },
786
792
  ".h4-webs": {
787
793
  "fontSize": "1.5rem",
788
794
  "lineHeight": "1.875rem",
789
795
  "fontWeight": "500",
790
796
  "fontFamily": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji"
791
797
  },
792
- ".code-body": {
793
- "fontSize": "0.75rem",
794
- "lineHeight": "1.125rem",
795
- "fontWeight": "400",
796
- "fontFamily": "Roboto Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace"
797
- },
798
798
  ".h2-core": {
799
799
  "fontSize": "1rem",
800
800
  "lineHeight": "1.5rem",
@@ -830,6 +830,18 @@ var typography = {
830
830
  "lineHeight": "1.5rem",
831
831
  "fontWeight": "500",
832
832
  "fontFamily": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji"
833
+ },
834
+ ".code-body": {
835
+ "fontSize": "0.75rem",
836
+ "lineHeight": "1.125rem",
837
+ "fontWeight": "400",
838
+ "fontFamily": "Roboto Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace"
839
+ },
840
+ ".code-label": {
841
+ "fontSize": "0.75rem",
842
+ "lineHeight": "0.9375rem",
843
+ "fontWeight": "500",
844
+ "fontFamily": "Roboto Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace"
833
845
  }
834
846
  };
835
847
 
package/dist/index.mjs CHANGED
@@ -360,6 +360,14 @@ var init_theme = __esm({
360
360
  "muted": {
361
361
  "DEFAULT": "var(--fg-muted)"
362
362
  }
363
+ },
364
+ "alpha": {
365
+ "250": {
366
+ "DEFAULT": "var(--alpha-250)"
367
+ },
368
+ "400": {
369
+ "DEFAULT": "var(--alpha-400)"
370
+ }
363
371
  }
364
372
  }
365
373
  },
@@ -384,9 +392,9 @@ var init_theme = __esm({
384
392
  "elevation-flyout": "var(--elevation-flyout)",
385
393
  "elevation-tooltip": "var(--elevation-tooltip)",
386
394
  "elevation-modal": "var(--elevation-modal)",
387
- "elevation-commandbar": "var(--elevation-commandbar)",
388
395
  "elevation-code-block": "var(--elevation-code-block)",
389
- "buttons-inverted": "var(--buttons-inverted)"
396
+ "buttons-inverted": "var(--buttons-inverted)",
397
+ "elevation-commandbar": "var(--elevation-commandbar)"
390
398
  }
391
399
  }
392
400
  };
@@ -487,7 +495,9 @@ var init_colors = __esm({
487
495
  "--bg-field-component-hover": "rgba(39, 39, 42, 1)",
488
496
  "--bg-subtle-pressed": "rgba(39, 39, 42, 1)",
489
497
  "--button-transparent-pressed": "rgba(255, 255, 255, 0.12)",
490
- "--fg-muted": "rgba(113, 113, 122, 1)"
498
+ "--fg-muted": "rgba(113, 113, 122, 1)",
499
+ "--alpha-400": "rgba(255, 255, 255, 0.24)",
500
+ "--alpha-250": "rgba(255, 255, 255, 0.1)"
491
501
  },
492
502
  "light": {
493
503
  "--tag-neutral-border": "rgba(228, 228, 231, 1)",
@@ -577,7 +587,9 @@ var init_colors = __esm({
577
587
  "--contrast-border-top": "rgba(24, 24, 27, 1)",
578
588
  "--bg-overlay": "rgba(24, 24, 27, 0.4)",
579
589
  "--fg-disabled": "rgba(161, 161, 170, 1)",
580
- "--fg-muted": "rgba(113, 113, 122, 1)"
590
+ "--fg-muted": "rgba(113, 113, 122, 1)",
591
+ "--alpha-400": "rgba(24, 24, 27, 0.24)",
592
+ "--alpha-250": "rgba(24, 24, 27, 0.1)"
581
593
  }
582
594
  };
583
595
  }
@@ -613,7 +625,6 @@ var init_effects = __esm({
613
625
  "--buttons-danger-focus": "0px -1px 0px 0px rgba(255, 255, 255, 0.16), 0px 0px 0px 1px rgba(255, 255, 255, 0.12), 0px 0px 0px 1px rgba(159, 18, 57, 1), 0px 0px 0px 2px rgba(24, 24, 27, 1), 0px 0px 0px 4px rgba(96, 165, 250, 0.8)",
614
626
  "--details-switch-background": "0px 1px 1px 0px rgba(0, 0, 0, 0.1) inset, 0px 2px 4px 0px rgba(0, 0, 0, 0.1) inset, 0px 0px 0px 0.75px rgba(255, 255, 255, 0.12) inset, 0px 0px 8px 0px rgba(0, 0, 0, 0.1) inset",
615
627
  "--buttons-inverted-focus": "0px -1px 0px 0px rgba(255, 255, 255, 0.12), 0px 0px 0px 1px rgba(255, 255, 255, 0.12), 0px 0px 0px 1px rgba(82, 82, 91, 1), 0px 0px 0px 2px rgba(24, 24, 27, 1), 0px 0px 0px 4px rgba(96, 165, 250, 0.8)",
616
- "--elevation-tooltip": "0px -1px 0px 0px rgba(255, 255, 255, 0.04), 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 2px 4px 0px rgba(0, 0, 0, 0.32), 0px 4px 8px 0px rgba(0, 0, 0, 0.32)",
617
628
  "--elevation-flyout": "0px -1px 0px 0px rgba(255, 255, 255, 0.04), 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 4px 8px 0px rgba(0, 0, 0, 0.32), 0px 8px 16px 0px rgba(0, 0, 0, 0.32)",
618
629
  "--borders-error": "0px 0px 0px 1px rgba(244, 63, 94, 1), 0px 0px 0px 3px rgba(225, 29, 72, 0.25)",
619
630
  "--buttons-inverted": "0px -1px 0px 0px rgba(255, 255, 255, 0.12), 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 0px 0px 1px rgba(82, 82, 91, 1), 0px 0px 1px 1.5px rgba(0, 0, 0, 0.24), 0px 2px 2px 0px rgba(0, 0, 0, 0.24)",
@@ -623,8 +634,9 @@ var init_effects = __esm({
623
634
  "--buttons-neutral": "0px -1px 0px 0px rgba(255, 255, 255, 0.06), 0px 0px 0px 1px rgba(255, 255, 255, 0.06), 0px 0px 0px 1px rgba(39, 39, 42, 1), 0px 0px 1px 1.5px rgba(0, 0, 0, 0.24), 0px 2px 2px 0px rgba(0, 0, 0, 0.24)",
624
635
  "--elevation-code-block": "0px -1px 0px 0px rgba(255, 255, 255, 0.06), 0px 0px 0px 1px rgba(255, 255, 255, 0.06), 0px 0px 0px 1px rgba(39, 39, 42, 1), 0px 1px 2px 0px rgba(0, 0, 0, 0.32), 0px 2px 4px 0px rgba(0, 0, 0, 0.32)",
625
636
  "--buttons-neutral-focus": "0px -1px 0px 0px rgba(255, 255, 255, 0.06), 0px 0px 0px 1px rgba(255, 255, 255, 0.06), 0px 0px 0px 1px rgba(39, 39, 42, 1), 0px 0px 0px 2px rgba(24, 24, 27, 1), 0px 0px 0px 4px rgba(96, 165, 250, 0.8)",
626
- "--elevation-commandbar": "0px 0px 0px 1px rgba(39, 39, 42, 1) inset, 0px 0px 0px 1.5px rgba(255, 255, 255, 0.1) inset, 0px 4px 8px 0px rgba(0, 0, 0, 0.32), 0px 8px 16px 0px rgba(0, 0, 0, 0.32)",
627
- "--elevation-modal": "0px 0px 0px 1px rgba(24, 24, 27, 1) inset, 0px 0px 0px 1.5px rgba(255, 255, 255, 0.06) inset, 0px -1px 0px 0px rgba(255, 255, 255, 0.04), 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 4px 8px 0px rgba(0, 0, 0, 0.32), 0px 8px 16px 0px rgba(0, 0, 0, 0.32)"
637
+ "--elevation-modal": "0px 0px 0px 1px rgba(24, 24, 27, 1) inset, 0px 0px 0px 1.5px rgba(255, 255, 255, 0.06) inset, 0px -1px 0px 0px rgba(255, 255, 255, 0.04), 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 4px 8px 0px rgba(0, 0, 0, 0.32), 0px 8px 16px 0px rgba(0, 0, 0, 0.32)",
638
+ "--elevation-commandbar": "0px 0px 0px 0.75px rgba(24, 24, 27, 1) inset, 0px 0px 0px 1.25px rgba(255, 255, 255, 0.1) inset, 0px 4px 8px 0px rgba(0, 0, 0, 0.32), 0px 8px 16px 0px rgba(0, 0, 0, 0.32)",
639
+ "--elevation-tooltip": "0px -1px 0px 0px rgba(255, 255, 255, 0.04), 0px 2px 4px 0px rgba(0, 0, 0, 0.32), 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 4px 8px 0px rgba(0, 0, 0, 0.32)"
628
640
  },
629
641
  "light": {
630
642
  "--borders-interactive-with-active": "0px 0px 0px 1px rgba(59, 130, 246, 1), 0px 0px 0px 4px rgba(59, 130, 246, 0.2)",
@@ -647,9 +659,9 @@ var init_effects = __esm({
647
659
  "--elevation-flyout": "0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 4px 8px 0px rgba(0, 0, 0, 0.08), 0px 8px 16px 0px rgba(0, 0, 0, 0.08)",
648
660
  "--elevation-tooltip": "0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 2px 4px 0px rgba(0, 0, 0, 0.08), 0px 4px 8px 0px rgba(0, 0, 0, 0.08)",
649
661
  "--elevation-modal": "0px 0px 0px 1px rgba(255, 255, 255, 1) inset, 0px 0px 0px 1.5px rgba(228, 228, 231, 0.6) inset, 0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 8px 16px 0px rgba(0, 0, 0, 0.08), 0px 16px 32px 0px rgba(0, 0, 0, 0.08)",
650
- "--elevation-commandbar": "0px 0px 0px 1px rgba(39, 39, 42, 1) inset, 0px 0px 0px 1.5px rgba(255, 255, 255, 0.3) inset, 0px 8px 16px 0px rgba(0, 0, 0, 0.08), 0px 16px 32px 0px rgba(0, 0, 0, 0.08)",
651
662
  "--elevation-code-block": "0px 0px 0px 1px rgba(24, 24, 27, 1) inset, 0px 0px 0px 1.5px rgba(255, 255, 255, 0.2) inset",
652
- "--buttons-inverted": "0px 0.75px 0px 0px rgba(255, 255, 255, 0.2) inset, 0px 1px 2px 0px rgba(0, 0, 0, 0.4), 0px 0px 0px 1px rgba(24, 24, 27, 1)"
663
+ "--buttons-inverted": "0px 0.75px 0px 0px rgba(255, 255, 255, 0.2) inset, 0px 1px 2px 0px rgba(0, 0, 0, 0.4), 0px 0px 0px 1px rgba(24, 24, 27, 1)",
664
+ "--elevation-commandbar": "0px 0px 0px 0.75px rgba(39, 39, 42, 1) inset, 0px 0px 0px 1.25px rgba(255, 255, 255, 0.3) inset, 0px 8px 16px 0px rgba(0, 0, 0, 0.08), 0px 16px 32px 0px rgba(0, 0, 0, 0.08)"
653
665
  }
654
666
  };
655
667
  }
@@ -799,24 +811,12 @@ var init_typography = __esm({
799
811
  "fontWeight": "500",
800
812
  "fontFamily": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji"
801
813
  },
802
- ".code-label": {
803
- "fontSize": "0.75rem",
804
- "lineHeight": "1.25rem",
805
- "fontWeight": "400",
806
- "fontFamily": "Roboto Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace"
807
- },
808
814
  ".h4-webs": {
809
815
  "fontSize": "1.5rem",
810
816
  "lineHeight": "1.875rem",
811
817
  "fontWeight": "500",
812
818
  "fontFamily": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji"
813
819
  },
814
- ".code-body": {
815
- "fontSize": "0.75rem",
816
- "lineHeight": "1.125rem",
817
- "fontWeight": "400",
818
- "fontFamily": "Roboto Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace"
819
- },
820
820
  ".h2-core": {
821
821
  "fontSize": "1rem",
822
822
  "lineHeight": "1.5rem",
@@ -852,6 +852,18 @@ var init_typography = __esm({
852
852
  "lineHeight": "1.5rem",
853
853
  "fontWeight": "500",
854
854
  "fontFamily": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji"
855
+ },
856
+ ".code-body": {
857
+ "fontSize": "0.75rem",
858
+ "lineHeight": "1.125rem",
859
+ "fontWeight": "400",
860
+ "fontFamily": "Roboto Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace"
861
+ },
862
+ ".code-label": {
863
+ "fontSize": "0.75rem",
864
+ "lineHeight": "0.9375rem",
865
+ "fontWeight": "500",
866
+ "fontFamily": "Roboto Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace"
855
867
  }
856
868
  };
857
869
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@medusajs/ui-preset",
3
- "version": "3.0.0-preview-20250211091350",
3
+ "version": "3.0.0-preview-20250406180144",
4
4
  "description": "Medusa UI preset",
5
5
  "license": "MIT",
6
6
  "repository": {
@@ -30,7 +30,7 @@
30
30
  "tailwindcss": ">=3.0.0"
31
31
  },
32
32
  "devDependencies": {
33
- "@medusajs/toolbox": "3.0.0-preview-20250211091350",
33
+ "@medusajs/toolbox": "3.0.0-preview-20250406180144",
34
34
  "tailwindcss": "^3.4.1",
35
35
  "tsup": "^7.1.0",
36
36
  "typescript": "^5.1.6"
package/src/theme/extension/theme.ts CHANGED
@@ -301,6 +301,14 @@ export const theme = {
301
301
  "muted": {
302
302
  "DEFAULT": "var(--fg-muted)"
303
303
  }
304
+ },
305
+ "alpha": {
306
+ "250": {
307
+ "DEFAULT": "var(--alpha-250)"
308
+ },
309
+ "400": {
310
+ "DEFAULT": "var(--alpha-400)"
311
+ }
304
312
  }
305
313
  }
306
314
  },
@@ -325,9 +333,9 @@ export const theme = {
325
333
  "elevation-flyout": "var(--elevation-flyout)",
326
334
  "elevation-tooltip": "var(--elevation-tooltip)",
327
335
  "elevation-modal": "var(--elevation-modal)",
328
- "elevation-commandbar": "var(--elevation-commandbar)",
329
336
  "elevation-code-block": "var(--elevation-code-block)",
330
- "buttons-inverted": "var(--buttons-inverted)"
337
+ "buttons-inverted": "var(--buttons-inverted)",
338
+ "elevation-commandbar": "var(--elevation-commandbar)"
331
339
  }
332
340
  }
333
341
  }
package/src/theme/tokens/colors.ts CHANGED
@@ -87,7 +87,9 @@ export const colors = {
87
87
  "--bg-field-component-hover": "rgba(39, 39, 42, 1)",
88
88
  "--bg-subtle-pressed": "rgba(39, 39, 42, 1)",
89
89
  "--button-transparent-pressed": "rgba(255, 255, 255, 0.12)",
90
- "--fg-muted": "rgba(113, 113, 122, 1)"
90
+ "--fg-muted": "rgba(113, 113, 122, 1)",
91
+ "--alpha-400": "rgba(255, 255, 255, 0.24)",
92
+ "--alpha-250": "rgba(255, 255, 255, 0.1)"
91
93
  },
92
94
  "light": {
93
95
  "--tag-neutral-border": "rgba(228, 228, 231, 1)",
@@ -177,6 +179,8 @@ export const colors = {
177
179
  "--contrast-border-top": "rgba(24, 24, 27, 1)",
178
180
  "--bg-overlay": "rgba(24, 24, 27, 0.4)",
179
181
  "--fg-disabled": "rgba(161, 161, 170, 1)",
180
- "--fg-muted": "rgba(113, 113, 122, 1)"
182
+ "--fg-muted": "rgba(113, 113, 122, 1)",
183
+ "--alpha-400": "rgba(24, 24, 27, 0.24)",
184
+ "--alpha-250": "rgba(24, 24, 27, 0.1)"
181
185
  }
182
186
  }
package/src/theme/tokens/effects.ts CHANGED
@@ -11,7 +11,6 @@ export const effects = {
11
11
  "--buttons-danger-focus": "0px -1px 0px 0px rgba(255, 255, 255, 0.16), 0px 0px 0px 1px rgba(255, 255, 255, 0.12), 0px 0px 0px 1px rgba(159, 18, 57, 1), 0px 0px 0px 2px rgba(24, 24, 27, 1), 0px 0px 0px 4px rgba(96, 165, 250, 0.8)",
12
12
  "--details-switch-background": "0px 1px 1px 0px rgba(0, 0, 0, 0.1) inset, 0px 2px 4px 0px rgba(0, 0, 0, 0.1) inset, 0px 0px 0px 0.75px rgba(255, 255, 255, 0.12) inset, 0px 0px 8px 0px rgba(0, 0, 0, 0.1) inset",
13
13
  "--buttons-inverted-focus": "0px -1px 0px 0px rgba(255, 255, 255, 0.12), 0px 0px 0px 1px rgba(255, 255, 255, 0.12), 0px 0px 0px 1px rgba(82, 82, 91, 1), 0px 0px 0px 2px rgba(24, 24, 27, 1), 0px 0px 0px 4px rgba(96, 165, 250, 0.8)",
14
- "--elevation-tooltip": "0px -1px 0px 0px rgba(255, 255, 255, 0.04), 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 2px 4px 0px rgba(0, 0, 0, 0.32), 0px 4px 8px 0px rgba(0, 0, 0, 0.32)",
15
14
  "--elevation-flyout": "0px -1px 0px 0px rgba(255, 255, 255, 0.04), 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 4px 8px 0px rgba(0, 0, 0, 0.32), 0px 8px 16px 0px rgba(0, 0, 0, 0.32)",
16
15
  "--borders-error": "0px 0px 0px 1px rgba(244, 63, 94, 1), 0px 0px 0px 3px rgba(225, 29, 72, 0.25)",
17
16
  "--buttons-inverted": "0px -1px 0px 0px rgba(255, 255, 255, 0.12), 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 0px 0px 1px rgba(82, 82, 91, 1), 0px 0px 1px 1.5px rgba(0, 0, 0, 0.24), 0px 2px 2px 0px rgba(0, 0, 0, 0.24)",
@@ -21,8 +20,9 @@ export const effects = {
21
20
  "--buttons-neutral": "0px -1px 0px 0px rgba(255, 255, 255, 0.06), 0px 0px 0px 1px rgba(255, 255, 255, 0.06), 0px 0px 0px 1px rgba(39, 39, 42, 1), 0px 0px 1px 1.5px rgba(0, 0, 0, 0.24), 0px 2px 2px 0px rgba(0, 0, 0, 0.24)",
22
21
  "--elevation-code-block": "0px -1px 0px 0px rgba(255, 255, 255, 0.06), 0px 0px 0px 1px rgba(255, 255, 255, 0.06), 0px 0px 0px 1px rgba(39, 39, 42, 1), 0px 1px 2px 0px rgba(0, 0, 0, 0.32), 0px 2px 4px 0px rgba(0, 0, 0, 0.32)",
23
22
  "--buttons-neutral-focus": "0px -1px 0px 0px rgba(255, 255, 255, 0.06), 0px 0px 0px 1px rgba(255, 255, 255, 0.06), 0px 0px 0px 1px rgba(39, 39, 42, 1), 0px 0px 0px 2px rgba(24, 24, 27, 1), 0px 0px 0px 4px rgba(96, 165, 250, 0.8)",
24
- "--elevation-commandbar": "0px 0px 0px 1px rgba(39, 39, 42, 1) inset, 0px 0px 0px 1.5px rgba(255, 255, 255, 0.1) inset, 0px 4px 8px 0px rgba(0, 0, 0, 0.32), 0px 8px 16px 0px rgba(0, 0, 0, 0.32)",
25
- "--elevation-modal": "0px 0px 0px 1px rgba(24, 24, 27, 1) inset, 0px 0px 0px 1.5px rgba(255, 255, 255, 0.06) inset, 0px -1px 0px 0px rgba(255, 255, 255, 0.04), 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 4px 8px 0px rgba(0, 0, 0, 0.32), 0px 8px 16px 0px rgba(0, 0, 0, 0.32)"
23
+ "--elevation-modal": "0px 0px 0px 1px rgba(24, 24, 27, 1) inset, 0px 0px 0px 1.5px rgba(255, 255, 255, 0.06) inset, 0px -1px 0px 0px rgba(255, 255, 255, 0.04), 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 4px 8px 0px rgba(0, 0, 0, 0.32), 0px 8px 16px 0px rgba(0, 0, 0, 0.32)",
24
+ "--elevation-commandbar": "0px 0px 0px 0.75px rgba(24, 24, 27, 1) inset, 0px 0px 0px 1.25px rgba(255, 255, 255, 0.1) inset, 0px 4px 8px 0px rgba(0, 0, 0, 0.32), 0px 8px 16px 0px rgba(0, 0, 0, 0.32)",
25
+ "--elevation-tooltip": "0px -1px 0px 0px rgba(255, 255, 255, 0.04), 0px 2px 4px 0px rgba(0, 0, 0, 0.32), 0px 0px 0px 1px rgba(255, 255, 255, 0.1), 0px 4px 8px 0px rgba(0, 0, 0, 0.32)"
26
26
  },
27
27
  "light": {
28
28
  "--borders-interactive-with-active": "0px 0px 0px 1px rgba(59, 130, 246, 1), 0px 0px 0px 4px rgba(59, 130, 246, 0.2)",
@@ -45,8 +45,8 @@ export const effects = {
45
45
  "--elevation-flyout": "0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 4px 8px 0px rgba(0, 0, 0, 0.08), 0px 8px 16px 0px rgba(0, 0, 0, 0.08)",
46
46
  "--elevation-tooltip": "0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 2px 4px 0px rgba(0, 0, 0, 0.08), 0px 4px 8px 0px rgba(0, 0, 0, 0.08)",
47
47
  "--elevation-modal": "0px 0px 0px 1px rgba(255, 255, 255, 1) inset, 0px 0px 0px 1.5px rgba(228, 228, 231, 0.6) inset, 0px 0px 0px 1px rgba(0, 0, 0, 0.08), 0px 8px 16px 0px rgba(0, 0, 0, 0.08), 0px 16px 32px 0px rgba(0, 0, 0, 0.08)",
48
- "--elevation-commandbar": "0px 0px 0px 1px rgba(39, 39, 42, 1) inset, 0px 0px 0px 1.5px rgba(255, 255, 255, 0.3) inset, 0px 8px 16px 0px rgba(0, 0, 0, 0.08), 0px 16px 32px 0px rgba(0, 0, 0, 0.08)",
49
48
  "--elevation-code-block": "0px 0px 0px 1px rgba(24, 24, 27, 1) inset, 0px 0px 0px 1.5px rgba(255, 255, 255, 0.2) inset",
50
- "--buttons-inverted": "0px 0.75px 0px 0px rgba(255, 255, 255, 0.2) inset, 0px 1px 2px 0px rgba(0, 0, 0, 0.4), 0px 0px 0px 1px rgba(24, 24, 27, 1)"
49
+ "--buttons-inverted": "0px 0.75px 0px 0px rgba(255, 255, 255, 0.2) inset, 0px 1px 2px 0px rgba(0, 0, 0, 0.4), 0px 0px 0px 1px rgba(24, 24, 27, 1)",
50
+ "--elevation-commandbar": "0px 0px 0px 0.75px rgba(39, 39, 42, 1) inset, 0px 0px 0px 1.25px rgba(255, 255, 255, 0.3) inset, 0px 8px 16px 0px rgba(0, 0, 0, 0.08), 0px 16px 32px 0px rgba(0, 0, 0, 0.08)"
51
51
  }
52
52
  }
package/src/theme/tokens/typography.ts CHANGED
@@ -137,24 +137,12 @@ export const typography = {
137
137
  "fontWeight": "500",
138
138
  "fontFamily": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji"
139
139
  },
140
- ".code-label": {
141
- "fontSize": "0.75rem",
142
- "lineHeight": "1.25rem",
143
- "fontWeight": "400",
144
- "fontFamily": "Roboto Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace"
145
- },
146
140
  ".h4-webs": {
147
141
  "fontSize": "1.5rem",
148
142
  "lineHeight": "1.875rem",
149
143
  "fontWeight": "500",
150
144
  "fontFamily": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji"
151
145
  },
152
- ".code-body": {
153
- "fontSize": "0.75rem",
154
- "lineHeight": "1.125rem",
155
- "fontWeight": "400",
156
- "fontFamily": "Roboto Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace"
157
- },
158
146
  ".h2-core": {
159
147
  "fontSize": "1rem",
160
148
  "lineHeight": "1.5rem",
@@ -190,5 +178,17 @@ export const typography = {
190
178
  "lineHeight": "1.5rem",
191
179
  "fontWeight": "500",
192
180
  "fontFamily": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji"
181
+ },
182
+ ".code-body": {
183
+ "fontSize": "0.75rem",
184
+ "lineHeight": "1.125rem",
185
+ "fontWeight": "400",
186
+ "fontFamily": "Roboto Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace"
187
+ },
188
+ ".code-label": {
189
+ "fontSize": "0.75rem",
190
+ "lineHeight": "0.9375rem",
191
+ "fontWeight": "500",
192
+ "fontFamily": "Roboto Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace"
193
193
  }
194
194
  }