@mantine/core 7.17.1 → 8.0.0-alpha.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 (152) hide show
  1. package/cjs/components/Checkbox/Checkbox.cjs.map +1 -1
  2. package/cjs/components/Checkbox/CheckboxGroup/CheckboxGroup.cjs.map +1 -1
  3. package/cjs/components/Chip/Chip.cjs.map +1 -1
  4. package/cjs/components/Input/Input.cjs.map +1 -1
  5. package/cjs/components/InputBase/InputBase.cjs.map +1 -1
  6. package/cjs/components/Kbd/Kbd.cjs +1 -4
  7. package/cjs/components/Kbd/Kbd.cjs.map +1 -1
  8. package/cjs/components/Menu/Menu.cjs +2 -7
  9. package/cjs/components/Menu/Menu.cjs.map +1 -1
  10. package/cjs/components/Menu/Menu.context.cjs.map +1 -1
  11. package/cjs/components/Menu/Menu.module.css.cjs +1 -1
  12. package/cjs/components/Menu/MenuItem/MenuItem.cjs +10 -15
  13. package/cjs/components/Menu/MenuItem/MenuItem.cjs.map +1 -1
  14. package/cjs/components/Menu/MenuSub/MenuSub.cjs +71 -0
  15. package/cjs/components/Menu/MenuSub/MenuSub.cjs.map +1 -0
  16. package/cjs/components/Menu/MenuSub/MenuSub.context.cjs +21 -0
  17. package/cjs/components/Menu/MenuSub/MenuSub.context.cjs.map +1 -0
  18. package/cjs/components/Menu/MenuSubDropdown/MenuSubDropdown.cjs +70 -0
  19. package/cjs/components/Menu/MenuSubDropdown/MenuSubDropdown.cjs.map +1 -0
  20. package/cjs/components/Menu/MenuSubItem/MenuSubItem.cjs +115 -0
  21. package/cjs/components/Menu/MenuSubItem/MenuSubItem.cjs.map +1 -0
  22. package/cjs/components/Menu/MenuSubTarget/MenuSubTarget.cjs +33 -0
  23. package/cjs/components/Menu/MenuSubTarget/MenuSubTarget.cjs.map +1 -0
  24. package/cjs/components/Popover/Popover.cjs +6 -2
  25. package/cjs/components/Popover/Popover.cjs.map +1 -1
  26. package/cjs/components/Popover/Popover.context.cjs.map +1 -1
  27. package/cjs/components/Popover/PopoverDropdown/PopoverDropdown.cjs +2 -1
  28. package/cjs/components/Popover/PopoverDropdown/PopoverDropdown.cjs.map +1 -1
  29. package/cjs/components/Popover/use-popover.cjs +1 -1
  30. package/cjs/components/Popover/use-popover.cjs.map +1 -1
  31. package/cjs/components/Portal/Portal.cjs +3 -1
  32. package/cjs/components/Portal/Portal.cjs.map +1 -1
  33. package/cjs/components/Radio/Radio.cjs.map +1 -1
  34. package/cjs/components/Radio/RadioGroup/RadioGroup.cjs.map +1 -1
  35. package/cjs/components/ScrollArea/ScrollArea.cjs +1 -0
  36. package/cjs/components/ScrollArea/ScrollArea.cjs.map +1 -1
  37. package/cjs/components/ScrollArea/ScrollArea.context.cjs.map +1 -1
  38. package/cjs/components/ScrollArea/ScrollArea.module.css.cjs +1 -1
  39. package/cjs/components/ScrollArea/ScrollAreaRoot/ScrollAreaRoot.cjs +7 -3
  40. package/cjs/components/ScrollArea/ScrollAreaRoot/ScrollAreaRoot.cjs.map +1 -1
  41. package/cjs/components/ScrollArea/ScrollAreaViewport/ScrollAreaViewport.cjs +1 -1
  42. package/cjs/components/ScrollArea/ScrollAreaViewport/ScrollAreaViewport.cjs.map +1 -1
  43. package/cjs/components/Switch/Switch.cjs +12 -2
  44. package/cjs/components/Switch/Switch.cjs.map +1 -1
  45. package/cjs/components/Switch/SwitchGroup/SwitchGroup.cjs.map +1 -1
  46. package/cjs/components/Tabs/Tabs.module.css.cjs +1 -1
  47. package/cjs/core/MantineProvider/MantineProvider.cjs +0 -2
  48. package/cjs/core/MantineProvider/MantineProvider.cjs.map +1 -1
  49. package/cjs/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.cjs +8 -0
  50. package/cjs/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.cjs.map +1 -1
  51. package/esm/components/Checkbox/Checkbox.mjs.map +1 -1
  52. package/esm/components/Checkbox/CheckboxGroup/CheckboxGroup.mjs.map +1 -1
  53. package/esm/components/Chip/Chip.mjs.map +1 -1
  54. package/esm/components/Input/Input.mjs.map +1 -1
  55. package/esm/components/InputBase/InputBase.mjs.map +1 -1
  56. package/esm/components/Kbd/Kbd.mjs +1 -4
  57. package/esm/components/Kbd/Kbd.mjs.map +1 -1
  58. package/esm/components/Menu/Menu.context.mjs.map +1 -1
  59. package/esm/components/Menu/Menu.mjs +3 -8
  60. package/esm/components/Menu/Menu.mjs.map +1 -1
  61. package/esm/components/Menu/Menu.module.css.mjs +1 -1
  62. package/esm/components/Menu/MenuItem/MenuItem.mjs +10 -15
  63. package/esm/components/Menu/MenuItem/MenuItem.mjs.map +1 -1
  64. package/esm/components/Menu/MenuSub/MenuSub.context.mjs +18 -0
  65. package/esm/components/Menu/MenuSub/MenuSub.context.mjs.map +1 -0
  66. package/esm/components/Menu/MenuSub/MenuSub.mjs +69 -0
  67. package/esm/components/Menu/MenuSub/MenuSub.mjs.map +1 -0
  68. package/esm/components/Menu/MenuSubDropdown/MenuSubDropdown.mjs +68 -0
  69. package/esm/components/Menu/MenuSubDropdown/MenuSubDropdown.mjs.map +1 -0
  70. package/esm/components/Menu/MenuSubItem/MenuSubItem.mjs +113 -0
  71. package/esm/components/Menu/MenuSubItem/MenuSubItem.mjs.map +1 -0
  72. package/esm/components/Menu/MenuSubTarget/MenuSubTarget.mjs +31 -0
  73. package/esm/components/Menu/MenuSubTarget/MenuSubTarget.mjs.map +1 -0
  74. package/esm/components/Popover/Popover.context.mjs.map +1 -1
  75. package/esm/components/Popover/Popover.mjs +6 -2
  76. package/esm/components/Popover/Popover.mjs.map +1 -1
  77. package/esm/components/Popover/PopoverDropdown/PopoverDropdown.mjs +2 -1
  78. package/esm/components/Popover/PopoverDropdown/PopoverDropdown.mjs.map +1 -1
  79. package/esm/components/Popover/use-popover.mjs +2 -2
  80. package/esm/components/Popover/use-popover.mjs.map +1 -1
  81. package/esm/components/Portal/Portal.mjs +3 -1
  82. package/esm/components/Portal/Portal.mjs.map +1 -1
  83. package/esm/components/Radio/Radio.mjs.map +1 -1
  84. package/esm/components/Radio/RadioGroup/RadioGroup.mjs.map +1 -1
  85. package/esm/components/ScrollArea/ScrollArea.context.mjs.map +1 -1
  86. package/esm/components/ScrollArea/ScrollArea.mjs +1 -0
  87. package/esm/components/ScrollArea/ScrollArea.mjs.map +1 -1
  88. package/esm/components/ScrollArea/ScrollArea.module.css.mjs +1 -1
  89. package/esm/components/ScrollArea/ScrollAreaRoot/ScrollAreaRoot.mjs +7 -3
  90. package/esm/components/ScrollArea/ScrollAreaRoot/ScrollAreaRoot.mjs.map +1 -1
  91. package/esm/components/ScrollArea/ScrollAreaViewport/ScrollAreaViewport.mjs +1 -1
  92. package/esm/components/ScrollArea/ScrollAreaViewport/ScrollAreaViewport.mjs.map +1 -1
  93. package/esm/components/Switch/Switch.mjs +12 -2
  94. package/esm/components/Switch/Switch.mjs.map +1 -1
  95. package/esm/components/Switch/SwitchGroup/SwitchGroup.mjs.map +1 -1
  96. package/esm/components/Tabs/Tabs.module.css.mjs +1 -1
  97. package/esm/core/MantineProvider/MantineProvider.mjs +0 -2
  98. package/esm/core/MantineProvider/MantineProvider.mjs.map +1 -1
  99. package/esm/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.mjs +8 -0
  100. package/esm/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.mjs.map +1 -1
  101. package/lib/components/Checkbox/Checkbox.d.ts +2 -2
  102. package/lib/components/Checkbox/CheckboxGroup/CheckboxGroup.d.ts +2 -2
  103. package/lib/components/Chip/Chip.d.ts +2 -2
  104. package/lib/components/Input/Input.d.ts +3 -3
  105. package/lib/components/Input/use-input-props.d.ts +280 -4
  106. package/lib/components/InputBase/InputBase.d.ts +2 -2
  107. package/lib/components/Kbd/Kbd.d.ts +3 -3
  108. package/lib/components/Menu/Menu.context.d.ts +0 -2
  109. package/lib/components/Menu/Menu.d.ts +3 -3
  110. package/lib/components/Menu/MenuSub/MenuSub.context.d.ts +13 -0
  111. package/lib/components/Menu/MenuSub/MenuSub.d.ts +53 -0
  112. package/lib/components/Menu/MenuSubDropdown/MenuSubDropdown.d.ts +16 -0
  113. package/lib/components/Menu/MenuSubItem/MenuSubItem.d.ts +51 -0
  114. package/lib/components/Menu/MenuSubTarget/MenuSubTarget.d.ts +10 -0
  115. package/lib/components/Popover/Popover.context.d.ts +1 -0
  116. package/lib/components/Popover/Popover.d.ts +2 -0
  117. package/lib/components/Portal/Portal.d.ts +1 -1
  118. package/lib/components/Radio/Radio.d.ts +2 -2
  119. package/lib/components/Radio/RadioGroup/RadioGroup.d.ts +2 -2
  120. package/lib/components/ScrollArea/ScrollArea.context.d.ts +3 -0
  121. package/lib/components/ScrollArea/ScrollArea.d.ts +1 -1
  122. package/lib/components/ScrollArea/ScrollAreaRoot/ScrollAreaRoot.d.ts +3 -11
  123. package/lib/components/Switch/Switch.d.ts +4 -2
  124. package/lib/components/Switch/SwitchGroup/SwitchGroup.d.ts +2 -2
  125. package/lib/core/MantineProvider/MantineProvider.d.ts +2 -0
  126. package/lib/core/index.d.ts +1 -0
  127. package/lib/core/types.d.ts +3 -0
  128. package/package.json +3 -3
  129. package/styles/Code.css +2 -4
  130. package/styles/Code.layer.css +2 -4
  131. package/styles/Image.css +0 -1
  132. package/styles/Image.layer.css +0 -1
  133. package/styles/Kbd.css +2 -8
  134. package/styles/Kbd.layer.css +2 -8
  135. package/styles/Menu.css +14 -2
  136. package/styles/Menu.layer.css +14 -2
  137. package/styles/ScrollArea.css +4 -0
  138. package/styles/ScrollArea.layer.css +4 -0
  139. package/styles/SegmentedControl.css +5 -5
  140. package/styles/SegmentedControl.layer.css +5 -5
  141. package/styles/Switch.css +17 -20
  142. package/styles/Switch.layer.css +17 -20
  143. package/styles/Tabs.css +39 -74
  144. package/styles/Tabs.layer.css +39 -74
  145. package/styles/baseline.css +40 -0
  146. package/styles/baseline.layer.css +41 -0
  147. package/styles/default-css-variables.css +507 -0
  148. package/styles/default-css-variables.layer.css +508 -0
  149. package/styles/global.css +0 -548
  150. package/styles/global.layer.css +1 -549
  151. package/styles.css +114 -144
  152. package/styles.layer.css +114 -144
package/styles.css CHANGED
@@ -1,4 +1,7 @@
1
- /* ----- CSS reset ----- */
1
+ :root {
2
+ color-scheme: var(--mantine-color-scheme);
3
+ }
4
+
2
5
  *,
3
6
  *::before,
4
7
  *::after {
@@ -17,7 +20,6 @@ select {
17
20
  text-transform: none;
18
21
  }
19
22
 
20
- /* ----- Global styles ----- */
21
23
  body {
22
24
  margin: 0;
23
25
  font-family: var(--mantine-font-family);
@@ -29,7 +31,9 @@ body {
29
31
  -webkit-font-smoothing: var(--mantine-webkit-font-smoothing);
30
32
  -moz-osx-font-smoothing: var(--mantine-moz-font-smoothing);
31
33
  }
34
+
32
35
  @media screen and (max-device-width: 31.25em) {
36
+
33
37
  body {
34
38
  -webkit-text-size-adjust: 100%
35
39
  }
@@ -76,11 +80,9 @@ fieldset:disabled .mantine-active:active {
76
80
  transform: rotate(180deg);
77
81
  }
78
82
 
79
- /* ----- Default CSS variables ----- */
80
-
83
+ /* stylelint-disable */
84
+ /* This file is automatically generated, do not modify it directly. */
81
85
  :root {
82
- color-scheme: var(--mantine-color-scheme);
83
-
84
86
  --mantine-z-index-app: 100;
85
87
  --mantine-z-index-modal: 200;
86
88
  --mantine-z-index-popover: 300;
@@ -90,7 +92,6 @@ fieldset:disabled .mantine-active:active {
90
92
  --mantine-scale: 1;
91
93
  --mantine-cursor-type: default;
92
94
  --mantine-webkit-font-smoothing: antialiased;
93
- --mantine-color-scheme: light dark;
94
95
  --mantine-moz-font-smoothing: grayscale;
95
96
  --mantine-color-white: #fff;
96
97
  --mantine-color-black: #000;
@@ -102,17 +103,8 @@ fieldset:disabled .mantine-active:active {
102
103
  --mantine-font-family-headings: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica,
103
104
  Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji;
104
105
  --mantine-heading-font-weight: 700;
106
+ --mantine-heading-text-wrap: wrap;
105
107
  --mantine-radius-default: calc(0.25rem * var(--mantine-scale));
106
- --mantine-primary-color-0: var(--mantine-color-blue-0);
107
- --mantine-primary-color-1: var(--mantine-color-blue-1);
108
- --mantine-primary-color-2: var(--mantine-color-blue-2);
109
- --mantine-primary-color-3: var(--mantine-color-blue-3);
110
- --mantine-primary-color-4: var(--mantine-color-blue-4);
111
- --mantine-primary-color-5: var(--mantine-color-blue-5);
112
- --mantine-primary-color-6: var(--mantine-color-blue-6);
113
- --mantine-primary-color-7: var(--mantine-color-blue-7);
114
- --mantine-primary-color-8: var(--mantine-color-blue-8);
115
- --mantine-primary-color-9: var(--mantine-color-blue-9);
116
108
  --mantine-primary-color-filled: var(--mantine-color-blue-filled);
117
109
  --mantine-primary-color-filled-hover: var(--mantine-color-blue-filled-hover);
118
110
  --mantine-primary-color-light: var(--mantine-color-blue-light);
@@ -171,6 +163,16 @@ fieldset:disabled .mantine-active:active {
171
163
  --mantine-radius-md: calc(0.5rem * var(--mantine-scale));
172
164
  --mantine-radius-lg: calc(1rem * var(--mantine-scale));
173
165
  --mantine-radius-xl: calc(2rem * var(--mantine-scale));
166
+ --mantine-primary-color-0: var(--mantine-color-blue-0);
167
+ --mantine-primary-color-1: var(--mantine-color-blue-1);
168
+ --mantine-primary-color-2: var(--mantine-color-blue-2);
169
+ --mantine-primary-color-3: var(--mantine-color-blue-3);
170
+ --mantine-primary-color-4: var(--mantine-color-blue-4);
171
+ --mantine-primary-color-5: var(--mantine-color-blue-5);
172
+ --mantine-primary-color-6: var(--mantine-color-blue-6);
173
+ --mantine-primary-color-7: var(--mantine-color-blue-7);
174
+ --mantine-primary-color-8: var(--mantine-color-blue-8);
175
+ --mantine-primary-color-9: var(--mantine-color-blue-9);
174
176
  --mantine-color-dark-0: #c9c9c9;
175
177
  --mantine-color-dark-1: #b8b8b8;
176
178
  --mantine-color-dark-2: #828282;
@@ -330,7 +332,6 @@ fieldset:disabled .mantine-active:active {
330
332
  --mantine-h6-line-height: 1.5;
331
333
  --mantine-h6-font-weight: 700;
332
334
  }
333
-
334
335
  :root[data-mantine-color-scheme='dark'] {
335
336
  --mantine-color-scheme: dark;
336
337
  --mantine-primary-color-contrast: var(--mantine-color-white);
@@ -347,12 +348,12 @@ fieldset:disabled .mantine-active:active {
347
348
  --mantine-color-dimmed: var(--mantine-color-dark-2);
348
349
  --mantine-color-dark-text: var(--mantine-color-dark-4);
349
350
  --mantine-color-dark-filled: var(--mantine-color-dark-8);
350
- --mantine-color-dark-filled-hover: var(--mantine-color-dark-7);
351
- --mantine-color-dark-light: rgba(36, 36, 36, 0.15);
352
- --mantine-color-dark-light-hover: rgba(36, 36, 36, 0.2);
351
+ --mantine-color-dark-filled-hover: var(--mantine-color-dark-9);
352
+ --mantine-color-dark-light: rgba(46, 46, 46, 0.15);
353
+ --mantine-color-dark-light-hover: rgba(46, 46, 46, 0.2);
353
354
  --mantine-color-dark-light-color: var(--mantine-color-dark-3);
354
355
  --mantine-color-dark-outline: var(--mantine-color-dark-4);
355
- --mantine-color-dark-outline-hover: rgba(36, 36, 36, 0.05);
356
+ --mantine-color-dark-outline-hover: rgba(66, 66, 66, 0.05);
356
357
  --mantine-color-gray-text: var(--mantine-color-gray-4);
357
358
  --mantine-color-gray-filled: var(--mantine-color-gray-8);
358
359
  --mantine-color-gray-filled-hover: var(--mantine-color-gray-9);
@@ -461,26 +462,26 @@ fieldset:disabled .mantine-active:active {
461
462
 
462
463
  :root[data-mantine-color-scheme='light'] {
463
464
  --mantine-color-scheme: light;
464
- --mantine-color-bright: var(--mantine-color-black);
465
- --mantine-color-text: var(--mantine-color-black);
466
- --mantine-color-body: var(--mantine-color-white);
467
465
  --mantine-primary-color-contrast: var(--mantine-color-white);
466
+ --mantine-color-bright: var(--mantine-color-black);
467
+ --mantine-color-text: #000;
468
+ --mantine-color-body: #fff;
468
469
  --mantine-color-error: var(--mantine-color-red-6);
469
470
  --mantine-color-placeholder: var(--mantine-color-gray-5);
470
- --mantine-color-anchor: var(--mantine-primary-color-filled);
471
+ --mantine-color-anchor: var(--mantine-color-blue-6);
471
472
  --mantine-color-default: var(--mantine-color-white);
472
473
  --mantine-color-default-hover: var(--mantine-color-gray-0);
473
- --mantine-color-default-color: var(--mantine-color-gray-9);
474
+ --mantine-color-default-color: var(--mantine-color-black);
474
475
  --mantine-color-default-border: var(--mantine-color-gray-4);
475
476
  --mantine-color-dimmed: var(--mantine-color-gray-6);
476
477
  --mantine-color-dark-text: var(--mantine-color-dark-filled);
477
478
  --mantine-color-dark-filled: var(--mantine-color-dark-6);
478
479
  --mantine-color-dark-filled-hover: var(--mantine-color-dark-7);
479
- --mantine-color-dark-light: rgba(56, 56, 56, 0.1);
480
- --mantine-color-dark-light-hover: rgba(56, 56, 56, 0.12);
480
+ --mantine-color-dark-light: rgba(46, 46, 46, 0.1);
481
+ --mantine-color-dark-light-hover: rgba(46, 46, 46, 0.12);
481
482
  --mantine-color-dark-light-color: var(--mantine-color-dark-6);
482
483
  --mantine-color-dark-outline: var(--mantine-color-dark-6);
483
- --mantine-color-dark-outline-hover: rgba(56, 56, 56, 0.05);
484
+ --mantine-color-dark-outline-hover: rgba(46, 46, 46, 0.05);
484
485
  --mantine-color-gray-text: var(--mantine-color-gray-filled);
485
486
  --mantine-color-gray-filled: var(--mantine-color-gray-6);
486
487
  --mantine-color-gray-filled-hover: var(--mantine-color-gray-7);
@@ -744,6 +745,10 @@ fieldset:disabled .mantine-active:active {
744
745
  display: none;
745
746
  }
746
747
 
748
+ .m_b1336c6 {
749
+ min-width: 100%;
750
+ }
751
+
747
752
  .m_87cf2631 {
748
753
  background-color: transparent;
749
754
  cursor: pointer;
@@ -3678,13 +3683,11 @@ fieldset:disabled .m_d3ea56bb,
3678
3683
  }
3679
3684
 
3680
3685
  :where([data-mantine-color-scheme='light']) .m_b183c0a2 {
3681
- background-color: var(--code-bg, var(--mantine-color-gray-1));
3682
- color: var(--mantine-color-black);
3686
+ background-color: var(--code-bg, var(--mantine-color-gray-0));
3683
3687
  }
3684
3688
 
3685
3689
  :where([data-mantine-color-scheme='dark']) .m_b183c0a2 {
3686
- background-color: var(--code-bg, var(--mantine-color-dark-5));
3687
- color: var(--mantine-color-white);
3690
+ background-color: var(--code-bg, var(--mantine-color-dark-6));
3688
3691
  }
3689
3692
 
3690
3693
  .m_b183c0a2[data-block] {
@@ -4174,7 +4177,6 @@ fieldset:disabled .m_d3ea56bb,
4174
4177
 
4175
4178
  .m_9e117634 {
4176
4179
  display: block;
4177
- flex: 0;
4178
4180
  object-fit: var(--image-object-fit, cover);
4179
4181
  width: 100%;
4180
4182
  border-radius: var(--image-radius, 0);
@@ -4253,22 +4255,16 @@ fieldset:disabled .m_d3ea56bb,
4253
4255
  --kbd-fz-xl: calc(1.25rem * var(--mantine-scale));
4254
4256
  --kbd-fz: var(--kbd-fz-sm);
4255
4257
 
4256
- --kbd-padding-xs: calc(0.125rem * var(--mantine-scale)) calc(0.25rem * var(--mantine-scale));
4257
- --kbd-padding-sm: calc(0.1875rem * var(--mantine-scale)) calc(0.3125rem * var(--mantine-scale));
4258
- --kbd-padding-md: calc(0.25rem * var(--mantine-scale)) calc(0.4375rem * var(--mantine-scale));
4259
- --kbd-padding-lg: calc(0.3125rem * var(--mantine-scale)) calc(0.5625rem * var(--mantine-scale));
4260
- --kbd-padding-xl: calc(0.5rem * var(--mantine-scale)) calc(0.875rem * var(--mantine-scale));
4261
- --kbd-padding: var(--kbd-padding-sm);
4262
-
4263
4258
  font-family: var(--mantine-font-family-monospace);
4264
4259
  line-height: var(--mantine-line-height);
4265
4260
  font-weight: 700;
4266
- padding: var(--kbd-padding);
4267
4261
  font-size: var(--kbd-fz);
4268
4262
  border-radius: var(--mantine-radius-sm);
4269
4263
  border: calc(0.0625rem * var(--mantine-scale)) solid;
4270
4264
  border-bottom-width: calc(0.1875rem * var(--mantine-scale));
4271
4265
  unicode-bidi: embed;
4266
+ text-align: center;
4267
+ padding: 0.12em 0.45em;
4272
4268
  }
4273
4269
 
4274
4270
  :where([data-mantine-color-scheme='light']) .m_dc6f14e2 {
@@ -4395,14 +4391,18 @@ fieldset:disabled .m_d3ea56bb,
4395
4391
  cursor: not-allowed;
4396
4392
  }
4397
4393
 
4398
- :where([data-mantine-color-scheme='light']) .m_99ac2aa1:where([data-hovered]):where(:not(:disabled, [data-disabled])) {
4394
+ :where([data-mantine-color-scheme='light']) .m_99ac2aa1:where(:hover, :focus):where(:not(:disabled, [data-disabled])) {
4399
4395
  background-color: var(--menu-item-hover, var(--mantine-color-gray-1));
4400
4396
  }
4401
4397
 
4402
- :where([data-mantine-color-scheme='dark']) .m_99ac2aa1:where([data-hovered]):where(:not(:disabled, [data-disabled])) {
4398
+ :where([data-mantine-color-scheme='dark']) .m_99ac2aa1:where(:hover, :focus):where(:not(:disabled, [data-disabled])) {
4403
4399
  background-color: var(--menu-item-hover, var(--mantine-color-dark-4));
4404
4400
  }
4405
4401
 
4402
+ .m_99ac2aa1:where([data-sub-menu-item]) {
4403
+ padding-inline-end: calc(0.3125rem * var(--mantine-scale));
4404
+ }
4405
+
4406
4406
  .m_5476e0d3 {
4407
4407
  flex: 1;
4408
4408
  }
@@ -4421,6 +4421,14 @@ fieldset:disabled .m_d3ea56bb,
4421
4421
  margin-inline-start: var(--mantine-spacing-xs);
4422
4422
  }
4423
4423
 
4424
+ .m_b85b0bed {
4425
+ transform: rotate(-90deg);
4426
+ }
4427
+
4428
+ :where([dir="rtl"]) .m_b85b0bed {
4429
+ transform: rotate(90deg);
4430
+ }
4431
+
4424
4432
  .m_9df02822 {
4425
4433
  --modal-size-xs: calc(20rem * var(--mantine-scale));
4426
4434
  --modal-size-sm: calc(23.75rem * var(--mantine-scale));
@@ -5663,11 +5671,11 @@ fieldset:disabled .m_d3ea56bb,
5663
5671
  }
5664
5672
 
5665
5673
  .m_cf365364 {
5666
- --sc-padding-xs: calc(0.1875rem * var(--mantine-scale)) calc(0.375rem * var(--mantine-scale));
5667
- --sc-padding-sm: calc(0.3125rem * var(--mantine-scale)) calc(0.625rem * var(--mantine-scale));
5668
- --sc-padding-md: calc(0.4375rem * var(--mantine-scale)) calc(0.875rem * var(--mantine-scale));
5669
- --sc-padding-lg: calc(0.5625rem * var(--mantine-scale)) calc(1rem * var(--mantine-scale));
5670
- --sc-padding-xl: calc(0.75rem * var(--mantine-scale)) calc(1.25rem * var(--mantine-scale));
5674
+ --sc-padding-xs: calc(0.125rem * var(--mantine-scale)) calc(0.375rem * var(--mantine-scale));
5675
+ --sc-padding-sm: calc(0.1875rem * var(--mantine-scale)) calc(0.625rem * var(--mantine-scale));
5676
+ --sc-padding-md: calc(0.25rem * var(--mantine-scale)) calc(0.875rem * var(--mantine-scale));
5677
+ --sc-padding-lg: calc(0.4375rem * var(--mantine-scale)) calc(1rem * var(--mantine-scale));
5678
+ --sc-padding-xl: calc(0.625rem * var(--mantine-scale)) calc(1.25rem * var(--mantine-scale));
5671
5679
 
5672
5680
  --sc-transition-duration: 200ms;
5673
5681
  --sc-padding: var(--sc-padding-sm);
@@ -6520,11 +6528,11 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
6520
6528
  --switch-label-font-size-lg: calc(0.5625rem * var(--mantine-scale));
6521
6529
  --switch-label-font-size-xl: calc(0.6875rem * var(--mantine-scale));
6522
6530
 
6523
- --switch-track-label-padding-xs: calc(0.0625rem * var(--mantine-scale));
6524
- --switch-track-label-padding-sm: calc(0.125rem * var(--mantine-scale));
6525
- --switch-track-label-padding-md: calc(0.125rem * var(--mantine-scale));
6531
+ --switch-track-label-padding-xs: calc(0.125rem * var(--mantine-scale));
6532
+ --switch-track-label-padding-sm: calc(0.15625rem * var(--mantine-scale));
6533
+ --switch-track-label-padding-md: calc(0.1875rem * var(--mantine-scale));
6526
6534
  --switch-track-label-padding-lg: calc(0.1875rem * var(--mantine-scale));
6527
- --switch-track-label-padding-xl: calc(0.1875rem * var(--mantine-scale));
6535
+ --switch-track-label-padding-xl: calc(0.21875rem * var(--mantine-scale));
6528
6536
 
6529
6537
  --switch-height: var(--switch-height-sm);
6530
6538
  --switch-width: var(--switch-width-sm);
@@ -6555,7 +6563,6 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
6555
6563
  position: relative;
6556
6564
  border-radius: var(--switch-radius);
6557
6565
  background-color: var(--switch-bg);
6558
- border: 1px solid var(--switch-bd);
6559
6566
  height: var(--switch-height);
6560
6567
  min-width: var(--switch-width);
6561
6568
  margin: 0;
@@ -6585,35 +6592,27 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
6585
6592
 
6586
6593
  .m_926b4011:checked + .m_9307d992 {
6587
6594
  --switch-bg: var(--switch-color);
6588
- --switch-bd: var(--switch-color);
6589
6595
  --switch-text-color: var(--mantine-color-white);
6590
6596
  }
6591
6597
 
6592
6598
  .m_926b4011:disabled + .m_9307d992,
6593
6599
  .m_926b4011[data-disabled] + .m_9307d992 {
6594
6600
  --switch-bg: var(--switch-disabled-color);
6595
- --switch-bd: var(--switch-disabled-color);
6596
6601
  --switch-cursor: not-allowed;
6597
6602
  }
6598
6603
 
6599
6604
  [data-mantine-color-scheme='light'] .m_9307d992 {
6600
- --switch-bg: var(--mantine-color-gray-2);
6601
- --switch-bd: var(--mantine-color-gray-3);
6605
+ --switch-bg: var(--mantine-color-gray-3);
6602
6606
  --switch-text-color: var(--mantine-color-gray-6);
6603
6607
  --switch-disabled-color: var(--mantine-color-gray-2);
6604
6608
  }
6605
6609
 
6606
6610
  [data-mantine-color-scheme='dark'] .m_9307d992 {
6607
- --switch-bg: var(--mantine-color-dark-6);
6608
- --switch-bd: var(--mantine-color-dark-4);
6611
+ --switch-bg: var(--mantine-color-dark-5);
6609
6612
  --switch-text-color: var(--mantine-color-dark-1);
6610
6613
  --switch-disabled-color: var(--mantine-color-dark-4);
6611
6614
  }
6612
6615
 
6613
- .m_9307d992[data-error] {
6614
- --switch-bd: var(--mantine-color-error);
6615
- }
6616
-
6617
6616
  .m_9307d992[data-label-position='left'] {
6618
6617
  --switch-order: 2;
6619
6618
  }
@@ -6626,33 +6625,39 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
6626
6625
  background-color: var(--switch-thumb-bg, var(--mantine-color-white));
6627
6626
  height: var(--switch-thumb-size);
6628
6627
  width: var(--switch-thumb-size);
6629
- border: 1px solid var(--switch-thumb-bd);
6630
6628
  inset-inline-start: var(--switch-thumb-start, var(--switch-track-label-padding));
6631
6629
  transition: inset-inline-start 150ms ease;
6632
6630
  }
6633
6631
 
6632
+ .m_93039a1d:where([data-with-thumb-indicator])::before {
6633
+ content: '';
6634
+ width: 40%;
6635
+ height: 40%;
6636
+ background-color: var(--switch-bg);
6637
+ position: absolute;
6638
+ border-radius: var(--switch-radius);
6639
+ inset: 50%;
6640
+ transform: translate(-50%, -50%);
6641
+ }
6642
+
6634
6643
  .m_93039a1d > * {
6635
6644
  margin: auto;
6636
6645
  }
6637
6646
 
6638
6647
  .m_926b4011:checked + * > .m_93039a1d {
6639
6648
  --switch-thumb-start: calc(100% - var(--switch-thumb-size) - var(--switch-track-label-padding));
6640
- --switch-thumb-bd: var(--mantine-color-white);
6641
6649
  }
6642
6650
 
6643
6651
  .m_926b4011:disabled + * > .m_93039a1d,
6644
6652
  .m_926b4011[data-disabled] + * > .m_93039a1d {
6645
- --switch-thumb-bd: var(--switch-thumb-bg-disabled);
6646
6653
  --switch-thumb-bg: var(--switch-thumb-bg-disabled);
6647
6654
  }
6648
6655
 
6649
6656
  [data-mantine-color-scheme='light'] .m_93039a1d {
6650
- --switch-thumb-bd: var(--mantine-color-gray-3);
6651
6657
  --switch-thumb-bg-disabled: var(--mantine-color-gray-0);
6652
6658
  }
6653
6659
 
6654
6660
  [data-mantine-color-scheme='dark'] .m_93039a1d {
6655
- --switch-thumb-bd: var(--mantine-color-white);
6656
6661
  --switch-thumb-bg-disabled: var(--mantine-color-dark-3);
6657
6662
  }
6658
6663
 
@@ -6837,11 +6842,17 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
6837
6842
  color: var(--toc-color);
6838
6843
  }
6839
6844
 
6840
- .m_89d60db1 {
6845
+ [data-mantine-color-scheme='light'] .m_89d60db1 {
6846
+ --tab-border-color: var(--mantine-color-gray-3);
6847
+ }
6848
+ [data-mantine-color-scheme='dark'] .m_89d60db1 {
6849
+ --tab-border-color: var(--mantine-color-dark-4);
6850
+ }
6851
+ .m_89d60db1 {
6852
+
6841
6853
  display: var(--tabs-display);
6842
6854
  flex-direction: var(--tabs-flex-direction);
6843
6855
 
6844
- --tab-justify: flex-start;
6845
6856
  --tabs-list-direction: row;
6846
6857
  --tabs-panel-grow: unset;
6847
6858
  --tabs-display: block;
@@ -6905,18 +6916,6 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
6905
6916
  --tab-radius: var(--tabs-radius) 0 0 var(--tabs-radius);
6906
6917
  }
6907
6918
 
6908
- [data-mantine-color-scheme='light'] .m_89d60db1 {
6909
- --tab-border-color: var(--mantine-color-gray-3);
6910
- }
6911
-
6912
- [data-mantine-color-scheme='dark'] .m_89d60db1 {
6913
- --tab-border-color: var(--mantine-color-dark-4);
6914
- }
6915
-
6916
- .m_89d60db1[data-orientation='horizontal'] {
6917
- --tab-justify: center;
6918
- }
6919
-
6920
6919
  .m_89d60db1[data-variant='default'] {
6921
6920
  --tabs-list-border-width: calc(0.125rem * var(--mantine-scale));
6922
6921
  }
@@ -6951,12 +6950,10 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
6951
6950
  justify-content: var(--tabs-justify, flex-start);
6952
6951
  flex-direction: var(--tabs-list-direction);
6953
6952
  gap: var(--tabs-list-gap);
6954
-
6955
- --tab-grow: unset;
6956
6953
  }
6957
6954
 
6958
- .m_89d33d6d[data-grow] {
6959
- --tab-grow: 1;
6955
+ .m_89d33d6d:where([data-grow]) .m_4ec4dce6 {
6956
+ flex: 1;
6960
6957
  }
6961
6958
 
6962
6959
  .m_b0c91715 {
@@ -6973,12 +6970,9 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
6973
6970
  align-items: center;
6974
6971
  line-height: 1;
6975
6972
  user-select: none;
6976
- flex-grow: var(--tab-grow);
6977
- justify-content: var(--tab-justify);
6978
6973
  }
6979
6974
 
6980
- .m_4ec4dce6:disabled,
6981
- .m_4ec4dce6[data-disabled] {
6975
+ .m_4ec4dce6:where(:disabled, [data-disabled]) {
6982
6976
  opacity: 0.5;
6983
6977
  cursor: not-allowed;
6984
6978
  }
@@ -6991,27 +6985,15 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
6991
6985
  display: flex;
6992
6986
  align-items: center;
6993
6987
  justify-content: center;
6994
- margin-left: var(--tab-section-margin-left, 0);
6995
- margin-right: var(--tab-section-margin-right, 0);
6996
6988
  }
6997
6989
 
6998
- .m_fc420b1f[data-position='left']:not(:only-child) {
6999
- --tab-section-margin-right: var(--mantine-spacing-xs);
7000
- }
7001
-
7002
- [dir="rtl"] .m_fc420b1f[data-position='left']:not(:only-child) {
7003
- --tab-section-margin-right: 0rem;
7004
- --tab-section-margin-left: var(--mantine-spacing-xs);
7005
- }
7006
-
7007
- .m_fc420b1f[data-position='right']:not(:only-child) {
7008
- --tab-section-margin-left: var(--mantine-spacing-xs);
7009
- }
6990
+ .m_fc420b1f:where([data-position='left']:not(:only-child)) {
6991
+ margin-inline-end: var(--mantine-spacing-xs);
6992
+ }
7010
6993
 
7011
- [dir="rtl"] .m_fc420b1f[data-position='right']:not(:only-child) {
7012
- --tab-section-margin-left: 0rem;
7013
- --tab-section-margin-right: var(--mantine-spacing-xs);
7014
- }
6994
+ .m_fc420b1f:where([data-position='right']:not(:only-child)) {
6995
+ margin-inline-start: var(--mantine-spacing-xs);
6996
+ }
7015
6997
 
7016
6998
  /*************************************** default variant ***************************************/
7017
6999
  .m_576c9d4 {
@@ -7020,9 +7002,7 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
7020
7002
  .m_576c9d4::before {
7021
7003
  content: '';
7022
7004
  position: absolute;
7023
- border-color: var(--tab-border-color);
7024
- border-width: var(--tabs-list-border-size);
7025
- border-style: solid;
7005
+ border: 1px solid var(--tab-border-color);
7026
7006
  bottom: var(--tabs-list-line-bottom);
7027
7007
  inset-inline-start: var(--tabs-list-line-start);
7028
7008
  inset-inline-end: var(--tabs-list-line-end);
@@ -7034,9 +7014,7 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
7034
7014
  border-width: var(--tab-border-width);
7035
7015
  border-style: solid;
7036
7016
  border-color: transparent;
7037
- background-color: var(--tab-bg);
7038
-
7039
- --tab-bg: transparent;
7017
+ background-color: transparent;
7040
7018
  }
7041
7019
 
7042
7020
  .m_539e827b:where([data-active]) {
@@ -7044,10 +7022,9 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
7044
7022
  }
7045
7023
 
7046
7024
  @media (hover: hover) {
7047
-
7048
- .m_539e827b:hover {
7049
- --tab-bg: var(--tab-hover-color);
7050
- }
7025
+ .m_539e827b:hover {
7026
+ background-color: var(--tab-hover-color);
7027
+ }
7051
7028
 
7052
7029
  .m_539e827b:hover:where(:not([data-active])) {
7053
7030
  border-color: var(--tab-border-color);
@@ -7055,10 +7032,9 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
7055
7032
  }
7056
7033
 
7057
7034
  @media (hover: none) {
7058
-
7059
- .m_539e827b:active {
7060
- --tab-bg: var(--tab-hover-color);
7061
- }
7035
+ .m_539e827b:active {
7036
+ background-color: var(--tab-hover-color);
7037
+ }
7062
7038
 
7063
7039
  .m_539e827b:active:where(:not([data-active])) {
7064
7040
  border-color: var(--tab-border-color);
@@ -7066,17 +7042,15 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
7066
7042
  }
7067
7043
 
7068
7044
  @media (hover: hover) {
7069
-
7070
- .m_539e827b:disabled:hover, .m_539e827b[data-disabled]:hover {
7071
- --tab-bg: transparent;
7072
- }
7045
+ .m_539e827b:disabled:hover, .m_539e827b[data-disabled]:hover {
7046
+ background-color: transparent;
7047
+ }
7073
7048
  }
7074
7049
 
7075
7050
  @media (hover: none) {
7076
-
7077
- .m_539e827b:disabled:active, .m_539e827b[data-disabled]:active {
7078
- --tab-bg: transparent;
7079
- }
7051
+ .m_539e827b:disabled:active, .m_539e827b[data-disabled]:active {
7052
+ background-color: transparent;
7053
+ }
7080
7054
  }
7081
7055
 
7082
7056
  /*************************************** outline variant ***************************************/
@@ -7208,32 +7182,28 @@ fieldset:disabled .m_c9ade57f:where([data-inverted]),
7208
7182
  --tab-color: inherit;
7209
7183
  }
7210
7184
  @media (hover: hover) {
7211
-
7212
- .m_c3381914:not([data-disabled]):hover {
7185
+ .m_c3381914:not([data-disabled]):hover {
7213
7186
  --tab-bg: var(--tab-hover-color);
7214
- }
7187
+ }
7215
7188
  }
7216
7189
  @media (hover: none) {
7217
-
7218
- .m_c3381914:not([data-disabled]):active {
7190
+ .m_c3381914:not([data-disabled]):active {
7219
7191
  --tab-bg: var(--tab-hover-color);
7220
- }
7192
+ }
7221
7193
  }
7222
7194
  .m_c3381914[data-active][data-active] {
7223
7195
  --tab-bg: var(--tabs-color);
7224
7196
  --tab-color: var(--tabs-text-color, var(--mantine-color-white));
7225
7197
  }
7226
7198
  @media (hover: hover) {
7227
-
7228
- .m_c3381914[data-active][data-active]:hover {
7199
+ .m_c3381914[data-active][data-active]:hover {
7229
7200
  --tab-bg: var(--tabs-color);
7230
- }
7201
+ }
7231
7202
  }
7232
7203
  @media (hover: none) {
7233
-
7234
- .m_c3381914[data-active][data-active]:active {
7204
+ .m_c3381914[data-active][data-active]:active {
7235
7205
  --tab-bg: var(--tabs-color);
7236
- }
7206
+ }
7237
7207
  }
7238
7208
 
7239
7209
  .m_7341320d {