@mantine-vue/core 2.2.2 → 2.3.1

package/lib/components/Pill/Pill.d.ts

@@ -1,10 +1,11 @@
 import { type PropType } from 'vue';
+import { type MantineRadius, type MantineSize } from '../../core';
 export type PillStylesNames = 'root' | 'label' | 'remove';
 export type PillVariant = 'default' | 'contrast';
 export declare const Pill: import("../..").WithBoxProps<{
     new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("vue").ExtractPropTypes<{
         size: {
-            type: PropType<string | number>;
+            type: PropType<MantineSize>;
             default: undefined;
         };
         withRemoveButton: {
@@ -20,7 +21,7 @@ export declare const Pill: import("../..").WithBoxProps<{
             default: undefined;
         };
         radius: {
-            type: PropType<string | number>;
+            type: PropType<MantineRadius>;
             default: undefined;
         };
         disabled: {
@@ -54,8 +55,8 @@ export declare const Pill: import("../..").WithBoxProps<{
     }>> & Readonly<{}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, import("vue").PublicProps, {
-        size: string | number;
-        radius: string | number;
+        size: MantineSize;
+        radius: MantineRadius;
         variant: PillVariant;
         classNames: Function | Record<string, any>;
         styles: Function | Record<string, any>;
@@ -75,7 +76,7 @@ export declare const Pill: import("../..").WithBoxProps<{
         Defaults: {};
     }, Readonly<import("vue").ExtractPropTypes<{
         size: {
-            type: PropType<string | number>;
+            type: PropType<MantineSize>;
             default: undefined;
         };
         withRemoveButton: {
@@ -91,7 +92,7 @@ export declare const Pill: import("../..").WithBoxProps<{
             default: undefined;
         };
         radius: {
-            type: PropType<string | number>;
+            type: PropType<MantineRadius>;
             default: undefined;
         };
         disabled: {
@@ -125,8 +126,8 @@ export declare const Pill: import("../..").WithBoxProps<{
     }>> & Readonly<{}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>, {}, {}, {}, {
-        size: string | number;
-        radius: string | number;
+        size: MantineSize;
+        radius: MantineRadius;
         variant: PillVariant;
         classNames: Function | Record<string, any>;
         styles: Function | Record<string, any>;
@@ -143,7 +144,7 @@ export declare const Pill: import("../..").WithBoxProps<{
     __isSuspense?: never;
 } & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
     size: {
-        type: PropType<string | number>;
+        type: PropType<MantineSize>;
         default: undefined;
     };
     withRemoveButton: {
@@ -159,7 +160,7 @@ export declare const Pill: import("../..").WithBoxProps<{
         default: undefined;
     };
     radius: {
-        type: PropType<string | number>;
+        type: PropType<MantineRadius>;
         default: undefined;
     };
     disabled: {
@@ -193,8 +194,8 @@ export declare const Pill: import("../..").WithBoxProps<{
 }>> & Readonly<{}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
-    size: string | number;
-    radius: string | number;
+    size: MantineSize;
+    radius: MantineRadius;
     variant: PillVariant;
     classNames: Function | Record<string, any>;
     styles: Function | Record<string, any>;
@@ -210,11 +211,11 @@ export declare const Pill: import("../..").WithBoxProps<{
     varsResolver: (theme: import("../..").MantineTheme, props: any, ctx: Record<string, any>) => Record<string, Record<string, string | undefined>>;
     Group: import("../..").WithBoxProps<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
         gap: {
-            type: PropType<string | number>;
+            type: PropType<MantineSize | (string & {}) | number>;
             default: undefined;
         };
         size: {
-            type: PropType<string | number>;
+            type: PropType<MantineSize | (string & {})>;
             default: undefined;
         };
         disabled: {
@@ -241,11 +242,11 @@ export declare const Pill: import("../..").WithBoxProps<{
         [key: string]: any;
     }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
         gap: {
-            type: PropType<string | number>;
+            type: PropType<MantineSize | (string & {}) | number>;
             default: undefined;
         };
         size: {
-            type: PropType<string | number>;
+            type: PropType<MantineSize | (string & {})>;
             default: undefined;
         };
         disabled: {
@@ -269,11 +270,11 @@ export declare const Pill: import("../..").WithBoxProps<{
             default: boolean;
         };
     }>> & Readonly<{}>, {
-        size: string | number;
+        size: MantineSize | (string & {});
         classNames: Function | Record<string, any>;
         styles: Function | Record<string, any>;
         disabled: boolean;
-        gap: string | number;
+        gap: number | MantineSize | (string & {});
         vars: Function | Record<string, any>;
         unstyled: boolean;
     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>>;

package/lib/components/Pill/PillGroup/PillGroup.d.ts

@@ -1,17 +1,18 @@
 import { type PropType } from 'vue';
+import { type MantineSize } from '../../../core';
 export interface PillGroupContextValue {
-    size?: string | number;
+    size?: MantineSize | (string & {}) | number;
     disabled?: boolean;
 }
 export declare function usePillGroupContext(): PillGroupContextValue | null;
 export type PillGroupStylesNames = 'group';
 export declare const PillGroup: import("../../..").WithBoxProps<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     gap: {
-        type: PropType<string | number>;
+        type: PropType<MantineSize | (string & {}) | number>;
         default: undefined;
     };
     size: {
-        type: PropType<string | number>;
+        type: PropType<MantineSize | (string & {})>;
         default: undefined;
     };
     disabled: {
@@ -38,11 +39,11 @@ export declare const PillGroup: import("../../..").WithBoxProps<import("vue").De
     [key: string]: any;
 }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     gap: {
-        type: PropType<string | number>;
+        type: PropType<MantineSize | (string & {}) | number>;
         default: undefined;
     };
     size: {
-        type: PropType<string | number>;
+        type: PropType<MantineSize | (string & {})>;
         default: undefined;
     };
     disabled: {
@@ -66,11 +67,11 @@ export declare const PillGroup: import("../../..").WithBoxProps<import("vue").De
         default: boolean;
     };
 }>> & Readonly<{}>, {
-    size: string | number;
+    size: MantineSize | (string & {});
     classNames: Function | Record<string, any>;
     styles: Function | Record<string, any>;
     disabled: boolean;
-    gap: string | number;
+    gap: number | MantineSize | (string & {});
     vars: Function | Record<string, any>;
     unstyled: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>>;

package/lib/components/PillsInput/PillsInput.d.ts

@@ -1,5 +1,5 @@
 import { type PropType, type SlotsType, type VNodeChild } from 'vue';
-import { type MantineNode } from '../../core';
+import { type MantineNode, type MantineRadius, type MantineSize } from '../../core';
 export interface PillsInputSlots {
     default?: () => VNodeChild;
     label?: () => VNodeChild;
@@ -11,7 +11,7 @@ export interface PillsInputSlots {
 export declare const PillsInput: {
     new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("vue").ExtractPropTypes<{
         size: {
-            type: PropType<string | number>;
+            type: PropType<MantineSize | (string & {}) | number>;
             default: string;
         };
         disabled: {
@@ -71,7 +71,7 @@ export declare const PillsInput: {
             default: boolean;
         };
         radius: {
-            type: PropType<string | number>;
+            type: PropType<MantineRadius>;
             default: undefined;
         };
         mod: {
@@ -81,9 +81,9 @@ export declare const PillsInput: {
     }>> & Readonly<{}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, import("vue").PublicProps, {
-        size: string | number;
+        size: number | MantineSize | (string & {});
         label: MantineNode;
-        radius: string | number;
+        radius: MantineRadius;
         variant: "default" | "filled" | "unstyled";
         error: MantineNode;
         classNames: Function | Record<string, any>;
@@ -107,7 +107,7 @@ export declare const PillsInput: {
         Defaults: {};
     }, Readonly<import("vue").ExtractPropTypes<{
         size: {
-            type: PropType<string | number>;
+            type: PropType<MantineSize | (string & {}) | number>;
             default: string;
         };
         disabled: {
@@ -167,7 +167,7 @@ export declare const PillsInput: {
             default: boolean;
         };
         radius: {
-            type: PropType<string | number>;
+            type: PropType<MantineRadius>;
             default: undefined;
         };
         mod: {
@@ -177,9 +177,9 @@ export declare const PillsInput: {
     }>> & Readonly<{}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>, {}, {}, {}, {
-        size: string | number;
+        size: number | MantineSize | (string & {});
         label: MantineNode;
-        radius: string | number;
+        radius: MantineRadius;
         variant: "default" | "filled" | "unstyled";
         error: MantineNode;
         classNames: Function | Record<string, any>;
@@ -200,7 +200,7 @@ export declare const PillsInput: {
     __isSuspense?: never;
 } & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
     size: {
-        type: PropType<string | number>;
+        type: PropType<MantineSize | (string & {}) | number>;
         default: string;
     };
     disabled: {
@@ -260,7 +260,7 @@ export declare const PillsInput: {
         default: boolean;
     };
     radius: {
-        type: PropType<string | number>;
+        type: PropType<MantineRadius>;
         default: undefined;
     };
     mod: {
@@ -270,9 +270,9 @@ export declare const PillsInput: {
 }>> & Readonly<{}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
-    size: string | number;
+    size: number | MantineSize | (string & {});
     label: MantineNode;
-    radius: string | number;
+    radius: MantineRadius;
     variant: "default" | "filled" | "unstyled";
     error: MantineNode;
     classNames: Function | Record<string, any>;

package/lib/components/PinInput/PinInput.d.ts

@@ -1,5 +1,6 @@
 import { type PropType } from 'vue';
 import { type VueRefTarget } from '@mantine-vue/hooks';
+import { type MantineRadius, type MantineSize, type MantineSpacing } from '../../core';
 export type PinInputStylesNames = 'root' | 'pinInput' | 'input';
 export type PinInputCssVariables = {
     root: '--pin-input-size';
@@ -50,15 +51,15 @@ export declare const PinInput: import("../..").WithBoxProps<import("vue").Define
         default: undefined;
     };
     gap: {
-        type: PropType<string | number>;
+        type: PropType<MantineSpacing>;
         default: undefined;
     };
     radius: {
-        type: PropType<string | number>;
+        type: PropType<MantineRadius>;
         default: undefined;
     };
     size: {
-        type: PropType<string | number>;
+        type: PropType<MantineSize>;
         default: undefined;
     };
     autoFocus: {
@@ -181,15 +182,15 @@ export declare const PinInput: import("../..").WithBoxProps<import("vue").Define
         default: undefined;
     };
     gap: {
-        type: PropType<string | number>;
+        type: PropType<MantineSpacing>;
         default: undefined;
     };
     radius: {
-        type: PropType<string | number>;
+        type: PropType<MantineRadius>;
         default: undefined;
     };
     size: {
-        type: PropType<string | number>;
+        type: PropType<MantineSize>;
         default: undefined;
     };
     autoFocus: {
@@ -301,11 +302,11 @@ export declare const PinInput: import("../..").WithBoxProps<import("vue").Define
         default: boolean;
     };
 }>> & Readonly<{}>, {
-    size: string | number;
+    size: MantineSize;
     length: number;
     form: string;
     mask: boolean;
-    radius: string | number;
+    radius: MantineRadius;
     name: string;
     variant: string;
     type: "number" | RegExp | "alphanumeric";
@@ -317,7 +318,7 @@ export declare const PinInput: import("../..").WithBoxProps<import("vue").Define
     disabled: boolean;
     defaultValue: string;
     id: string;
-    gap: string | number;
+    gap: MantineSpacing;
     onComplete: (value: string) => void;
     vars: Function | Record<string, any>;
     unstyled: boolean;

package/lib/components/Popover/Popover.d.ts

@@ -1,3 +1,4 @@
+import { type FlipOptions, type InlineOptions, type ShiftOptions, type SizeOptions } from '@floating-ui/vue';
 import { type PropType, type VNode } from 'vue';
 import { type ArrowPosition, type FloatingAxesOffsets, type FloatingPosition, type FloatingStrategy } from '../../utils/Floating';
 export interface PopoverProps {
@@ -10,7 +11,7 @@ export interface PopoverProps {
     onOpen?: () => void;
     onClose?: () => void;
     onDismiss?: () => void;
-    width?: string | number | 'target' | null;
+    width?: PopoverWidth;
     withArrow?: boolean;
     arrowSize?: number;
     arrowOffset?: number;
@@ -28,7 +29,7 @@ export interface PopoverProps {
     transitionProps?: Record<string, any>;
     zIndex?: string | number;
     floatingStrategy?: FloatingStrategy;
-    middlewares?: Record<string, any>;
+    middlewares?: PopoverMiddlewares;
     id?: string;
     targetProps?: Record<string, any>;
     withOverlay?: boolean;
@@ -40,6 +41,13 @@ export interface PopoverProps {
     vars?: any;
     unstyled?: boolean;
 }
+export type PopoverWidth = 'target' | string | number | null;
+export interface PopoverMiddlewares {
+    shift?: boolean | ShiftOptions;
+    flip?: boolean | FlipOptions;
+    inline?: boolean | InlineOptions;
+    size?: boolean | SizeOptions;
+}
 export declare const PopoverTarget: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     refProp: {
         type: StringConstructor;

package/lib/components/Popover/index.d.ts

@@ -1,2 +1,2 @@
 export { Popover, PopoverTarget, PopoverDropdown, PopoverContextMenu } from './Popover';
-export type { PopoverProps, PopoverStylesNames, PopoverCssVariables, PopoverTargetProps, PopoverDropdownProps, PopoverContextMenuProps, } from './Popover';
+export type { PopoverProps, PopoverStylesNames, PopoverCssVariables, PopoverTargetProps, PopoverDropdownProps, PopoverContextMenuProps, PopoverMiddlewares, PopoverWidth, } from './Popover';

package/lib/components/Progress/Progress.d.ts

@@ -1,4 +1,5 @@
 import { type PropType } from 'vue';
+import { type MantineColor, type MantineRadius, type MantineSize } from '../../core';
 export type ProgressStylesNames = 'root' | 'section' | 'label';
 export declare const Progress: {
     new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("vue").ExtractPropTypes<{
@@ -7,7 +8,7 @@ export declare const Progress: {
             required: true;
         };
         color: {
-            type: StringConstructor;
+            type: PropType<MantineColor>;
             default: undefined;
         };
         striped: {
@@ -19,11 +20,11 @@ export declare const Progress: {
             default: boolean;
         };
         size: {
-            type: PropType<string | number>;
+            type: PropType<MantineSize | (string & {}) | number>;
             default: undefined;
         };
         radius: {
-            type: PropType<string | number>;
+            type: PropType<MantineRadius>;
             default: undefined;
         };
         autoContrast: {
@@ -57,10 +58,10 @@ export declare const Progress: {
     }>> & Readonly<{}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, import("vue").PublicProps, {
-        size: string | number;
+        size: number | MantineSize | (string & {});
         orientation: "vertical" | "horizontal";
-        radius: string | number;
-        color: string;
+        radius: MantineRadius;
+        color: MantineColor;
         autoContrast: boolean;
         classNames: Function | Record<string, any>;
         styles: Function | Record<string, any>;
@@ -82,7 +83,7 @@ export declare const Progress: {
             required: true;
         };
         color: {
-            type: StringConstructor;
+            type: PropType<MantineColor>;
             default: undefined;
         };
         striped: {
@@ -94,11 +95,11 @@ export declare const Progress: {
             default: boolean;
         };
         size: {
-            type: PropType<string | number>;
+            type: PropType<MantineSize | (string & {}) | number>;
             default: undefined;
         };
         radius: {
-            type: PropType<string | number>;
+            type: PropType<MantineRadius>;
             default: undefined;
         };
         autoContrast: {
@@ -132,10 +133,10 @@ export declare const Progress: {
     }>> & Readonly<{}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }>, {}, {}, {}, {
-        size: string | number;
+        size: number | MantineSize | (string & {});
         orientation: "vertical" | "horizontal";
-        radius: string | number;
-        color: string;
+        radius: MantineRadius;
+        color: MantineColor;
         autoContrast: boolean;
         classNames: Function | Record<string, any>;
         styles: Function | Record<string, any>;
@@ -154,7 +155,7 @@ export declare const Progress: {
         required: true;
     };
     color: {
-        type: StringConstructor;
+        type: PropType<MantineColor>;
         default: undefined;
     };
     striped: {
@@ -166,11 +167,11 @@ export declare const Progress: {
         default: boolean;
     };
     size: {
-        type: PropType<string | number>;
+        type: PropType<MantineSize | (string & {}) | number>;
         default: undefined;
     };
     radius: {
-        type: PropType<string | number>;
+        type: PropType<MantineRadius>;
         default: undefined;
     };
     autoContrast: {
@@ -204,10 +205,10 @@ export declare const Progress: {
 }>> & Readonly<{}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
-    size: string | number;
+    size: number | MantineSize | (string & {});
     orientation: "vertical" | "horizontal";
-    radius: string | number;
-    color: string;
+    radius: MantineRadius;
+    color: MantineColor;
     autoContrast: boolean;
     classNames: Function | Record<string, any>;
     styles: Function | Record<string, any>;
@@ -220,11 +221,11 @@ export declare const Progress: {
     classes: Record<string, string>;
     Root: import("../..").WithBoxProps<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
         size: {
-            type: PropType<string | number>;
+            type: PropType<MantineSize | (string & {}) | number>;
             default: undefined;
         };
         radius: {
-            type: PropType<string | number>;
+            type: PropType<MantineRadius>;
             default: undefined;
         };
         autoContrast: {
@@ -263,11 +264,11 @@ export declare const Progress: {
         [key: string]: any;
     }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
         size: {
-            type: PropType<string | number>;
+            type: PropType<MantineSize | (string & {}) | number>;
             default: undefined;
         };
         radius: {
-            type: PropType<string | number>;
+            type: PropType<MantineRadius>;
             default: undefined;
         };
         autoContrast: {
@@ -303,9 +304,9 @@ export declare const Progress: {
             default: boolean;
         };
     }>> & Readonly<{}>, {
-        size: string | number;
+        size: number | MantineSize | (string & {});
         orientation: "vertical" | "horizontal";
-        radius: string | number;
+        radius: MantineRadius;
         autoContrast: boolean;
         classNames: Function | Record<string, any>;
         styles: Function | Record<string, any>;
@@ -324,7 +325,7 @@ export declare const Progress: {
             default: undefined;
         };
         color: {
-            type: StringConstructor;
+            type: PropType<MantineColor>;
             default: undefined;
         };
         striped: {
@@ -363,7 +364,7 @@ export declare const Progress: {
             default: undefined;
         };
         color: {
-            type: StringConstructor;
+            type: PropType<MantineColor>;
             default: undefined;
         };
         striped: {
@@ -391,7 +392,7 @@ export declare const Progress: {
             default: undefined;
         };
     }>> & Readonly<{}>, {
-        color: string;
+        color: MantineColor;
         classNames: Function | Record<string, any>;
         styles: Function | Record<string, any>;
         mod: any;

package/lib/components/Progress/ProgressRoot/ProgressRoot.d.ts

@@ -1,12 +1,13 @@
 import { type PropType } from 'vue';
+import { type MantineRadius, type MantineSize } from '../../../core';
 export type ProgressRootStylesNames = 'root' | 'section' | 'label';
 export declare const ProgressRoot: import("../../..").WithBoxProps<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     size: {
-        type: PropType<string | number>;
+        type: PropType<MantineSize | (string & {}) | number>;
         default: undefined;
     };
     radius: {
-        type: PropType<string | number>;
+        type: PropType<MantineRadius>;
         default: undefined;
     };
     autoContrast: {
@@ -45,11 +46,11 @@ export declare const ProgressRoot: import("../../..").WithBoxProps<import("vue")
     [key: string]: any;
 }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     size: {
-        type: PropType<string | number>;
+        type: PropType<MantineSize | (string & {}) | number>;
         default: undefined;
     };
     radius: {
-        type: PropType<string | number>;
+        type: PropType<MantineRadius>;
         default: undefined;
     };
     autoContrast: {
@@ -85,9 +86,9 @@ export declare const ProgressRoot: import("../../..").WithBoxProps<import("vue")
         default: boolean;
     };
 }>> & Readonly<{}>, {
-    size: string | number;
+    size: number | MantineSize | (string & {});
     orientation: "vertical" | "horizontal";
-    radius: string | number;
+    radius: MantineRadius;
     autoContrast: boolean;
     classNames: Function | Record<string, any>;
     styles: Function | Record<string, any>;

package/lib/components/Progress/ProgressSection/ProgressSection.d.ts

@@ -1,4 +1,5 @@
 import { type PropType } from 'vue';
+import { type MantineColor } from '../../../core';
 export declare const ProgressSection: import("../../..").WithBoxProps<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     value: {
         type: NumberConstructor;
@@ -9,7 +10,7 @@ export declare const ProgressSection: import("../../..").WithBoxProps<import("vu
         default: undefined;
     };
     color: {
-        type: StringConstructor;
+        type: PropType<MantineColor>;
         default: undefined;
     };
     striped: {
@@ -48,7 +49,7 @@ export declare const ProgressSection: import("../../..").WithBoxProps<import("vu
         default: undefined;
     };
     color: {
-        type: StringConstructor;
+        type: PropType<MantineColor>;
         default: undefined;
     };
     striped: {
@@ -76,7 +77,7 @@ export declare const ProgressSection: import("../../..").WithBoxProps<import("vu
         default: undefined;
     };
 }>> & Readonly<{}>, {
-    color: string;
+    color: MantineColor;
     classNames: Function | Record<string, any>;
     styles: Function | Record<string, any>;
     mod: any;