@mantine/core 3.6.13 → 3.7.0-alpha.1

package/esm/components/Divider/Divider.js

@@ -1,5 +1,5 @@
 import React, { forwardRef } from 'react';
-import { useMantineTheme } from '@mantine/styles';
+import { useMantineDefaultProps, useMantineTheme } from '@mantine/styles';
 import useStyles from './Divider.styles.js';
 import { Box } from '../Box/Box.js';
 import { Text } from '../Text/Text.js';
@@ -35,19 +35,25 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-const Divider = forwardRef((_a, ref) => {
-  var _b = _a, {
+const defaultProps = {
+  orientation: "horizontal",
+  size: "xs",
+  labelPosition: "left",
+  variant: "solid"
+};
+const Divider = forwardRef((props, ref) => {
+  const _a = useMantineDefaultProps("Divider", defaultProps, props), {
     className,
     color,
-    orientation = "horizontal",
-    size = "xs",
+    orientation,
+    size,
     label,
-    labelPosition = "left",
+    labelPosition,
     labelProps,
-    variant = "solid",
+    variant,
     styles,
     classNames
-  } = _b, others = __objRest(_b, [
+  } = _a, others = __objRest(_a, [
     "className",
     "color",
     "orientation",

package/esm/components/Divider/Divider.js.map

@@ -1 +1 @@
-{"version":3,"file":"Divider.js","sources":["../../../src/components/Divider/Divider.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { useMantineTheme, DefaultProps, MantineNumberSize, MantineColor } from '@mantine/styles';\nimport useStyles from './Divider.styles';\nimport { Text } from '../Text';\nimport { Box } from '../Box';\n\nexport type DividerStylesNames = 'label';\n\nexport interface DividerProps\n  extends DefaultProps<DividerStylesNames>,\n    React.ComponentPropsWithoutRef<'div'> {\n  /** Line color from theme, defaults to gray in light color scheme and to dark in dark color scheme */\n  color?: MantineColor;\n\n  /** Line orientation */\n  orientation?: 'horizontal' | 'vertical';\n\n  /** Sets height in horizontal orientation and width in vertical */\n  size?: MantineNumberSize;\n\n  /** Adds text after line in horizontal orientation */\n  label?: React.ReactNode;\n\n  /** Label position */\n  labelPosition?: 'left' | 'center' | 'right';\n\n  /** Props spread to Text component in label */\n  labelProps?: Record<string, any>;\n\n  /** Divider borderStyle */\n  variant?: 'solid' | 'dashed' | 'dotted';\n}\n\nexport const Divider = forwardRef<HTMLDivElement, DividerProps>(\n  (\n    {\n      className,\n      color,\n      orientation = 'horizontal',\n      size = 'xs',\n      label,\n      labelPosition = 'left',\n      labelProps,\n      variant = 'solid',\n      styles,\n      classNames,\n      ...others\n    }: DividerProps,\n    ref\n  ) => {\n    const theme = useMantineTheme();\n    const _color = color || (theme.colorScheme === 'dark' ? 'dark' : 'gray');\n    const { classes, cx } = useStyles(\n      { color: _color, size, variant },\n      { classNames, styles, name: 'Divider' }\n    );\n\n    const vertical = orientation === 'vertical';\n    const horizontal = !vertical;\n    const withLabel = !!label && horizontal;\n\n    return (\n      <Box\n        ref={ref}\n        className={cx(\n          {\n            [classes.vertical]: vertical,\n            [classes.horizontal]: horizontal,\n            [classes.withLabel]: withLabel,\n          },\n          className\n        )}\n        {...others}\n      >\n        {!!label && horizontal && (\n          <Text\n            {...labelProps}\n            color={_color}\n            size={labelProps?.size || 'xs'}\n            sx={{ marginTop: 2 }}\n            className={cx(classes.label, classes[labelPosition])}\n          >\n            {label}\n          </Text>\n        )}\n      </Box>\n    );\n  }\n);\n\nDivider.displayName = '@mantine/core/Divider';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Divider.js","sources":["../../../src/components/Divider/Divider.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport {\n  useMantineTheme,\n  DefaultProps,\n  MantineNumberSize,\n  MantineColor,\n  useMantineDefaultProps,\n} from '@mantine/styles';\nimport useStyles from './Divider.styles';\nimport { Text } from '../Text';\nimport { Box } from '../Box';\n\nexport type DividerStylesNames = 'label';\n\nexport interface DividerProps\n  extends DefaultProps<DividerStylesNames>,\n    React.ComponentPropsWithoutRef<'div'> {\n  /** Line color from theme, defaults to gray in light color scheme and to dark in dark color scheme */\n  color?: MantineColor;\n\n  /** Line orientation */\n  orientation?: 'horizontal' | 'vertical';\n\n  /** Sets height in horizontal orientation and width in vertical */\n  size?: MantineNumberSize;\n\n  /** Adds text after line in horizontal orientation */\n  label?: React.ReactNode;\n\n  /** Label position */\n  labelPosition?: 'left' | 'center' | 'right';\n\n  /** Props spread to Text component in label */\n  labelProps?: Record<string, any>;\n\n  /** Divider borderStyle */\n  variant?: 'solid' | 'dashed' | 'dotted';\n}\n\nconst defaultProps: Partial<DividerProps> = {\n  orientation: 'horizontal',\n  size: 'xs',\n  labelPosition: 'left',\n  variant: 'solid',\n};\n\nexport const Divider = forwardRef<HTMLDivElement, DividerProps>((props: DividerProps, ref) => {\n  const {\n    className,\n    color,\n    orientation,\n    size,\n    label,\n    labelPosition,\n    labelProps,\n    variant,\n    styles,\n    classNames,\n    ...others\n  } = useMantineDefaultProps('Divider', defaultProps, props);\n\n  const theme = useMantineTheme();\n  const _color = color || (theme.colorScheme === 'dark' ? 'dark' : 'gray');\n  const { classes, cx } = useStyles(\n    { color: _color, size, variant },\n    { classNames, styles, name: 'Divider' }\n  );\n\n  const vertical = orientation === 'vertical';\n  const horizontal = !vertical;\n  const withLabel = !!label && horizontal;\n\n  return (\n    <Box\n      ref={ref}\n      className={cx(\n        {\n          [classes.vertical]: vertical,\n          [classes.horizontal]: horizontal,\n          [classes.withLabel]: withLabel,\n        },\n        className\n      )}\n      {...others}\n    >\n      {!!label && horizontal && (\n        <Text\n          {...labelProps}\n          color={_color}\n          size={labelProps?.size || 'xs'}\n          sx={{ marginTop: 2 }}\n          className={cx(classes.label, classes[labelPosition])}\n        >\n          {label}\n        </Text>\n      )}\n    </Box>\n  );\n});\n\nDivider.displayName = '@mantine/core/Divider';\n"],"names":[],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"Divider.styles.js","sources":["../../../src/components/Divider/Divider.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, MantineColor } from '@mantine/styles';\n\ninterface DividerStyles {\n  size: MantineNumberSize;\n  variant: 'solid' | 'dashed' | 'dotted';\n  color: MantineColor;\n}\n\nexport const sizes = {\n  xs: 1,\n  sm: 2,\n  md: 3,\n  lg: 4,\n  xl: 5,\n};\n\nexport default createStyles((theme, { size, variant, color }: DividerStyles) => ({\n  withLabel: {\n    borderTop: '0 !important',\n  },\n\n  left: {\n    '&::before': {\n      display: 'none',\n    },\n  },\n\n  right: {\n    '&::after': {\n      display: 'none',\n    },\n  },\n\n  label: {\n    display: 'flex',\n    alignItems: 'center',\n    color: color === 'dark' ? theme.colors.dark[1] : theme.fn.themeColor(color, 6),\n\n    '&::before': {\n      content: '\"\"',\n      flex: 1,\n      height: 1,\n      borderTop: `${theme.fn.size({ size, sizes })}px ${variant} ${theme.fn.themeColor(\n        color,\n        theme.colorScheme === 'dark' ? 3 : 4\n      )}`,\n      marginRight: theme.spacing.xs,\n    },\n\n    '&::after': {\n      content: '\"\"',\n      flex: 1,\n      borderTop: `${theme.fn.size({ size, sizes })}px ${variant} ${theme.fn.themeColor(\n        color,\n        theme.colorScheme === 'dark' ? 3 : 4\n      )}`,\n      marginLeft: theme.spacing.xs,\n    },\n  },\n\n  horizontal: {\n    border: 0,\n    borderTopWidth: theme.fn.size({ size, sizes }),\n    borderTopColor: theme.fn.themeColor(color, theme.colorScheme === 'dark' ? 3 : 4),\n    borderTopStyle: variant,\n    margin: 0,\n  },\n\n  vertical: {\n    border: 0,\n    alignSelf: 'stretch',\n    height: '100%',\n    borderLeftWidth: theme.fn.size({ size, sizes }),\n    borderLeftColor: theme.fn.themeColor(color, 4),\n    borderLeftStyle: variant,\n  },\n}));\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Divider.styles.js","sources":["../../../src/components/Divider/Divider.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, MantineColor } from '@mantine/styles';\n\nexport interface DividerStylesParams {\n  size: MantineNumberSize;\n  variant: 'solid' | 'dashed' | 'dotted';\n  color: MantineColor;\n}\n\nexport const sizes = {\n  xs: 1,\n  sm: 2,\n  md: 3,\n  lg: 4,\n  xl: 5,\n};\n\nexport default createStyles((theme, { size, variant, color }: DividerStylesParams) => ({\n  withLabel: {\n    borderTop: '0 !important',\n  },\n\n  left: {\n    '&::before': {\n      display: 'none',\n    },\n  },\n\n  right: {\n    '&::after': {\n      display: 'none',\n    },\n  },\n\n  label: {\n    display: 'flex',\n    alignItems: 'center',\n    color: color === 'dark' ? theme.colors.dark[1] : theme.fn.themeColor(color, 6),\n\n    '&::before': {\n      content: '\"\"',\n      flex: 1,\n      height: 1,\n      borderTop: `${theme.fn.size({ size, sizes })}px ${variant} ${theme.fn.themeColor(\n        color,\n        theme.colorScheme === 'dark' ? 3 : 4\n      )}`,\n      marginRight: theme.spacing.xs,\n    },\n\n    '&::after': {\n      content: '\"\"',\n      flex: 1,\n      borderTop: `${theme.fn.size({ size, sizes })}px ${variant} ${theme.fn.themeColor(\n        color,\n        theme.colorScheme === 'dark' ? 3 : 4\n      )}`,\n      marginLeft: theme.spacing.xs,\n    },\n  },\n\n  horizontal: {\n    border: 0,\n    borderTopWidth: theme.fn.size({ size, sizes }),\n    borderTopColor: theme.fn.themeColor(color, theme.colorScheme === 'dark' ? 3 : 4),\n    borderTopStyle: variant,\n    margin: 0,\n  },\n\n  vertical: {\n    border: 0,\n    alignSelf: 'stretch',\n    height: '100%',\n    borderLeftWidth: theme.fn.size({ size, sizes }),\n    borderLeftColor: theme.fn.themeColor(color, 4),\n    borderLeftStyle: variant,\n  },\n}));\n"],"names":[],"mappings":"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"}

package/esm/components/Drawer/Drawer.js

@@ -1,8 +1,8 @@
 import React, { useEffect } from 'react';
 import { useFocusTrap, useScrollLock, useFocusReturn } from '@mantine/hooks';
-import { getDefaultZIndex } from '@mantine/styles';
+import { getDefaultZIndex, useMantineDefaultProps } from '@mantine/styles';
 import useStyles from './Drawer.styles.js';
-import { Portal } from '../Portal/Portal.js';
+import { OptionalPortal } from '../Portal/OptionalPortal.js';
 import { GroupedTransition } from '../Transition/GroupedTransition.js';
 import { Box } from '../Box/Box.js';
 import { Paper } from '../Paper/Paper.js';
@@ -53,43 +53,60 @@ const rtlTransitions = {
   right: "slide-right",
   left: "slide-left"
 };
-function MantineDrawer(_a) {
-  var _b = _a, {
+const defaultProps = {
+  position: "left",
+  size: "md",
+  transitionDuration: 250,
+  transitionTimingFunction: "ease",
+  zIndex: getDefaultZIndex("modal"),
+  shadow: "md",
+  padding: 0,
+  lockScroll: true,
+  closeOnClickOutside: true,
+  closeOnEscape: true,
+  trapFocus: true,
+  withOverlay: true,
+  withCloseButton: true,
+  withinPortal: true
+};
+function Drawer(props) {
+  const _a = useMantineDefaultProps("Drawer", defaultProps, props), {
     className,
     opened,
     onClose,
-    position = "left",
-    size = "md",
-    noFocusTrap = false,
-    noScrollLock = false,
-    noCloseOnClickOutside = false,
-    noCloseOnEscape = false,
+    position,
+    size,
+    trapFocus,
+    lockScroll,
+    closeOnClickOutside,
+    closeOnEscape,
     transition,
-    transitionDuration = 250,
-    transitionTimingFunction = "ease",
-    zIndex = getDefaultZIndex("modal"),
+    transitionDuration,
+    transitionTimingFunction,
+    zIndex,
     overlayColor,
     overlayOpacity,
     children,
-    noOverlay = false,
-    shadow = "md",
-    padding = 0,
+    withOverlay,
+    shadow,
+    padding,
     title,
-    hideCloseButton,
+    withCloseButton,
     closeButtonLabel,
     classNames,
     styles,
-    target
-  } = _b, others = __objRest(_b, [
+    target,
+    withinPortal
+  } = _a, others = __objRest(_a, [
     "className",
     "opened",
     "onClose",
     "position",
     "size",
-    "noFocusTrap",
-    "noScrollLock",
-    "noCloseOnClickOutside",
-    "noCloseOnEscape",
+    "trapFocus",
+    "lockScroll",
+    "closeOnClickOutside",
+    "closeOnEscape",
     "transition",
     "transitionDuration",
     "transitionTimingFunction",
@@ -97,36 +114,42 @@ function MantineDrawer(_a) {
     "overlayColor",
     "overlayOpacity",
     "children",
-    "noOverlay",
+    "withOverlay",
     "shadow",
     "padding",
     "title",
-    "hideCloseButton",
+    "withCloseButton",
     "closeButtonLabel",
     "classNames",
     "styles",
-    "target"
+    "target",
+    "withinPortal"
   ]);
-  const { classes, cx, theme } = useStyles({ size, position }, { classNames, styles, name: "Drawer" });
-  const focusTrapRef = useFocusTrap(!noFocusTrap && opened);
-  const [, lockScroll] = useScrollLock();
+  const { classes, cx, theme } = useStyles({ size, position, zIndex }, { classNames, styles, name: "Drawer" });
+  const focusTrapRef = useFocusTrap(trapFocus && opened);
+  const [, _lockScroll] = useScrollLock();
   const drawerTransition = transition || (theme.dir === "rtl" ? rtlTransitions : transitions)[position];
   const _overlayOpacity = typeof overlayOpacity === "number" ? overlayOpacity : theme.colorScheme === "dark" ? 0.85 : 0.75;
-  const closeOnEscape = (event) => {
-    if (noFocusTrap && event.code === "Escape" && !noCloseOnEscape) {
+  const _closeOnEscape = (event) => {
+    if (event.code === "Escape" && closeOnEscape) {
       onClose();
     }
   };
   useEffect(() => {
-    if (noFocusTrap) {
-      window.addEventListener("keydown", closeOnEscape);
-      return () => window.removeEventListener("keydown", closeOnEscape);
+    if (!trapFocus) {
+      window.addEventListener("keydown", _closeOnEscape);
+      return () => window.removeEventListener("keydown", _closeOnEscape);
     }
-  }, [noFocusTrap]);
-  useFocusReturn({ opened, transitionDuration });
-  return /* @__PURE__ */ React.createElement(GroupedTransition, {
-    onExited: () => lockScroll(false),
-    onEntered: () => lockScroll(!noScrollLock && true),
+    return void 0;
+  }, [trapFocus]);
+  useFocusReturn({ opened, transitionDuration: 0 });
+  return /* @__PURE__ */ React.createElement(OptionalPortal, {
+    withinPortal,
+    zIndex,
+    target
+  }, /* @__PURE__ */ React.createElement(GroupedTransition, {
+    onExited: () => _lockScroll(false),
+    onEntered: () => _lockScroll(lockScroll && true),
     mounted: opened,
     transitions: {
       overlay: { duration: transitionDuration / 2, transition: "fade", timingFunction: "ease" },
@@ -137,10 +160,10 @@ function MantineDrawer(_a) {
       }
     }
   }, (transitionStyles) => /* @__PURE__ */ React.createElement(Box, __spreadValues({
-    className: cx(classes.root, { [classes.noOverlay]: noOverlay }, className),
+    className: cx(classes.root, { [classes.noOverlay]: !withOverlay }, className),
     role: "dialog",
     "aria-modal": true,
-    onMouseDown: () => !noCloseOnClickOutside && onClose()
+    onMouseDown: () => closeOnClickOutside && onClose()
   }, others), /* @__PURE__ */ React.createElement(Paper, {
     onMouseDown: (event) => event.stopPropagation(),
     className: cx(classes.drawer, className),
@@ -151,42 +174,29 @@ function MantineDrawer(_a) {
     onKeyDownCapture: (event) => {
       var _a2;
       const shouldTrigger = ((_a2 = event.target) == null ? void 0 : _a2.getAttribute("data-mantine-stop-propagation")) !== "true";
-      shouldTrigger && event.nativeEvent.code === "Escape" && !noCloseOnEscape && onClose();
+      shouldTrigger && event.nativeEvent.code === "Escape" && closeOnEscape && onClose();
     },
     shadow,
-    padding
-  }, (title || !hideCloseButton) && /* @__PURE__ */ React.createElement("div", {
+    p: padding
+  }, (title || withCloseButton) && /* @__PURE__ */ React.createElement("div", {
     className: classes.header
   }, /* @__PURE__ */ React.createElement(Text, {
     className: classes.title
-  }, title), !hideCloseButton && /* @__PURE__ */ React.createElement(CloseButton, {
+  }, title), withCloseButton && /* @__PURE__ */ React.createElement(CloseButton, {
     iconSize: 16,
     onClick: onClose,
     "aria-label": closeButtonLabel,
     className: classes.closeButton
-  })), children), !noOverlay && /* @__PURE__ */ React.createElement("div", {
+  })), children), withOverlay && /* @__PURE__ */ React.createElement("div", {
     style: transitionStyles.overlay
   }, /* @__PURE__ */ React.createElement(Overlay, {
     className: classes.overlay,
     opacity: _overlayOpacity,
     zIndex,
     color: overlayColor || (theme.colorScheme === "dark" ? theme.colors.dark[9] : theme.black)
-  }))));
-}
-function Drawer(_c) {
-  var _d = _c, {
-    zIndex = getDefaultZIndex("modal"),
-    target
-  } = _d, props = __objRest(_d, [
-    "zIndex",
-    "target"
-  ]);
-  return /* @__PURE__ */ React.createElement(Portal, {
-    zIndex,
-    target
-  }, /* @__PURE__ */ React.createElement(MantineDrawer, __spreadValues({}, props)));
+  })))));
 }
 Drawer.displayName = "@mantine/core/Drawer";
 
-export { Drawer, MantineDrawer };
+export { Drawer };
 //# sourceMappingURL=Drawer.js.map

package/esm/components/Drawer/Drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.js","sources":["../../../src/components/Drawer/Drawer.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { useScrollLock, useFocusTrap, useFocusReturn } from '@mantine/hooks';\nimport {\n  DefaultProps,\n  MantineNumberSize,\n  MantineShadow,\n  ClassNames,\n  MantineMargin,\n  getDefaultZIndex,\n} from '@mantine/styles';\nimport { Paper } from '../Paper';\nimport { Overlay } from '../Overlay';\nimport { Portal } from '../Portal';\nimport { Text } from '../Text';\nimport { Box } from '../Box';\nimport { CloseButton } from '../ActionIcon';\nimport { GroupedTransition, MantineTransition } from '../Transition';\nimport useStyles, { DrawerPosition } from './Drawer.styles';\n\nexport type DrawerStylesNames = Exclude<ClassNames<typeof useStyles>, 'noOverlay'>;\n\nexport interface DrawerProps\n  extends Omit<DefaultProps<DrawerStylesNames>, MantineMargin>,\n    Omit<React.ComponentPropsWithoutRef<'div'>, 'title'> {\n  /** If true drawer is mounted to the dom */\n  opened: boolean;\n\n  /** Called when drawer is closed (Escape key and click outside, depending on options) */\n  onClose(): void;\n\n  /** Drawer body position */\n  position?: DrawerPosition;\n\n  /** Drawer body width (right | left position) or height (top | bottom position), cannot exceed 100vh for height and 100% for width */\n  size?: string | number;\n\n  /** Drawer body shadow from theme or any css shadow value */\n  shadow?: MantineShadow;\n\n  /** Drawer body padding from theme or number for padding in px */\n  padding?: MantineNumberSize;\n\n  /** Drawer z-index property */\n  zIndex?: number;\n\n  /** Disables focus trap */\n  noFocusTrap?: boolean;\n\n  /** Disables scroll lock */\n  noScrollLock?: boolean;\n\n  /** Disable onClock trigger for outside events */\n  noCloseOnClickOutside?: boolean;\n\n  /** Disable onClock trigger for escape key press */\n  noCloseOnEscape?: boolean;\n\n  /** Drawer appear and disappear transition, see Transition component for full documentation */\n  transition?: MantineTransition;\n\n  /** Transition duration in ms */\n  transitionDuration?: number;\n\n  /** Drawer transitionTimingFunction css property */\n  transitionTimingFunction?: string;\n\n  /** Removes overlay entirely */\n  noOverlay?: boolean;\n\n  /** Sets overlay opacity, defaults to 0.75 in light theme and to 0.85 in dark theme */\n  overlayOpacity?: number;\n\n  /** Sets overlay color, defaults to theme.black in light theme and to theme.colors.dark[9] in dark theme */\n  overlayColor?: string;\n\n  /** Drawer title, displayed in header before close button */\n  title?: React.ReactNode;\n\n  /** Hides close button, modal still can be closed with escape key and by clicking outside */\n  hideCloseButton?: boolean;\n\n  /** Close button aria-label */\n  closeButtonLabel?: string;\n\n  /** Target element or selector where drawer portal should be rendered */\n  target?: HTMLElement | string;\n}\n\nconst transitions: Record<DrawerPosition, MantineTransition> = {\n  top: 'slide-down',\n  bottom: 'slide-up',\n  left: 'slide-right',\n  right: 'slide-left',\n};\n\nconst rtlTransitions: Record<DrawerPosition, MantineTransition> = {\n  top: 'slide-down',\n  bottom: 'slide-up',\n  right: 'slide-right',\n  left: 'slide-left',\n};\n\nexport function MantineDrawer({\n  className,\n  opened,\n  onClose,\n  position = 'left',\n  size = 'md',\n  noFocusTrap = false,\n  noScrollLock = false,\n  noCloseOnClickOutside = false,\n  noCloseOnEscape = false,\n  transition,\n  transitionDuration = 250,\n  transitionTimingFunction = 'ease',\n  zIndex = getDefaultZIndex('modal'),\n  overlayColor,\n  overlayOpacity,\n  children,\n  noOverlay = false,\n  shadow = 'md',\n  padding = 0,\n  title,\n  hideCloseButton,\n  closeButtonLabel,\n  classNames,\n  styles,\n  target,\n  ...others\n}: DrawerProps) {\n  const { classes, cx, theme } = useStyles(\n    { size, position },\n    { classNames, styles, name: 'Drawer' }\n  );\n  const focusTrapRef = useFocusTrap(!noFocusTrap && opened);\n\n  const [, lockScroll] = useScrollLock();\n\n  const drawerTransition =\n    transition || (theme.dir === 'rtl' ? rtlTransitions : transitions)[position];\n  const _overlayOpacity =\n    typeof overlayOpacity === 'number'\n      ? overlayOpacity\n      : theme.colorScheme === 'dark'\n      ? 0.85\n      : 0.75;\n\n  const closeOnEscape = (event: KeyboardEvent) => {\n    if (noFocusTrap && event.code === 'Escape' && !noCloseOnEscape) {\n      onClose();\n    }\n  };\n\n  // eslint-disable-next-line consistent-return\n  useEffect(() => {\n    // onKeyDownCapture event will not fire when focus trap is not active\n    if (noFocusTrap) {\n      window.addEventListener('keydown', closeOnEscape);\n      return () => window.removeEventListener('keydown', closeOnEscape);\n    }\n  }, [noFocusTrap]);\n\n  useFocusReturn({ opened, transitionDuration });\n\n  return (\n    <GroupedTransition\n      onExited={() => lockScroll(false)}\n      onEntered={() => lockScroll(!noScrollLock && true)}\n      mounted={opened}\n      transitions={{\n        overlay: { duration: transitionDuration / 2, transition: 'fade', timingFunction: 'ease' },\n        drawer: {\n          duration: transitionDuration,\n          transition: drawerTransition,\n          timingFunction: transitionTimingFunction,\n        },\n      }}\n    >\n      {(transitionStyles) => (\n        <Box\n          className={cx(classes.root, { [classes.noOverlay]: noOverlay }, className)}\n          role=\"dialog\"\n          aria-modal\n          onMouseDown={() => !noCloseOnClickOutside && onClose()}\n          {...others}\n        >\n          <Paper<'div'>\n            onMouseDown={(event) => event.stopPropagation()}\n            className={cx(classes.drawer, className)}\n            ref={focusTrapRef}\n            style={{ ...transitionStyles.drawer, zIndex: zIndex + 2 }}\n            radius={0}\n            tabIndex={-1}\n            onKeyDownCapture={(event) => {\n              const shouldTrigger =\n                (event.target as any)?.getAttribute('data-mantine-stop-propagation') !== 'true';\n\n              shouldTrigger && event.nativeEvent.code === 'Escape' && !noCloseOnEscape && onClose();\n            }}\n            shadow={shadow}\n            padding={padding}\n          >\n            {(title || !hideCloseButton) && (\n              <div className={classes.header}>\n                <Text className={classes.title}>{title}</Text>\n\n                {!hideCloseButton && (\n                  <CloseButton\n                    iconSize={16}\n                    onClick={onClose}\n                    aria-label={closeButtonLabel}\n                    className={classes.closeButton}\n                  />\n                )}\n              </div>\n            )}\n            {children}\n          </Paper>\n\n          {!noOverlay && (\n            <div style={transitionStyles.overlay}>\n              <Overlay\n                className={classes.overlay}\n                opacity={_overlayOpacity}\n                zIndex={zIndex}\n                color={\n                  overlayColor ||\n                  (theme.colorScheme === 'dark' ? theme.colors.dark[9] : theme.black)\n                }\n              />\n            </div>\n          )}\n        </Box>\n      )}\n    </GroupedTransition>\n  );\n}\n\nexport function Drawer({\n  zIndex = getDefaultZIndex('modal'),\n  target,\n  ...props\n}: React.ComponentPropsWithoutRef<typeof MantineDrawer>) {\n  return (\n    <Portal zIndex={zIndex} target={target}>\n      <MantineDrawer {...props} />\n    </Portal>\n  );\n}\n\nDrawer.displayName = '@mantine/core/Drawer';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Drawer.js","sources":["../../../src/components/Drawer/Drawer.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { useScrollLock, useFocusTrap, useFocusReturn } from '@mantine/hooks';\nimport {\n  DefaultProps,\n  MantineNumberSize,\n  MantineShadow,\n  ClassNames,\n  MantineStyleSystemSize,\n  getDefaultZIndex,\n  useMantineDefaultProps,\n} from '@mantine/styles';\nimport { Paper } from '../Paper';\nimport { Overlay } from '../Overlay';\nimport { OptionalPortal } from '../Portal';\nimport { Text } from '../Text';\nimport { Box } from '../Box';\nimport { CloseButton } from '../ActionIcon';\nimport { GroupedTransition, MantineTransition } from '../Transition';\nimport useStyles, { DrawerPosition } from './Drawer.styles';\n\nexport type DrawerStylesNames = Exclude<ClassNames<typeof useStyles>, 'withOverlay'>;\n\nexport interface DrawerProps\n  extends Omit<DefaultProps<DrawerStylesNames>, MantineStyleSystemSize>,\n    Omit<React.ComponentPropsWithoutRef<'div'>, 'title'> {\n  /** If true drawer is mounted to the dom */\n  opened: boolean;\n\n  /** Called when drawer is closed (Escape key and click outside, depending on options) */\n  onClose(): void;\n\n  /** Drawer body position */\n  position?: DrawerPosition;\n\n  /** Drawer body width (right | left position) or height (top | bottom position), cannot exceed 100vh for height and 100% for width */\n  size?: string | number;\n\n  /** Drawer body shadow from theme or any css shadow value */\n  shadow?: MantineShadow;\n\n  /** Drawer body padding from theme or number for padding in px */\n  padding?: MantineNumberSize;\n\n  /** Drawer z-index property */\n  zIndex?: number;\n\n  /** Disables focus trap */\n  trapFocus?: boolean;\n\n  /** Disables scroll lock */\n  lockScroll?: boolean;\n\n  /** Disable onClock trigger for outside events */\n  closeOnClickOutside?: boolean;\n\n  /** Disable onClock trigger for escape key press */\n  closeOnEscape?: boolean;\n\n  /** Drawer appear and disappear transition, see Transition component for full documentation */\n  transition?: MantineTransition;\n\n  /** Transition duration in ms */\n  transitionDuration?: number;\n\n  /** Drawer transitionTimingFunction css property */\n  transitionTimingFunction?: string;\n\n  /** Removes overlay entirely */\n  withOverlay?: boolean;\n\n  /** Sets overlay opacity, defaults to 0.75 in light theme and to 0.85 in dark theme */\n  overlayOpacity?: number;\n\n  /** Sets overlay color, defaults to theme.black in light theme and to theme.colors.dark[9] in dark theme */\n  overlayColor?: string;\n\n  /** Drawer title, displayed in header before close button */\n  title?: React.ReactNode;\n\n  /** Hides close button if set to false, drawer still can be closed with escape key and by clicking outside */\n  withCloseButton?: boolean;\n\n  /** Close button aria-label */\n  closeButtonLabel?: string;\n\n  /** Target element or selector where drawer portal should be rendered */\n  target?: HTMLElement | string;\n\n  /** Determines whether drawer should be rendered within Portal, defaults to true */\n  withinPortal?: boolean;\n}\n\nconst transitions: Record<DrawerPosition, MantineTransition> = {\n  top: 'slide-down',\n  bottom: 'slide-up',\n  left: 'slide-right',\n  right: 'slide-left',\n};\n\nconst rtlTransitions: Record<DrawerPosition, MantineTransition> = {\n  top: 'slide-down',\n  bottom: 'slide-up',\n  right: 'slide-right',\n  left: 'slide-left',\n};\n\nconst defaultProps: Partial<DrawerProps> = {\n  position: 'left',\n  size: 'md',\n  transitionDuration: 250,\n  transitionTimingFunction: 'ease',\n  zIndex: getDefaultZIndex('modal'),\n  shadow: 'md',\n  padding: 0,\n  lockScroll: true,\n  closeOnClickOutside: true,\n  closeOnEscape: true,\n  trapFocus: true,\n  withOverlay: true,\n  withCloseButton: true,\n  withinPortal: true,\n};\n\nexport function Drawer(props: DrawerProps) {\n  const {\n    className,\n    opened,\n    onClose,\n    position,\n    size,\n    trapFocus,\n    lockScroll,\n    closeOnClickOutside,\n    closeOnEscape,\n    transition,\n    transitionDuration,\n    transitionTimingFunction,\n    zIndex,\n    overlayColor,\n    overlayOpacity,\n    children,\n    withOverlay,\n    shadow,\n    padding,\n    title,\n    withCloseButton,\n    closeButtonLabel,\n    classNames,\n    styles,\n    target,\n    withinPortal,\n    ...others\n  } = useMantineDefaultProps('Drawer', defaultProps, props);\n\n  const { classes, cx, theme } = useStyles(\n    { size, position, zIndex },\n    { classNames, styles, name: 'Drawer' }\n  );\n\n  const focusTrapRef = useFocusTrap(trapFocus && opened);\n\n  const [, _lockScroll] = useScrollLock();\n\n  const drawerTransition =\n    transition || (theme.dir === 'rtl' ? rtlTransitions : transitions)[position];\n  const _overlayOpacity =\n    typeof overlayOpacity === 'number'\n      ? overlayOpacity\n      : theme.colorScheme === 'dark'\n      ? 0.85\n      : 0.75;\n\n  const _closeOnEscape = (event: KeyboardEvent) => {\n    if (event.code === 'Escape' && closeOnEscape) {\n      onClose();\n    }\n  };\n\n  useEffect(() => {\n    if (!trapFocus) {\n      window.addEventListener('keydown', _closeOnEscape);\n      return () => window.removeEventListener('keydown', _closeOnEscape);\n    }\n\n    return undefined;\n  }, [trapFocus]);\n\n  useFocusReturn({ opened, transitionDuration: 0 });\n\n  return (\n    <OptionalPortal withinPortal={withinPortal} zIndex={zIndex} target={target}>\n      <GroupedTransition\n        onExited={() => _lockScroll(false)}\n        onEntered={() => _lockScroll(lockScroll && true)}\n        mounted={opened}\n        transitions={{\n          overlay: { duration: transitionDuration / 2, transition: 'fade', timingFunction: 'ease' },\n          drawer: {\n            duration: transitionDuration,\n            transition: drawerTransition,\n            timingFunction: transitionTimingFunction,\n          },\n        }}\n      >\n        {(transitionStyles) => (\n          <Box\n            className={cx(classes.root, { [classes.noOverlay]: !withOverlay }, className)}\n            role=\"dialog\"\n            aria-modal\n            onMouseDown={() => closeOnClickOutside && onClose()}\n            {...others}\n          >\n            <Paper<'div'>\n              onMouseDown={(event) => event.stopPropagation()}\n              className={cx(classes.drawer, className)}\n              ref={focusTrapRef}\n              style={{ ...transitionStyles.drawer, zIndex: zIndex + 2 }}\n              radius={0}\n              tabIndex={-1}\n              onKeyDownCapture={(event) => {\n                const shouldTrigger =\n                  (event.target as any)?.getAttribute('data-mantine-stop-propagation') !== 'true';\n\n                shouldTrigger && event.nativeEvent.code === 'Escape' && closeOnEscape && onClose();\n              }}\n              shadow={shadow}\n              p={padding}\n            >\n              {(title || withCloseButton) && (\n                <div className={classes.header}>\n                  <Text className={classes.title}>{title}</Text>\n\n                  {withCloseButton && (\n                    <CloseButton\n                      iconSize={16}\n                      onClick={onClose}\n                      aria-label={closeButtonLabel}\n                      className={classes.closeButton}\n                    />\n                  )}\n                </div>\n              )}\n              {children}\n            </Paper>\n\n            {withOverlay && (\n              <div style={transitionStyles.overlay}>\n                <Overlay\n                  className={classes.overlay}\n                  opacity={_overlayOpacity}\n                  zIndex={zIndex}\n                  color={\n                    overlayColor ||\n                    (theme.colorScheme === 'dark' ? theme.colors.dark[9] : theme.black)\n                  }\n                />\n              </div>\n            )}\n          </Box>\n        )}\n      </GroupedTransition>\n    </OptionalPortal>\n  );\n}\n\nDrawer.displayName = '@mantine/core/Drawer';\n"],"names":[],"mappings":"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"}

package/esm/components/Drawer/Drawer.styles.js

@@ -45,43 +45,41 @@ function getPositionStyles({
       return null;
   }
 }
-var useStyles = createStyles((theme, { position, size }, getRef) => {
-  const noOverlay = getRef("noOverlay");
-  return {
-    closeButton: {},
-    overlay: {},
-    noOverlay: {
-      ref: noOverlay
-    },
-    root: {
-      [`&:not(.${noOverlay})`]: {
-        position: "fixed",
-        top: 0,
-        left: 0,
-        right: 0,
-        bottom: 0
-      }
-    },
-    drawer: __spreadProps(__spreadValues({}, getPositionStyles({ position, size, theme })), {
-      maxWidth: "100%",
-      maxHeight: "100vh",
+var useStyles = createStyles((theme, { position, size, zIndex }, getRef) => ({
+  closeButton: {},
+  overlay: {},
+  noOverlay: {
+    ref: getRef("noOverlay")
+  },
+  root: {
+    [`&:not(.${getRef("noOverlay")})`]: {
       position: "fixed",
-      outline: 0
-    }),
-    title: {
-      marginRight: theme.spacing.md,
-      textOverflow: "ellipsis",
-      display: "block",
-      wordBreak: "break-word"
-    },
-    header: {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "space-between",
-      marginBottom: theme.spacing.md
+      zIndex,
+      top: 0,
+      left: 0,
+      right: 0,
+      bottom: 0
     }
-  };
-});
+  },
+  drawer: __spreadProps(__spreadValues({}, getPositionStyles({ position, size, theme })), {
+    maxWidth: "100%",
+    maxHeight: "100vh",
+    position: "fixed",
+    outline: 0
+  }),
+  title: {
+    marginRight: theme.spacing.md,
+    textOverflow: "ellipsis",
+    display: "block",
+    wordBreak: "break-word"
+  },
+  header: {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "space-between",
+    marginBottom: theme.spacing.md
+  }
+}));
 
 export default useStyles;
 export { sizes };

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

@@ -1 +1 @@
-{"version":3,"file":"Drawer.styles.js","sources":["../../../src/components/Drawer/Drawer.styles.ts"],"sourcesContent":["import React from 'react';\nimport { createStyles, MantineTheme } from '@mantine/styles';\n\nexport const sizes = {\n  xs: 180,\n  sm: 240,\n  md: 320,\n  lg: 360,\n  xl: 500,\n  full: '100%',\n};\n\nexport type DrawerPosition = 'top' | 'bottom' | 'left' | 'right';\n\ninterface DrawerStyles {\n  position: DrawerPosition;\n  size: number | string;\n}\n\ninterface GetPositionStyles {\n  position: DrawerPosition;\n  size: number | string;\n  theme: MantineTheme;\n}\n\nfunction getPositionStyles({\n  position,\n  size,\n  theme,\n}: GetPositionStyles): Partial<Record<keyof React.CSSProperties, any>> {\n  switch (position) {\n    case 'top':\n      return { top: 0, left: 0, right: 0, height: theme.fn.size({ size, sizes }) };\n\n    case 'bottom':\n      return { bottom: 0, left: 0, right: 0, height: theme.fn.size({ size, sizes }) };\n\n    case 'right':\n      return { bottom: 0, top: 0, right: 0, width: theme.fn.size({ size, sizes }) };\n\n    case 'left':\n      return { bottom: 0, top: 0, left: 0, width: theme.fn.size({ size, sizes }) };\n\n    default:\n      return null;\n  }\n}\n\nexport default createStyles((theme, { position, size }: DrawerStyles, getRef) => {\n  const noOverlay = getRef('noOverlay');\n\n  return {\n    closeButton: {},\n    overlay: {},\n\n    noOverlay: {\n      ref: noOverlay,\n    },\n\n    root: {\n      [`&:not(.${noOverlay})`]: {\n        position: 'fixed',\n        top: 0,\n        left: 0,\n        right: 0,\n        bottom: 0,\n      },\n    },\n\n    drawer: {\n      ...getPositionStyles({ position, size, theme }),\n      maxWidth: '100%',\n      maxHeight: '100vh',\n      position: 'fixed',\n      outline: 0,\n    },\n\n    title: {\n      marginRight: theme.spacing.md,\n      textOverflow: 'ellipsis',\n      display: 'block',\n      wordBreak: 'break-word',\n    },\n\n    header: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n      marginBottom: theme.spacing.md,\n    },\n  };\n});\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Drawer.styles.js","sources":["../../../src/components/Drawer/Drawer.styles.ts"],"sourcesContent":["import React from 'react';\nimport { createStyles, MantineTheme } from '@mantine/styles';\n\nexport const sizes = {\n  xs: 180,\n  sm: 240,\n  md: 320,\n  lg: 360,\n  xl: 500,\n  full: '100%',\n};\n\nexport type DrawerPosition = 'top' | 'bottom' | 'left' | 'right';\n\nexport interface DrawerStylesParams {\n  position: DrawerPosition;\n  size: number | string;\n  zIndex: number;\n}\n\ninterface GetPositionStyles {\n  position: DrawerPosition;\n  size: number | string;\n  theme: MantineTheme;\n}\n\nfunction getPositionStyles({\n  position,\n  size,\n  theme,\n}: GetPositionStyles): Partial<Record<keyof React.CSSProperties, any>> {\n  switch (position) {\n    case 'top':\n      return { top: 0, left: 0, right: 0, height: theme.fn.size({ size, sizes }) };\n\n    case 'bottom':\n      return { bottom: 0, left: 0, right: 0, height: theme.fn.size({ size, sizes }) };\n\n    case 'right':\n      return { bottom: 0, top: 0, right: 0, width: theme.fn.size({ size, sizes }) };\n\n    case 'left':\n      return { bottom: 0, top: 0, left: 0, width: theme.fn.size({ size, sizes }) };\n\n    default:\n      return null;\n  }\n}\n\nexport default createStyles((theme, { position, size, zIndex }: DrawerStylesParams, getRef) => ({\n  closeButton: {},\n  overlay: {},\n\n  noOverlay: {\n    ref: getRef('noOverlay'),\n  },\n\n  root: {\n    [`&:not(.${getRef('noOverlay')})`]: {\n      position: 'fixed',\n      zIndex,\n      top: 0,\n      left: 0,\n      right: 0,\n      bottom: 0,\n    },\n  },\n\n  drawer: {\n    ...getPositionStyles({ position, size, theme }),\n    maxWidth: '100%',\n    maxHeight: '100vh',\n    position: 'fixed',\n    outline: 0,\n  },\n\n  title: {\n    marginRight: theme.spacing.md,\n    textOverflow: 'ellipsis',\n    display: 'block',\n    wordBreak: 'break-word',\n  },\n\n  header: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    marginBottom: theme.spacing.md,\n  },\n}));\n"],"names":[],"mappings":"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"}

package/esm/components/Grid/Grid.js

@@ -1,4 +1,5 @@
 import React, { forwardRef, Children } from 'react';
+import { useMantineDefaultProps } from '@mantine/styles';
 import { Col } from './Col/Col.js';
 import useStyles from './Grid.styles.js';
 import { Box } from '../Box/Box.js';
@@ -31,19 +32,25 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-const Grid = forwardRef((_a, ref) => {
-  var _b = _a, {
-    gutter = "md",
+const defaultProps = {
+  gutter: "md",
+  justify: "flex-start",
+  align: "stretch",
+  columns: 12
+};
+const Grid = forwardRef((props, ref) => {
+  const _a = useMantineDefaultProps("Grid", defaultProps, props), {
+    gutter,
     children,
-    grow = false,
-    justify = "flex-start",
-    align = "stretch",
-    columns = 12,
+    grow,
+    justify,
+    align,
+    columns,
     className,
     classNames,
     styles,
     id
-  } = _b, others = __objRest(_b, [
+  } = _a, others = __objRest(_a, [
     "gutter",
     "children",
     "grow",

package/esm/components/Grid/Grid.js.map

@@ -1 +1 @@
-{"version":3,"file":"Grid.js","sources":["../../../src/components/Grid/Grid.tsx"],"sourcesContent":["import React, { Children, forwardRef } from 'react';\nimport { DefaultProps, MantineNumberSize, ForwardRefWithStaticComponents } from '@mantine/styles';\nimport { Box } from '../Box';\nimport { Col } from './Col/Col';\nimport useStyles from './Grid.styles';\n\nexport interface GridProps extends DefaultProps, React.ComponentPropsWithoutRef<'div'> {\n  /** <Col /> components only */\n  children: React.ReactNode;\n\n  /** Spacing between columns predefined value from theme.spacing or number for gutter in px  */\n  gutter?: MantineNumberSize;\n\n  /** Should columns in the last row take 100% of grid width */\n  grow?: boolean;\n\n  /** Set grid justify-content property */\n  justify?: React.CSSProperties['justifyContent'];\n\n  /** Set grid align-content property */\n  align?: React.CSSProperties['alignContent'];\n\n  /** Amount of columns in each row */\n  columns?: number;\n}\n\ntype GridComponent = ForwardRefWithStaticComponents<GridProps, { Col: typeof Col }>;\n\nexport const Grid: GridComponent = forwardRef<HTMLDivElement, GridProps>(\n  (\n    {\n      gutter = 'md',\n      children,\n      grow = false,\n      justify = 'flex-start',\n      align = 'stretch',\n      columns = 12,\n      className,\n      classNames,\n      styles,\n      id,\n      ...others\n    }: GridProps,\n    ref\n  ) => {\n    const { classes, cx } = useStyles(\n      { gutter, justify, align },\n      { classNames, styles, name: 'Grid' }\n    );\n\n    const cols = (Children.toArray(children) as React.ReactElement[]).map((col, index) =>\n      React.cloneElement(col, {\n        gutter,\n        grow,\n        columns,\n        span: col.props.span || columns,\n        key: index,\n      })\n    );\n\n    return (\n      <Box className={cx(classes.root, className)} ref={ref} {...others}>\n        {cols}\n      </Box>\n    );\n  }\n) as any;\n\nGrid.Col = Col;\nGrid.displayName = '@mantine/core/Grid';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Grid.js","sources":["../../../src/components/Grid/Grid.tsx"],"sourcesContent":["import React, { Children, forwardRef } from 'react';\nimport {\n  DefaultProps,\n  MantineNumberSize,\n  ForwardRefWithStaticComponents,\n  useMantineDefaultProps,\n} from '@mantine/styles';\nimport { Box } from '../Box';\nimport { Col } from './Col/Col';\nimport useStyles from './Grid.styles';\n\nexport interface GridProps extends DefaultProps, React.ComponentPropsWithoutRef<'div'> {\n  /** <Col /> components only */\n  children: React.ReactNode;\n\n  /** Spacing between columns predefined value from theme.spacing or number for gutter in px  */\n  gutter?: MantineNumberSize;\n\n  /** Should columns in the last row take 100% of grid width */\n  grow?: boolean;\n\n  /** Set grid justify-content property */\n  justify?: React.CSSProperties['justifyContent'];\n\n  /** Set grid align-content property */\n  align?: React.CSSProperties['alignContent'];\n\n  /** Amount of columns in each row */\n  columns?: number;\n}\n\ntype GridComponent = ForwardRefWithStaticComponents<GridProps, { Col: typeof Col }>;\n\nconst defaultProps: Partial<GridProps> = {\n  gutter: 'md',\n  justify: 'flex-start',\n  align: 'stretch',\n  columns: 12,\n};\n\nexport const Grid: GridComponent = forwardRef<HTMLDivElement, GridProps>(\n  (props: GridProps, ref) => {\n    const {\n      gutter,\n      children,\n      grow,\n      justify,\n      align,\n      columns,\n      className,\n      classNames,\n      styles,\n      id,\n      ...others\n    } = useMantineDefaultProps('Grid', defaultProps, props);\n\n    const { classes, cx } = useStyles(\n      { gutter, justify, align },\n      { classNames, styles, name: 'Grid' }\n    );\n\n    const cols = (Children.toArray(children) as React.ReactElement[]).map((col, index) =>\n      React.cloneElement(col, {\n        gutter,\n        grow,\n        columns,\n        span: col.props.span || columns,\n        key: index,\n      })\n    );\n\n    return (\n      <Box className={cx(classes.root, className)} ref={ref} {...others}>\n        {cols}\n      </Box>\n    );\n  }\n) as any;\n\nGrid.Col = Col;\nGrid.displayName = '@mantine/core/Grid';\n"],"names":[],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"Grid.styles.js","sources":["../../../src/components/Grid/Grid.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize } from '@mantine/styles';\n\ninterface GridStyles {\n  gutter: MantineNumberSize;\n  justify?: React.CSSProperties['justifyContent'];\n  align?: React.CSSProperties['alignContent'];\n}\n\nexport default createStyles((theme, { justify, align, gutter }: GridStyles) => ({\n  root: {\n    margin: -theme.fn.size({ size: gutter, sizes: theme.spacing }) / 2,\n    display: 'flex',\n    flexWrap: 'wrap',\n    justifyContent: justify,\n    alignItems: align,\n  },\n}));\n"],"names":[],"mappings":";;AACA,gBAAe,YAAY,CAAC,CAAC,KAAK,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM;AACpE,EAAE,IAAI,EAAE;AACR,IAAI,MAAM,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC,GAAG,CAAC;AACtE,IAAI,OAAO,EAAE,MAAM;AACnB,IAAI,QAAQ,EAAE,MAAM;AACpB,IAAI,cAAc,EAAE,OAAO;AAC3B,IAAI,UAAU,EAAE,KAAK;AACrB,GAAG;AACH,CAAC,CAAC,CAAC;;;;"}
+{"version":3,"file":"Grid.styles.js","sources":["../../../src/components/Grid/Grid.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize } from '@mantine/styles';\n\nexport interface GridStylesParams {\n  gutter: MantineNumberSize;\n  justify?: React.CSSProperties['justifyContent'];\n  align?: React.CSSProperties['alignContent'];\n}\n\nexport default createStyles((theme, { justify, align, gutter }: GridStylesParams) => ({\n  root: {\n    margin: -theme.fn.size({ size: gutter, sizes: theme.spacing }) / 2,\n    display: 'flex',\n    flexWrap: 'wrap',\n    justifyContent: justify,\n    alignItems: align,\n  },\n}));\n"],"names":[],"mappings":";;AACA,gBAAe,YAAY,CAAC,CAAC,KAAK,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM;AACpE,EAAE,IAAI,EAAE;AACR,IAAI,MAAM,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC,GAAG,CAAC;AACtE,IAAI,OAAO,EAAE,MAAM;AACnB,IAAI,QAAQ,EAAE,MAAM;AACpB,IAAI,cAAc,EAAE,OAAO;AAC3B,IAAI,UAAU,EAAE,KAAK;AACrB,GAAG;AACH,CAAC,CAAC,CAAC;;;;"}

package/esm/components/Group/Group.js

@@ -1,4 +1,5 @@
 import React, { forwardRef } from 'react';
+import { useMantineDefaultProps } from '@mantine/styles';
 import useStyles from './Group.styles.js';
 import { filterFalsyChildren } from '../../utils/filter-falsy-children/filter-falsy-children.js';
 import { Box } from '../Box/Box.js';
@@ -31,19 +32,24 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-const Group = forwardRef((_a, ref) => {
-  var _b = _a, {
+const defaultProps = {
+  position: "left",
+  spacing: "md",
+  direction: "row"
+};
+const Group = forwardRef((props, ref) => {
+  const _a = useMantineDefaultProps("Group", defaultProps, props), {
     className,
-    position = "left",
+    position,
     align,
     children,
-    noWrap = false,
-    grow = false,
-    spacing = "md",
-    direction = "row",
+    noWrap,
+    grow,
+    spacing,
+    direction,
     classNames,
     styles
-  } = _b, others = __objRest(_b, [
+  } = _a, others = __objRest(_a, [
     "className",
     "position",
     "align",
@@ -65,9 +71,15 @@ const Group = forwardRef((_a, ref) => {
     direction,
     count: filteredChildren.length
   }, { classNames, styles, name: "Group" });
-  const items = filteredChildren.map((child) => React.cloneElement(child, {
-    className: cx(classes.child, child.props.className)
-  }));
+  const items = filteredChildren.map((child) => {
+    var _a2;
+    if (typeof child === "object" && child !== null && "props" in child) {
+      return React.cloneElement(child, {
+        className: cx(classes.child, (_a2 = child.props) == null ? void 0 : _a2.className)
+      });
+    }
+    return child;
+  });
   return /* @__PURE__ */ React.createElement(Box, __spreadValues({
     className: cx(classes.root, className),
     ref