@mantine/core 7.14.0 → 7.14.2-alpha.0

package/lib/components/FileInput/FileInput.d.ts

@@ -1,6 +1,7 @@
 import { BoxProps, ElementProps, Factory, StylesApiProps } from '../../core';
 import { __BaseInputProps, __InputStylesNames, InputVariant } from '../Input';
 export interface FileInputProps<Multiple = false> extends BoxProps, __BaseInputProps, StylesApiProps<FileInputFactory>, ElementProps<'button', 'value' | 'defaultValue' | 'onChange' | 'placeholder'> {
+    component?: any;
     /** Called when value changes */
     onChange?: (payload: Multiple extends true ? File[] : File | null) => void;
     /** Controlled component value */

package/lib/components/Input/use-input-props.d.ts

@@ -8,7 +8,7 @@ interface BaseProps extends __BaseInputProps, BoxProps, StylesApiProps<{
     __stylesApiProps?: Record<string, any>;
     id?: string;
 }
-export declare function useInputProps<T extends BaseProps, U extends Partial<T>>(component: string, defaultProps: U, _props: T): Omit<T & { [Key in Extract<keyof T, never>]-?: {}[Key] | NonNullable<T[Key]>; }, "label" | "style" | "size" | "styles" | "className" | "id" | "vars" | "variant" | "unstyled" | "classNames" | "required" | "mod" | "error" | "description" | "__staticSelector" | "__stylesApiProps" | "withAsterisk" | "labelProps" | "descriptionProps" | "errorProps" | "inputContainer" | "inputWrapperOrder" | "wrapperProps"> & {
+export declare function useInputProps<T extends BaseProps, U extends Partial<T>>(component: string, defaultProps: U, _props: T): Omit<T & { [Key in Extract<keyof T, never>]-?: {}[Key] | NonNullable<T[Key]>; }, "style" | "label" | "className" | "id" | "mod" | "unstyled" | "variant" | "classNames" | "styles" | "vars" | "size" | "required" | "wrapperProps" | "description" | "error" | "withAsterisk" | "labelProps" | "descriptionProps" | "errorProps" | "inputContainer" | "inputWrapperOrder" | "__staticSelector" | "__stylesApiProps"> & {
     classNames: Partial<Record<string, string>> | ((theme: import("../../core").MantineTheme, props: any, ctx: unknown) => Partial<Record<string, string>>) | undefined;
     styles: Partial<Record<string, import("../../core").CSSProperties>> | ((theme: import("../../core").MantineTheme, props: any, ctx: unknown) => Partial<Record<string, import("../../core").CSSProperties>>) | undefined;
     unstyled: boolean | undefined;
@@ -26,10 +26,10 @@ export declare function useInputProps<T extends BaseProps, U extends Partial<T>>
         descriptionProps: Record<string, any> | undefined;
         unstyled: boolean | undefined;
         styles: Partial<Record<string, import("../../core").CSSProperties>> | ((theme: import("../../core").MantineTheme, props: any, ctx: unknown) => Partial<Record<string, import("../../core").CSSProperties>>) | undefined;
-        size: (string & {}) | import("../../core").MantineSize | undefined;
+        size: import("../../core").MantineSize | (string & {}) | undefined;
         style: import("../../core").MantineStyleProp;
         inputContainer: ((children: React.ReactNode) => React.ReactNode) | undefined;
-        inputWrapperOrder: ("input" | "label" | "error" | "description")[] | undefined;
+        inputWrapperOrder: ("input" | "label" | "description" | "error")[] | undefined;
         withAsterisk: boolean | undefined;
         variant: string | undefined;
         id: string | undefined;
@@ -40,7 +40,7 @@ export declare function useInputProps<T extends BaseProps, U extends Partial<T>>
         classNames: Partial<Record<string, string>> | ((theme: import("../../core").MantineTheme, props: any, ctx: unknown) => Partial<Record<string, string>>) | undefined;
         styles: Partial<Record<string, import("../../core").CSSProperties>> | ((theme: import("../../core").MantineTheme, props: any, ctx: unknown) => Partial<Record<string, import("../../core").CSSProperties>>) | undefined;
         unstyled: boolean | undefined;
-        size: (string & {}) | import("../../core").MantineSize | undefined;
+        size: import("../../core").MantineSize | (string & {}) | undefined;
         __staticSelector: string | undefined;
         __stylesApiProps: Record<string, any>;
         error: import("react").ReactNode;

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

@@ -44,6 +44,7 @@ interface PopoverContext {
     variant: string | undefined;
     keepMounted: boolean | undefined;
     getStyles: GetStylesApi<PopoverFactory>;
+    resolvedStyles: Record<string, any>;
     floatingStrategy: FloatingStrategy | undefined;
 }
 export declare const PopoverContextProvider: ({ children, value }: {

package/lib/components/RingProgress/RingProgress.d.ts

@@ -6,7 +6,7 @@ interface RingProgressSection extends React.ComponentPropsWithRef<'circle'> {
 }
 export type RingProgressStylesNames = 'root' | 'svg' | 'label' | 'curve';
 export type RingProgressCssVariables = {
-    root: '--rp-size' | '--rp-label-offset';
+    root: '--rp-size' | '--rp-label-offset' | '--rp-transition-duration';
 };
 export interface RingProgressProps extends BoxProps, StylesApiProps<RingProgressFactory>, ElementProps<'div'> {
     /** Label displayed in the center of the ring */
@@ -21,6 +21,8 @@ export interface RingProgressProps extends BoxProps, StylesApiProps<RingProgress
     sections: RingProgressSection[];
     /** Color of the root section, key of theme.colors or CSS color value */
     rootColor?: MantineColor;
+    /** Transition duration of filled section styles changes in ms, `0` by default */
+    transitionDuration?: number;
 }
 export type RingProgressFactory = Factory<{
     props: RingProgressProps;

package/lib/core/Box/Box.d.ts

@@ -32,7 +32,7 @@ export interface BoxComponentProps extends BoxProps {
 }
 export declare const Box: (<C = "div">(props: import("../factory").PolymorphicComponentProps<C, BoxComponentProps>) => React.ReactElement) & Omit<import("react").FunctionComponent<(BoxComponentProps & {
     component?: any;
-} & Omit<Omit<any, "ref">, "component" | keyof BoxComponentProps> & {
+} & Omit<Omit<any, "ref">, keyof BoxComponentProps | "component"> & {
     ref?: any;
     renderRoot?: (props: any) => any;
 }) | (BoxComponentProps & {

package/lib/core/MantineProvider/color-functions/get-contrast-color/get-contrast-color.d.ts

@@ -4,6 +4,6 @@ interface GetContrastColorInput {
     theme: MantineTheme;
     autoContrast?: boolean | undefined | null;
 }
-export declare function getContrastColor({ color, theme, autoContrast }: GetContrastColorInput): "var(--mantine-color-black)" | "var(--mantine-color-white)";
-export declare function getPrimaryContrastColor(theme: MantineTheme, colorScheme: 'light' | 'dark'): "var(--mantine-color-black)" | "var(--mantine-color-white)";
+export declare function getContrastColor({ color, theme, autoContrast }: GetContrastColorInput): "var(--mantine-color-white)" | "var(--mantine-color-black)";
+export declare function getPrimaryContrastColor(theme: MantineTheme, colorScheme: 'light' | 'dark'): "var(--mantine-color-white)" | "var(--mantine-color-black)";
 export {};

package/lib/core/types.d.ts

@@ -0,0 +1,3 @@
+export interface DataAttributes {
+    [key: `data-${string}`]: string | number | undefined;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mantine/core",
-  "version": "7.14.0",
+  "version": "7.14.2-alpha.0",
   "description": "React components library focused on usability, accessibility and developer experience",
   "homepage": "https://mantine.dev/",
   "license": "MIT",
@@ -43,7 +43,7 @@
     "directory": "packages/@mantine/core"
   },
   "peerDependencies": {
-    "@mantine/hooks": "7.14.0",
+    "@mantine/hooks": "7.14.2-alpha.0",
     "react": "^18.x || ^19.x",
     "react-dom": "^18.x || ^19.x"
   },

package/styles/RingProgress.css

@@ -4,6 +4,7 @@
   height: var(--rp-size);
   min-width: var(--rp-size);
   min-height: var(--rp-size);
+  --rp-transition-duration: 0ms;
 }
 
 .m_d43b5134 {
@@ -16,6 +17,10 @@
 
 .m_b1ca1fbf {
   stroke: var(--curve-color, var(--rp-curve-root-color));
+  transition:
+    stroke-dashoffset var(--rp-transition-duration) ease,
+    stroke-dasharray var(--rp-transition-duration) ease,
+    stroke var(--rp-transition-duration);
 }
 
 [data-mantine-color-scheme='light'] .m_b1ca1fbf {

package/styles/RingProgress.layer.css

@@ -4,6 +4,7 @@
   height: var(--rp-size);
   min-width: var(--rp-size);
   min-height: var(--rp-size);
+  --rp-transition-duration: 0ms;
 }
 
 .m_d43b5134 {
@@ -16,6 +17,10 @@
 
 .m_b1ca1fbf {
   stroke: var(--curve-color, var(--rp-curve-root-color));
+  transition:
+    stroke-dashoffset var(--rp-transition-duration) ease,
+    stroke-dasharray var(--rp-transition-duration) ease,
+    stroke var(--rp-transition-duration);
 }
 
 [data-mantine-color-scheme='light'] .m_b1ca1fbf {

package/styles/baseline.css

@@ -0,0 +1,36 @@
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+input,
+button,
+textarea,
+select {
+  font: inherit;
+}
+
+button,
+select {
+  text-transform: none;
+}
+
+body {
+  margin: 0;
+  font-family: var(--mantine-font-family);
+  font-size: var(--mantine-font-size-md);
+  line-height: var(--mantine-line-height);
+  background-color: var(--mantine-color-body);
+  color: var(--mantine-color-text);
+
+  -webkit-font-smoothing: var(--mantine-webkit-font-smoothing);
+  -moz-osx-font-smoothing: var(--mantine-moz-font-smoothing);
+}
+
+@media screen and (max-device-width: 31.25em) {
+
+body {
+    -webkit-text-size-adjust: 100%
+}
+  }

package/styles/baseline.layer.css

@@ -0,0 +1,37 @@
+@layer mantine {*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+input,
+button,
+textarea,
+select {
+  font: inherit;
+}
+
+button,
+select {
+  text-transform: none;
+}
+
+body {
+  margin: 0;
+  font-family: var(--mantine-font-family);
+  font-size: var(--mantine-font-size-md);
+  line-height: var(--mantine-line-height);
+  background-color: var(--mantine-color-body);
+  color: var(--mantine-color-text);
+
+  -webkit-font-smoothing: var(--mantine-webkit-font-smoothing);
+  -moz-osx-font-smoothing: var(--mantine-moz-font-smoothing);
+}
+
+@media screen and (max-device-width: 31.25em) {
+
+body {
+    -webkit-text-size-adjust: 100%
+}
+  }
+}