@mantine/core 7.12.0 → 7.12.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 (73) hide show
  1. package/cjs/components/Accordion/Accordion.cjs +2 -0
  2. package/cjs/components/Accordion/Accordion.cjs.map +1 -1
  3. package/cjs/components/Combobox/Combobox.module.css.cjs +1 -1
  4. package/cjs/components/FloatingIndicator/use-floating-indicator.cjs +2 -2
  5. package/cjs/components/FloatingIndicator/use-floating-indicator.cjs.map +1 -1
  6. package/cjs/components/Menu/MenuDropdown/MenuDropdown.cjs +10 -1
  7. package/cjs/components/Menu/MenuDropdown/MenuDropdown.cjs.map +1 -1
  8. package/cjs/components/Menu/MenuItem/MenuItem.cjs +1 -0
  9. package/cjs/components/Menu/MenuItem/MenuItem.cjs.map +1 -1
  10. package/cjs/components/PinInput/PinInput.cjs +3 -1
  11. package/cjs/components/PinInput/PinInput.cjs.map +1 -1
  12. package/cjs/components/Popover/use-popover.cjs +9 -5
  13. package/cjs/components/Popover/use-popover.cjs.map +1 -1
  14. package/cjs/components/SegmentedControl/SegmentedControl.cjs +1 -0
  15. package/cjs/components/SegmentedControl/SegmentedControl.cjs.map +1 -1
  16. package/cjs/components/Switch/Switch.cjs +1 -1
  17. package/cjs/components/Switch/Switch.cjs.map +1 -1
  18. package/cjs/components/TagsInput/TagsInput.cjs +2 -0
  19. package/cjs/components/TagsInput/TagsInput.cjs.map +1 -1
  20. package/cjs/components/Tooltip/TooltipGroup/TooltipGroup.cjs +1 -0
  21. package/cjs/components/Tooltip/TooltipGroup/TooltipGroup.cjs.map +1 -1
  22. package/cjs/core/factory/factory.cjs +10 -0
  23. package/cjs/core/factory/factory.cjs.map +1 -1
  24. package/cjs/index.cjs +1 -0
  25. package/cjs/index.cjs.map +1 -1
  26. package/esm/components/Accordion/Accordion.mjs +2 -0
  27. package/esm/components/Accordion/Accordion.mjs.map +1 -1
  28. package/esm/components/Combobox/Combobox.module.css.mjs +1 -1
  29. package/esm/components/FloatingIndicator/use-floating-indicator.mjs +2 -2
  30. package/esm/components/FloatingIndicator/use-floating-indicator.mjs.map +1 -1
  31. package/esm/components/Menu/MenuDropdown/MenuDropdown.mjs +10 -1
  32. package/esm/components/Menu/MenuDropdown/MenuDropdown.mjs.map +1 -1
  33. package/esm/components/Menu/MenuItem/MenuItem.mjs +1 -0
  34. package/esm/components/Menu/MenuItem/MenuItem.mjs.map +1 -1
  35. package/esm/components/PinInput/PinInput.mjs +3 -1
  36. package/esm/components/PinInput/PinInput.mjs.map +1 -1
  37. package/esm/components/Popover/use-popover.mjs +9 -5
  38. package/esm/components/Popover/use-popover.mjs.map +1 -1
  39. package/esm/components/SegmentedControl/SegmentedControl.mjs +1 -0
  40. package/esm/components/SegmentedControl/SegmentedControl.mjs.map +1 -1
  41. package/esm/components/Switch/Switch.mjs +1 -1
  42. package/esm/components/Switch/Switch.mjs.map +1 -1
  43. package/esm/components/TagsInput/TagsInput.mjs +2 -0
  44. package/esm/components/TagsInput/TagsInput.mjs.map +1 -1
  45. package/esm/components/Tooltip/TooltipGroup/TooltipGroup.mjs +1 -0
  46. package/esm/components/Tooltip/TooltipGroup/TooltipGroup.mjs.map +1 -1
  47. package/esm/core/factory/factory.mjs +10 -1
  48. package/esm/core/factory/factory.mjs.map +1 -1
  49. package/esm/index.mjs +1 -1
  50. package/lib/components/Accordion/Accordion.d.ts +1 -0
  51. package/lib/components/PinInput/PinInput.d.ts +3 -0
  52. package/lib/components/Tooltip/TooltipGroup/TooltipGroup.d.ts +7 -0
  53. package/lib/core/factory/factory.d.ts +1 -0
  54. package/lib/core/factory/index.d.ts +1 -1
  55. package/package.json +3 -3
  56. package/styles/Badge.css +3 -1
  57. package/styles/Badge.layer.css +3 -1
  58. package/styles/Chip.css +1 -1
  59. package/styles/Chip.layer.css +1 -1
  60. package/styles/Combobox.css +4 -0
  61. package/styles/Combobox.layer.css +4 -0
  62. package/styles/Pill.css +2 -0
  63. package/styles/Pill.layer.css +2 -0
  64. package/styles/ScrollArea.css +1 -1
  65. package/styles/ScrollArea.layer.css +1 -1
  66. package/styles/Slider.css +1 -1
  67. package/styles/Slider.layer.css +1 -1
  68. package/styles/Switch.css +4 -0
  69. package/styles/Switch.layer.css +4 -0
  70. package/styles/global.css +4 -0
  71. package/styles/global.layer.css +4 -0
  72. package/styles.css +20 -4
  73. package/styles.layer.css +20 -4
package/styles/Chip.css CHANGED
@@ -21,7 +21,7 @@
21
21
  --chip-checked-padding-sm: 10px;
22
22
  --chip-checked-padding-md: 11.7px;
23
23
  --chip-checked-padding-lg: 13.5px;
24
- --chip-checked-padding-xl: 12.5px;
24
+ --chip-checked-padding-xl: 15.7px;
25
25
 
26
26
  --chip-spacing-xs: 10px;
27
27
  --chip-spacing-sm: 12px;
package/styles/Chip.layer.css CHANGED
@@ -21,7 +21,7 @@
21
21
  --chip-checked-padding-sm: 10px;
22
22
  --chip-checked-padding-md: 11.7px;
23
23
  --chip-checked-padding-lg: 13.5px;
24
- --chip-checked-padding-xl: 12.5px;
24
+ --chip-checked-padding-xl: 15.7px;
25
25
 
26
26
  --chip-spacing-xs: 10px;
27
27
  --chip-spacing-sm: 12px;
package/styles/Combobox.css CHANGED
@@ -7,6 +7,10 @@
7
7
  padding-inline-end: 0;
8
8
  }
9
9
 
10
+ .m_88b62a41:has([data-mantine-scrollbar]) .m_985517d8 {
11
+ max-width: calc(100% + var(--combobox-padding));
12
+ }
13
+
10
14
  .m_88b62a41[data-hidden] {
11
15
  display: none;
12
16
  }
package/styles/Combobox.layer.css CHANGED
@@ -7,6 +7,10 @@
7
7
  padding-inline-end: 0;
8
8
  }
9
9
 
10
+ .m_88b62a41:has([data-mantine-scrollbar]) .m_985517d8 {
11
+ max-width: calc(100% + var(--combobox-padding));
12
+ }
13
+
10
14
  .m_88b62a41[data-hidden] {
11
15
  display: none;
12
16
  }
package/styles/Pill.css CHANGED
@@ -80,6 +80,8 @@
80
80
  padding-inline-start: 0.1em;
81
81
  padding-inline-end: 0.3em;
82
82
  flex: 0;
83
+ border-end-end-radius: var(--pill-radius, 50%);
84
+ border-start-end-radius: var(--pill-radius, 50%);
83
85
  }
84
86
 
85
87
  .m_7cda1cd6[data-disabled] > .m_ae386778,
package/styles/Pill.layer.css CHANGED
@@ -80,6 +80,8 @@
80
80
  padding-inline-start: 0.1em;
81
81
  padding-inline-end: 0.3em;
82
82
  flex: 0;
83
+ border-end-end-radius: var(--pill-radius, 50%);
84
+ border-start-end-radius: var(--pill-radius, 50%);
83
85
  }
84
86
 
85
87
  .m_7cda1cd6[data-disabled] > .m_ae386778,
package/styles/ScrollArea.css CHANGED
@@ -109,7 +109,7 @@
109
109
  }
110
110
 
111
111
  .m_d8b5e363::before {
112
- content: '""';
112
+ content: '';
113
113
  position: absolute;
114
114
  top: 50%;
115
115
  left: 50%;
package/styles/ScrollArea.layer.css CHANGED
@@ -109,7 +109,7 @@
109
109
  }
110
110
 
111
111
  .m_d8b5e363::before {
112
- content: '""';
112
+ content: '';
113
113
  position: absolute;
114
114
  top: 50%;
115
115
  left: 50%;
package/styles/Slider.css CHANGED
@@ -175,7 +175,7 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
175
175
  height: var(--slider-size);
176
176
  width: var(--slider-size);
177
177
  border-radius: 1000px;
178
- transform: translateX((calc(var(--slider-size) / -2)));
178
+ transform: translateX(calc(var(--slider-size) / -2));
179
179
  background-color: var(--mantine-color-white);
180
180
  pointer-events: none;
181
181
  }
package/styles/Slider.layer.css CHANGED
@@ -175,7 +175,7 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
175
175
  height: var(--slider-size);
176
176
  width: var(--slider-size);
177
177
  border-radius: 1000px;
178
- transform: translateX((calc(var(--slider-size) / -2)));
178
+ transform: translateX(calc(var(--slider-size) / -2));
179
179
  background-color: var(--mantine-color-white);
180
180
  pointer-events: none;
181
181
  }
package/styles/Switch.css CHANGED
@@ -77,6 +77,10 @@
77
77
  color: var(--switch-text-color);
78
78
  }
79
79
 
80
+ .m_9307d992:where([data-without-labels]) {
81
+ width: var(--switch-width);
82
+ }
83
+
80
84
  .m_926b4011:focus-visible + .m_9307d992 {
81
85
  outline: 2px solid var(--mantine-primary-color-filled);
82
86
  outline-offset: 2px;
package/styles/Switch.layer.css CHANGED
@@ -77,6 +77,10 @@
77
77
  color: var(--switch-text-color);
78
78
  }
79
79
 
80
+ .m_9307d992:where([data-without-labels]) {
81
+ width: var(--switch-width);
82
+ }
83
+
80
84
  .m_926b4011:focus-visible + .m_9307d992 {
81
85
  outline: 2px solid var(--mantine-primary-color-filled);
82
86
  outline-offset: 2px;
package/styles/global.css CHANGED
@@ -68,6 +68,10 @@ body {
68
68
  transform: translateY(calc(0.0625rem * var(--mantine-scale)));
69
69
  }
70
70
 
71
+ fieldset:disabled .mantine-active:active {
72
+ transform: none;
73
+ }
74
+
71
75
  :where([dir="rtl"]) .mantine-rotate-rtl {
72
76
  transform: rotate(180deg);
73
77
  }
package/styles/global.layer.css CHANGED
@@ -68,6 +68,10 @@ body {
68
68
  transform: translateY(calc(0.0625rem * var(--mantine-scale)));
69
69
  }
70
70
 
71
+ fieldset:disabled .mantine-active:active {
72
+ transform: none;
73
+ }
74
+
71
75
  :where([dir="rtl"]) .mantine-rotate-rtl {
72
76
  transform: rotate(180deg);
73
77
  }
package/styles.css CHANGED
@@ -68,6 +68,10 @@ body {
68
68
  transform: translateY(calc(0.0625rem * var(--mantine-scale)));
69
69
  }
70
70
 
71
+ fieldset:disabled .mantine-active:active {
72
+ transform: none;
73
+ }
74
+
71
75
  :where([dir="rtl"]) .mantine-rotate-rtl {
72
76
  transform: rotate(180deg);
73
77
  }
@@ -694,7 +698,7 @@ body {
694
698
  }
695
699
 
696
700
  .m_d8b5e363::before {
697
- content: '""';
701
+ content: '';
698
702
  position: absolute;
699
703
  top: 50%;
700
704
  left: 50%;
@@ -2086,6 +2090,10 @@ body {
2086
2090
  padding-inline-end: 0;
2087
2091
  }
2088
2092
 
2093
+ .m_88b62a41:has([data-mantine-scrollbar]) .m_985517d8 {
2094
+ max-width: calc(100% + var(--combobox-padding));
2095
+ }
2096
+
2089
2097
  .m_88b62a41[data-hidden] {
2090
2098
  display: none;
2091
2099
  }
@@ -2701,7 +2709,8 @@ fieldset:disabled .m_d3ea56bb,
2701
2709
  line-height: var(--badge-lh);
2702
2710
  text-decoration: none;
2703
2711
  padding: 0 var(--badge-padding-x);
2704
- display: inline-flex;
2712
+ display: grid;
2713
+ grid-template-columns: auto 1fr auto;
2705
2714
  align-items: center;
2706
2715
  justify-content: center;
2707
2716
  width: fit-content;
@@ -2723,6 +2732,7 @@ fieldset:disabled .m_d3ea56bb,
2723
2732
 
2724
2733
  .m_347db0ec:where([data-circle]) {
2725
2734
  padding-inline: calc(0.125rem * var(--mantine-scale));
2735
+ display: flex;
2726
2736
  width: var(--badge-height);
2727
2737
  }
2728
2738
 
@@ -3225,7 +3235,7 @@ fieldset:disabled .m_d3ea56bb,
3225
3235
  --chip-checked-padding-sm: calc(0.625rem * var(--mantine-scale));
3226
3236
  --chip-checked-padding-md: calc(0.73125rem * var(--mantine-scale));
3227
3237
  --chip-checked-padding-lg: calc(0.84375rem * var(--mantine-scale));
3228
- --chip-checked-padding-xl: calc(0.78125rem * var(--mantine-scale));
3238
+ --chip-checked-padding-xl: calc(0.98125rem * var(--mantine-scale));
3229
3239
 
3230
3240
  --chip-spacing-xs: calc(0.625rem * var(--mantine-scale));
3231
3241
  --chip-spacing-sm: calc(0.75rem * var(--mantine-scale));
@@ -4294,6 +4304,8 @@ fieldset:disabled .m_d3ea56bb,
4294
4304
  padding-inline-start: 0.1em;
4295
4305
  padding-inline-end: 0.3em;
4296
4306
  flex: 0;
4307
+ border-end-end-radius: var(--pill-radius, 50%);
4308
+ border-start-end-radius: var(--pill-radius, 50%);
4297
4309
  }
4298
4310
 
4299
4311
  .m_7cda1cd6[data-disabled] > .m_ae386778,
@@ -5917,7 +5929,7 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
5917
5929
  height: var(--slider-size);
5918
5930
  width: var(--slider-size);
5919
5931
  border-radius: calc(62.5rem * var(--mantine-scale));
5920
- transform: translateX((calc(var(--slider-size) / -2)));
5932
+ transform: translateX(calc(var(--slider-size) / -2));
5921
5933
  background-color: var(--mantine-color-white);
5922
5934
  pointer-events: none;
5923
5935
  }
@@ -6296,6 +6308,10 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
6296
6308
  color: var(--switch-text-color);
6297
6309
  }
6298
6310
 
6311
+ .m_9307d992:where([data-without-labels]) {
6312
+ width: var(--switch-width);
6313
+ }
6314
+
6299
6315
  .m_926b4011:focus-visible + .m_9307d992 {
6300
6316
  outline: 2px solid var(--mantine-primary-color-filled);
6301
6317
  outline-offset: calc(0.125rem * var(--mantine-scale));
package/styles.layer.css CHANGED
@@ -68,6 +68,10 @@ body {
68
68
  transform: translateY(calc(0.0625rem * var(--mantine-scale)));
69
69
  }
70
70
 
71
+ fieldset:disabled .mantine-active:active {
72
+ transform: none;
73
+ }
74
+
71
75
  :where([dir="rtl"]) .mantine-rotate-rtl {
72
76
  transform: rotate(180deg);
73
77
  }
@@ -694,7 +698,7 @@ body {
694
698
  }
695
699
 
696
700
  .m_d8b5e363::before {
697
- content: '""';
701
+ content: '';
698
702
  position: absolute;
699
703
  top: 50%;
700
704
  left: 50%;
@@ -2086,6 +2090,10 @@ body {
2086
2090
  padding-inline-end: 0;
2087
2091
  }
2088
2092
 
2093
+ .m_88b62a41:has([data-mantine-scrollbar]) .m_985517d8 {
2094
+ max-width: calc(100% + var(--combobox-padding));
2095
+ }
2096
+
2089
2097
  .m_88b62a41[data-hidden] {
2090
2098
  display: none;
2091
2099
  }
@@ -2701,7 +2709,8 @@ fieldset:disabled .m_d3ea56bb,
2701
2709
  line-height: var(--badge-lh);
2702
2710
  text-decoration: none;
2703
2711
  padding: 0 var(--badge-padding-x);
2704
- display: inline-flex;
2712
+ display: grid;
2713
+ grid-template-columns: auto 1fr auto;
2705
2714
  align-items: center;
2706
2715
  justify-content: center;
2707
2716
  width: fit-content;
@@ -2723,6 +2732,7 @@ fieldset:disabled .m_d3ea56bb,
2723
2732
 
2724
2733
  .m_347db0ec:where([data-circle]) {
2725
2734
  padding-inline: calc(0.125rem * var(--mantine-scale));
2735
+ display: flex;
2726
2736
  width: var(--badge-height);
2727
2737
  }
2728
2738
 
@@ -3225,7 +3235,7 @@ fieldset:disabled .m_d3ea56bb,
3225
3235
  --chip-checked-padding-sm: calc(0.625rem * var(--mantine-scale));
3226
3236
  --chip-checked-padding-md: calc(0.73125rem * var(--mantine-scale));
3227
3237
  --chip-checked-padding-lg: calc(0.84375rem * var(--mantine-scale));
3228
- --chip-checked-padding-xl: calc(0.78125rem * var(--mantine-scale));
3238
+ --chip-checked-padding-xl: calc(0.98125rem * var(--mantine-scale));
3229
3239
 
3230
3240
  --chip-spacing-xs: calc(0.625rem * var(--mantine-scale));
3231
3241
  --chip-spacing-sm: calc(0.75rem * var(--mantine-scale));
@@ -4294,6 +4304,8 @@ fieldset:disabled .m_d3ea56bb,
4294
4304
  padding-inline-start: 0.1em;
4295
4305
  padding-inline-end: 0.3em;
4296
4306
  flex: 0;
4307
+ border-end-end-radius: var(--pill-radius, 50%);
4308
+ border-start-end-radius: var(--pill-radius, 50%);
4297
4309
  }
4298
4310
 
4299
4311
  .m_7cda1cd6[data-disabled] > .m_ae386778,
@@ -5917,7 +5929,7 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
5917
5929
  height: var(--slider-size);
5918
5930
  width: var(--slider-size);
5919
5931
  border-radius: calc(62.5rem * var(--mantine-scale));
5920
- transform: translateX((calc(var(--slider-size) / -2)));
5932
+ transform: translateX(calc(var(--slider-size) / -2));
5921
5933
  background-color: var(--mantine-color-white);
5922
5934
  pointer-events: none;
5923
5935
  }
@@ -6296,6 +6308,10 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
6296
6308
  color: var(--switch-text-color);
6297
6309
  }
6298
6310
 
6311
+ .m_9307d992:where([data-without-labels]) {
6312
+ width: var(--switch-width);
6313
+ }
6314
+
6299
6315
  .m_926b4011:focus-visible + .m_9307d992 {
6300
6316
  outline: 2px solid var(--mantine-primary-color-filled);
6301
6317
  outline-offset: calc(0.125rem * var(--mantine-scale));