@mantine/core 3.3.5 → 3.4.3

package/esm/components/InputWrapper/InputWrapper.js

@@ -1,7 +1,7 @@
 import React, { forwardRef, createElement } from 'react';
-import { useExtractedMargins } from '@mantine/styles';
-import { Text } from '../Text/Text.js';
 import useStyles from './InputWrapper.styles.js';
+import { Box } from '../Box/Box.js';
+import { Text } from '../Text/Text.js';
 
 var __defProp = Object.defineProperty;
 var __defProps = Object.defineProperties;
@@ -37,7 +37,6 @@ var __objRest = (source, exclude) => {
 const InputWrapper = forwardRef((_a, ref) => {
   var _b = _a, {
     className,
-    style,
     label,
     children,
     required,
@@ -50,12 +49,10 @@ const InputWrapper = forwardRef((_a, ref) => {
     errorProps,
     classNames,
     styles,
-    sx,
     size = "sm",
     __staticSelector = "InputWrapper"
   } = _b, others = __objRest(_b, [
     "className",
-    "style",
     "label",
     "children",
     "required",
@@ -68,12 +65,10 @@ const InputWrapper = forwardRef((_a, ref) => {
     "errorProps",
     "classNames",
     "styles",
-    "sx",
     "size",
     "__staticSelector"
   ]);
-  const { classes, cx } = useStyles({ size }, { classNames, styles, sx, name: __staticSelector });
-  const { mergedStyles, rest } = useExtractedMargins({ others, style });
+  const { classes, cx } = useStyles({ size }, { classNames, styles, name: __staticSelector });
   const _labelProps = labelElement === "label" ? { htmlFor: id } : {};
   const inputLabel = createElement(labelElement, __spreadProps(__spreadValues(__spreadValues({}, _labelProps), labelProps), {
     id: id ? `${id}-label` : void 0,
@@ -81,11 +76,10 @@ const InputWrapper = forwardRef((_a, ref) => {
   }), /* @__PURE__ */ React.createElement(React.Fragment, null, label, required && /* @__PURE__ */ React.createElement("span", {
     className: classes.required
   }, " *")));
-  return /* @__PURE__ */ React.createElement("div", __spreadValues({
+  return /* @__PURE__ */ React.createElement(Box, __spreadValues({
     className: cx(classes.root, className),
-    style: mergedStyles,
     ref
-  }, rest), label && inputLabel, description && /* @__PURE__ */ React.createElement(Text, __spreadProps(__spreadValues({}, descriptionProps), {
+  }, others), label && inputLabel, description && /* @__PURE__ */ React.createElement(Text, __spreadProps(__spreadValues({}, descriptionProps), {
     color: "gray",
     className: classes.description
   }), description), children, typeof error !== "boolean" && error && /* @__PURE__ */ React.createElement(Text, __spreadProps(__spreadValues({}, errorProps), {

package/esm/components/InputWrapper/InputWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputWrapper.js","sources":["../../../src/components/InputWrapper/InputWrapper.tsx"],"sourcesContent":["import React, { createElement, forwardRef } from 'react';\nimport { DefaultProps, MantineSize, ClassNames, useExtractedMargins } from '@mantine/styles';\nimport { Text } from '../Text/Text';\nimport useStyles from './InputWrapper.styles';\n\nexport type InputWrapperStylesNames = ClassNames<typeof useStyles>;\n\nexport interface InputWrapperBaseProps {\n  /** Input label, displayed before input */\n  label?: React.ReactNode;\n\n  /** Input description, displayed after label */\n  description?: React.ReactNode;\n\n  /** Displays error message after input */\n  error?: React.ReactNode;\n\n  /** Adds red asterisk on the right side of label */\n  required?: boolean;\n\n  /** Props spread to label element */\n  labelProps?: React.ComponentPropsWithoutRef<'label'> & { [key: string]: any };\n\n  /** Props spread to description element */\n  descriptionProps?: React.ComponentPropsWithoutRef<'div'> & { [key: string]: any };\n\n  /** Props spread to error element */\n  errorProps?: React.ComponentPropsWithoutRef<'div'> & { [key: string]: any };\n}\n\nexport interface InputWrapperProps\n  extends DefaultProps<InputWrapperStylesNames>,\n    InputWrapperBaseProps,\n    React.ComponentPropsWithoutRef<'div'> {\n  /** Input that should be wrapped */\n  children: React.ReactNode;\n\n  /** htmlFor label prop */\n  id?: string;\n\n  /** Render label as label with htmlFor or as div */\n  labelElement?: 'label' | 'div';\n\n  /** Controls all elements font-size */\n  size?: MantineSize;\n\n  /** Static css selector base */\n  __staticSelector?: string;\n}\n\nexport const InputWrapper = forwardRef<HTMLDivElement, InputWrapperProps>(\n  (\n    {\n      className,\n      style,\n      label,\n      children,\n      required,\n      id,\n      error,\n      description,\n      labelElement = 'label',\n      labelProps,\n      descriptionProps,\n      errorProps,\n      classNames,\n      styles,\n      sx,\n      size = 'sm',\n      __staticSelector = 'InputWrapper',\n      ...others\n    }: InputWrapperProps,\n    ref\n  ) => {\n    const { classes, cx } = useStyles({ size }, { classNames, styles, sx, name: __staticSelector });\n    const { mergedStyles, rest } = useExtractedMargins({ others, style });\n    const _labelProps = labelElement === 'label' ? { htmlFor: id } : {};\n    const inputLabel = createElement(\n      labelElement,\n      {\n        ..._labelProps,\n        ...labelProps,\n        id: id ? `${id}-label` : undefined,\n        className: classes.label,\n      },\n      <>\n        {label}\n        {required && <span className={classes.required}> *</span>}\n      </>\n    );\n\n    return (\n      <div className={cx(classes.root, className)} style={mergedStyles} ref={ref} {...rest}>\n        {label && inputLabel}\n\n        {description && (\n          <Text {...descriptionProps} color=\"gray\" className={classes.description}>\n            {description}\n          </Text>\n        )}\n\n        {children}\n\n        {typeof error !== 'boolean' && error && (\n          <Text {...errorProps} size={size} className={classes.error}>\n            {error}\n          </Text>\n        )}\n      </div>\n    );\n  }\n);\n\nInputWrapper.displayName = '@mantine/core/InputWrapper';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"InputWrapper.js","sources":["../../../src/components/InputWrapper/InputWrapper.tsx"],"sourcesContent":["import React, { createElement, forwardRef } from 'react';\nimport { DefaultProps, MantineSize, ClassNames } from '@mantine/styles';\nimport { Text } from '../Text';\nimport { Box } from '../Box';\nimport useStyles from './InputWrapper.styles';\n\nexport type InputWrapperStylesNames = ClassNames<typeof useStyles>;\n\nexport interface InputWrapperBaseProps {\n  /** Input label, displayed before input */\n  label?: React.ReactNode;\n\n  /** Input description, displayed after label */\n  description?: React.ReactNode;\n\n  /** Displays error message after input */\n  error?: React.ReactNode;\n\n  /** Adds red asterisk on the right side of label */\n  required?: boolean;\n\n  /** Props spread to label element */\n  labelProps?: React.ComponentPropsWithoutRef<'label'> & { [key: string]: any };\n\n  /** Props spread to description element */\n  descriptionProps?: React.ComponentPropsWithoutRef<'div'> & { [key: string]: any };\n\n  /** Props spread to error element */\n  errorProps?: React.ComponentPropsWithoutRef<'div'> & { [key: string]: any };\n}\n\nexport interface InputWrapperProps\n  extends DefaultProps<InputWrapperStylesNames>,\n    InputWrapperBaseProps,\n    React.ComponentPropsWithoutRef<'div'> {\n  /** Input that should be wrapped */\n  children: React.ReactNode;\n\n  /** htmlFor label prop */\n  id?: string;\n\n  /** Render label as label with htmlFor or as div */\n  labelElement?: 'label' | 'div';\n\n  /** Controls all elements font-size */\n  size?: MantineSize;\n\n  /** Static css selector base */\n  __staticSelector?: string;\n}\n\nexport const InputWrapper = forwardRef<HTMLDivElement, InputWrapperProps>(\n  (\n    {\n      className,\n      label,\n      children,\n      required,\n      id,\n      error,\n      description,\n      labelElement = 'label',\n      labelProps,\n      descriptionProps,\n      errorProps,\n      classNames,\n      styles,\n      size = 'sm',\n      __staticSelector = 'InputWrapper',\n      ...others\n    }: InputWrapperProps,\n    ref\n  ) => {\n    const { classes, cx } = useStyles({ size }, { classNames, styles, name: __staticSelector });\n    const _labelProps = labelElement === 'label' ? { htmlFor: id } : {};\n    const inputLabel = createElement(\n      labelElement,\n      {\n        ..._labelProps,\n        ...labelProps,\n        id: id ? `${id}-label` : undefined,\n        className: classes.label,\n      },\n      <>\n        {label}\n        {required && <span className={classes.required}> *</span>}\n      </>\n    );\n\n    return (\n      <Box className={cx(classes.root, className)} ref={ref} {...others}>\n        {label && inputLabel}\n\n        {description && (\n          <Text {...descriptionProps} color=\"gray\" className={classes.description}>\n            {description}\n          </Text>\n        )}\n\n        {children}\n\n        {typeof error !== 'boolean' && error && (\n          <Text {...errorProps} size={size} className={classes.error}>\n            {error}\n          </Text>\n        )}\n      </Box>\n    );\n  }\n);\n\nInputWrapper.displayName = '@mantine/core/InputWrapper';\n"],"names":[],"mappings":";;;;;AAAA,IAAI,SAAS,GAAG,MAAM,CAAC,cAAc,CAAC;AACtC,IAAI,UAAU,GAAG,MAAM,CAAC,gBAAgB,CAAC;AACzC,IAAI,iBAAiB,GAAG,MAAM,CAAC,yBAAyB,CAAC;AACzD,IAAI,mBAAmB,GAAG,MAAM,CAAC,qBAAqB,CAAC;AACvD,IAAI,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC;AACnD,IAAI,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,oBAAoB,CAAC;AACzD,IAAI,eAAe,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,KAAK,GAAG,IAAI,GAAG,GAAG,SAAS,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,GAAG,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AAChK,IAAI,cAAc,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK;AAC/B,EAAE,KAAK,IAAI,IAAI,IAAI,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC;AAChC,IAAI,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC;AAClC,MAAM,eAAe,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AACxC,EAAE,IAAI,mBAAmB;AACzB,IAAI,KAAK,IAAI,IAAI,IAAI,mBAAmB,CAAC,CAAC,CAAC,EAAE;AAC7C,MAAM,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC;AACpC,QAAQ,eAAe,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AAC1C,KAAK;AACL,EAAE,OAAO,CAAC,CAAC;AACX,CAAC,CAAC;AACF,IAAI,aAAa,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK,UAAU,CAAC,CAAC,EAAE,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC;AAClE,IAAI,SAAS,GAAG,CAAC,MAAM,EAAE,OAAO,KAAK;AACrC,EAAE,IAAI,MAAM,GAAG,EAAE,CAAC;AAClB,EAAE,KAAK,IAAI,IAAI,IAAI,MAAM;AACzB,IAAI,IAAI,YAAY,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;AACpE,MAAM,MAAM,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;AAClC,EAAE,IAAI,MAAM,IAAI,IAAI,IAAI,mBAAmB;AAC3C,IAAI,KAAK,IAAI,IAAI,IAAI,mBAAmB,CAAC,MAAM,CAAC,EAAE;AAClD,MAAM,IAAI,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,YAAY,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC;AACtE,QAAQ,MAAM,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;AACpC,KAAK;AACL,EAAE,OAAO,MAAM,CAAC;AAChB,CAAC,CAAC;AAKU,MAAC,YAAY,GAAG,UAAU,CAAC,CAAC,EAAE,EAAE,GAAG,KAAK;AACpD,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE;AACf,IAAI,SAAS;AACb,IAAI,KAAK;AACT,IAAI,QAAQ;AACZ,IAAI,QAAQ;AACZ,IAAI,EAAE;AACN,IAAI,KAAK;AACT,IAAI,WAAW;AACf,IAAI,YAAY,GAAG,OAAO;AAC1B,IAAI,UAAU;AACd,IAAI,gBAAgB;AACpB,IAAI,UAAU;AACd,IAAI,UAAU;AACd,IAAI,MAAM;AACV,IAAI,IAAI,GAAG,IAAI;AACf,IAAI,gBAAgB,GAAG,cAAc;AACrC,GAAG,GAAG,EAAE,EAAE,MAAM,GAAG,SAAS,CAAC,EAAE,EAAE;AACjC,IAAI,WAAW;AACf,IAAI,OAAO;AACX,IAAI,UAAU;AACd,IAAI,UAAU;AACd,IAAI,IAAI;AACR,IAAI,OAAO;AACX,IAAI,aAAa;AACjB,IAAI,cAAc;AAClB,IAAI,YAAY;AAChB,IAAI,kBAAkB;AACtB,IAAI,YAAY;AAChB,IAAI,YAAY;AAChB,IAAI,QAAQ;AACZ,IAAI,MAAM;AACV,IAAI,kBAAkB;AACtB,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,SAAS,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,IAAI,EAAE,gBAAgB,EAAE,CAAC,CAAC;AAC9F,EAAE,MAAM,WAAW,GAAG,YAAY,KAAK,OAAO,GAAG,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC;AACtE,EAAE,MAAM,UAAU,GAAG,aAAa,CAAC,YAAY,EAAE,aAAa,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,EAAE,WAAW,CAAC,EAAE,UAAU,CAAC,EAAE;AAC5H,IAAI,EAAE,EAAE,EAAE,GAAG,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,GAAG,KAAK,CAAC;AACnC,IAAI,SAAS,EAAE,OAAO,CAAC,KAAK;AAC5B,GAAG,CAAC,kBAAkB,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,oBAAoB,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE;AAC/H,IAAI,SAAS,EAAE,OAAO,CAAC,QAAQ;AAC/B,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC;AACb,EAAE,uBAAuB,KAAK,CAAC,aAAa,CAAC,GAAG,EAAE,cAAc,CAAC;AACjE,IAAI,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,SAAS,CAAC;AAC1C,IAAI,GAAG;AACP,GAAG,EAAE,MAAM,CAAC,EAAE,KAAK,IAAI,UAAU,EAAE,WAAW,oBAAoB,KAAK,CAAC,aAAa,CAAC,IAAI,EAAE,aAAa,CAAC,cAAc,CAAC,EAAE,EAAE,gBAAgB,CAAC,EAAE;AAChJ,IAAI,KAAK,EAAE,MAAM;AACjB,IAAI,SAAS,EAAE,OAAO,CAAC,WAAW;AAClC,GAAG,CAAC,EAAE,WAAW,CAAC,EAAE,QAAQ,EAAE,OAAO,KAAK,KAAK,SAAS,IAAI,KAAK,oBAAoB,KAAK,CAAC,aAAa,CAAC,IAAI,EAAE,aAAa,CAAC,cAAc,CAAC,EAAE,EAAE,UAAU,CAAC,EAAE;AAC7J,IAAI,IAAI;AACR,IAAI,SAAS,EAAE,OAAO,CAAC,KAAK;AAC5B,GAAG,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC;AACd,CAAC,EAAE;AACH,YAAY,CAAC,WAAW,GAAG,4BAA4B;;;;"}

package/esm/components/Kbd/Kbd.js

@@ -1,6 +1,6 @@
 import React, { forwardRef } from 'react';
-import { useExtractedMargins } from '@mantine/styles';
 import useStyles from './Kbd.styles.js';
+import { Box } from '../Box/Box.js';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
@@ -31,14 +31,13 @@ var __objRest = (source, exclude) => {
   return target;
 };
 const Kbd = forwardRef((_a, ref) => {
-  var _b = _a, { className, children, style, sx } = _b, others = __objRest(_b, ["className", "children", "style", "sx"]);
-  const { classes, cx } = useStyles(null, { sx, name: "Kbd" });
-  const { mergedStyles, rest } = useExtractedMargins({ others, style });
-  return /* @__PURE__ */ React.createElement("kbd", __spreadValues({
+  var _b = _a, { className, children } = _b, others = __objRest(_b, ["className", "children"]);
+  const { classes, cx } = useStyles(null, { name: "Kbd" });
+  return /* @__PURE__ */ React.createElement(Box, __spreadValues({
+    component: "kbd",
     className: cx(classes.root, className),
-    style: mergedStyles,
     ref
-  }, rest), children);
+  }, others), children);
 });
 Kbd.displayName = "@mantine/core/Kbd";
 

package/esm/components/Kbd/Kbd.js.map

@@ -1 +1 @@
-{"version":3,"file":"Kbd.js","sources":["../../../src/components/Kbd/Kbd.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, useExtractedMargins } from '@mantine/styles';\nimport useStyles from './Kbd.styles';\n\nexport interface KbdProps extends DefaultProps, React.ComponentPropsWithoutRef<'kbd'> {\n  /** Keyboard key */\n  children: React.ReactNode;\n}\n\nexport const Kbd = forwardRef<HTMLElement, KbdProps>(\n  ({ className, children, style, sx, ...others }: KbdProps, ref) => {\n    const { classes, cx } = useStyles(null, { sx, name: 'Kbd' });\n    const { mergedStyles, rest } = useExtractedMargins({ others, style });\n\n    return (\n      <kbd className={cx(classes.root, className)} style={mergedStyles} ref={ref} {...rest}>\n        {children}\n      </kbd>\n    );\n  }\n);\n\nKbd.displayName = '@mantine/core/Kbd';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Kbd.js","sources":["../../../src/components/Kbd/Kbd.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps } from '@mantine/styles';\nimport { Box } from '../Box';\nimport useStyles from './Kbd.styles';\n\nexport interface KbdProps extends DefaultProps, React.ComponentPropsWithoutRef<'kbd'> {\n  /** Keyboard key */\n  children: React.ReactNode;\n}\n\nexport const Kbd = forwardRef<HTMLElement, KbdProps>(\n  ({ className, children, ...others }: KbdProps, ref) => {\n    const { classes, cx } = useStyles(null, { name: 'Kbd' });\n\n    return (\n      <Box component=\"kbd\" className={cx(classes.root, className)} ref={ref} {...others}>\n        {children}\n      </Box>\n    );\n  }\n);\n\nKbd.displayName = '@mantine/core/Kbd';\n"],"names":[],"mappings":"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"}

package/esm/components/List/List.js

@@ -1,7 +1,7 @@
-import React, { Children } from 'react';
-import { useExtractedMargins } from '@mantine/styles';
+import React, { forwardRef, Children } from 'react';
 import { ListItem } from './ListItem/ListItem.js';
 import useStyles from './List.styles.js';
+import { Box } from '../Box/Box.js';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
@@ -31,7 +31,7 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-function List(_a) {
+const List = forwardRef((_a, ref) => {
   var _b = _a, {
     children,
     type = "unordered",
@@ -42,10 +42,8 @@ function List(_a) {
     spacing = 0,
     icon,
     className,
-    style,
     styles,
-    classNames,
-    sx
+    classNames
   } = _b, others = __objRest(_b, [
     "children",
     "type",
@@ -56,14 +54,10 @@ function List(_a) {
     "spacing",
     "icon",
     "className",
-    "style",
     "styles",
-    "classNames",
-    "sx"
+    "classNames"
   ]);
-  const { classes, cx } = useStyles({ withPadding, size, listStyleType }, { sx, classNames, styles, name: "List" });
-  const { mergedStyles, rest } = useExtractedMargins({ others, style });
-  const Element = type === "unordered" ? "ul" : "ol";
+  const { classes, cx } = useStyles({ withPadding, size, listStyleType }, { classNames, styles, name: "List" });
   const items = Children.toArray(children).filter((item) => item.type === ListItem).map((item) => {
     var _a2;
     return React.cloneElement(item, {
@@ -74,11 +68,12 @@ function List(_a) {
       icon: ((_a2 = item.props) == null ? void 0 : _a2.icon) || icon
     });
   });
-  return /* @__PURE__ */ React.createElement(Element, __spreadValues({
+  return /* @__PURE__ */ React.createElement(Box, __spreadValues({
+    component: type === "unordered" ? "ul" : "ol",
     className: cx(classes.root, className),
-    style: mergedStyles
-  }, rest), items);
-}
+    ref
+  }, others), items);
+});
 List.Item = ListItem;
 List.displayName = "@mantine/core/List";
 

package/esm/components/List/List.js.map

@@ -1 +1 @@
-{"version":3,"file":"List.js","sources":["../../../src/components/List/List.tsx"],"sourcesContent":["import React, { Children } from 'react';\nimport { DefaultProps, MantineNumberSize, ClassNames, useExtractedMargins } from '@mantine/styles';\nimport { ListItem, ListItemStylesNames } from './ListItem/ListItem';\nimport useStyles from './List.styles';\n\nexport type ListStylesNames = ListItemStylesNames | ClassNames<typeof useStyles>;\n\nexport interface ListProps\n  extends DefaultProps<ListStylesNames>,\n    React.ComponentPropsWithoutRef<'ul'> {\n  /** <List.Item /> components only */\n  children: React.ReactNode;\n\n  /** List type: ol or ul */\n  type?: 'order' | 'unordered';\n\n  /** Include padding-left to offset list from main content */\n  withPadding?: boolean;\n\n  /** Font size from theme or number to set value in px */\n  size?: MantineNumberSize;\n\n  /** Icon that should replace list item dot */\n  icon?: React.ReactNode;\n\n  /** Spacing between items from theme or number to set value in px */\n  spacing?: MantineNumberSize;\n\n  /** Center items with icon */\n  center?: boolean;\n\n  /** List style */\n  listStyleType?: React.CSSProperties['listStyleType'];\n}\n\nexport function List({\n  children,\n  type = 'unordered',\n  size = 'md',\n  listStyleType,\n  withPadding = false,\n  center = false,\n  spacing = 0,\n  icon,\n  className,\n  style,\n  styles,\n  classNames,\n  sx,\n  ...others\n}: ListProps) {\n  const { classes, cx } = useStyles(\n    { withPadding, size, listStyleType },\n    { sx, classNames, styles, name: 'List' }\n  );\n  const { mergedStyles, rest } = useExtractedMargins({ others, style });\n  const Element = type === 'unordered' ? 'ul' : 'ol';\n\n  const items = Children.toArray(children)\n    .filter((item: React.ReactElement) => item.type === ListItem)\n    .map((item: React.ReactElement) =>\n      React.cloneElement(item, {\n        classNames,\n        styles,\n        spacing,\n        center,\n        icon: item.props?.icon || icon,\n      })\n    );\n\n  return (\n    <Element className={cx(classes.root, className)} style={mergedStyles} {...rest}>\n      {items}\n    </Element>\n  );\n}\n\nList.Item = ListItem;\nList.displayName = '@mantine/core/List';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"List.js","sources":["../../../src/components/List/List.tsx"],"sourcesContent":["import React, { Children, forwardRef } from 'react';\nimport { DefaultProps, MantineNumberSize, ClassNames } from '@mantine/styles';\nimport { Box } from '../Box';\nimport { ListItem, ListItemStylesNames } from './ListItem/ListItem';\nimport useStyles from './List.styles';\n\nexport type ListStylesNames = ListItemStylesNames | ClassNames<typeof useStyles>;\n\nexport interface ListProps\n  extends DefaultProps<ListStylesNames>,\n    React.ComponentPropsWithoutRef<'ul'> {\n  /** <List.Item /> components only */\n  children: React.ReactNode;\n\n  /** List type: ol or ul */\n  type?: 'order' | 'unordered';\n\n  /** Include padding-left to offset list from main content */\n  withPadding?: boolean;\n\n  /** Font size from theme or number to set value in px */\n  size?: MantineNumberSize;\n\n  /** Icon that should replace list item dot */\n  icon?: React.ReactNode;\n\n  /** Spacing between items from theme or number to set value in px */\n  spacing?: MantineNumberSize;\n\n  /** Center items with icon */\n  center?: boolean;\n\n  /** List style */\n  listStyleType?: React.CSSProperties['listStyleType'];\n}\n\ntype ListComponent = ((props: ListProps) => React.ReactElement) & {\n  displayName: string;\n  Item: typeof ListItem;\n};\n\nexport const List: ListComponent = forwardRef<HTMLUListElement, ListProps>(\n  (\n    {\n      children,\n      type = 'unordered',\n      size = 'md',\n      listStyleType,\n      withPadding = false,\n      center = false,\n      spacing = 0,\n      icon,\n      className,\n      styles,\n      classNames,\n      ...others\n    }: ListProps,\n    ref\n  ) => {\n    const { classes, cx } = useStyles(\n      { withPadding, size, listStyleType },\n      { classNames, styles, name: 'List' }\n    );\n\n    const items = Children.toArray(children)\n      .filter((item: React.ReactElement) => item.type === ListItem)\n      .map((item: React.ReactElement) =>\n        React.cloneElement(item, {\n          classNames,\n          styles,\n          spacing,\n          center,\n          icon: item.props?.icon || icon,\n        })\n      );\n\n    return (\n      <Box\n        component={type === 'unordered' ? 'ul' : 'ol'}\n        className={cx(classes.root, className)}\n        ref={ref}\n        {...others}\n      >\n        {items}\n      </Box>\n    );\n  }\n) as any;\n\nList.Item = ListItem;\nList.displayName = '@mantine/core/List';\n"],"names":[],"mappings":"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"}

package/esm/components/List/ListItem/ListItem.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import { useSx, useExtractedMargins } from '@mantine/styles';
 import useStyles from './ListItem.styles.js';
+import { Box } from '../../Box/Box.js';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
@@ -33,32 +33,26 @@ var __objRest = (source, exclude) => {
 function ListItem(_a) {
   var _b = _a, {
     className,
-    style,
     children,
     icon,
     classNames,
     styles,
     spacing,
-    center,
-    sx
+    center
   } = _b, others = __objRest(_b, [
     "className",
-    "style",
     "children",
     "icon",
     "classNames",
     "styles",
     "spacing",
-    "center",
-    "sx"
+    "center"
   ]);
-  const { sxClassName } = useSx({ sx });
   const { classes, cx } = useStyles({ spacing, center }, { classNames, styles, name: "List" });
-  const { mergedStyles, rest } = useExtractedMargins({ others, style });
-  return /* @__PURE__ */ React.createElement("li", __spreadValues({
-    className: cx(classes.item, { [classes.withIcon]: icon }, sxClassName, className),
-    style: mergedStyles
-  }, rest), /* @__PURE__ */ React.createElement("div", {
+  return /* @__PURE__ */ React.createElement(Box, __spreadValues({
+    component: "li",
+    className: cx(classes.item, { [classes.withIcon]: icon }, className)
+  }, others), /* @__PURE__ */ React.createElement("div", {
     className: classes.itemWrapper
   }, icon && /* @__PURE__ */ React.createElement("span", {
     className: classes.itemIcon

package/esm/components/List/ListItem/ListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.js","sources":["../../../../src/components/List/ListItem/ListItem.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  DefaultProps,\n  MantineNumberSize,\n  ClassNames,\n  useExtractedMargins,\n  useSx,\n} from '@mantine/styles';\nimport useStyles from './ListItem.styles';\n\nexport type ListItemStylesNames = ClassNames<typeof useStyles>;\n\nexport interface ListItemProps\n  extends DefaultProps<ListItemStylesNames>,\n    React.ComponentPropsWithoutRef<'li'> {\n  /** Icon to replace bullet */\n  icon?: React.ReactNode;\n\n  /** Item content */\n  children: React.ReactNode;\n\n  /** Predefined spacing between items or number to set value in px */\n  spacing?: MantineNumberSize;\n\n  /** Center item content with icon */\n  center?: boolean;\n}\n\nexport function ListItem({\n  className,\n  style,\n  children,\n  icon,\n  classNames,\n  styles,\n  spacing,\n  center,\n  sx,\n  ...others\n}: ListItemProps) {\n  const { sxClassName } = useSx({ sx });\n  const { classes, cx } = useStyles({ spacing, center }, { classNames, styles, name: 'List' });\n  const { mergedStyles, rest } = useExtractedMargins({ others, style });\n\n  return (\n    <li\n      className={cx(classes.item, { [classes.withIcon]: icon }, sxClassName, className)}\n      style={mergedStyles}\n      {...rest}\n    >\n      <div className={classes.itemWrapper}>\n        {icon && <span className={classes.itemIcon}>{icon}</span>}\n        <span>{children}</span>\n      </div>\n    </li>\n  );\n}\n\nListItem.displayName = '@mantine/core/ListItem';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ListItem.js","sources":["../../../../src/components/List/ListItem/ListItem.tsx"],"sourcesContent":["import React from 'react';\nimport { DefaultProps, MantineNumberSize, ClassNames } from '@mantine/styles';\nimport { Box } from '../../Box';\nimport useStyles from './ListItem.styles';\n\nexport type ListItemStylesNames = ClassNames<typeof useStyles>;\n\nexport interface ListItemProps\n  extends DefaultProps<ListItemStylesNames>,\n    React.ComponentPropsWithoutRef<'li'> {\n  /** Icon to replace bullet */\n  icon?: React.ReactNode;\n\n  /** Item content */\n  children: React.ReactNode;\n\n  /** Predefined spacing between items or number to set value in px */\n  spacing?: MantineNumberSize;\n\n  /** Center item content with icon */\n  center?: boolean;\n}\n\nexport function ListItem({\n  className,\n  children,\n  icon,\n  classNames,\n  styles,\n  spacing,\n  center,\n  ...others\n}: ListItemProps) {\n  const { classes, cx } = useStyles({ spacing, center }, { classNames, styles, name: 'List' });\n\n  return (\n    <Box\n      component=\"li\"\n      className={cx(classes.item, { [classes.withIcon]: icon }, className)}\n      {...others}\n    >\n      <div className={classes.itemWrapper}>\n        {icon && <span className={classes.itemIcon}>{icon}</span>}\n        <span>{children}</span>\n      </div>\n    </Box>\n  );\n}\n\nListItem.displayName = '@mantine/core/ListItem';\n"],"names":[],"mappings":"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"}

package/esm/components/Loader/Loader.js

@@ -1,8 +1,9 @@
 import React from 'react';
-import { useSx, useExtractedMargins } from '@mantine/styles';
+import { useMantineTheme } from '@mantine/styles';
 import { Bars } from './loaders/Bars.js';
 import { Oval } from './loaders/Oval.js';
 import { Dots } from './loaders/Dots.js';
+import { Box } from '../Box/Box.js';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
@@ -45,33 +46,16 @@ const LOADER_SIZES = {
   xl: 58
 };
 function Loader(_a) {
-  var _b = _a, {
-    size = "md",
-    color,
-    className,
-    variant,
-    style,
-    sx
-  } = _b, others = __objRest(_b, [
-    "size",
-    "color",
-    "className",
-    "variant",
-    "style",
-    "sx"
-  ]);
-  const { sxClassName, theme } = useSx({ sx, className });
-  const { mergedStyles, rest } = useExtractedMargins({ others, style });
+  var _b = _a, { size = "md", color, variant } = _b, others = __objRest(_b, ["size", "color", "variant"]);
+  const theme = useMantineTheme();
   const defaultLoader = variant in LOADERS ? variant : theme.loader;
-  const Component = LOADERS[defaultLoader] || LOADERS.bars;
   const _color = color || theme.primaryColor;
-  return /* @__PURE__ */ React.createElement(Component, __spreadValues({
-    size: theme.fn.size({ size, sizes: LOADER_SIZES }),
-    style: mergedStyles,
-    color: _color in theme.colors ? theme.fn.themeColor(_color, theme.colorScheme === "dark" ? 4 : 6) : color,
+  return /* @__PURE__ */ React.createElement(Box, __spreadValues({
     role: "presentation",
-    className: sxClassName
-  }, rest));
+    component: LOADERS[defaultLoader] || LOADERS.bars,
+    size: theme.fn.size({ size, sizes: LOADER_SIZES }),
+    color: _color in theme.colors ? theme.fn.themeColor(_color, theme.colorScheme === "dark" ? 4 : 6) : color
+  }, others));
 }
 Loader.displayName = "@mantine/core/Loader";
 

package/esm/components/Loader/Loader.js.map

@@ -1 +1 @@
-{"version":3,"file":"Loader.js","sources":["../../../src/components/Loader/Loader.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  DefaultProps,\n  MantineNumberSize,\n  MantineColor,\n  MantineTheme,\n  useExtractedMargins,\n  useSx,\n} from '@mantine/styles';\nimport { Bars } from './loaders/Bars';\nimport { Oval } from './loaders/Oval';\nimport { Dots } from './loaders/Dots';\n\nconst LOADERS = {\n  bars: Bars,\n  oval: Oval,\n  dots: Dots,\n} as const;\n\nexport const LOADER_SIZES = {\n  xs: 18,\n  sm: 22,\n  md: 36,\n  lg: 44,\n  xl: 58,\n};\n\nexport interface LoaderProps extends DefaultProps, React.ComponentPropsWithoutRef<'svg'> {\n  /** Defines width of loader */\n  size?: MantineNumberSize;\n\n  /** Loader color from theme */\n  color?: MantineColor;\n\n  /** Loader appearance */\n  variant?: MantineTheme['loader'];\n}\n\nexport function Loader({\n  size = 'md',\n  color,\n  className,\n  variant,\n  style,\n  sx,\n  ...others\n}: LoaderProps) {\n  const { sxClassName, theme } = useSx({ sx, className });\n  const { mergedStyles, rest } = useExtractedMargins({ others, style });\n  const defaultLoader = variant in LOADERS ? variant : theme.loader;\n  const Component = LOADERS[defaultLoader] || LOADERS.bars;\n  const _color = color || theme.primaryColor;\n\n  return (\n    <Component\n      size={theme.fn.size({ size, sizes: LOADER_SIZES })}\n      style={mergedStyles}\n      color={\n        _color in theme.colors\n          ? theme.fn.themeColor(_color, theme.colorScheme === 'dark' ? 4 : 6)\n          : color\n      }\n      role=\"presentation\"\n      className={sxClassName}\n      {...rest}\n    />\n  );\n}\n\nLoader.displayName = '@mantine/core/Loader';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Loader.js","sources":["../../../src/components/Loader/Loader.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  DefaultProps,\n  MantineNumberSize,\n  MantineColor,\n  MantineTheme,\n  useMantineTheme,\n} from '@mantine/styles';\nimport { Box } from '../Box';\nimport { Bars } from './loaders/Bars';\nimport { Oval } from './loaders/Oval';\nimport { Dots } from './loaders/Dots';\n\nconst LOADERS = {\n  bars: Bars,\n  oval: Oval,\n  dots: Dots,\n} as const;\n\nexport const LOADER_SIZES = {\n  xs: 18,\n  sm: 22,\n  md: 36,\n  lg: 44,\n  xl: 58,\n};\n\nexport interface LoaderProps extends DefaultProps, React.ComponentPropsWithoutRef<'svg'> {\n  /** Defines width of loader */\n  size?: MantineNumberSize;\n\n  /** Loader color from theme */\n  color?: MantineColor;\n\n  /** Loader appearance */\n  variant?: MantineTheme['loader'];\n}\n\nexport function Loader({ size = 'md', color, variant, ...others }: LoaderProps) {\n  const theme = useMantineTheme();\n  const defaultLoader = variant in LOADERS ? variant : theme.loader;\n  const _color = color || theme.primaryColor;\n\n  return (\n    <Box\n      role=\"presentation\"\n      component={LOADERS[defaultLoader] || LOADERS.bars}\n      size={theme.fn.size({ size, sizes: LOADER_SIZES })}\n      color={\n        _color in theme.colors\n          ? theme.fn.themeColor(_color, theme.colorScheme === 'dark' ? 4 : 6)\n          : color\n      }\n      {...others}\n    />\n  );\n}\n\nLoader.displayName = '@mantine/core/Loader';\n"],"names":[],"mappings":"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"}

package/esm/components/LoadingOverlay/LoadingOverlay.js

@@ -1,9 +1,10 @@
-import React from 'react';
+import React, { forwardRef } from 'react';
 import { getDefaultZIndex } from '@mantine/styles';
-import { Overlay } from '../Overlay/Overlay.js';
-import { Loader } from '../Loader/Loader.js';
 import useStyles from './LoadingOverlay.styles.js';
 import { Transition } from '../Transition/Transition.js';
+import { Box } from '../Box/Box.js';
+import { Loader } from '../Loader/Loader.js';
+import { Overlay } from '../Overlay/Overlay.js';
 
 var __defProp = Object.defineProperty;
 var __defProps = Object.defineProperties;
@@ -36,7 +37,7 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-function LoadingOverlay(_a) {
+const LoadingOverlay = forwardRef((_a, ref) => {
   var _b = _a, {
     className,
     visible,
@@ -47,8 +48,7 @@ function LoadingOverlay(_a) {
     zIndex = getDefaultZIndex("overlay"),
     style,
     loader,
-    radius,
-    sx
+    radius
   } = _b, others = __objRest(_b, [
     "className",
     "visible",
@@ -59,17 +59,17 @@ function LoadingOverlay(_a) {
     "zIndex",
     "style",
     "loader",
-    "radius",
-    "sx"
+    "radius"
   ]);
-  const { classes, cx, theme } = useStyles(null, { sx, name: "LoadingOverlay" });
+  const { classes, cx, theme } = useStyles(null, { name: "LoadingOverlay" });
   return /* @__PURE__ */ React.createElement(Transition, {
     duration: transitionDuration,
     mounted: visible,
     transition: "fade"
-  }, (transitionStyles) => /* @__PURE__ */ React.createElement("div", __spreadValues({
+  }, (transitionStyles) => /* @__PURE__ */ React.createElement(Box, __spreadValues({
     className: cx(classes.root, className),
-    style: __spreadProps(__spreadValues(__spreadValues({}, transitionStyles), style), { zIndex })
+    style: __spreadProps(__spreadValues(__spreadValues({}, transitionStyles), style), { zIndex }),
+    ref
   }, others), loader ? /* @__PURE__ */ React.createElement("div", {
     style: { zIndex: zIndex + 1 }
   }, loader) : /* @__PURE__ */ React.createElement(Loader, __spreadValues({
@@ -80,7 +80,7 @@ function LoadingOverlay(_a) {
     radius,
     color: overlayColor || (theme.colorScheme === "dark" ? theme.colors.dark[5] : theme.white)
   })));
-}
+});
 LoadingOverlay.displayName = "@mantine/core/LoadingOverlay";
 
 export { LoadingOverlay };

package/esm/components/LoadingOverlay/LoadingOverlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoadingOverlay.js","sources":["../../../src/components/LoadingOverlay/LoadingOverlay.tsx"],"sourcesContent":["import React from 'react';\nimport { DefaultProps, MantineMargin, MantineNumberSize, getDefaultZIndex } from '@mantine/styles';\nimport { Overlay } from '../Overlay/Overlay';\nimport { Transition } from '../Transition';\nimport { Loader, LoaderProps } from '../Loader/Loader';\nimport useStyles from './LoadingOverlay.styles';\n\nexport interface LoadingOverlayProps\n  extends Omit<DefaultProps, MantineMargin>,\n    React.ComponentPropsWithoutRef<'div'> {\n  /** Provide custom loader */\n  loader?: React.ReactNode;\n\n  /** Loader component props */\n  loaderProps?: LoaderProps;\n\n  /** Sets overlay opacity */\n  overlayOpacity?: number;\n\n  /** Sets overlay color, defaults to theme.white in light theme and to theme.colors.dark[5] in dark theme */\n  overlayColor?: string;\n\n  /** Loading overlay z-index */\n  zIndex?: number;\n\n  /** If visible overlay will take 100% width and height of first parent with relative position and overlay all of its content */\n  visible: boolean;\n\n  /** Appear and disappear animation duration */\n  transitionDuration?: number;\n\n  /** Value from theme.radius or number to set border-radius in px */\n  radius?: MantineNumberSize;\n}\n\nexport function LoadingOverlay({\n  className,\n  visible,\n  loaderProps = {},\n  overlayOpacity = 0.75,\n  overlayColor,\n  transitionDuration = 200,\n  zIndex = getDefaultZIndex('overlay'),\n  style,\n  loader,\n  radius,\n  sx,\n  ...others\n}: LoadingOverlayProps) {\n  const { classes, cx, theme } = useStyles(null, { sx, name: 'LoadingOverlay' });\n\n  return (\n    <Transition duration={transitionDuration} mounted={visible} transition=\"fade\">\n      {(transitionStyles) => (\n        <div\n          className={cx(classes.root, className)}\n          style={{ ...transitionStyles, ...style, zIndex }}\n          {...others}\n        >\n          {loader ? (\n            <div style={{ zIndex: zIndex + 1 }}>{loader}</div>\n          ) : (\n            <Loader style={{ zIndex: zIndex + 1 }} {...loaderProps} />\n          )}\n\n          <Overlay\n            opacity={overlayOpacity}\n            zIndex={zIndex}\n            radius={radius}\n            color={\n              overlayColor || (theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.white)\n            }\n          />\n        </div>\n      )}\n    </Transition>\n  );\n}\n\nLoadingOverlay.displayName = '@mantine/core/LoadingOverlay';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"LoadingOverlay.js","sources":["../../../src/components/LoadingOverlay/LoadingOverlay.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, MantineMargin, MantineNumberSize, getDefaultZIndex } from '@mantine/styles';\nimport { Overlay } from '../Overlay';\nimport { Transition } from '../Transition';\nimport { Loader, LoaderProps } from '../Loader';\nimport { Box } from '../Box';\nimport useStyles from './LoadingOverlay.styles';\n\nexport interface LoadingOverlayProps\n  extends Omit<DefaultProps, MantineMargin>,\n    React.ComponentPropsWithoutRef<'div'> {\n  /** Provide custom loader */\n  loader?: React.ReactNode;\n\n  /** Loader component props */\n  loaderProps?: LoaderProps;\n\n  /** Sets overlay opacity */\n  overlayOpacity?: number;\n\n  /** Sets overlay color, defaults to theme.white in light theme and to theme.colors.dark[5] in dark theme */\n  overlayColor?: string;\n\n  /** Loading overlay z-index */\n  zIndex?: number;\n\n  /** If visible overlay will take 100% width and height of first parent with relative position and overlay all of its content */\n  visible: boolean;\n\n  /** Appear and disappear animation duration */\n  transitionDuration?: number;\n\n  /** Value from theme.radius or number to set border-radius in px */\n  radius?: MantineNumberSize;\n}\n\nexport const LoadingOverlay = forwardRef<HTMLDivElement, LoadingOverlayProps>(\n  (\n    {\n      className,\n      visible,\n      loaderProps = {},\n      overlayOpacity = 0.75,\n      overlayColor,\n      transitionDuration = 200,\n      zIndex = getDefaultZIndex('overlay'),\n      style,\n      loader,\n      radius,\n      ...others\n    }: LoadingOverlayProps,\n    ref\n  ) => {\n    const { classes, cx, theme } = useStyles(null, { name: 'LoadingOverlay' });\n\n    return (\n      <Transition duration={transitionDuration} mounted={visible} transition=\"fade\">\n        {(transitionStyles) => (\n          <Box\n            className={cx(classes.root, className)}\n            style={{ ...transitionStyles, ...style, zIndex }}\n            ref={ref}\n            {...others}\n          >\n            {loader ? (\n              <div style={{ zIndex: zIndex + 1 }}>{loader}</div>\n            ) : (\n              <Loader style={{ zIndex: zIndex + 1 }} {...loaderProps} />\n            )}\n\n            <Overlay\n              opacity={overlayOpacity}\n              zIndex={zIndex}\n              radius={radius}\n              color={\n                overlayColor || (theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.white)\n              }\n            />\n          </Box>\n        )}\n      </Transition>\n    );\n  }\n);\n\nLoadingOverlay.displayName = '@mantine/core/LoadingOverlay';\n"],"names":[],"mappings":"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"}

package/esm/components/Mark/Mark.js

@@ -1,6 +1,6 @@
 import React, { forwardRef } from 'react';
-import { useExtractedMargins } from '@mantine/styles';
 import useStyles from './Mark.styles.js';
+import { Box } from '../Box/Box.js';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
@@ -31,14 +31,13 @@ var __objRest = (source, exclude) => {
   return target;
 };
 const Mark = forwardRef((_a, ref) => {
-  var _b = _a, { color = "yellow", style, sx, className, classNames, styles } = _b, others = __objRest(_b, ["color", "style", "sx", "className", "classNames", "styles"]);
-  const { classes, cx } = useStyles({ color }, { sx, classNames, styles, name: "Mark" });
-  const { mergedStyles, rest } = useExtractedMargins({ others, style });
-  return /* @__PURE__ */ React.createElement("mark", __spreadValues({
+  var _b = _a, { color = "yellow", className, classNames, styles } = _b, others = __objRest(_b, ["color", "className", "classNames", "styles"]);
+  const { classes, cx } = useStyles({ color }, { classNames, styles, name: "Mark" });
+  return /* @__PURE__ */ React.createElement(Box, __spreadValues({
+    component: "mark",
     ref,
-    style: mergedStyles,
     className: cx(classes.root, className)
-  }, rest));
+  }, others));
 });
 Mark.displayName = "@mantine/core/Mark";
 

package/esm/components/Mark/Mark.js.map

@@ -1 +1 @@
-{"version":3,"file":"Mark.js","sources":["../../../src/components/Mark/Mark.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, MantineColor, useExtractedMargins } from '@mantine/styles';\nimport useStyles from './Mark.styles';\n\nexport interface MarkProps extends DefaultProps, React.ComponentPropsWithoutRef<'mark'> {\n  /** Background color from theme.colors */\n  color?: MantineColor;\n}\n\nexport const Mark = forwardRef<HTMLElement, MarkProps>(\n  ({ color = 'yellow', style, sx, className, classNames, styles, ...others }: MarkProps, ref) => {\n    const { classes, cx } = useStyles({ color }, { sx, classNames, styles, name: 'Mark' });\n    const { mergedStyles, rest } = useExtractedMargins({ others, style });\n    return (\n      <mark ref={ref} style={mergedStyles} className={cx(classes.root, className)} {...rest} />\n    );\n  }\n);\n\nMark.displayName = '@mantine/core/Mark';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Mark.js","sources":["../../../src/components/Mark/Mark.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, MantineColor } from '@mantine/styles';\nimport { Box } from '../Box';\nimport useStyles from './Mark.styles';\n\nexport interface MarkProps extends DefaultProps, React.ComponentPropsWithoutRef<'mark'> {\n  /** Background color from theme.colors */\n  color?: MantineColor;\n}\n\nexport const Mark = forwardRef<HTMLElement, MarkProps>(\n  ({ color = 'yellow', className, classNames, styles, ...others }: MarkProps, ref) => {\n    const { classes, cx } = useStyles({ color }, { classNames, styles, name: 'Mark' });\n    return <Box component=\"mark\" ref={ref} className={cx(classes.root, className)} {...others} />;\n  }\n);\n\nMark.displayName = '@mantine/core/Mark';\n"],"names":[],"mappings":"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"}

package/esm/components/MediaQuery/MediaQuery.js.map

@@ -1 +1 @@
-{"version":3,"file":"MediaQuery.js","sources":["../../../src/components/MediaQuery/MediaQuery.tsx"],"sourcesContent":["import React, { Children } from 'react';\nimport { MantineNumberSize, CSSObject } from '@mantine/styles';\nimport useStyles from './MediaQuery.styles';\n\nexport interface MediaQueryProps {\n  className?: string;\n\n  /** Child that should be shown at given breakpoint, it must accept className prop */\n  children: React.ReactNode;\n\n  /** Smaller than given breakpoint or value in px, will be hidden on larger viewport */\n  smallerThan?: MantineNumberSize;\n\n  /** Larger than given breakpoint or value in px, will be hidden on smaller viewport */\n  largerThan?: MantineNumberSize;\n\n  /** Any other media query */\n  query?: string;\n\n  /** Styles applied to child when breakpoint matches */\n  styles: CSSObject;\n}\n\nexport function MediaQuery({\n  children,\n  smallerThan,\n  largerThan,\n  query,\n  styles,\n  className,\n}: MediaQueryProps) {\n  const { classes, cx } = useStyles(\n    { smallerThan, largerThan, query, styles },\n    { name: 'MediaQuery' }\n  );\n  const child = Children.only(children) as React.ReactElement;\n  return React.cloneElement(child, {\n    className: cx(classes.media, child.props?.className, className),\n  });\n}\n\nMediaQuery.displayName = '@mantine/core/MediaQuery';\n"],"names":[],"mappings":";;;AAEO,SAAS,UAAU,CAAC;AAC3B,EAAE,QAAQ;AACV,EAAE,WAAW;AACb,EAAE,UAAU;AACZ,EAAE,KAAK;AACP,EAAE,MAAM;AACR,EAAE,SAAS;AACX,CAAC,EAAE;AACH,EAAE,IAAI,EAAE,CAAC;AACT,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,SAAS,CAAC,EAAE,WAAW,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE,CAAC,CAAC;AACxG,EAAE,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;AACxC,EAAE,OAAO,KAAK,CAAC,YAAY,CAAC,KAAK,EAAE;AACnC,IAAI,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC,EAAE,GAAG,KAAK,CAAC,KAAK,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;AAC/F,GAAG,CAAC,CAAC;AACL,CAAC;AACD,UAAU,CAAC,WAAW,GAAG,0BAA0B;;;;"}
+{"version":3,"file":"MediaQuery.js","sources":["../../../src/components/MediaQuery/MediaQuery.tsx"],"sourcesContent":["import React, { Children } from 'react';\nimport { MantineNumberSize, CSSObject } from '@mantine/styles';\nimport useStyles from './MediaQuery.styles';\n\nexport interface MediaQueryProps {\n  className?: string;\n\n  /** Child that should be shown at given breakpoint, it must accept className prop */\n  children: React.ReactNode;\n\n  /** Styles applied to child when viewport is smaller than given breakpoint */\n  smallerThan?: MantineNumberSize;\n\n  /** Styles applied to child when viewport is larger than given breakpoint */\n  largerThan?: MantineNumberSize;\n\n  /** Any other media query */\n  query?: string;\n\n  /** Styles applied to child when breakpoint matches */\n  styles: CSSObject;\n}\n\nexport function MediaQuery({\n  children,\n  smallerThan,\n  largerThan,\n  query,\n  styles,\n  className,\n}: MediaQueryProps) {\n  const { classes, cx } = useStyles(\n    { smallerThan, largerThan, query, styles },\n    { name: 'MediaQuery' }\n  );\n  const child = Children.only(children) as React.ReactElement;\n  return React.cloneElement(child, {\n    className: cx(classes.media, child.props?.className, className),\n  });\n}\n\nMediaQuery.displayName = '@mantine/core/MediaQuery';\n"],"names":[],"mappings":";;;AAEO,SAAS,UAAU,CAAC;AAC3B,EAAE,QAAQ;AACV,EAAE,WAAW;AACb,EAAE,UAAU;AACZ,EAAE,KAAK;AACP,EAAE,MAAM;AACR,EAAE,SAAS;AACX,CAAC,EAAE;AACH,EAAE,IAAI,EAAE,CAAC;AACT,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,SAAS,CAAC,EAAE,WAAW,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE,CAAC,CAAC;AACxG,EAAE,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;AACxC,EAAE,OAAO,KAAK,CAAC,YAAY,CAAC,KAAK,EAAE;AACnC,IAAI,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC,EAAE,GAAG,KAAK,CAAC,KAAK,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;AAC/F,GAAG,CAAC,CAAC;AACL,CAAC;AACD,UAAU,CAAC,WAAW,GAAG,0BAA0B;;;;"}

package/esm/components/MediaQuery/MediaQuery.styles.js

@@ -2,11 +2,17 @@ import { createStyles } from '@mantine/styles';
 
 var useStyles = createStyles((theme, { smallerThan, largerThan, query, styles }) => {
   const media = {};
-  if (smallerThan) {
-    media[`@media (min-width: ${theme.fn.size({ size: smallerThan, sizes: theme.breakpoints }) + 1}px)`] = styles;
-  }
-  if (largerThan) {
-    media[`@media (max-width: ${theme.fn.size({ size: largerThan, sizes: theme.breakpoints })}px)`] = styles;
+  const minWidth = theme.fn.size({ size: largerThan, sizes: theme.breakpoints }) + 1;
+  const maxWidth = theme.fn.size({ size: smallerThan, sizes: theme.breakpoints });
+  if (largerThan !== void 0 && smallerThan !== void 0) {
+    media[`@media (min-width: ${minWidth}px) and (max-width: ${maxWidth}px)`] = styles;
+  } else {
+    if (largerThan !== void 0) {
+      media[`@media (min-width: ${theme.fn.size({ size: largerThan, sizes: theme.breakpoints }) + 1}px)`] = styles;
+    }
+    if (smallerThan !== void 0) {
+      media[`@media (max-width: ${theme.fn.size({ size: smallerThan, sizes: theme.breakpoints })}px)`] = styles;
+    }
   }
   if (query) {
     media[`@media ${query}`] = styles;

package/esm/components/MediaQuery/MediaQuery.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"MediaQuery.styles.js","sources":["../../../src/components/MediaQuery/MediaQuery.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, CSSObject } from '@mantine/styles';\n\ninterface MediaQueryStyles {\n  smallerThan: MantineNumberSize;\n  largerThan: MantineNumberSize;\n  styles: CSSObject;\n  query: string;\n}\n\nexport default createStyles(\n  (theme, { smallerThan, largerThan, query, styles }: MediaQueryStyles) => {\n    const media: CSSObject = {};\n\n    if (smallerThan) {\n      media[\n        `@media (min-width: ${\n          theme.fn.size({ size: smallerThan, sizes: theme.breakpoints }) + 1\n        }px)`\n      ] = styles;\n    }\n\n    if (largerThan) {\n      media[\n        `@media (max-width: ${theme.fn.size({ size: largerThan, sizes: theme.breakpoints })}px)`\n      ] = styles;\n    }\n\n    if (query) {\n      media[`@media ${query}`] = styles;\n    }\n\n    return { media };\n  }\n);\n"],"names":[],"mappings":";;AACA,gBAAe,YAAY,CAAC,CAAC,KAAK,EAAE,EAAE,WAAW,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK;AACnF,EAAE,MAAM,KAAK,GAAG,EAAE,CAAC;AACnB,EAAE,IAAI,WAAW,EAAE;AACnB,IAAI,KAAK,CAAC,CAAC,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,KAAK,CAAC,WAAW,EAAE,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,MAAM,CAAC;AAClH,GAAG;AACH,EAAE,IAAI,UAAU,EAAE;AAClB,IAAI,KAAK,CAAC,CAAC,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,MAAM,CAAC;AAC7G,GAAG;AACH,EAAE,IAAI,KAAK,EAAE;AACb,IAAI,KAAK,CAAC,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC;AACtC,GAAG;AACH,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;AACnB,CAAC,CAAC;;;;"}
+{"version":3,"file":"MediaQuery.styles.js","sources":["../../../src/components/MediaQuery/MediaQuery.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, CSSObject } from '@mantine/styles';\n\ninterface MediaQueryStyles {\n  smallerThan: MantineNumberSize;\n  largerThan: MantineNumberSize;\n  styles: CSSObject;\n  query: string;\n}\n\nexport default createStyles(\n  (theme, { smallerThan, largerThan, query, styles }: MediaQueryStyles) => {\n    const media: CSSObject = {};\n    const minWidth = theme.fn.size({ size: largerThan, sizes: theme.breakpoints }) + 1;\n    const maxWidth = theme.fn.size({ size: smallerThan, sizes: theme.breakpoints });\n\n    if (largerThan !== undefined && smallerThan !== undefined) {\n      media[`@media (min-width: ${minWidth}px) and (max-width: ${maxWidth}px)`] = styles;\n    } else {\n      if (largerThan !== undefined) {\n        media[\n          `@media (min-width: ${\n            theme.fn.size({ size: largerThan, sizes: theme.breakpoints }) + 1\n          }px)`\n        ] = styles;\n      }\n\n      if (smallerThan !== undefined) {\n        media[\n          `@media (max-width: ${theme.fn.size({ size: smallerThan, sizes: theme.breakpoints })}px)`\n        ] = styles;\n      }\n    }\n\n    if (query) {\n      media[`@media ${query}`] = styles;\n    }\n\n    return { media };\n  }\n);\n"],"names":[],"mappings":";;AACA,gBAAe,YAAY,CAAC,CAAC,KAAK,EAAE,EAAE,WAAW,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK;AACnF,EAAE,MAAM,KAAK,GAAG,EAAE,CAAC;AACnB,EAAE,MAAM,QAAQ,GAAG,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,CAAC,WAAW,EAAE,CAAC,GAAG,CAAC,CAAC;AACrF,EAAE,MAAM,QAAQ,GAAG,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC;AAClF,EAAE,IAAI,UAAU,KAAK,KAAK,CAAC,IAAI,WAAW,KAAK,KAAK,CAAC,EAAE;AACvD,IAAI,KAAK,CAAC,CAAC,mBAAmB,EAAE,QAAQ,CAAC,oBAAoB,EAAE,QAAQ,CAAC,GAAG,CAAC,CAAC,GAAG,MAAM,CAAC;AACvF,GAAG,MAAM;AACT,IAAI,IAAI,UAAU,KAAK,KAAK,CAAC,EAAE;AAC/B,MAAM,KAAK,CAAC,CAAC,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,CAAC,WAAW,EAAE,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,MAAM,CAAC;AACnH,KAAK;AACL,IAAI,IAAI,WAAW,KAAK,KAAK,CAAC,EAAE;AAChC,MAAM,KAAK,CAAC,CAAC,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,MAAM,CAAC;AAChH,KAAK;AACL,GAAG;AACH,EAAE,IAAI,KAAK,EAAE;AACb,IAAI,KAAK,CAAC,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC;AACtC,GAAG;AACH,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;AACnB,CAAC,CAAC;;;;"}