@mantine/spotlight 8.3.13 → 9.0.0-alpha.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.
- package/cjs/Spotlight.cjs +2 -2
- package/cjs/Spotlight.cjs.map +1 -1
- package/cjs/SpotlightAction.cjs +1 -2
- package/cjs/SpotlightAction.cjs.map +1 -1
- package/cjs/SpotlightActionsGroup.cjs +1 -2
- package/cjs/SpotlightActionsGroup.cjs.map +1 -1
- package/cjs/SpotlightActionsList.cjs +1 -2
- package/cjs/SpotlightActionsList.cjs.map +1 -1
- package/cjs/SpotlightEmpty.cjs +2 -9
- package/cjs/SpotlightEmpty.cjs.map +1 -1
- package/cjs/SpotlightFooter.cjs +2 -9
- package/cjs/SpotlightFooter.cjs.map +1 -1
- package/cjs/SpotlightRoot.cjs +9 -10
- package/cjs/SpotlightRoot.cjs.map +1 -1
- package/cjs/SpotlightSearch.cjs +3 -3
- package/cjs/SpotlightSearch.cjs.map +1 -1
- package/esm/Spotlight.mjs +2 -2
- package/esm/Spotlight.mjs.map +1 -1
- package/esm/SpotlightAction.mjs +1 -2
- package/esm/SpotlightAction.mjs.map +1 -1
- package/esm/SpotlightActionsGroup.mjs +1 -2
- package/esm/SpotlightActionsGroup.mjs.map +1 -1
- package/esm/SpotlightActionsList.mjs +1 -2
- package/esm/SpotlightActionsList.mjs.map +1 -1
- package/esm/SpotlightEmpty.mjs +2 -9
- package/esm/SpotlightEmpty.mjs.map +1 -1
- package/esm/SpotlightFooter.mjs +2 -9
- package/esm/SpotlightFooter.mjs.map +1 -1
- package/esm/SpotlightRoot.mjs +10 -11
- package/esm/SpotlightRoot.mjs.map +1 -1
- package/esm/SpotlightSearch.mjs +3 -3
- package/esm/SpotlightSearch.mjs.map +1 -1
- package/lib/Spotlight.context.d.ts +1 -4
- package/lib/Spotlight.d.ts +2 -2
- package/lib/SpotlightAction.d.ts +3 -3
- package/lib/SpotlightRoot.d.ts +7 -7
- package/lib/index.d.mts +45 -8
- package/lib/index.d.ts +45 -8
- package/package.json +6 -6
- package/styles.css +2 -1
- package/styles.layer.css +2 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SpotlightSearch.mjs","sources":["../src/SpotlightSearch.tsx"],"sourcesContent":["import { useState } from 'react';\nimport {\n BoxProps,\n CompoundStylesApiProps,\n ElementProps,\n factory,\n Factory,\n Input,\n InputProps,\n InputStylesNames,\n useProps,\n} from '@mantine/core';\nimport { useSpotlightContext } from './Spotlight.context';\nimport classes from './Spotlight.module.css';\nimport { spotlightActions } from './spotlight.store';\n\nexport type SpotlightSearchStylesNames = InputStylesNames;\n\nexport interface SpotlightSearchProps\n extends
|
|
1
|
+
{"version":3,"file":"SpotlightSearch.mjs","sources":["../src/SpotlightSearch.tsx"],"sourcesContent":["import { useState } from 'react';\nimport {\n BoxProps,\n CompoundStylesApiProps,\n ElementProps,\n factory,\n Factory,\n Input,\n InputProps,\n InputStylesNames,\n useProps,\n} from '@mantine/core';\nimport { useSpotlightContext } from './Spotlight.context';\nimport classes from './Spotlight.module.css';\nimport { spotlightActions } from './spotlight.store';\n\nexport type SpotlightSearchStylesNames = InputStylesNames;\n\nexport interface SpotlightSearchProps\n extends\n BoxProps,\n Omit<InputProps, 'classNames' | 'styles' | 'vars' | 'variant'>,\n CompoundStylesApiProps<SpotlightSearchFactory>,\n ElementProps<'input', 'size'> {}\n\nexport type SpotlightSearchFactory = Factory<{\n props: SpotlightSearchProps;\n ref: HTMLInputElement;\n stylesNames: SpotlightSearchStylesNames;\n compound: true;\n}>;\n\nconst defaultProps = {\n size: 'lg',\n} satisfies Partial<SpotlightSearchProps>;\n\nexport const SpotlightSearch = factory<SpotlightSearchFactory>((props) => {\n const { classNames, styles, onKeyDown, onChange, vars, value, attributes, ...others } = useProps(\n 'SpotlightSearch',\n defaultProps,\n props\n );\n const ctx = useSpotlightContext();\n const inputStyles = ctx.getStyles('search');\n const [isComposing, setIsComposing] = useState(false); // IME\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n onKeyDown?.(event);\n if (isComposing) {\n return;\n }\n\n if (event.nativeEvent.code === 'ArrowDown') {\n event.preventDefault();\n spotlightActions.selectNextAction(ctx.store);\n }\n\n if (event.nativeEvent.code === 'ArrowUp') {\n event.preventDefault();\n spotlightActions.selectPreviousAction(ctx.store);\n }\n\n if (event.nativeEvent.code === 'Enter' || event.nativeEvent.code === 'NumpadEnter') {\n event.preventDefault();\n spotlightActions.triggerSelectedAction(ctx.store);\n }\n };\n\n return (\n <Input\n {...inputStyles}\n classNames={[{ input: inputStyles.className }, classNames] as any}\n styles={[{ input: inputStyles.style }, styles] as any}\n {...others}\n value={value ?? ctx.query}\n onChange={(event) => {\n ctx.setQuery(event.currentTarget.value);\n onChange?.(event);\n }}\n onKeyDown={handleKeyDown}\n onCompositionStart={() => setIsComposing(true)}\n onCompositionEnd={() => setIsComposing(false)}\n />\n );\n});\n\nSpotlightSearch.classes = classes;\nSpotlightSearch.displayName = '@mantine/spotlight/SpotlightSearch';\n"],"names":[],"mappings":"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"}
|
|
@@ -8,8 +8,5 @@ interface SpotlightContextValue {
|
|
|
8
8
|
store: SpotlightStore;
|
|
9
9
|
closeOnActionTrigger: boolean | undefined;
|
|
10
10
|
}
|
|
11
|
-
export declare const SpotlightProvider: (
|
|
12
|
-
value: SpotlightContextValue;
|
|
13
|
-
children: React.ReactNode;
|
|
14
|
-
}) => import("react/jsx-runtime").JSX.Element, useSpotlightContext: () => SpotlightContextValue;
|
|
11
|
+
export declare const SpotlightProvider: import("react").Context<SpotlightContextValue | null>, useSpotlightContext: () => SpotlightContextValue;
|
|
15
12
|
export {};
|
package/lib/Spotlight.d.ts
CHANGED
|
@@ -27,9 +27,9 @@ export interface SpotlightProps extends SpotlightRootProps {
|
|
|
27
27
|
filter?: SpotlightFilterFunction;
|
|
28
28
|
/** Message displayed when none of the actions match given `filter` */
|
|
29
29
|
nothingFound?: React.ReactNode;
|
|
30
|
-
/** Determines whether search query should be highlighted in action label @default
|
|
30
|
+
/** Determines whether search query should be highlighted in action label @default false */
|
|
31
31
|
highlightQuery?: boolean;
|
|
32
|
-
/** Maximum number of actions displayed at a time @default
|
|
32
|
+
/** Maximum number of actions displayed at a time @default Infinity */
|
|
33
33
|
limit?: number;
|
|
34
34
|
/** Props passed down to the `ScrollArea` component */
|
|
35
35
|
scrollAreaProps?: Partial<ScrollAreaAutosizeProps>;
|
package/lib/SpotlightAction.d.ts
CHANGED
|
@@ -11,11 +11,11 @@ export interface SpotlightActionProps extends BoxProps, CompoundStylesApiProps<S
|
|
|
11
11
|
rightSection?: React.ReactNode;
|
|
12
12
|
/** Children override default action elements, if passed, label, description and sections are hidden */
|
|
13
13
|
children?: React.ReactNode;
|
|
14
|
-
/** Determines whether left and right sections should have dimmed styles @default
|
|
14
|
+
/** Determines whether left and right sections should have dimmed styles @default true */
|
|
15
15
|
dimmedSections?: boolean;
|
|
16
|
-
/** Determines whether search query should be highlighted in action label @default
|
|
16
|
+
/** Determines whether search query should be highlighted in action label @default false */
|
|
17
17
|
highlightQuery?: boolean;
|
|
18
|
-
/** Key of `theme.colors` of any valid CSS color that will be used to highlight search query @default
|
|
18
|
+
/** Key of `theme.colors` of any valid CSS color that will be used to highlight search query @default 'yellow' */
|
|
19
19
|
highlightColor?: MantineColor;
|
|
20
20
|
/** Determines whether the spotlight should be closed when action is triggered, overrides `closeOnActionTrigger` prop set on `Spotlight` */
|
|
21
21
|
closeSpotlightOnTrigger?: boolean;
|
package/lib/SpotlightRoot.d.ts
CHANGED
|
@@ -8,13 +8,13 @@ export interface SpotlightRootProps extends StylesApiProps<SpotlightRootFactory>
|
|
|
8
8
|
query?: string;
|
|
9
9
|
/** Called when query changes */
|
|
10
10
|
onQueryChange?: (query: string) => void;
|
|
11
|
-
/** Determines whether the search query should be cleared when the spotlight is closed @default
|
|
11
|
+
/** Determines whether the search query should be cleared when the spotlight is closed @default true */
|
|
12
12
|
clearQueryOnClose?: boolean;
|
|
13
|
-
/** Keyboard shortcut or a list of shortcuts to trigger spotlight @default
|
|
13
|
+
/** Keyboard shortcut or a list of shortcuts to trigger spotlight @default 'mod + K' */
|
|
14
14
|
shortcut?: string | string[] | null;
|
|
15
|
-
/** A list of tags which when focused will be ignored by shortcut @default
|
|
15
|
+
/** A list of tags which when focused will be ignored by shortcut @default ['input', 'textarea', 'select'] */
|
|
16
16
|
tagsToIgnore?: string[];
|
|
17
|
-
/** Determines whether shortcut should trigger based in contentEditable @default
|
|
17
|
+
/** Determines whether shortcut should trigger based in contentEditable @default false */
|
|
18
18
|
triggerOnContentEditable?: boolean;
|
|
19
19
|
/** If set, spotlight will not be rendered */
|
|
20
20
|
disabled?: boolean;
|
|
@@ -24,11 +24,11 @@ export interface SpotlightRootProps extends StylesApiProps<SpotlightRootFactory>
|
|
|
24
24
|
onSpotlightClose?: () => void;
|
|
25
25
|
/** Forces opened state, useful for tests */
|
|
26
26
|
forceOpened?: boolean;
|
|
27
|
-
/** Determines whether spotlight should be closed when one of the actions is triggered @default
|
|
27
|
+
/** Determines whether spotlight should be closed when one of the actions is triggered @default true */
|
|
28
28
|
closeOnActionTrigger?: boolean;
|
|
29
|
-
/** Spotlight content max-height. Ignored unless `scrollable` prop is set. @default
|
|
29
|
+
/** Spotlight content max-height. Ignored unless `scrollable` prop is set. @default 400 */
|
|
30
30
|
maxHeight?: React.CSSProperties['maxHeight'];
|
|
31
|
-
/** Determines whether the actions list should be scrollable. If not set, `maxHeight` is ignored @default
|
|
31
|
+
/** Determines whether the actions list should be scrollable. If not set, `maxHeight` is ignored @default false */
|
|
32
32
|
scrollable?: boolean;
|
|
33
33
|
}
|
|
34
34
|
export type SpotlightRootFactory = Factory<{
|
package/lib/index.d.mts
CHANGED
|
@@ -1,3 +1,11 @@
|
|
|
1
|
+
import type { SpotlightActionData, SpotlightActionGroupData, SpotlightFactory, SpotlightFilterFunction, SpotlightProps, SpotlightStylesNames } from './Spotlight';
|
|
2
|
+
import type { SpotlightActionProps, SpotlightActionStylesNames } from './SpotlightAction';
|
|
3
|
+
import type { SpotlightActionsGroupProps, SpotlightActionsGroupStylesNames } from './SpotlightActionsGroup';
|
|
4
|
+
import type { SpotlightActionsListProps, SpotlightActionsListStylesNames } from './SpotlightActionsList';
|
|
5
|
+
import type { SpotlightEmptyProps, SpotlightEmptyStylesNames } from './SpotlightEmpty';
|
|
6
|
+
import type { SpotlightFooterProps, SpotlightFooterStylesNames } from './SpotlightFooter';
|
|
7
|
+
import type { SpotlightRootProps, SpotlightRootStylesNames } from './SpotlightRoot';
|
|
8
|
+
import type { SpotlightSearchProps, SpotlightSearchStylesNames } from './SpotlightSearch';
|
|
1
9
|
export { spotlight, createSpotlight, createSpotlightStore, useSpotlight, openSpotlight, closeSpotlight, toggleSpotlight, } from './spotlight.store.js';
|
|
2
10
|
export type { SpotlightState, SpotlightStore } from './spotlight.store.js';
|
|
3
11
|
export { isActionsGroup } from './is-actions-group.js';
|
|
@@ -9,11 +17,40 @@ export { SpotlightActionsList } from './SpotlightActionsList.js';
|
|
|
9
17
|
export { SpotlightEmpty } from './SpotlightEmpty.js';
|
|
10
18
|
export { SpotlightFooter } from './SpotlightFooter.js';
|
|
11
19
|
export { SpotlightSearch } from './SpotlightSearch.js';
|
|
12
|
-
export type { SpotlightFactory, SpotlightFilterFunction, SpotlightActionData, SpotlightActionGroupData,
|
|
13
|
-
export
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
+
export type { SpotlightProps, SpotlightStylesNames, SpotlightFactory, SpotlightFilterFunction, SpotlightActionData, SpotlightActionGroupData, SpotlightActionProps, SpotlightActionStylesNames, SpotlightActionsGroupProps, SpotlightActionsGroupStylesNames, SpotlightActionsListProps, SpotlightActionsListStylesNames, SpotlightEmptyProps, SpotlightEmptyStylesNames, SpotlightFooterProps, SpotlightFooterStylesNames, SpotlightSearchProps, SpotlightSearchStylesNames, SpotlightRootProps, SpotlightRootStylesNames, };
|
|
21
|
+
export declare namespace Spotlight {
|
|
22
|
+
type Props = SpotlightProps;
|
|
23
|
+
type StylesNames = SpotlightStylesNames;
|
|
24
|
+
type Factory = SpotlightFactory;
|
|
25
|
+
type FilterFunction = SpotlightFilterFunction;
|
|
26
|
+
type ActionData = SpotlightActionData;
|
|
27
|
+
type ActionGroupData = SpotlightActionGroupData;
|
|
28
|
+
namespace Action {
|
|
29
|
+
type Props = SpotlightActionProps;
|
|
30
|
+
type StylesNames = SpotlightActionStylesNames;
|
|
31
|
+
}
|
|
32
|
+
namespace ActionsGroup {
|
|
33
|
+
type Props = SpotlightActionsGroupProps;
|
|
34
|
+
type StylesNames = SpotlightActionsGroupStylesNames;
|
|
35
|
+
}
|
|
36
|
+
namespace ActionsList {
|
|
37
|
+
type Props = SpotlightActionsListProps;
|
|
38
|
+
type StylesNames = SpotlightActionsListStylesNames;
|
|
39
|
+
}
|
|
40
|
+
namespace Empty {
|
|
41
|
+
type Props = SpotlightEmptyProps;
|
|
42
|
+
type StylesNames = SpotlightEmptyStylesNames;
|
|
43
|
+
}
|
|
44
|
+
namespace Footer {
|
|
45
|
+
type Props = SpotlightFooterProps;
|
|
46
|
+
type StylesNames = SpotlightFooterStylesNames;
|
|
47
|
+
}
|
|
48
|
+
namespace Search {
|
|
49
|
+
type Props = SpotlightSearchProps;
|
|
50
|
+
type StylesNames = SpotlightSearchStylesNames;
|
|
51
|
+
}
|
|
52
|
+
namespace Root {
|
|
53
|
+
type Props = SpotlightRootProps;
|
|
54
|
+
type StylesNames = SpotlightRootStylesNames;
|
|
55
|
+
}
|
|
56
|
+
}
|
package/lib/index.d.ts
CHANGED
|
@@ -1,3 +1,11 @@
|
|
|
1
|
+
import type { SpotlightActionData, SpotlightActionGroupData, SpotlightFactory, SpotlightFilterFunction, SpotlightProps, SpotlightStylesNames } from './Spotlight';
|
|
2
|
+
import type { SpotlightActionProps, SpotlightActionStylesNames } from './SpotlightAction';
|
|
3
|
+
import type { SpotlightActionsGroupProps, SpotlightActionsGroupStylesNames } from './SpotlightActionsGroup';
|
|
4
|
+
import type { SpotlightActionsListProps, SpotlightActionsListStylesNames } from './SpotlightActionsList';
|
|
5
|
+
import type { SpotlightEmptyProps, SpotlightEmptyStylesNames } from './SpotlightEmpty';
|
|
6
|
+
import type { SpotlightFooterProps, SpotlightFooterStylesNames } from './SpotlightFooter';
|
|
7
|
+
import type { SpotlightRootProps, SpotlightRootStylesNames } from './SpotlightRoot';
|
|
8
|
+
import type { SpotlightSearchProps, SpotlightSearchStylesNames } from './SpotlightSearch';
|
|
1
9
|
export { spotlight, createSpotlight, createSpotlightStore, useSpotlight, openSpotlight, closeSpotlight, toggleSpotlight, } from './spotlight.store.js';
|
|
2
10
|
export type { SpotlightState, SpotlightStore } from './spotlight.store.js';
|
|
3
11
|
export { isActionsGroup } from './is-actions-group.js';
|
|
@@ -9,11 +17,40 @@ export { SpotlightActionsList } from './SpotlightActionsList.js';
|
|
|
9
17
|
export { SpotlightEmpty } from './SpotlightEmpty.js';
|
|
10
18
|
export { SpotlightFooter } from './SpotlightFooter.js';
|
|
11
19
|
export { SpotlightSearch } from './SpotlightSearch.js';
|
|
12
|
-
export type { SpotlightFactory, SpotlightFilterFunction, SpotlightActionData, SpotlightActionGroupData,
|
|
13
|
-
export
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
+
export type { SpotlightProps, SpotlightStylesNames, SpotlightFactory, SpotlightFilterFunction, SpotlightActionData, SpotlightActionGroupData, SpotlightActionProps, SpotlightActionStylesNames, SpotlightActionsGroupProps, SpotlightActionsGroupStylesNames, SpotlightActionsListProps, SpotlightActionsListStylesNames, SpotlightEmptyProps, SpotlightEmptyStylesNames, SpotlightFooterProps, SpotlightFooterStylesNames, SpotlightSearchProps, SpotlightSearchStylesNames, SpotlightRootProps, SpotlightRootStylesNames, };
|
|
21
|
+
export declare namespace Spotlight {
|
|
22
|
+
type Props = SpotlightProps;
|
|
23
|
+
type StylesNames = SpotlightStylesNames;
|
|
24
|
+
type Factory = SpotlightFactory;
|
|
25
|
+
type FilterFunction = SpotlightFilterFunction;
|
|
26
|
+
type ActionData = SpotlightActionData;
|
|
27
|
+
type ActionGroupData = SpotlightActionGroupData;
|
|
28
|
+
namespace Action {
|
|
29
|
+
type Props = SpotlightActionProps;
|
|
30
|
+
type StylesNames = SpotlightActionStylesNames;
|
|
31
|
+
}
|
|
32
|
+
namespace ActionsGroup {
|
|
33
|
+
type Props = SpotlightActionsGroupProps;
|
|
34
|
+
type StylesNames = SpotlightActionsGroupStylesNames;
|
|
35
|
+
}
|
|
36
|
+
namespace ActionsList {
|
|
37
|
+
type Props = SpotlightActionsListProps;
|
|
38
|
+
type StylesNames = SpotlightActionsListStylesNames;
|
|
39
|
+
}
|
|
40
|
+
namespace Empty {
|
|
41
|
+
type Props = SpotlightEmptyProps;
|
|
42
|
+
type StylesNames = SpotlightEmptyStylesNames;
|
|
43
|
+
}
|
|
44
|
+
namespace Footer {
|
|
45
|
+
type Props = SpotlightFooterProps;
|
|
46
|
+
type StylesNames = SpotlightFooterStylesNames;
|
|
47
|
+
}
|
|
48
|
+
namespace Search {
|
|
49
|
+
type Props = SpotlightSearchProps;
|
|
50
|
+
type StylesNames = SpotlightSearchStylesNames;
|
|
51
|
+
}
|
|
52
|
+
namespace Root {
|
|
53
|
+
type Props = SpotlightRootProps;
|
|
54
|
+
type StylesNames = SpotlightRootStylesNames;
|
|
55
|
+
}
|
|
56
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mantine/spotlight",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "9.0.0-alpha.0",
|
|
4
4
|
"description": "Command center components for react and Mantine",
|
|
5
5
|
"homepage": "https://mantine.dev",
|
|
6
6
|
"license": "MIT",
|
|
@@ -41,19 +41,19 @@
|
|
|
41
41
|
"directory": "packages/@mantine/spotlight"
|
|
42
42
|
},
|
|
43
43
|
"peerDependencies": {
|
|
44
|
-
"@mantine/core": "
|
|
45
|
-
"@mantine/hooks": "
|
|
44
|
+
"@mantine/core": "9.0.0-alpha.0",
|
|
45
|
+
"@mantine/hooks": "9.0.0-alpha.0",
|
|
46
46
|
"react": "^18.x || ^19.x",
|
|
47
47
|
"react-dom": "^18.x || ^19.x"
|
|
48
48
|
},
|
|
49
49
|
"dependencies": {
|
|
50
|
-
"@mantine/store": "
|
|
50
|
+
"@mantine/store": "9.0.0-alpha.0"
|
|
51
51
|
},
|
|
52
52
|
"devDependencies": {
|
|
53
53
|
"@mantine-tests/core": "workspace:*",
|
|
54
54
|
"@mantine/core": "workspace:*",
|
|
55
55
|
"@mantine/hooks": "workspace:*",
|
|
56
|
-
"react": "19.
|
|
57
|
-
"react-dom": "19.
|
|
56
|
+
"react": "19.2.1",
|
|
57
|
+
"react-dom": "19.2.1"
|
|
58
58
|
}
|
|
59
59
|
}
|
package/styles.css
CHANGED
|
@@ -26,8 +26,9 @@
|
|
|
26
26
|
border-top: calc(0.0625rem * var(--mantine-scale)) solid;
|
|
27
27
|
flex: 1;
|
|
28
28
|
padding: var(--spotlight-actions-list-padding);
|
|
29
|
-
max-height: calc(
|
|
29
|
+
max-height: calc(100vh - 15rem);
|
|
30
30
|
margin-inline-end: calc(var(--spotlight-actions-list-padding) * -1);
|
|
31
|
+
width: 100%;
|
|
31
32
|
}
|
|
32
33
|
|
|
33
34
|
:where([data-mantine-color-scheme='light']) .m_6e463822 {
|
package/styles.layer.css
CHANGED
|
@@ -26,8 +26,9 @@
|
|
|
26
26
|
border-top: calc(0.0625rem * var(--mantine-scale)) solid;
|
|
27
27
|
flex: 1;
|
|
28
28
|
padding: var(--spotlight-actions-list-padding);
|
|
29
|
-
max-height: calc(
|
|
29
|
+
max-height: calc(100vh - 15rem);
|
|
30
30
|
margin-inline-end: calc(var(--spotlight-actions-list-padding) * -1);
|
|
31
|
+
width: 100%;
|
|
31
32
|
}
|
|
32
33
|
|
|
33
34
|
:where([data-mantine-color-scheme='light']) .m_6e463822 {
|