@blocknote/mantine 0.39.1 → 0.40.0

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 (15) hide show
  1. package/dist/blocknote-mantine.cjs +1 -1
  2. package/dist/blocknote-mantine.cjs.map +1 -1
  3. package/dist/blocknote-mantine.js +536 -577
  4. package/dist/blocknote-mantine.js.map +1 -1
  5. package/dist/webpack-stats.json +1 -1
  6. package/package.json +14 -9
  7. package/src/BlockNoteView.tsx +32 -28
  8. package/src/blocknoteStyles.css +794 -0
  9. package/src/components.tsx +0 -1
  10. package/src/mantineStyles.css +558 -39
  11. package/src/menu/Menu.tsx +41 -133
  12. package/src/style.css +1 -796
  13. package/types/src/BlockNoteView.d.ts +0 -1
  14. package/types/src/components.d.ts +0 -1
  15. package/dist/style.css +0 -1
package/src/components.tsx CHANGED
@@ -21,7 +21,6 @@ import { PanelTextInput } from "./panel/PanelTextInput.js";
21
21
  import { Popover, PopoverContent, PopoverTrigger } from "./popover/Popover.js";
22
22
  import { SideMenu } from "./sideMenu/SideMenu.js";
23
23
  import { SideMenuButton } from "./sideMenu/SideMenuButton.js";
24
- import "./style.css";
25
24
  import { SuggestionMenu } from "./suggestionMenu/SuggestionMenu.js";
26
25
  import { SuggestionMenuEmptyItem } from "./suggestionMenu/SuggestionMenuEmptyItem.js";
27
26
  import { SuggestionMenuItem } from "./suggestionMenu/SuggestionMenuItem.js";
package/src/mantineStyles.css CHANGED
@@ -82,62 +82,581 @@
82
82
  @import url("@mantine/core/styles/Timeline.css");
83
83
  @import url("@mantine/core/styles/Title.css");
84
84
  @import url("@mantine/core/styles/Tooltip.css");
85
- @import url("@mantine/core/styles/TypographyStylesProvider.css");
85
+ @import url("@mantine/core/styles/Typography.css");
86
+
87
+ /* Mantine baseline styles, scoped to .bn-mantine element. */
88
+ /* https://github.com/mantinedev/mantine/blob/8.3.1/packages/%40mantine/core/src/core/MantineProvider/baseline.css */
89
+ .bn-mantine {
90
+ color-scheme: var(--mantine-color-scheme);
91
+ }
86
92
 
87
- /* Mantine global styles, scoped to bn-container */
88
- /* Based on @mantine/core/styles/global.css
89
- (src: https://github.com/mantinedev/mantine/blob/master/packages/%40mantine/core/src/core/MantineProvider/global.css)
90
- but with styles set on `body` and `html` instead set on `bn-container`, as
91
- well as other minor changes. */
92
93
  .bn-mantine *,
93
- .bn-mantine :after,
94
- .bn-mantine :before {
94
+ .bn-mantine *::before,
95
+ .bn-mantine *::after {
95
96
  box-sizing: border-box;
96
97
  }
97
98
 
99
+ /* Fonts are already set in `style.css`, so not needed here. */
100
+ /* .bn-mantine input,
98
101
  .bn-mantine button,
102
+ .bn-mantine textarea,
99
103
  .bn-mantine select {
100
- text-transform: none;
101
- }
102
-
103
- @media screen and (max-device-width: 500px) {
104
- .bn-mantine {
105
- -webkit-text-size-adjust: 100%;
106
- }
107
- }
104
+ font: inherit;
105
+ } */
108
106
 
109
- @media (prefers-reduced-motion: reduce) {
110
- .bn-mantine [data-respect-reduced-motion] [data-reduce-motion] {
111
- animation: none;
112
- transition: none;
113
- }
107
+ .bn-mantine button,
108
+ .bn-mantine select {
109
+ text-transform: none;
114
110
  }
115
111
 
116
- .bn-mantine [data-mantine-color-scheme="dark"] .mantine-dark-hidden,
117
- .bn-mantine [data-mantine-color-scheme="light"] .mantine-light-hidden {
118
- display: none;
119
- }
112
+ .bn-mantine {
113
+ /* Defaults for font, text color, etc are already set in `style.css` so they
114
+ aren't needed here. The `.bn-mantine` element also has a margin that we don't
115
+ want to remove, so that too is commented out (would normally just remove the
116
+ margin on `body`). */
117
+ /* margin: 0;
118
+ font-family: var(--mantine-font-family);
119
+ font-size: var(--mantine-font-size-md);
120
+ line-height: var(--mantine-line-height);
121
+ background-color: var(--mantine-color-body);
122
+ color: var(--mantine-color-text); */
120
123
 
121
- .bn-mantine .mantine-focus-auto:focus-visible {
122
- outline: calc(0.125rem * var(--mantine-scale)) solid
123
- var(--mantine-primary-color-filled);
124
- outline-offset: calc(0.125rem * var(--mantine-scale));
124
+ -webkit-font-smoothing: var(--mantine-webkit-font-smoothing);
125
+ -moz-osx-font-smoothing: var(--mantine-moz-font-smoothing);
125
126
  }
126
127
 
127
- .bn-mantine .mantine-focus-always:focus {
128
- outline: calc(0.125rem * var(--mantine-scale)) solid
129
- var(--mantine-primary-color-filled);
130
- outline-offset: calc(0.125rem * var(--mantine-scale));
128
+ @media screen and (max-device-width: em(500px)) {
129
+ .bn-mantine {
130
+ -webkit-text-size-adjust: 100%;
131
+ }
131
132
  }
132
133
 
133
- .bn-mantine .mantine-focus-never:focus {
134
- outline: none;
134
+ /* Mantine default CSS variables, scoped to .bn-mantine element. */
135
+ /* https://github.com/mantinedev/mantine/blob/master/packages/%40mantine/core/src/core/MantineProvider/default-css-variables.css */
136
+ .bn-mantine {
137
+ --mantine-z-index-app: 100;
138
+ --mantine-z-index-modal: 200;
139
+ --mantine-z-index-popover: 300;
140
+ --mantine-z-index-overlay: 400;
141
+ --mantine-z-index-max: 9999;
142
+ --mantine-scale: 1;
143
+ --mantine-cursor-type: default;
144
+ --mantine-webkit-font-smoothing: antialiased;
145
+ --mantine-moz-font-smoothing: grayscale;
146
+ --mantine-color-white: #fff;
147
+ --mantine-color-black: #000;
148
+ --mantine-line-height: 1.55;
149
+ --mantine-font-family:
150
+ -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial,
151
+ sans-serif, Apple Color Emoji, Segoe UI Emoji;
152
+ --mantine-font-family-monospace:
153
+ ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono,
154
+ Courier New, monospace;
155
+ --mantine-font-family-headings:
156
+ -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial,
157
+ sans-serif, Apple Color Emoji, Segoe UI Emoji;
158
+ --mantine-heading-font-weight: 700;
159
+ --mantine-heading-text-wrap: wrap;
160
+ --mantine-radius-default: calc(0.25rem * var(--mantine-scale));
161
+ --mantine-primary-color-filled: var(--mantine-color-blue-filled);
162
+ --mantine-primary-color-filled-hover: var(--mantine-color-blue-filled-hover);
163
+ --mantine-primary-color-light: var(--mantine-color-blue-light);
164
+ --mantine-primary-color-light-hover: var(--mantine-color-blue-light-hover);
165
+ --mantine-primary-color-light-color: var(--mantine-color-blue-light-color);
166
+ --mantine-breakpoint-xs: 36em;
167
+ --mantine-breakpoint-sm: 48em;
168
+ --mantine-breakpoint-md: 62em;
169
+ --mantine-breakpoint-lg: 75em;
170
+ --mantine-breakpoint-xl: 88em;
171
+ --mantine-spacing-xs: calc(0.625rem * var(--mantine-scale));
172
+ --mantine-spacing-sm: calc(0.75rem * var(--mantine-scale));
173
+ --mantine-spacing-md: calc(1rem * var(--mantine-scale));
174
+ --mantine-spacing-lg: calc(1.25rem * var(--mantine-scale));
175
+ --mantine-spacing-xl: calc(2rem * var(--mantine-scale));
176
+ --mantine-font-size-xs: calc(0.75rem * var(--mantine-scale));
177
+ --mantine-font-size-sm: calc(0.875rem * var(--mantine-scale));
178
+ --mantine-font-size-md: calc(1rem * var(--mantine-scale));
179
+ --mantine-font-size-lg: calc(1.125rem * var(--mantine-scale));
180
+ --mantine-font-size-xl: calc(1.25rem * var(--mantine-scale));
181
+ --mantine-line-height-xs: 1.4;
182
+ --mantine-line-height-sm: 1.45;
183
+ --mantine-line-height-md: 1.55;
184
+ --mantine-line-height-lg: 1.6;
185
+ --mantine-line-height-xl: 1.65;
186
+ --mantine-shadow-xs:
187
+ 0 calc(0.0625rem * var(--mantine-scale))
188
+ calc(0.1875rem * var(--mantine-scale)) rgba(0, 0, 0, 0.05),
189
+ 0 calc(0.0625rem * var(--mantine-scale))
190
+ calc(0.125rem * var(--mantine-scale)) rgba(0, 0, 0, 0.1);
191
+ --mantine-shadow-sm:
192
+ 0 calc(0.0625rem * var(--mantine-scale))
193
+ calc(0.1875rem * var(--mantine-scale)) rgba(0, 0, 0, 0.05),
194
+ rgba(0, 0, 0, 0.05) 0 calc(0.625rem * var(--mantine-scale))
195
+ calc(0.9375rem * var(--mantine-scale))
196
+ calc(-0.3125rem * var(--mantine-scale)),
197
+ rgba(0, 0, 0, 0.04) 0 calc(0.4375rem * var(--mantine-scale))
198
+ calc(0.4375rem * var(--mantine-scale))
199
+ calc(-0.3125rem * var(--mantine-scale));
200
+ --mantine-shadow-md:
201
+ 0 calc(0.0625rem * var(--mantine-scale))
202
+ calc(0.1875rem * var(--mantine-scale)) rgba(0, 0, 0, 0.05),
203
+ rgba(0, 0, 0, 0.05) 0 calc(1.25rem * var(--mantine-scale))
204
+ calc(1.5625rem * var(--mantine-scale))
205
+ calc(-0.3125rem * var(--mantine-scale)),
206
+ rgba(0, 0, 0, 0.04) 0 calc(0.625rem * var(--mantine-scale))
207
+ calc(0.625rem * var(--mantine-scale))
208
+ calc(-0.3125rem * var(--mantine-scale));
209
+ --mantine-shadow-lg:
210
+ 0 calc(0.0625rem * var(--mantine-scale))
211
+ calc(0.1875rem * var(--mantine-scale)) rgba(0, 0, 0, 0.05),
212
+ rgba(0, 0, 0, 0.05) 0 calc(1.75rem * var(--mantine-scale))
213
+ calc(1.4375rem * var(--mantine-scale))
214
+ calc(-0.4375rem * var(--mantine-scale)),
215
+ rgba(0, 0, 0, 0.04) 0 calc(0.75rem * var(--mantine-scale))
216
+ calc(0.75rem * var(--mantine-scale))
217
+ calc(-0.4375rem * var(--mantine-scale));
218
+ --mantine-shadow-xl:
219
+ 0 calc(0.0625rem * var(--mantine-scale))
220
+ calc(0.1875rem * var(--mantine-scale)) rgba(0, 0, 0, 0.05),
221
+ rgba(0, 0, 0, 0.05) 0 calc(2.25rem * var(--mantine-scale))
222
+ calc(1.75rem * var(--mantine-scale))
223
+ calc(-0.4375rem * var(--mantine-scale)),
224
+ rgba(0, 0, 0, 0.04) 0 calc(1.0625rem * var(--mantine-scale))
225
+ calc(1.0625rem * var(--mantine-scale))
226
+ calc(-0.4375rem * var(--mantine-scale));
227
+ --mantine-radius-xs: calc(0.125rem * var(--mantine-scale));
228
+ --mantine-radius-sm: calc(0.25rem * var(--mantine-scale));
229
+ --mantine-radius-md: calc(0.5rem * var(--mantine-scale));
230
+ --mantine-radius-lg: calc(1rem * var(--mantine-scale));
231
+ --mantine-radius-xl: calc(2rem * var(--mantine-scale));
232
+ --mantine-primary-color-0: var(--mantine-color-blue-0);
233
+ --mantine-primary-color-1: var(--mantine-color-blue-1);
234
+ --mantine-primary-color-2: var(--mantine-color-blue-2);
235
+ --mantine-primary-color-3: var(--mantine-color-blue-3);
236
+ --mantine-primary-color-4: var(--mantine-color-blue-4);
237
+ --mantine-primary-color-5: var(--mantine-color-blue-5);
238
+ --mantine-primary-color-6: var(--mantine-color-blue-6);
239
+ --mantine-primary-color-7: var(--mantine-color-blue-7);
240
+ --mantine-primary-color-8: var(--mantine-color-blue-8);
241
+ --mantine-primary-color-9: var(--mantine-color-blue-9);
242
+ --mantine-color-dark-0: #c9c9c9;
243
+ --mantine-color-dark-1: #b8b8b8;
244
+ --mantine-color-dark-2: #828282;
245
+ --mantine-color-dark-3: #696969;
246
+ --mantine-color-dark-4: #424242;
247
+ --mantine-color-dark-5: #3b3b3b;
248
+ --mantine-color-dark-6: #2e2e2e;
249
+ --mantine-color-dark-7: #242424;
250
+ --mantine-color-dark-8: #1f1f1f;
251
+ --mantine-color-dark-9: #141414;
252
+ --mantine-color-gray-0: #f8f9fa;
253
+ --mantine-color-gray-1: #f1f3f5;
254
+ --mantine-color-gray-2: #e9ecef;
255
+ --mantine-color-gray-3: #dee2e6;
256
+ --mantine-color-gray-4: #ced4da;
257
+ --mantine-color-gray-5: #adb5bd;
258
+ --mantine-color-gray-6: #868e96;
259
+ --mantine-color-gray-7: #495057;
260
+ --mantine-color-gray-8: #343a40;
261
+ --mantine-color-gray-9: #212529;
262
+ --mantine-color-red-0: #fff5f5;
263
+ --mantine-color-red-1: #ffe3e3;
264
+ --mantine-color-red-2: #ffc9c9;
265
+ --mantine-color-red-3: #ffa8a8;
266
+ --mantine-color-red-4: #ff8787;
267
+ --mantine-color-red-5: #ff6b6b;
268
+ --mantine-color-red-6: #fa5252;
269
+ --mantine-color-red-7: #f03e3e;
270
+ --mantine-color-red-8: #e03131;
271
+ --mantine-color-red-9: #c92a2a;
272
+ --mantine-color-pink-0: #fff0f6;
273
+ --mantine-color-pink-1: #ffdeeb;
274
+ --mantine-color-pink-2: #fcc2d7;
275
+ --mantine-color-pink-3: #faa2c1;
276
+ --mantine-color-pink-4: #f783ac;
277
+ --mantine-color-pink-5: #f06595;
278
+ --mantine-color-pink-6: #e64980;
279
+ --mantine-color-pink-7: #d6336c;
280
+ --mantine-color-pink-8: #c2255c;
281
+ --mantine-color-pink-9: #a61e4d;
282
+ --mantine-color-grape-0: #f8f0fc;
283
+ --mantine-color-grape-1: #f3d9fa;
284
+ --mantine-color-grape-2: #eebefa;
285
+ --mantine-color-grape-3: #e599f7;
286
+ --mantine-color-grape-4: #da77f2;
287
+ --mantine-color-grape-5: #cc5de8;
288
+ --mantine-color-grape-6: #be4bdb;
289
+ --mantine-color-grape-7: #ae3ec9;
290
+ --mantine-color-grape-8: #9c36b5;
291
+ --mantine-color-grape-9: #862e9c;
292
+ --mantine-color-violet-0: #f3f0ff;
293
+ --mantine-color-violet-1: #e5dbff;
294
+ --mantine-color-violet-2: #d0bfff;
295
+ --mantine-color-violet-3: #b197fc;
296
+ --mantine-color-violet-4: #9775fa;
297
+ --mantine-color-violet-5: #845ef7;
298
+ --mantine-color-violet-6: #7950f2;
299
+ --mantine-color-violet-7: #7048e8;
300
+ --mantine-color-violet-8: #6741d9;
301
+ --mantine-color-violet-9: #5f3dc4;
302
+ --mantine-color-indigo-0: #edf2ff;
303
+ --mantine-color-indigo-1: #dbe4ff;
304
+ --mantine-color-indigo-2: #bac8ff;
305
+ --mantine-color-indigo-3: #91a7ff;
306
+ --mantine-color-indigo-4: #748ffc;
307
+ --mantine-color-indigo-5: #5c7cfa;
308
+ --mantine-color-indigo-6: #4c6ef5;
309
+ --mantine-color-indigo-7: #4263eb;
310
+ --mantine-color-indigo-8: #3b5bdb;
311
+ --mantine-color-indigo-9: #364fc7;
312
+ --mantine-color-blue-0: #e7f5ff;
313
+ --mantine-color-blue-1: #d0ebff;
314
+ --mantine-color-blue-2: #a5d8ff;
315
+ --mantine-color-blue-3: #74c0fc;
316
+ --mantine-color-blue-4: #4dabf7;
317
+ --mantine-color-blue-5: #339af0;
318
+ --mantine-color-blue-6: #228be6;
319
+ --mantine-color-blue-7: #1c7ed6;
320
+ --mantine-color-blue-8: #1971c2;
321
+ --mantine-color-blue-9: #1864ab;
322
+ --mantine-color-cyan-0: #e3fafc;
323
+ --mantine-color-cyan-1: #c5f6fa;
324
+ --mantine-color-cyan-2: #99e9f2;
325
+ --mantine-color-cyan-3: #66d9e8;
326
+ --mantine-color-cyan-4: #3bc9db;
327
+ --mantine-color-cyan-5: #22b8cf;
328
+ --mantine-color-cyan-6: #15aabf;
329
+ --mantine-color-cyan-7: #1098ad;
330
+ --mantine-color-cyan-8: #0c8599;
331
+ --mantine-color-cyan-9: #0b7285;
332
+ --mantine-color-teal-0: #e6fcf5;
333
+ --mantine-color-teal-1: #c3fae8;
334
+ --mantine-color-teal-2: #96f2d7;
335
+ --mantine-color-teal-3: #63e6be;
336
+ --mantine-color-teal-4: #38d9a9;
337
+ --mantine-color-teal-5: #20c997;
338
+ --mantine-color-teal-6: #12b886;
339
+ --mantine-color-teal-7: #0ca678;
340
+ --mantine-color-teal-8: #099268;
341
+ --mantine-color-teal-9: #087f5b;
342
+ --mantine-color-green-0: #ebfbee;
343
+ --mantine-color-green-1: #d3f9d8;
344
+ --mantine-color-green-2: #b2f2bb;
345
+ --mantine-color-green-3: #8ce99a;
346
+ --mantine-color-green-4: #69db7c;
347
+ --mantine-color-green-5: #51cf66;
348
+ --mantine-color-green-6: #40c057;
349
+ --mantine-color-green-7: #37b24d;
350
+ --mantine-color-green-8: #2f9e44;
351
+ --mantine-color-green-9: #2b8a3e;
352
+ --mantine-color-lime-0: #f4fce3;
353
+ --mantine-color-lime-1: #e9fac8;
354
+ --mantine-color-lime-2: #d8f5a2;
355
+ --mantine-color-lime-3: #c0eb75;
356
+ --mantine-color-lime-4: #a9e34b;
357
+ --mantine-color-lime-5: #94d82d;
358
+ --mantine-color-lime-6: #82c91e;
359
+ --mantine-color-lime-7: #74b816;
360
+ --mantine-color-lime-8: #66a80f;
361
+ --mantine-color-lime-9: #5c940d;
362
+ --mantine-color-yellow-0: #fff9db;
363
+ --mantine-color-yellow-1: #fff3bf;
364
+ --mantine-color-yellow-2: #ffec99;
365
+ --mantine-color-yellow-3: #ffe066;
366
+ --mantine-color-yellow-4: #ffd43b;
367
+ --mantine-color-yellow-5: #fcc419;
368
+ --mantine-color-yellow-6: #fab005;
369
+ --mantine-color-yellow-7: #f59f00;
370
+ --mantine-color-yellow-8: #f08c00;
371
+ --mantine-color-yellow-9: #e67700;
372
+ --mantine-color-orange-0: #fff4e6;
373
+ --mantine-color-orange-1: #ffe8cc;
374
+ --mantine-color-orange-2: #ffd8a8;
375
+ --mantine-color-orange-3: #ffc078;
376
+ --mantine-color-orange-4: #ffa94d;
377
+ --mantine-color-orange-5: #ff922b;
378
+ --mantine-color-orange-6: #fd7e14;
379
+ --mantine-color-orange-7: #f76707;
380
+ --mantine-color-orange-8: #e8590c;
381
+ --mantine-color-orange-9: #d9480f;
382
+ --mantine-h1-font-size: calc(2.125rem * var(--mantine-scale));
383
+ --mantine-h1-line-height: 1.3;
384
+ --mantine-h1-font-weight: 700;
385
+ --mantine-h2-font-size: calc(1.625rem * var(--mantine-scale));
386
+ --mantine-h2-line-height: 1.35;
387
+ --mantine-h2-font-weight: 700;
388
+ --mantine-h3-font-size: calc(1.375rem * var(--mantine-scale));
389
+ --mantine-h3-line-height: 1.4;
390
+ --mantine-h3-font-weight: 700;
391
+ --mantine-h4-font-size: calc(1.125rem * var(--mantine-scale));
392
+ --mantine-h4-line-height: 1.45;
393
+ --mantine-h4-font-weight: 700;
394
+ --mantine-h5-font-size: calc(1rem * var(--mantine-scale));
395
+ --mantine-h5-line-height: 1.5;
396
+ --mantine-h5-font-weight: 700;
397
+ --mantine-h6-font-size: calc(0.875rem * var(--mantine-scale));
398
+ --mantine-h6-line-height: 1.5;
399
+ --mantine-h6-font-weight: 700;
135
400
  }
136
401
 
137
- .bn-mantine .mantine-active:active {
138
- transform: translateY(calc(0.0625rem * var(--mantine-scale)));
402
+ .bn-mantine[data-mantine-color-scheme="dark"] {
403
+ --mantine-color-scheme: dark;
404
+ --mantine-primary-color-contrast: var(--mantine-color-white);
405
+ --mantine-color-bright: var(--mantine-color-white);
406
+ --mantine-color-text: var(--mantine-color-dark-0);
407
+ --mantine-color-body: var(--mantine-color-dark-7);
408
+ --mantine-color-error: var(--mantine-color-red-8);
409
+ --mantine-color-placeholder: var(--mantine-color-dark-3);
410
+ --mantine-color-anchor: var(--mantine-color-blue-4);
411
+ --mantine-color-default: var(--mantine-color-dark-6);
412
+ --mantine-color-default-hover: var(--mantine-color-dark-5);
413
+ --mantine-color-default-color: var(--mantine-color-white);
414
+ --mantine-color-default-border: var(--mantine-color-dark-4);
415
+ --mantine-color-dimmed: var(--mantine-color-dark-2);
416
+ --mantine-color-disabled: var(--mantine-color-dark-6);
417
+ --mantine-color-disabled-color: var(--mantine-color-dark-3);
418
+ --mantine-color-disabled-border: var(--mantine-color-dark-4);
419
+ --mantine-color-dark-text: var(--mantine-color-dark-4);
420
+ --mantine-color-dark-filled: var(--mantine-color-dark-8);
421
+ --mantine-color-dark-filled-hover: var(--mantine-color-dark-9);
422
+ --mantine-color-dark-light: rgba(46, 46, 46, 0.15);
423
+ --mantine-color-dark-light-hover: rgba(46, 46, 46, 0.2);
424
+ --mantine-color-dark-light-color: var(--mantine-color-dark-3);
425
+ --mantine-color-dark-outline: var(--mantine-color-dark-4);
426
+ --mantine-color-dark-outline-hover: rgba(66, 66, 66, 0.05);
427
+ --mantine-color-gray-text: var(--mantine-color-gray-4);
428
+ --mantine-color-gray-filled: var(--mantine-color-gray-8);
429
+ --mantine-color-gray-filled-hover: var(--mantine-color-gray-9);
430
+ --mantine-color-gray-light: rgba(134, 142, 150, 0.15);
431
+ --mantine-color-gray-light-hover: rgba(134, 142, 150, 0.2);
432
+ --mantine-color-gray-light-color: var(--mantine-color-gray-3);
433
+ --mantine-color-gray-outline: var(--mantine-color-gray-4);
434
+ --mantine-color-gray-outline-hover: rgba(206, 212, 218, 0.05);
435
+ --mantine-color-red-text: var(--mantine-color-red-4);
436
+ --mantine-color-red-filled: var(--mantine-color-red-8);
437
+ --mantine-color-red-filled-hover: var(--mantine-color-red-9);
438
+ --mantine-color-red-light: rgba(250, 82, 82, 0.15);
439
+ --mantine-color-red-light-hover: rgba(250, 82, 82, 0.2);
440
+ --mantine-color-red-light-color: var(--mantine-color-red-3);
441
+ --mantine-color-red-outline: var(--mantine-color-red-4);
442
+ --mantine-color-red-outline-hover: rgba(255, 135, 135, 0.05);
443
+ --mantine-color-pink-text: var(--mantine-color-pink-4);
444
+ --mantine-color-pink-filled: var(--mantine-color-pink-8);
445
+ --mantine-color-pink-filled-hover: var(--mantine-color-pink-9);
446
+ --mantine-color-pink-light: rgba(230, 73, 128, 0.15);
447
+ --mantine-color-pink-light-hover: rgba(230, 73, 128, 0.2);
448
+ --mantine-color-pink-light-color: var(--mantine-color-pink-3);
449
+ --mantine-color-pink-outline: var(--mantine-color-pink-4);
450
+ --mantine-color-pink-outline-hover: rgba(247, 131, 172, 0.05);
451
+ --mantine-color-grape-text: var(--mantine-color-grape-4);
452
+ --mantine-color-grape-filled: var(--mantine-color-grape-8);
453
+ --mantine-color-grape-filled-hover: var(--mantine-color-grape-9);
454
+ --mantine-color-grape-light: rgba(190, 75, 219, 0.15);
455
+ --mantine-color-grape-light-hover: rgba(190, 75, 219, 0.2);
456
+ --mantine-color-grape-light-color: var(--mantine-color-grape-3);
457
+ --mantine-color-grape-outline: var(--mantine-color-grape-4);
458
+ --mantine-color-grape-outline-hover: rgba(218, 119, 242, 0.05);
459
+ --mantine-color-violet-text: var(--mantine-color-violet-4);
460
+ --mantine-color-violet-filled: var(--mantine-color-violet-8);
461
+ --mantine-color-violet-filled-hover: var(--mantine-color-violet-9);
462
+ --mantine-color-violet-light: rgba(121, 80, 242, 0.15);
463
+ --mantine-color-violet-light-hover: rgba(121, 80, 242, 0.2);
464
+ --mantine-color-violet-light-color: var(--mantine-color-violet-3);
465
+ --mantine-color-violet-outline: var(--mantine-color-violet-4);
466
+ --mantine-color-violet-outline-hover: rgba(151, 117, 250, 0.05);
467
+ --mantine-color-indigo-text: var(--mantine-color-indigo-4);
468
+ --mantine-color-indigo-filled: var(--mantine-color-indigo-8);
469
+ --mantine-color-indigo-filled-hover: var(--mantine-color-indigo-9);
470
+ --mantine-color-indigo-light: rgba(76, 110, 245, 0.15);
471
+ --mantine-color-indigo-light-hover: rgba(76, 110, 245, 0.2);
472
+ --mantine-color-indigo-light-color: var(--mantine-color-indigo-3);
473
+ --mantine-color-indigo-outline: var(--mantine-color-indigo-4);
474
+ --mantine-color-indigo-outline-hover: rgba(116, 143, 252, 0.05);
475
+ --mantine-color-blue-text: var(--mantine-color-blue-4);
476
+ --mantine-color-blue-filled: var(--mantine-color-blue-8);
477
+ --mantine-color-blue-filled-hover: var(--mantine-color-blue-9);
478
+ --mantine-color-blue-light: rgba(34, 139, 230, 0.15);
479
+ --mantine-color-blue-light-hover: rgba(34, 139, 230, 0.2);
480
+ --mantine-color-blue-light-color: var(--mantine-color-blue-3);
481
+ --mantine-color-blue-outline: var(--mantine-color-blue-4);
482
+ --mantine-color-blue-outline-hover: rgba(77, 171, 247, 0.05);
483
+ --mantine-color-cyan-text: var(--mantine-color-cyan-4);
484
+ --mantine-color-cyan-filled: var(--mantine-color-cyan-8);
485
+ --mantine-color-cyan-filled-hover: var(--mantine-color-cyan-9);
486
+ --mantine-color-cyan-light: rgba(21, 170, 191, 0.15);
487
+ --mantine-color-cyan-light-hover: rgba(21, 170, 191, 0.2);
488
+ --mantine-color-cyan-light-color: var(--mantine-color-cyan-3);
489
+ --mantine-color-cyan-outline: var(--mantine-color-cyan-4);
490
+ --mantine-color-cyan-outline-hover: rgba(59, 201, 219, 0.05);
491
+ --mantine-color-teal-text: var(--mantine-color-teal-4);
492
+ --mantine-color-teal-filled: var(--mantine-color-teal-8);
493
+ --mantine-color-teal-filled-hover: var(--mantine-color-teal-9);
494
+ --mantine-color-teal-light: rgba(18, 184, 134, 0.15);
495
+ --mantine-color-teal-light-hover: rgba(18, 184, 134, 0.2);
496
+ --mantine-color-teal-light-color: var(--mantine-color-teal-3);
497
+ --mantine-color-teal-outline: var(--mantine-color-teal-4);
498
+ --mantine-color-teal-outline-hover: rgba(56, 217, 169, 0.05);
499
+ --mantine-color-green-text: var(--mantine-color-green-4);
500
+ --mantine-color-green-filled: var(--mantine-color-green-8);
501
+ --mantine-color-green-filled-hover: var(--mantine-color-green-9);
502
+ --mantine-color-green-light: rgba(64, 192, 87, 0.15);
503
+ --mantine-color-green-light-hover: rgba(64, 192, 87, 0.2);
504
+ --mantine-color-green-light-color: var(--mantine-color-green-3);
505
+ --mantine-color-green-outline: var(--mantine-color-green-4);
506
+ --mantine-color-green-outline-hover: rgba(105, 219, 124, 0.05);
507
+ --mantine-color-lime-text: var(--mantine-color-lime-4);
508
+ --mantine-color-lime-filled: var(--mantine-color-lime-8);
509
+ --mantine-color-lime-filled-hover: var(--mantine-color-lime-9);
510
+ --mantine-color-lime-light: rgba(130, 201, 30, 0.15);
511
+ --mantine-color-lime-light-hover: rgba(130, 201, 30, 0.2);
512
+ --mantine-color-lime-light-color: var(--mantine-color-lime-3);
513
+ --mantine-color-lime-outline: var(--mantine-color-lime-4);
514
+ --mantine-color-lime-outline-hover: rgba(169, 227, 75, 0.05);
515
+ --mantine-color-yellow-text: var(--mantine-color-yellow-4);
516
+ --mantine-color-yellow-filled: var(--mantine-color-yellow-8);
517
+ --mantine-color-yellow-filled-hover: var(--mantine-color-yellow-9);
518
+ --mantine-color-yellow-light: rgba(250, 176, 5, 0.15);
519
+ --mantine-color-yellow-light-hover: rgba(250, 176, 5, 0.2);
520
+ --mantine-color-yellow-light-color: var(--mantine-color-yellow-3);
521
+ --mantine-color-yellow-outline: var(--mantine-color-yellow-4);
522
+ --mantine-color-yellow-outline-hover: rgba(255, 212, 59, 0.05);
523
+ --mantine-color-orange-text: var(--mantine-color-orange-4);
524
+ --mantine-color-orange-filled: var(--mantine-color-orange-8);
525
+ --mantine-color-orange-filled-hover: var(--mantine-color-orange-9);
526
+ --mantine-color-orange-light: rgba(253, 126, 20, 0.15);
527
+ --mantine-color-orange-light-hover: rgba(253, 126, 20, 0.2);
528
+ --mantine-color-orange-light-color: var(--mantine-color-orange-3);
529
+ --mantine-color-orange-outline: var(--mantine-color-orange-4);
530
+ --mantine-color-orange-outline-hover: rgba(255, 169, 77, 0.05);
139
531
  }
140
532
 
141
- .bn-mantine[dir="rtl"] .mantine-rotate-rtl {
142
- transform: rotate(180deg);
533
+ .bn-mantine[data-mantine-color-scheme="light"] {
534
+ --mantine-color-scheme: light;
535
+ --mantine-primary-color-contrast: var(--mantine-color-white);
536
+ --mantine-color-bright: var(--mantine-color-black);
537
+ --mantine-color-text: #000;
538
+ --mantine-color-body: #fff;
539
+ --mantine-color-error: var(--mantine-color-red-6);
540
+ --mantine-color-placeholder: var(--mantine-color-gray-5);
541
+ --mantine-color-anchor: var(--mantine-color-blue-6);
542
+ --mantine-color-default: var(--mantine-color-white);
543
+ --mantine-color-default-hover: var(--mantine-color-gray-0);
544
+ --mantine-color-default-color: var(--mantine-color-black);
545
+ --mantine-color-default-border: var(--mantine-color-gray-4);
546
+ --mantine-color-dimmed: var(--mantine-color-gray-6);
547
+ --mantine-color-disabled: var(--mantine-color-gray-2);
548
+ --mantine-color-disabled-color: var(--mantine-color-gray-5);
549
+ --mantine-color-disabled-border: var(--mantine-color-gray-3);
550
+ --mantine-color-dark-text: var(--mantine-color-dark-filled);
551
+ --mantine-color-dark-filled: var(--mantine-color-dark-6);
552
+ --mantine-color-dark-filled-hover: var(--mantine-color-dark-7);
553
+ --mantine-color-dark-light: rgba(46, 46, 46, 0.1);
554
+ --mantine-color-dark-light-hover: rgba(46, 46, 46, 0.12);
555
+ --mantine-color-dark-light-color: var(--mantine-color-dark-6);
556
+ --mantine-color-dark-outline: var(--mantine-color-dark-6);
557
+ --mantine-color-dark-outline-hover: rgba(46, 46, 46, 0.05);
558
+ --mantine-color-gray-text: var(--mantine-color-gray-filled);
559
+ --mantine-color-gray-filled: var(--mantine-color-gray-6);
560
+ --mantine-color-gray-filled-hover: var(--mantine-color-gray-7);
561
+ --mantine-color-gray-light: rgba(134, 142, 150, 0.1);
562
+ --mantine-color-gray-light-hover: rgba(134, 142, 150, 0.12);
563
+ --mantine-color-gray-light-color: var(--mantine-color-gray-6);
564
+ --mantine-color-gray-outline: var(--mantine-color-gray-6);
565
+ --mantine-color-gray-outline-hover: rgba(134, 142, 150, 0.05);
566
+ --mantine-color-red-text: var(--mantine-color-red-filled);
567
+ --mantine-color-red-filled: var(--mantine-color-red-6);
568
+ --mantine-color-red-filled-hover: var(--mantine-color-red-7);
569
+ --mantine-color-red-light: rgba(250, 82, 82, 0.1);
570
+ --mantine-color-red-light-hover: rgba(250, 82, 82, 0.12);
571
+ --mantine-color-red-light-color: var(--mantine-color-red-6);
572
+ --mantine-color-red-outline: var(--mantine-color-red-6);
573
+ --mantine-color-red-outline-hover: rgba(250, 82, 82, 0.05);
574
+ --mantine-color-pink-text: var(--mantine-color-pink-filled);
575
+ --mantine-color-pink-filled: var(--mantine-color-pink-6);
576
+ --mantine-color-pink-filled-hover: var(--mantine-color-pink-7);
577
+ --mantine-color-pink-light: rgba(230, 73, 128, 0.1);
578
+ --mantine-color-pink-light-hover: rgba(230, 73, 128, 0.12);
579
+ --mantine-color-pink-light-color: var(--mantine-color-pink-6);
580
+ --mantine-color-pink-outline: var(--mantine-color-pink-6);
581
+ --mantine-color-pink-outline-hover: rgba(230, 73, 128, 0.05);
582
+ --mantine-color-grape-text: var(--mantine-color-grape-filled);
583
+ --mantine-color-grape-filled: var(--mantine-color-grape-6);
584
+ --mantine-color-grape-filled-hover: var(--mantine-color-grape-7);
585
+ --mantine-color-grape-light: rgba(190, 75, 219, 0.1);
586
+ --mantine-color-grape-light-hover: rgba(190, 75, 219, 0.12);
587
+ --mantine-color-grape-light-color: var(--mantine-color-grape-6);
588
+ --mantine-color-grape-outline: var(--mantine-color-grape-6);
589
+ --mantine-color-grape-outline-hover: rgba(190, 75, 219, 0.05);
590
+ --mantine-color-violet-text: var(--mantine-color-violet-filled);
591
+ --mantine-color-violet-filled: var(--mantine-color-violet-6);
592
+ --mantine-color-violet-filled-hover: var(--mantine-color-violet-7);
593
+ --mantine-color-violet-light: rgba(121, 80, 242, 0.1);
594
+ --mantine-color-violet-light-hover: rgba(121, 80, 242, 0.12);
595
+ --mantine-color-violet-light-color: var(--mantine-color-violet-6);
596
+ --mantine-color-violet-outline: var(--mantine-color-violet-6);
597
+ --mantine-color-violet-outline-hover: rgba(121, 80, 242, 0.05);
598
+ --mantine-color-indigo-text: var(--mantine-color-indigo-filled);
599
+ --mantine-color-indigo-filled: var(--mantine-color-indigo-6);
600
+ --mantine-color-indigo-filled-hover: var(--mantine-color-indigo-7);
601
+ --mantine-color-indigo-light: rgba(76, 110, 245, 0.1);
602
+ --mantine-color-indigo-light-hover: rgba(76, 110, 245, 0.12);
603
+ --mantine-color-indigo-light-color: var(--mantine-color-indigo-6);
604
+ --mantine-color-indigo-outline: var(--mantine-color-indigo-6);
605
+ --mantine-color-indigo-outline-hover: rgba(76, 110, 245, 0.05);
606
+ --mantine-color-blue-text: var(--mantine-color-blue-filled);
607
+ --mantine-color-blue-filled: var(--mantine-color-blue-6);
608
+ --mantine-color-blue-filled-hover: var(--mantine-color-blue-7);
609
+ --mantine-color-blue-light: rgba(34, 139, 230, 0.1);
610
+ --mantine-color-blue-light-hover: rgba(34, 139, 230, 0.12);
611
+ --mantine-color-blue-light-color: var(--mantine-color-blue-6);
612
+ --mantine-color-blue-outline: var(--mantine-color-blue-6);
613
+ --mantine-color-blue-outline-hover: rgba(34, 139, 230, 0.05);
614
+ --mantine-color-cyan-text: var(--mantine-color-cyan-filled);
615
+ --mantine-color-cyan-filled: var(--mantine-color-cyan-6);
616
+ --mantine-color-cyan-filled-hover: var(--mantine-color-cyan-7);
617
+ --mantine-color-cyan-light: rgba(21, 170, 191, 0.1);
618
+ --mantine-color-cyan-light-hover: rgba(21, 170, 191, 0.12);
619
+ --mantine-color-cyan-light-color: var(--mantine-color-cyan-6);
620
+ --mantine-color-cyan-outline: var(--mantine-color-cyan-6);
621
+ --mantine-color-cyan-outline-hover: rgba(21, 170, 191, 0.05);
622
+ --mantine-color-teal-text: var(--mantine-color-teal-filled);
623
+ --mantine-color-teal-filled: var(--mantine-color-teal-6);
624
+ --mantine-color-teal-filled-hover: var(--mantine-color-teal-7);
625
+ --mantine-color-teal-light: rgba(18, 184, 134, 0.1);
626
+ --mantine-color-teal-light-hover: rgba(18, 184, 134, 0.12);
627
+ --mantine-color-teal-light-color: var(--mantine-color-teal-6);
628
+ --mantine-color-teal-outline: var(--mantine-color-teal-6);
629
+ --mantine-color-teal-outline-hover: rgba(18, 184, 134, 0.05);
630
+ --mantine-color-green-text: var(--mantine-color-green-filled);
631
+ --mantine-color-green-filled: var(--mantine-color-green-6);
632
+ --mantine-color-green-filled-hover: var(--mantine-color-green-7);
633
+ --mantine-color-green-light: rgba(64, 192, 87, 0.1);
634
+ --mantine-color-green-light-hover: rgba(64, 192, 87, 0.12);
635
+ --mantine-color-green-light-color: var(--mantine-color-green-6);
636
+ --mantine-color-green-outline: var(--mantine-color-green-6);
637
+ --mantine-color-green-outline-hover: rgba(64, 192, 87, 0.05);
638
+ --mantine-color-lime-text: var(--mantine-color-lime-filled);
639
+ --mantine-color-lime-filled: var(--mantine-color-lime-6);
640
+ --mantine-color-lime-filled-hover: var(--mantine-color-lime-7);
641
+ --mantine-color-lime-light: rgba(130, 201, 30, 0.1);
642
+ --mantine-color-lime-light-hover: rgba(130, 201, 30, 0.12);
643
+ --mantine-color-lime-light-color: var(--mantine-color-lime-6);
644
+ --mantine-color-lime-outline: var(--mantine-color-lime-6);
645
+ --mantine-color-lime-outline-hover: rgba(130, 201, 30, 0.05);
646
+ --mantine-color-yellow-text: var(--mantine-color-yellow-filled);
647
+ --mantine-color-yellow-filled: var(--mantine-color-yellow-6);
648
+ --mantine-color-yellow-filled-hover: var(--mantine-color-yellow-7);
649
+ --mantine-color-yellow-light: rgba(250, 176, 5, 0.1);
650
+ --mantine-color-yellow-light-hover: rgba(250, 176, 5, 0.12);
651
+ --mantine-color-yellow-light-color: var(--mantine-color-yellow-6);
652
+ --mantine-color-yellow-outline: var(--mantine-color-yellow-6);
653
+ --mantine-color-yellow-outline-hover: rgba(250, 176, 5, 0.05);
654
+ --mantine-color-orange-text: var(--mantine-color-orange-filled);
655
+ --mantine-color-orange-filled: var(--mantine-color-orange-6);
656
+ --mantine-color-orange-filled-hover: var(--mantine-color-orange-7);
657
+ --mantine-color-orange-light: rgba(253, 126, 20, 0.1);
658
+ --mantine-color-orange-light-hover: rgba(253, 126, 20, 0.12);
659
+ --mantine-color-orange-light-color: var(--mantine-color-orange-6);
660
+ --mantine-color-orange-outline: var(--mantine-color-orange-6);
661
+ --mantine-color-orange-outline-hover: rgba(253, 126, 20, 0.05);
143
662
  }