@mantine/core 7.17.2 → 7.17.4

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 (77) hide show
  1. package/cjs/components/AppShell/AppShell.cjs.map +1 -1
  2. package/cjs/components/Autocomplete/Autocomplete.cjs +7 -3
  3. package/cjs/components/Autocomplete/Autocomplete.cjs.map +1 -1
  4. package/cjs/components/Checkbox/Checkbox.cjs +9 -2
  5. package/cjs/components/Checkbox/Checkbox.cjs.map +1 -1
  6. package/cjs/components/Flex/Flex.cjs.map +1 -1
  7. package/cjs/components/Input/InputDescription/InputDescription.cjs.map +1 -1
  8. package/cjs/components/Input/InputError/InputError.cjs.map +1 -1
  9. package/cjs/components/Input/InputLabel/InputLabel.cjs.map +1 -1
  10. package/cjs/components/Input/InputWrapper/InputWrapper.cjs.map +1 -1
  11. package/cjs/components/MultiSelect/MultiSelect.cjs +9 -5
  12. package/cjs/components/MultiSelect/MultiSelect.cjs.map +1 -1
  13. package/cjs/components/NavLink/NavLink.cjs.map +1 -1
  14. package/cjs/components/Pagination/Pagination.cjs.map +1 -1
  15. package/cjs/components/Pill/Pill.cjs.map +1 -1
  16. package/cjs/components/ScrollArea/ScrollArea.cjs +2 -2
  17. package/cjs/components/ScrollArea/ScrollArea.cjs.map +1 -1
  18. package/cjs/components/SegmentedControl/SegmentedControl.cjs +6 -1
  19. package/cjs/components/SegmentedControl/SegmentedControl.cjs.map +1 -1
  20. package/cjs/components/Select/Select.cjs +11 -7
  21. package/cjs/components/Select/Select.cjs.map +1 -1
  22. package/cjs/components/Slider/Slider/Slider.cjs +32 -22
  23. package/cjs/components/Slider/Slider/Slider.cjs.map +1 -1
  24. package/cjs/components/TagsInput/TagsInput.cjs +10 -6
  25. package/cjs/components/TagsInput/TagsInput.cjs.map +1 -1
  26. package/cjs/components/Text/Text.cjs.map +1 -1
  27. package/cjs/components/Title/Title.cjs.map +1 -1
  28. package/esm/components/AppShell/AppShell.mjs.map +1 -1
  29. package/esm/components/Autocomplete/Autocomplete.mjs +7 -3
  30. package/esm/components/Autocomplete/Autocomplete.mjs.map +1 -1
  31. package/esm/components/Checkbox/Checkbox.mjs +9 -2
  32. package/esm/components/Checkbox/Checkbox.mjs.map +1 -1
  33. package/esm/components/Flex/Flex.mjs.map +1 -1
  34. package/esm/components/Input/InputDescription/InputDescription.mjs.map +1 -1
  35. package/esm/components/Input/InputError/InputError.mjs.map +1 -1
  36. package/esm/components/Input/InputLabel/InputLabel.mjs.map +1 -1
  37. package/esm/components/Input/InputWrapper/InputWrapper.mjs.map +1 -1
  38. package/esm/components/MultiSelect/MultiSelect.mjs +9 -5
  39. package/esm/components/MultiSelect/MultiSelect.mjs.map +1 -1
  40. package/esm/components/NavLink/NavLink.mjs.map +1 -1
  41. package/esm/components/Pagination/Pagination.mjs.map +1 -1
  42. package/esm/components/Pill/Pill.mjs.map +1 -1
  43. package/esm/components/ScrollArea/ScrollArea.mjs +2 -2
  44. package/esm/components/ScrollArea/ScrollArea.mjs.map +1 -1
  45. package/esm/components/SegmentedControl/SegmentedControl.mjs +7 -2
  46. package/esm/components/SegmentedControl/SegmentedControl.mjs.map +1 -1
  47. package/esm/components/Select/Select.mjs +11 -7
  48. package/esm/components/Select/Select.mjs.map +1 -1
  49. package/esm/components/Slider/Slider/Slider.mjs +33 -23
  50. package/esm/components/Slider/Slider/Slider.mjs.map +1 -1
  51. package/esm/components/TagsInput/TagsInput.mjs +10 -6
  52. package/esm/components/TagsInput/TagsInput.mjs.map +1 -1
  53. package/esm/components/Text/Text.mjs.map +1 -1
  54. package/esm/components/Title/Title.mjs.map +1 -1
  55. package/lib/components/AppShell/AppShell.d.ts +1 -1
  56. package/lib/components/Flex/Flex.d.ts +4 -4
  57. package/lib/components/Input/InputDescription/InputDescription.d.ts +2 -2
  58. package/lib/components/Input/InputError/InputError.d.ts +2 -2
  59. package/lib/components/Input/InputLabel/InputLabel.d.ts +2 -2
  60. package/lib/components/Input/InputWrapper/InputWrapper.d.ts +2 -2
  61. package/lib/components/NavLink/NavLink.d.ts +2 -2
  62. package/lib/components/Pagination/Pagination.d.ts +2 -2
  63. package/lib/components/Pill/Pill.d.ts +2 -1
  64. package/lib/components/Text/Text.d.ts +2 -2
  65. package/lib/components/Title/Title.d.ts +2 -2
  66. package/lib/core/MantineProvider/theme.types.d.ts +30 -12
  67. package/package.json +3 -3
  68. package/styles/AppShell.css +2 -0
  69. package/styles/AppShell.layer.css +2 -0
  70. package/styles/Paper.css +8 -4
  71. package/styles/Paper.layer.css +8 -4
  72. package/styles/Table.css +10 -1
  73. package/styles/Table.layer.css +10 -1
  74. package/styles/TypographyStylesProvider.css +1 -0
  75. package/styles/TypographyStylesProvider.layer.css +1 -0
  76. package/styles.css +21 -5
  77. package/styles.layer.css +21 -5
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mantine/core",
3
- "version": "7.17.2",
3
+ "version": "7.17.4",
4
4
  "description": "React components library focused on usability, accessibility and developer experience",
5
5
  "homepage": "https://mantine.dev/",
6
6
  "license": "MIT",
@@ -43,7 +43,7 @@
43
43
  "directory": "packages/@mantine/core"
44
44
  },
45
45
  "peerDependencies": {
46
- "@mantine/hooks": "7.17.2",
46
+ "@mantine/hooks": "7.17.4",
47
47
  "react": "^18.x || ^19.x",
48
48
  "react-dom": "^18.x || ^19.x"
49
49
  },
@@ -52,7 +52,7 @@
52
52
  "clsx": "^2.1.1",
53
53
  "react-number-format": "^5.4.3",
54
54
  "react-remove-scroll": "^2.6.2",
55
- "react-textarea-autosize": "8.5.6",
55
+ "react-textarea-autosize": "8.5.9",
56
56
  "type-fest": "^4.27.0"
57
57
  },
58
58
  "devDependencies": {
package/styles/AppShell.css CHANGED
@@ -4,6 +4,8 @@
4
4
  .m_89ab340[data-disabled] {
5
5
  --app-shell-header-offset: 0rem !important;
6
6
  --app-shell-navbar-offset: 0rem !important;
7
+ --app-shell-aside-offset: 0rem !important;
8
+ --app-shell-footer-offset: 0rem !important;
7
9
  }
8
10
  [data-mantine-color-scheme='light'] .m_89ab340 {
9
11
  --app-shell-border-color: var(--mantine-color-gray-3);
package/styles/AppShell.layer.css CHANGED
@@ -4,6 +4,8 @@
4
4
  .m_89ab340[data-disabled] {
5
5
  --app-shell-header-offset: 0rem !important;
6
6
  --app-shell-navbar-offset: 0rem !important;
7
+ --app-shell-aside-offset: 0rem !important;
8
+ --app-shell-footer-offset: 0rem !important;
7
9
  }
8
10
  [data-mantine-color-scheme='light'] .m_89ab340 {
9
11
  --app-shell-border-color: var(--mantine-color-gray-3);
package/styles/Paper.css CHANGED
@@ -11,10 +11,14 @@
11
11
  background-color: var(--mantine-color-body);
12
12
  }
13
13
 
14
- :where([data-mantine-color-scheme='light']) .m_1b7284a3:where([data-with-border]) {
15
- border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-gray-3);
14
+ [data-mantine-color-scheme='light'] .m_1b7284a3 {
15
+ --paper-border-color: var(--mantine-color-gray-3);
16
16
  }
17
17
 
18
- :where([data-mantine-color-scheme='dark']) .m_1b7284a3:where([data-with-border]) {
19
- border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-dark-4);
18
+ [data-mantine-color-scheme='dark'] .m_1b7284a3 {
19
+ --paper-border-color: var(--mantine-color-dark-4);
20
20
  }
21
+
22
+ .m_1b7284a3:where([data-with-border]) {
23
+ border: calc(0.0625rem * var(--mantine-scale)) solid var(--paper-border-color);
24
+ }
package/styles/Paper.layer.css CHANGED
@@ -11,11 +11,15 @@
11
11
  background-color: var(--mantine-color-body);
12
12
  }
13
13
 
14
- :where([data-mantine-color-scheme='light']) .m_1b7284a3:where([data-with-border]) {
15
- border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-gray-3);
14
+ [data-mantine-color-scheme='light'] .m_1b7284a3 {
15
+ --paper-border-color: var(--mantine-color-gray-3);
16
16
  }
17
17
 
18
- :where([data-mantine-color-scheme='dark']) .m_1b7284a3:where([data-with-border]) {
19
- border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-dark-4);
18
+ [data-mantine-color-scheme='dark'] .m_1b7284a3 {
19
+ --paper-border-color: var(--mantine-color-dark-4);
20
20
  }
21
+
22
+ .m_1b7284a3:where([data-with-border]) {
23
+ border: calc(0.0625rem * var(--mantine-scale)) solid var(--paper-border-color);
24
+ }
21
25
  }
package/styles/Table.css CHANGED
@@ -102,9 +102,18 @@
102
102
 
103
103
  .m_b242d975:where([data-sticky]) {
104
104
  position: sticky;
105
- background-color: var(--mantine-color-body);
106
105
  }
107
106
 
107
+ .m_b242d975:where([data-sticky]) .m_4e7aa4f3 {
108
+ position: sticky;
109
+ top: var(--table-sticky-header-offset, 0);
110
+ background-color: var(--mantine-color-body);
111
+ }
112
+
113
+ :where([data-with-table-border]) .m_b242d975[data-sticky] .m_4e7aa4f3 {
114
+ top: initial;
115
+ }
116
+
108
117
  .m_9e5a3ac7 {
109
118
  color: var(--mantine-color-dimmed);
110
119
  }
package/styles/Table.layer.css CHANGED
@@ -102,9 +102,18 @@
102
102
 
103
103
  .m_b242d975:where([data-sticky]) {
104
104
  position: sticky;
105
- background-color: var(--mantine-color-body);
106
105
  }
107
106
 
107
+ .m_b242d975:where([data-sticky]) .m_4e7aa4f3 {
108
+ position: sticky;
109
+ top: var(--table-sticky-header-offset, 0);
110
+ background-color: var(--mantine-color-body);
111
+ }
112
+
113
+ :where([data-with-table-border]) .m_b242d975[data-sticky] .m_4e7aa4f3 {
114
+ top: initial;
115
+ }
116
+
108
117
  .m_9e5a3ac7 {
109
118
  color: var(--mantine-color-dimmed);
110
119
  }
package/styles/TypographyStylesProvider.css CHANGED
@@ -7,6 +7,7 @@
7
7
  .m_d6493fad :where(h1, h2, h3, h4, h5, h6) {
8
8
  margin-bottom: var(--mantine-spacing-xs);
9
9
  text-wrap: var(--mantine-heading-text-wrap);
10
+ font-family: var(--mantine-font-family-headings);
10
11
  }
11
12
  .m_d6493fad :where(h1) {
12
13
  margin-top: calc(1.5 * var(--mantine-spacing-xl));
package/styles/TypographyStylesProvider.layer.css CHANGED
@@ -7,6 +7,7 @@
7
7
  .m_d6493fad :where(h1, h2, h3, h4, h5, h6) {
8
8
  margin-bottom: var(--mantine-spacing-xs);
9
9
  text-wrap: var(--mantine-heading-text-wrap);
10
+ font-family: var(--mantine-font-family-headings);
10
11
  }
11
12
  .m_d6493fad :where(h1) {
12
13
  margin-top: calc(1.5 * var(--mantine-spacing-xl));
package/styles.css CHANGED
@@ -812,14 +812,18 @@ fieldset:disabled .mantine-active:active {
812
812
  background-color: var(--mantine-color-body);
813
813
  }
814
814
 
815
- :where([data-mantine-color-scheme='light']) .m_1b7284a3:where([data-with-border]) {
816
- border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-gray-3);
815
+ [data-mantine-color-scheme='light'] .m_1b7284a3 {
816
+ --paper-border-color: var(--mantine-color-gray-3);
817
817
  }
818
818
 
819
- :where([data-mantine-color-scheme='dark']) .m_1b7284a3:where([data-with-border]) {
820
- border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-dark-4);
819
+ [data-mantine-color-scheme='dark'] .m_1b7284a3 {
820
+ --paper-border-color: var(--mantine-color-dark-4);
821
821
  }
822
822
 
823
+ .m_1b7284a3:where([data-with-border]) {
824
+ border: calc(0.0625rem * var(--mantine-scale)) solid var(--paper-border-color);
825
+ }
826
+
823
827
  .m_9814e45f {
824
828
  inset: 0;
825
829
  position: absolute;
@@ -2144,6 +2148,8 @@ fieldset:disabled .mantine-active:active {
2144
2148
  .m_89ab340[data-disabled] {
2145
2149
  --app-shell-header-offset: 0rem !important;
2146
2150
  --app-shell-navbar-offset: 0rem !important;
2151
+ --app-shell-aside-offset: 0rem !important;
2152
+ --app-shell-footer-offset: 0rem !important;
2147
2153
  }
2148
2154
  [data-mantine-color-scheme='light'] .m_89ab340 {
2149
2155
  --app-shell-border-color: var(--mantine-color-gray-3);
@@ -6792,9 +6798,18 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
6792
6798
 
6793
6799
  .m_b242d975:where([data-sticky]) {
6794
6800
  position: sticky;
6795
- background-color: var(--mantine-color-body);
6796
6801
  }
6797
6802
 
6803
+ .m_b242d975:where([data-sticky]) .m_4e7aa4f3 {
6804
+ position: sticky;
6805
+ top: var(--table-sticky-header-offset, 0);
6806
+ background-color: var(--mantine-color-body);
6807
+ }
6808
+
6809
+ :where([data-with-table-border]) .m_b242d975[data-sticky] .m_4e7aa4f3 {
6810
+ top: initial;
6811
+ }
6812
+
6798
6813
  .m_9e5a3ac7 {
6799
6814
  color: var(--mantine-color-dimmed);
6800
6815
  }
@@ -7515,6 +7530,7 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
7515
7530
  .m_d6493fad :where(h1, h2, h3, h4, h5, h6) {
7516
7531
  margin-bottom: var(--mantine-spacing-xs);
7517
7532
  text-wrap: var(--mantine-heading-text-wrap);
7533
+ font-family: var(--mantine-font-family-headings);
7518
7534
  }
7519
7535
  .m_d6493fad :where(h1) {
7520
7536
  margin-top: calc(1.5 * var(--mantine-spacing-xl));
package/styles.layer.css CHANGED
@@ -812,14 +812,18 @@ fieldset:disabled .mantine-active:active {
812
812
  background-color: var(--mantine-color-body);
813
813
  }
814
814
 
815
- :where([data-mantine-color-scheme='light']) .m_1b7284a3:where([data-with-border]) {
816
- border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-gray-3);
815
+ [data-mantine-color-scheme='light'] .m_1b7284a3 {
816
+ --paper-border-color: var(--mantine-color-gray-3);
817
817
  }
818
818
 
819
- :where([data-mantine-color-scheme='dark']) .m_1b7284a3:where([data-with-border]) {
820
- border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-dark-4);
819
+ [data-mantine-color-scheme='dark'] .m_1b7284a3 {
820
+ --paper-border-color: var(--mantine-color-dark-4);
821
821
  }
822
822
 
823
+ .m_1b7284a3:where([data-with-border]) {
824
+ border: calc(0.0625rem * var(--mantine-scale)) solid var(--paper-border-color);
825
+ }
826
+
823
827
  .m_9814e45f {
824
828
  inset: 0;
825
829
  position: absolute;
@@ -2144,6 +2148,8 @@ fieldset:disabled .mantine-active:active {
2144
2148
  .m_89ab340[data-disabled] {
2145
2149
  --app-shell-header-offset: 0rem !important;
2146
2150
  --app-shell-navbar-offset: 0rem !important;
2151
+ --app-shell-aside-offset: 0rem !important;
2152
+ --app-shell-footer-offset: 0rem !important;
2147
2153
  }
2148
2154
  [data-mantine-color-scheme='light'] .m_89ab340 {
2149
2155
  --app-shell-border-color: var(--mantine-color-gray-3);
@@ -6792,9 +6798,18 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
6792
6798
 
6793
6799
  .m_b242d975:where([data-sticky]) {
6794
6800
  position: sticky;
6795
- background-color: var(--mantine-color-body);
6796
6801
  }
6797
6802
 
6803
+ .m_b242d975:where([data-sticky]) .m_4e7aa4f3 {
6804
+ position: sticky;
6805
+ top: var(--table-sticky-header-offset, 0);
6806
+ background-color: var(--mantine-color-body);
6807
+ }
6808
+
6809
+ :where([data-with-table-border]) .m_b242d975[data-sticky] .m_4e7aa4f3 {
6810
+ top: initial;
6811
+ }
6812
+
6798
6813
  .m_9e5a3ac7 {
6799
6814
  color: var(--mantine-color-dimmed);
6800
6815
  }
@@ -7515,6 +7530,7 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
7515
7530
  .m_d6493fad :where(h1, h2, h3, h4, h5, h6) {
7516
7531
  margin-bottom: var(--mantine-spacing-xs);
7517
7532
  text-wrap: var(--mantine-heading-text-wrap);
7533
+ font-family: var(--mantine-font-family-headings);
7518
7534
  }
7519
7535
  .m_d6493fad :where(h1) {
7520
7536
  margin-top: calc(1.5 * var(--mantine-spacing-xl));