@mantine/core 8.3.2 → 8.3.3

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 (199) hide show
  1. package/cjs/components/Checkbox/Checkbox.cjs +2 -1
  2. package/cjs/components/Checkbox/Checkbox.cjs.map +1 -1
  3. package/cjs/components/Checkbox/CheckboxIndicator/CheckboxIndicator.cjs +2 -1
  4. package/cjs/components/Checkbox/CheckboxIndicator/CheckboxIndicator.cjs.map +1 -1
  5. package/cjs/components/Popover/Popover.cjs +4 -2
  6. package/cjs/components/Popover/Popover.cjs.map +1 -1
  7. package/cjs/components/Tabs/TabsTab/TabsTab.cjs +1 -1
  8. package/cjs/components/Tabs/TabsTab/TabsTab.cjs.map +1 -1
  9. package/esm/components/Checkbox/Checkbox.mjs +2 -1
  10. package/esm/components/Checkbox/Checkbox.mjs.map +1 -1
  11. package/esm/components/Checkbox/CheckboxIndicator/CheckboxIndicator.mjs +2 -1
  12. package/esm/components/Checkbox/CheckboxIndicator/CheckboxIndicator.mjs.map +1 -1
  13. package/esm/components/Popover/Popover.mjs +4 -2
  14. package/esm/components/Popover/Popover.mjs.map +1 -1
  15. package/esm/components/Tabs/TabsTab/TabsTab.mjs +1 -1
  16. package/esm/components/Tabs/TabsTab/TabsTab.mjs.map +1 -1
  17. package/package.json +2 -2
  18. package/styles.css +21 -4
  19. package/styles.layer.css +21 -4
  20. package/styles/Accordion.css +0 -178
  21. package/styles/Accordion.layer.css +0 -179
  22. package/styles/ActionIcon.css +0 -188
  23. package/styles/ActionIcon.layer.css +0 -189
  24. package/styles/Affix.css +0 -8
  25. package/styles/Affix.layer.css +0 -9
  26. package/styles/Alert.css +0 -82
  27. package/styles/Alert.layer.css +0 -83
  28. package/styles/Anchor.css +0 -56
  29. package/styles/Anchor.layer.css +0 -57
  30. package/styles/AngleSlider.css +0 -106
  31. package/styles/AngleSlider.layer.css +0 -107
  32. package/styles/AppShell.css +0 -127
  33. package/styles/AppShell.layer.css +0 -128
  34. package/styles/AspectRatio.css +0 -13
  35. package/styles/AspectRatio.layer.css +0 -14
  36. package/styles/Avatar.css +0 -68
  37. package/styles/Avatar.layer.css +0 -69
  38. package/styles/BackgroundImage.css +0 -9
  39. package/styles/BackgroundImage.layer.css +0 -10
  40. package/styles/Badge.css +0 -127
  41. package/styles/Badge.layer.css +0 -128
  42. package/styles/Blockquote.css +0 -41
  43. package/styles/Blockquote.layer.css +0 -42
  44. package/styles/Breadcrumbs.css +0 -27
  45. package/styles/Breadcrumbs.layer.css +0 -28
  46. package/styles/Burger.css +0 -68
  47. package/styles/Burger.layer.css +0 -69
  48. package/styles/Button.css +0 -261
  49. package/styles/Button.layer.css +0 -262
  50. package/styles/Card.css +0 -54
  51. package/styles/Card.layer.css +0 -55
  52. package/styles/Center.css +0 -9
  53. package/styles/Center.layer.css +0 -10
  54. package/styles/Checkbox.css +0 -103
  55. package/styles/Checkbox.layer.css +0 -104
  56. package/styles/CheckboxCard.css +0 -24
  57. package/styles/CheckboxCard.layer.css +0 -25
  58. package/styles/CheckboxIndicator.css +0 -87
  59. package/styles/CheckboxIndicator.layer.css +0 -88
  60. package/styles/Chip.css +0 -199
  61. package/styles/Chip.layer.css +0 -200
  62. package/styles/CloseButton.css +0 -58
  63. package/styles/CloseButton.layer.css +0 -59
  64. package/styles/Code.css +0 -21
  65. package/styles/Code.layer.css +0 -22
  66. package/styles/ColorInput.css +0 -21
  67. package/styles/ColorInput.layer.css +0 -22
  68. package/styles/ColorPicker.css +0 -160
  69. package/styles/ColorPicker.layer.css +0 -161
  70. package/styles/ColorSwatch.css +0 -71
  71. package/styles/ColorSwatch.layer.css +0 -72
  72. package/styles/Combobox.css +0 -210
  73. package/styles/Combobox.layer.css +0 -211
  74. package/styles/Container.css +0 -37
  75. package/styles/Container.layer.css +0 -38
  76. package/styles/Dialog.css +0 -19
  77. package/styles/Dialog.layer.css +0 -20
  78. package/styles/Divider.css +0 -62
  79. package/styles/Divider.layer.css +0 -63
  80. package/styles/Drawer.css +0 -33
  81. package/styles/Drawer.layer.css +0 -34
  82. package/styles/Fieldset.css +0 -49
  83. package/styles/Fieldset.layer.css +0 -50
  84. package/styles/Flex.css +0 -3
  85. package/styles/Flex.layer.css +0 -4
  86. package/styles/FloatingIndicator.css +0 -20
  87. package/styles/FloatingIndicator.layer.css +0 -21
  88. package/styles/Grid.css +0 -34
  89. package/styles/Grid.layer.css +0 -35
  90. package/styles/Group.css +0 -13
  91. package/styles/Group.layer.css +0 -14
  92. package/styles/Image.css +0 -6
  93. package/styles/Image.layer.css +0 -7
  94. package/styles/Indicator.css +0 -64
  95. package/styles/Indicator.layer.css +0 -65
  96. package/styles/InlineInput.css +0 -66
  97. package/styles/InlineInput.layer.css +0 -67
  98. package/styles/Input.css +0 -333
  99. package/styles/Input.layer.css +0 -334
  100. package/styles/Kbd.css +0 -31
  101. package/styles/Kbd.layer.css +0 -32
  102. package/styles/List.css +0 -51
  103. package/styles/List.layer.css +0 -52
  104. package/styles/Loader.css +0 -114
  105. package/styles/Loader.layer.css +0 -115
  106. package/styles/LoadingOverlay.css +0 -18
  107. package/styles/LoadingOverlay.layer.css +0 -19
  108. package/styles/Mark.css +0 -11
  109. package/styles/Mark.layer.css +0 -12
  110. package/styles/Menu.css +0 -80
  111. package/styles/Menu.layer.css +0 -81
  112. package/styles/Modal.css +0 -61
  113. package/styles/Modal.layer.css +0 -62
  114. package/styles/ModalBase.css +0 -56
  115. package/styles/ModalBase.layer.css +0 -57
  116. package/styles/NavLink.css +0 -118
  117. package/styles/NavLink.layer.css +0 -119
  118. package/styles/Notification.css +0 -131
  119. package/styles/Notification.layer.css +0 -132
  120. package/styles/NumberInput.css +0 -81
  121. package/styles/NumberInput.layer.css +0 -82
  122. package/styles/Overlay.css +0 -19
  123. package/styles/Overlay.layer.css +0 -20
  124. package/styles/Pagination.css +0 -96
  125. package/styles/Pagination.layer.css +0 -97
  126. package/styles/Paper.css +0 -24
  127. package/styles/Paper.layer.css +0 -25
  128. package/styles/PasswordInput.css +0 -62
  129. package/styles/PasswordInput.layer.css +0 -63
  130. package/styles/Pill.css +0 -117
  131. package/styles/Pill.layer.css +0 -118
  132. package/styles/PillsInput.css +0 -45
  133. package/styles/PillsInput.layer.css +0 -46
  134. package/styles/PinInput.css +0 -13
  135. package/styles/PinInput.layer.css +0 -14
  136. package/styles/Popover.css +0 -36
  137. package/styles/Popover.layer.css +0 -37
  138. package/styles/Progress.css +0 -142
  139. package/styles/Progress.layer.css +0 -143
  140. package/styles/Radio.css +0 -109
  141. package/styles/Radio.layer.css +0 -110
  142. package/styles/RadioCard.css +0 -24
  143. package/styles/RadioCard.layer.css +0 -25
  144. package/styles/RadioIndicator.css +0 -91
  145. package/styles/RadioIndicator.layer.css +0 -92
  146. package/styles/Rating.css +0 -82
  147. package/styles/Rating.layer.css +0 -83
  148. package/styles/RingProgress.css +0 -39
  149. package/styles/RingProgress.layer.css +0 -40
  150. package/styles/ScrollArea.css +0 -189
  151. package/styles/ScrollArea.layer.css +0 -190
  152. package/styles/SegmentedControl.css +0 -224
  153. package/styles/SegmentedControl.layer.css +0 -225
  154. package/styles/SemiCircleProgress.css +0 -56
  155. package/styles/SemiCircleProgress.layer.css +0 -57
  156. package/styles/SimpleGrid.css +0 -9
  157. package/styles/SimpleGrid.layer.css +0 -10
  158. package/styles/Skeleton.css +0 -50
  159. package/styles/Skeleton.layer.css +0 -51
  160. package/styles/Slider.css +0 -209
  161. package/styles/Slider.layer.css +0 -210
  162. package/styles/Spoiler.css +0 -21
  163. package/styles/Spoiler.layer.css +0 -22
  164. package/styles/Stack.css +0 -7
  165. package/styles/Stack.layer.css +0 -8
  166. package/styles/Stepper.css +0 -204
  167. package/styles/Stepper.layer.css +0 -205
  168. package/styles/Switch.css +0 -172
  169. package/styles/Switch.layer.css +0 -173
  170. package/styles/Table.css +0 -159
  171. package/styles/Table.layer.css +0 -160
  172. package/styles/TableOfContents.css +0 -38
  173. package/styles/TableOfContents.layer.css +0 -39
  174. package/styles/Tabs.css +0 -368
  175. package/styles/Tabs.layer.css +0 -369
  176. package/styles/Text.css +0 -51
  177. package/styles/Text.layer.css +0 -52
  178. package/styles/ThemeIcon.css +0 -24
  179. package/styles/ThemeIcon.layer.css +0 -25
  180. package/styles/Timeline.css +0 -173
  181. package/styles/Timeline.layer.css +0 -174
  182. package/styles/Title.css +0 -16
  183. package/styles/Title.layer.css +0 -17
  184. package/styles/Tooltip.css +0 -34
  185. package/styles/Tooltip.layer.css +0 -35
  186. package/styles/Tree.css +0 -36
  187. package/styles/Tree.layer.css +0 -37
  188. package/styles/Typography.css +0 -209
  189. package/styles/Typography.layer.css +0 -210
  190. package/styles/UnstyledButton.css +0 -17
  191. package/styles/UnstyledButton.layer.css +0 -18
  192. package/styles/VisuallyHidden.css +0 -11
  193. package/styles/VisuallyHidden.layer.css +0 -12
  194. package/styles/baseline.css +0 -40
  195. package/styles/baseline.layer.css +0 -41
  196. package/styles/default-css-variables.css +0 -519
  197. package/styles/default-css-variables.layer.css +0 -520
  198. package/styles/global.css +0 -40
  199. package/styles/global.layer.css +0 -41
@@ -1,41 +0,0 @@
1
- .m_ddec01c0 {
2
- --blockquote-border: 3px solid var(--bq-bd);
3
-
4
- position: relative;
5
- margin: 0;
6
- border-inline-start: var(--blockquote-border);
7
- border-start-end-radius: var(--bq-radius);
8
- border-end-end-radius: var(--bq-radius);
9
- padding: var(--mantine-spacing-xl) calc(2.375rem * var(--mantine-scale));
10
- }
11
-
12
- :where([data-mantine-color-scheme='light']) .m_ddec01c0 {
13
- background-color: var(--bq-bg-light);
14
- }
15
-
16
- :where([data-mantine-color-scheme='dark']) .m_ddec01c0 {
17
- background-color: var(--bq-bg-dark);
18
- }
19
-
20
- .m_dde7bd57 {
21
- --blockquote-icon-offset: calc(var(--bq-icon-size) / -2);
22
-
23
- position: absolute;
24
- color: var(--bq-bd);
25
- background-color: var(--mantine-color-body);
26
- display: flex;
27
- align-items: center;
28
- justify-content: center;
29
- top: var(--blockquote-icon-offset);
30
- inset-inline-start: var(--blockquote-icon-offset);
31
- width: var(--bq-icon-size);
32
- height: var(--bq-icon-size);
33
- border-radius: var(--bq-icon-size);
34
- }
35
-
36
- .m_dde51a35 {
37
- display: block;
38
- margin-top: var(--mantine-spacing-md);
39
- opacity: 0.6;
40
- font-size: 85%;
41
- }
@@ -1,42 +0,0 @@
1
- @layer mantine {.m_ddec01c0 {
2
- --blockquote-border: 3px solid var(--bq-bd);
3
-
4
- position: relative;
5
- margin: 0;
6
- border-inline-start: var(--blockquote-border);
7
- border-start-end-radius: var(--bq-radius);
8
- border-end-end-radius: var(--bq-radius);
9
- padding: var(--mantine-spacing-xl) calc(2.375rem * var(--mantine-scale));
10
- }
11
-
12
- :where([data-mantine-color-scheme='light']) .m_ddec01c0 {
13
- background-color: var(--bq-bg-light);
14
- }
15
-
16
- :where([data-mantine-color-scheme='dark']) .m_ddec01c0 {
17
- background-color: var(--bq-bg-dark);
18
- }
19
-
20
- .m_dde7bd57 {
21
- --blockquote-icon-offset: calc(var(--bq-icon-size) / -2);
22
-
23
- position: absolute;
24
- color: var(--bq-bd);
25
- background-color: var(--mantine-color-body);
26
- display: flex;
27
- align-items: center;
28
- justify-content: center;
29
- top: var(--blockquote-icon-offset);
30
- inset-inline-start: var(--blockquote-icon-offset);
31
- width: var(--bq-icon-size);
32
- height: var(--bq-icon-size);
33
- border-radius: var(--bq-icon-size);
34
- }
35
-
36
- .m_dde51a35 {
37
- display: block;
38
- margin-top: var(--mantine-spacing-md);
39
- opacity: 0.6;
40
- font-size: 85%;
41
- }
42
- }
@@ -1,27 +0,0 @@
1
- .m_8b3717df {
2
- display: flex;
3
- align-items: center;
4
- flex-wrap: wrap;
5
- }
6
-
7
- .m_f678d540 {
8
- line-height: 1;
9
- white-space: nowrap;
10
- -webkit-tap-highlight-color: transparent;
11
- }
12
-
13
- .m_3b8f2208 {
14
- margin-inline: var(--bc-separator-margin, var(--mantine-spacing-xs));
15
- line-height: 1;
16
- display: flex;
17
- align-items: center;
18
- justify-content: center;
19
- }
20
-
21
- :where([data-mantine-color-scheme='light']) .m_3b8f2208 {
22
- color: var(--mantine-color-gray-7);
23
- }
24
-
25
- :where([data-mantine-color-scheme='dark']) .m_3b8f2208 {
26
- color: var(--mantine-color-dark-2);
27
- }
@@ -1,28 +0,0 @@
1
- @layer mantine {.m_8b3717df {
2
- display: flex;
3
- align-items: center;
4
- flex-wrap: wrap;
5
- }
6
-
7
- .m_f678d540 {
8
- line-height: 1;
9
- white-space: nowrap;
10
- -webkit-tap-highlight-color: transparent;
11
- }
12
-
13
- .m_3b8f2208 {
14
- margin-inline: var(--bc-separator-margin, var(--mantine-spacing-xs));
15
- line-height: 1;
16
- display: flex;
17
- align-items: center;
18
- justify-content: center;
19
- }
20
-
21
- :where([data-mantine-color-scheme='light']) .m_3b8f2208 {
22
- color: var(--mantine-color-gray-7);
23
- }
24
-
25
- :where([data-mantine-color-scheme='dark']) .m_3b8f2208 {
26
- color: var(--mantine-color-dark-2);
27
- }
28
- }
package/styles/Burger.css DELETED
@@ -1,68 +0,0 @@
1
- .m_fea6bf1a {
2
- --burger-size-xs: 12px;
3
- --burger-size-sm: 18px;
4
- --burger-size-md: 24px;
5
- --burger-size-lg: 34px;
6
- --burger-size-xl: 42px;
7
-
8
- --burger-size: var(--burger-size-md);
9
- --burger-line-size: calc(var(--burger-size) / 12);
10
-
11
- width: calc(var(--burger-size) + var(--mantine-spacing-xs));
12
- height: calc(var(--burger-size) + var(--mantine-spacing-xs));
13
- padding: calc(var(--mantine-spacing-xs) / 2);
14
- cursor: pointer;
15
- }
16
-
17
- :where([data-mantine-color-scheme='light']) .m_fea6bf1a {
18
- --burger-color: var(--mantine-color-black);
19
- }
20
-
21
- :where([data-mantine-color-scheme='dark']) .m_fea6bf1a {
22
- --burger-color: var(--mantine-color-white);
23
- }
24
-
25
- .m_d4fb9cad {
26
- position: relative;
27
- user-select: none;
28
- }
29
-
30
- .m_d4fb9cad,
31
- .m_d4fb9cad::before,
32
- .m_d4fb9cad::after {
33
- display: block;
34
- width: var(--burger-size);
35
- height: var(--burger-line-size);
36
- background-color: var(--burger-color);
37
- outline: 1px solid transparent;
38
- transition-property: background-color, transform;
39
- transition-duration: var(--burger-transition-duration, 300ms);
40
- transition-timing-function: var(--burger-transition-timing-function, ease);
41
- }
42
-
43
- .m_d4fb9cad::before,
44
- .m_d4fb9cad::after {
45
- position: absolute;
46
- content: '';
47
- inset-inline-start: 0;
48
- }
49
-
50
- .m_d4fb9cad::before {
51
- top: calc(var(--burger-size) / -3);
52
- }
53
-
54
- .m_d4fb9cad::after {
55
- top: calc(var(--burger-size) / 3);
56
- }
57
-
58
- .m_d4fb9cad[data-opened] {
59
- background-color: transparent;
60
- }
61
-
62
- .m_d4fb9cad[data-opened]::before {
63
- transform: translateY(calc(var(--burger-size) / 3)) rotate(45deg);
64
- }
65
-
66
- .m_d4fb9cad[data-opened]::after {
67
- transform: translateY(calc(var(--burger-size) / -3)) rotate(-45deg);
68
- }
@@ -1,69 +0,0 @@
1
- @layer mantine {.m_fea6bf1a {
2
- --burger-size-xs: 12px;
3
- --burger-size-sm: 18px;
4
- --burger-size-md: 24px;
5
- --burger-size-lg: 34px;
6
- --burger-size-xl: 42px;
7
-
8
- --burger-size: var(--burger-size-md);
9
- --burger-line-size: calc(var(--burger-size) / 12);
10
-
11
- width: calc(var(--burger-size) + var(--mantine-spacing-xs));
12
- height: calc(var(--burger-size) + var(--mantine-spacing-xs));
13
- padding: calc(var(--mantine-spacing-xs) / 2);
14
- cursor: pointer;
15
- }
16
-
17
- :where([data-mantine-color-scheme='light']) .m_fea6bf1a {
18
- --burger-color: var(--mantine-color-black);
19
- }
20
-
21
- :where([data-mantine-color-scheme='dark']) .m_fea6bf1a {
22
- --burger-color: var(--mantine-color-white);
23
- }
24
-
25
- .m_d4fb9cad {
26
- position: relative;
27
- user-select: none;
28
- }
29
-
30
- .m_d4fb9cad,
31
- .m_d4fb9cad::before,
32
- .m_d4fb9cad::after {
33
- display: block;
34
- width: var(--burger-size);
35
- height: var(--burger-line-size);
36
- background-color: var(--burger-color);
37
- outline: 1px solid transparent;
38
- transition-property: background-color, transform;
39
- transition-duration: var(--burger-transition-duration, 300ms);
40
- transition-timing-function: var(--burger-transition-timing-function, ease);
41
- }
42
-
43
- .m_d4fb9cad::before,
44
- .m_d4fb9cad::after {
45
- position: absolute;
46
- content: '';
47
- inset-inline-start: 0;
48
- }
49
-
50
- .m_d4fb9cad::before {
51
- top: calc(var(--burger-size) / -3);
52
- }
53
-
54
- .m_d4fb9cad::after {
55
- top: calc(var(--burger-size) / 3);
56
- }
57
-
58
- .m_d4fb9cad[data-opened] {
59
- background-color: transparent;
60
- }
61
-
62
- .m_d4fb9cad[data-opened]::before {
63
- transform: translateY(calc(var(--burger-size) / 3)) rotate(45deg);
64
- }
65
-
66
- .m_d4fb9cad[data-opened]::after {
67
- transform: translateY(calc(var(--burger-size) / -3)) rotate(-45deg);
68
- }
69
- }
package/styles/Button.css DELETED
@@ -1,261 +0,0 @@
1
- .m_77c9d27d {
2
- --button-height-xs: 30px;
3
- --button-height-sm: 36px;
4
- --button-height-md: 42px;
5
- --button-height-lg: 50px;
6
- --button-height-xl: 60px;
7
-
8
- --button-height-compact-xs: 22px;
9
- --button-height-compact-sm: 26px;
10
- --button-height-compact-md: 30px;
11
- --button-height-compact-lg: 34px;
12
- --button-height-compact-xl: 40px;
13
-
14
- --button-padding-x-xs: 14px;
15
- --button-padding-x-sm: 18px;
16
- --button-padding-x-md: 22px;
17
- --button-padding-x-lg: 26px;
18
- --button-padding-x-xl: 32px;
19
-
20
- --button-padding-x-compact-xs: 7px;
21
- --button-padding-x-compact-sm: 8px;
22
- --button-padding-x-compact-md: 10px;
23
- --button-padding-x-compact-lg: 12px;
24
- --button-padding-x-compact-xl: 14px;
25
-
26
- --button-height: var(--button-height-sm);
27
- --button-padding-x: var(--button-padding-x-sm);
28
- --button-color: var(--mantine-color-white);
29
-
30
- user-select: none;
31
- font-weight: 600;
32
- position: relative;
33
- line-height: 1;
34
- text-align: center;
35
- overflow: hidden;
36
-
37
- width: auto;
38
- cursor: pointer;
39
- display: inline-block;
40
- border-radius: var(--button-radius, var(--mantine-radius-default));
41
- font-size: var(--button-fz, var(--mantine-font-size-sm));
42
- background: var(--button-bg, var(--mantine-primary-color-filled));
43
- border: var(--button-bd, calc(0.0625rem * var(--mantine-scale)) solid transparent);
44
- color: var(--button-color, var(--mantine-color-white));
45
- height: var(--button-height, var(--button-height-sm));
46
- padding-inline: var(--button-padding-x, var(--button-padding-x-sm));
47
- vertical-align: middle;
48
- }
49
-
50
- .m_77c9d27d:where([data-block]) {
51
- display: block;
52
- width: 100%;
53
- }
54
-
55
- .m_77c9d27d:where([data-with-left-section]) {
56
- padding-inline-start: calc(var(--button-padding-x) / 1.5);
57
- }
58
-
59
- .m_77c9d27d:where([data-with-right-section]) {
60
- padding-inline-end: calc(var(--button-padding-x) / 1.5);
61
- }
62
-
63
- .m_77c9d27d:where(:disabled:not([data-loading]), [data-disabled]:not([data-loading])) {
64
- cursor: not-allowed;
65
- border: 1px solid transparent;
66
- transform: none;
67
- color: var(--mantine-color-disabled-color);
68
- background: var(--mantine-color-disabled);
69
- }
70
-
71
- .m_77c9d27d::before {
72
- content: '';
73
- pointer-events: none;
74
- position: absolute;
75
- inset: -1px;
76
- border-radius: var(--button-radius, var(--mantine-radius-default));
77
- transform: translateY(-100%);
78
- opacity: 0;
79
- filter: blur(12px);
80
- transition:
81
- transform 150ms ease,
82
- opacity 100ms ease;
83
- }
84
-
85
- :where([data-mantine-color-scheme='light']) .m_77c9d27d::before {
86
- background-color: rgba(255, 255, 255, 0.15);
87
- }
88
-
89
- :where([data-mantine-color-scheme='dark']) .m_77c9d27d::before {
90
- background-color: rgba(0, 0, 0, 0.15);
91
- }
92
-
93
- .m_77c9d27d:where([data-loading]) {
94
- cursor: not-allowed;
95
- transform: none;
96
- }
97
-
98
- .m_77c9d27d:where([data-loading])::before {
99
- transform: translateY(0);
100
- opacity: 1;
101
- }
102
-
103
- .m_77c9d27d:where([data-loading]) .m_80f1301b {
104
- opacity: 0;
105
- transform: translateY(100%);
106
- }
107
-
108
- @media (hover: hover) {
109
- .m_77c9d27d:hover:where(:not([data-loading], :disabled, [data-disabled])) {
110
- background-color: var(--button-hover, var(--mantine-primary-color-filled-hover));
111
- color: var(--button-hover-color, var(--button-color));
112
- }
113
- }
114
-
115
- @media (hover: none) {
116
- .m_77c9d27d:active:where(:not([data-loading], :disabled, [data-disabled])) {
117
- background-color: var(--button-hover, var(--mantine-primary-color-filled-hover));
118
- color: var(--button-hover-color, var(--button-color));
119
- }
120
- }
121
-
122
- .m_80f1301b {
123
- display: flex;
124
- align-items: center;
125
- justify-content: var(--button-justify, center);
126
- height: 100%;
127
- overflow: visible;
128
- transition:
129
- transform 150ms ease,
130
- opacity 100ms ease;
131
- }
132
-
133
- .m_811560b9 {
134
- white-space: nowrap;
135
- height: 100%;
136
- overflow: hidden;
137
- display: flex;
138
- align-items: center;
139
- opacity: 1;
140
- }
141
-
142
- .m_811560b9:where([data-loading]) {
143
- opacity: 0.2;
144
- }
145
-
146
- .m_a74036a {
147
- display: flex;
148
- align-items: center;
149
- }
150
-
151
- .m_a74036a:where([data-position='left']) {
152
- margin-inline-end: var(--mantine-spacing-xs);
153
- }
154
-
155
- .m_a74036a:where([data-position='right']) {
156
- margin-inline-start: var(--mantine-spacing-xs);
157
- }
158
-
159
- .m_a25b86ee {
160
- position: absolute;
161
- left: 50%;
162
- top: 50%;
163
- }
164
-
165
- .m_80d6d844 {
166
- --button-border-width: 1px;
167
- display: flex;
168
- }
169
-
170
- .m_80d6d844 :where(.m_77c9d27d):focus {
171
- position: relative;
172
- z-index: 1;
173
- }
174
-
175
- .m_80d6d844[data-orientation='horizontal'] {
176
- flex-direction: row;
177
- }
178
-
179
- .m_80d6d844[data-orientation='horizontal'] .m_77c9d27d:not(:only-child):first-child, .m_80d6d844[data-orientation='horizontal'] .m_70be2a01:not(:only-child):first-child {
180
- border-end-end-radius: 0;
181
- border-start-end-radius: 0;
182
- border-inline-end-width: calc(var(--button-border-width) / 2);
183
- }
184
-
185
- .m_80d6d844[data-orientation='horizontal'] .m_77c9d27d:not(:only-child):last-child, .m_80d6d844[data-orientation='horizontal'] .m_70be2a01:not(:only-child):last-child {
186
- border-end-start-radius: 0;
187
- border-start-start-radius: 0;
188
- border-inline-start-width: calc(var(--button-border-width) / 2);
189
- }
190
-
191
- .m_80d6d844[data-orientation='horizontal'] .m_77c9d27d:not(:only-child):not(:first-child):not(:last-child), .m_80d6d844[data-orientation='horizontal'] .m_70be2a01:not(:only-child):not(:first-child):not(:last-child) {
192
- border-radius: 0;
193
- border-inline-width: calc(var(--button-border-width) / 2);
194
- }
195
-
196
- .m_80d6d844[data-orientation='vertical'] {
197
- flex-direction: column;
198
- }
199
-
200
- .m_80d6d844[data-orientation='vertical'] .m_77c9d27d:not(:only-child):first-child, .m_80d6d844[data-orientation='vertical'] .m_70be2a01:not(:only-child):first-child {
201
- border-end-start-radius: 0;
202
- border-end-end-radius: 0;
203
- border-bottom-width: calc(var(--button-border-width) / 2);
204
- }
205
-
206
- .m_80d6d844[data-orientation='vertical'] .m_77c9d27d:not(:only-child):last-child, .m_80d6d844[data-orientation='vertical'] .m_70be2a01:not(:only-child):last-child {
207
- border-start-start-radius: 0;
208
- border-start-end-radius: 0;
209
- border-top-width: calc(var(--button-border-width) / 2);
210
- }
211
-
212
- .m_80d6d844[data-orientation='vertical'] .m_77c9d27d:not(:only-child):not(:first-child):not(:last-child), .m_80d6d844[data-orientation='vertical'] .m_70be2a01:not(:only-child):not(:first-child):not(:last-child) {
213
- border-radius: 0;
214
- border-bottom-width: calc(var(--button-border-width) / 2);
215
- border-top-width: calc(var(--button-border-width) / 2);
216
- }
217
-
218
- .m_70be2a01 {
219
- --section-height-xs: 30px;
220
- --section-height-sm: 36px;
221
- --section-height-md: 42px;
222
- --section-height-lg: 50px;
223
- --section-height-xl: 60px;
224
-
225
- --section-height-compact-xs: 22px;
226
- --section-height-compact-sm: 26px;
227
- --section-height-compact-md: 30px;
228
- --section-height-compact-lg: 34px;
229
- --section-height-compact-xl: 40px;
230
-
231
- --section-padding-x-xs: 14px;
232
- --section-padding-x-sm: 18px;
233
- --section-padding-x-md: 22px;
234
- --section-padding-x-lg: 26px;
235
- --section-padding-x-xl: 32px;
236
-
237
- --section-padding-x-compact-xs: 7px;
238
- --section-padding-x-compact-sm: 8px;
239
- --section-padding-x-compact-md: 10px;
240
- --section-padding-x-compact-lg: 12px;
241
- --section-padding-x-compact-xl: 14px;
242
-
243
- --section-height: var(--section-height-sm);
244
- --section-padding-x: var(--section-padding-x-sm);
245
- --section-color: var(--mantine-color-white);
246
-
247
- font-weight: 600;
248
- width: auto;
249
- border-radius: var(--section-radius, var(--mantine-radius-default));
250
- font-size: var(--section-fz, var(--mantine-font-size-sm));
251
- background: var(--section-bg, var(--mantine-primary-color-filled));
252
- border: var(--section-bd, calc(0.0625rem * var(--mantine-scale)) solid transparent);
253
- color: var(--section-color, var(--mantine-color-white));
254
- height: var(--section-height, var(--section-height-sm));
255
- padding-inline: var(--section-padding-x, var(--section-padding-x-sm));
256
- vertical-align: middle;
257
- line-height: 1;
258
- display: inline-flex;
259
- align-items: center;
260
- justify-content: center;
261
- }