@mantine/core 3.1.9 → 3.2.3

package/cjs/components/Menu/MenuBody/MenuBody.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuBody.styles.js","sources":["../../../../src/components/Menu/MenuBody/MenuBody.styles.ts"],"sourcesContent":["import { createStyles, getSizeValue, MantineNumberSize } from '@mantine/styles';\n\ninterface MenuBodyStyles {\n  size: MantineNumberSize;\n}\n\nexport const sizes = {\n  xs: 120,\n  sm: 160,\n  md: 200,\n  lg: 240,\n  xl: 300,\n};\n\nconst MENU_PADDING = 4;\n\nexport default createStyles((theme, { size }: MenuBodyStyles) => ({\n  body: {\n    width: getSizeValue({ size, sizes }),\n    overflow: 'hidden',\n    backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.white,\n    pointerEvents: 'all',\n    border: `1px solid ${\n      theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[2]\n    }`,\n    padding: MENU_PADDING,\n  },\n\n  divider: {\n    borderTopColor: theme.colorScheme === 'dark' ? theme.colors.dark[7] : theme.colors.gray[2],\n    margin: `${theme.spacing.xs / 2}px -${MENU_PADDING}px`,\n  },\n\n  label: {\n    color: theme.colorScheme === 'dark' ? theme.colors.dark[2] : theme.colors.gray[6],\n    fontWeight: 500,\n    fontSize: theme.fontSizes.xs,\n    padding: `${theme.spacing.xs / 2}px ${theme.spacing.sm}px`,\n    cursor: 'default',\n  },\n}));\n"],"names":["createStyles","getSizeValue"],"mappings":";;;;;;AACY,MAAC,KAAK,GAAG;AACrB,EAAE,EAAE,EAAE,GAAG;AACT,EAAE,EAAE,EAAE,GAAG;AACT,EAAE,EAAE,EAAE,GAAG;AACT,EAAE,EAAE,EAAE,GAAG;AACT,EAAE,EAAE,EAAE,GAAG;AACT,EAAE;AACF,MAAM,YAAY,GAAG,CAAC,CAAC;AACvB,gBAAeA,mBAAY,CAAC,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM;AAClD,EAAE,IAAI,EAAE;AACR,IAAI,KAAK,EAAEC,mBAAY,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;AACxC,IAAI,QAAQ,EAAE,QAAQ;AACtB,IAAI,eAAe,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK;AACtF,IAAI,aAAa,EAAE,KAAK;AACxB,IAAI,MAAM,EAAE,CAAC,UAAU,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;AACrG,IAAI,OAAO,EAAE,YAAY;AACzB,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,cAAc,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;AAC9F,IAAI,MAAM,EAAE,CAAC,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,YAAY,CAAC,EAAE,CAAC;AAC1D,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,KAAK,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;AACrF,IAAI,UAAU,EAAE,GAAG;AACnB,IAAI,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,EAAE;AAChC,IAAI,OAAO,EAAE,CAAC,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,CAAC;AAC9D,IAAI,MAAM,EAAE,SAAS;AACrB,GAAG;AACH,CAAC,CAAC,CAAC;;;;;"}
+{"version":3,"file":"MenuBody.styles.js","sources":["../../../../src/components/Menu/MenuBody/MenuBody.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize } from '@mantine/styles';\n\ninterface MenuBodyStyles {\n  size: MantineNumberSize;\n}\n\nexport const sizes = {\n  xs: 120,\n  sm: 160,\n  md: 200,\n  lg: 240,\n  xl: 300,\n};\n\nconst MENU_PADDING = 4;\n\nexport default createStyles((theme, { size }: MenuBodyStyles) => ({\n  body: {\n    width: theme.fn.size({ size, sizes }),\n    overflow: 'hidden',\n    backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.white,\n    pointerEvents: 'all',\n    border: `1px solid ${\n      theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[2]\n    }`,\n    padding: MENU_PADDING,\n  },\n\n  divider: {\n    borderTopColor: theme.colorScheme === 'dark' ? theme.colors.dark[7] : theme.colors.gray[2],\n    margin: `${theme.spacing.xs / 2}px -${MENU_PADDING}px`,\n  },\n\n  label: {\n    color: theme.colorScheme === 'dark' ? theme.colors.dark[2] : theme.colors.gray[6],\n    fontWeight: 500,\n    fontSize: theme.fontSizes.xs,\n    padding: `${theme.spacing.xs / 2}px ${theme.spacing.sm}px`,\n    cursor: 'default',\n  },\n}));\n"],"names":["createStyles"],"mappings":";;;;;;AACY,MAAC,KAAK,GAAG;AACrB,EAAE,EAAE,EAAE,GAAG;AACT,EAAE,EAAE,EAAE,GAAG;AACT,EAAE,EAAE,EAAE,GAAG;AACT,EAAE,EAAE,EAAE,GAAG;AACT,EAAE,EAAE,EAAE,GAAG;AACT,EAAE;AACF,MAAM,YAAY,GAAG,CAAC,CAAC;AACvB,gBAAeA,mBAAY,CAAC,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM;AAClD,EAAE,IAAI,EAAE;AACR,IAAI,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;AACzC,IAAI,QAAQ,EAAE,QAAQ;AACtB,IAAI,eAAe,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK;AACtF,IAAI,aAAa,EAAE,KAAK;AACxB,IAAI,MAAM,EAAE,CAAC,UAAU,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;AACrG,IAAI,OAAO,EAAE,YAAY;AACzB,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,cAAc,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;AAC9F,IAAI,MAAM,EAAE,CAAC,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,YAAY,CAAC,EAAE,CAAC;AAC1D,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,KAAK,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;AACrF,IAAI,UAAU,EAAE,GAAG;AACnB,IAAI,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,EAAE;AAChC,IAAI,OAAO,EAAE,CAAC,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,CAAC;AAC9D,IAAI,MAAM,EAAE,SAAS;AACrB,GAAG;AACH,CAAC,CAAC,CAAC;;;;;"}

package/cjs/components/Menu/MenuButton/MenuButton.styles.js

@@ -24,7 +24,7 @@ var __spreadValues = (a, b) => {
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 var useStyles = styles.createStyles((theme, { radius, color }) => ({
-  item: __spreadProps(__spreadValues({}, styles.getFontStyles(theme)), {
+  item: __spreadProps(__spreadValues({}, theme.fn.fontStyles()), {
     WebkitTapHighlightColor: "transparent",
     fontSize: theme.fontSizes.sm,
     border: 0,
@@ -37,15 +37,15 @@ var useStyles = styles.createStyles((theme, { radius, color }) => ({
     boxSizing: "border-box",
     padding: `${theme.spacing.xs}px ${theme.spacing.sm}px`,
     cursor: "pointer",
-    borderRadius: styles.getSizeValue({ size: radius, sizes: theme.radius }),
-    color: color ? styles.getThemeColor({ theme, color, shade: theme.colorScheme === "dark" ? 5 : 7 }) : theme.colorScheme === "dark" ? theme.colors.dark[0] : theme.black,
+    borderRadius: theme.fn.size({ size: radius, sizes: theme.radius }),
+    color: color ? theme.fn.themeColor(color, theme.colorScheme === "dark" ? 5 : 7) : theme.colorScheme === "dark" ? theme.colors.dark[0] : theme.black,
     "&:disabled": {
       color: theme.colorScheme === "dark" ? theme.colors.dark[3] : theme.colors.gray[5],
       cursor: "not-allowed"
     }
   }),
   itemHovered: {
-    backgroundColor: color ? styles.hexToRgba(styles.getThemeColor({ theme, color, shade: theme.colorScheme === "dark" ? 9 : 0 }), theme.colorScheme === "dark" ? 0.2 : 1) : theme.colorScheme === "dark" ? styles.hexToRgba(theme.colors.dark[3], 0.35) : theme.colors.gray[0]
+    backgroundColor: color ? theme.fn.rgba(theme.fn.themeColor(color, theme.colorScheme === "dark" ? 9 : 0), theme.colorScheme === "dark" ? 0.2 : 1) : theme.colorScheme === "dark" ? theme.fn.rgba(theme.colors.dark[3], 0.35) : theme.colors.gray[0]
   },
   itemInner: {
     display: "flex",

package/cjs/components/Menu/MenuButton/MenuButton.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuButton.styles.js","sources":["../../../../src/components/Menu/MenuButton/MenuButton.styles.ts"],"sourcesContent":["import {\n  createStyles,\n  getFontStyles,\n  getThemeColor,\n  MantineNumberSize,\n  getSizeValue,\n  hexToRgba,\n  MantineColor,\n} from '@mantine/styles';\n\ninterface MenuButtonStyles {\n  radius: MantineNumberSize;\n  color: MantineColor;\n}\n\nexport default createStyles((theme, { radius, color }: MenuButtonStyles) => ({\n  item: {\n    ...getFontStyles(theme),\n    WebkitTapHighlightColor: 'transparent',\n    fontSize: theme.fontSizes.sm,\n    border: 0,\n    backgroundColor: 'transparent',\n    outline: 0,\n    width: '100%',\n    textAlign: 'left',\n    display: 'inline-block',\n    textDecoration: 'none',\n    boxSizing: 'border-box',\n    padding: `${theme.spacing.xs}px ${theme.spacing.sm}px`,\n    cursor: 'pointer',\n    borderRadius: getSizeValue({ size: radius, sizes: theme.radius }),\n    color: color\n      ? getThemeColor({ theme, color, shade: theme.colorScheme === 'dark' ? 5 : 7 })\n      : theme.colorScheme === 'dark'\n      ? theme.colors.dark[0]\n      : theme.black,\n\n    '&:disabled': {\n      color: theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[5],\n      cursor: 'not-allowed',\n    },\n  },\n\n  itemHovered: {\n    backgroundColor: color\n      ? hexToRgba(\n          getThemeColor({ theme, color, shade: theme.colorScheme === 'dark' ? 9 : 0 }),\n          theme.colorScheme === 'dark' ? 0.2 : 1\n        )\n      : theme.colorScheme === 'dark'\n      ? hexToRgba(theme.colors.dark[3], 0.35)\n      : theme.colors.gray[0],\n  },\n\n  itemInner: {\n    display: 'flex',\n    alignItems: 'center',\n    height: '100%',\n  },\n\n  itemBody: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    flex: 1,\n  },\n\n  itemIcon: {\n    marginRight: theme.spacing.xs,\n\n    '& *': {\n      display: 'block',\n    },\n  },\n\n  itemLabel: {\n    lineHeight: 1,\n  },\n}));\n"],"names":["createStyles","getFontStyles","getSizeValue","getThemeColor","hexToRgba"],"mappings":"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"}
+{"version":3,"file":"MenuButton.styles.js","sources":["../../../../src/components/Menu/MenuButton/MenuButton.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, MantineColor } from '@mantine/styles';\n\ninterface MenuButtonStyles {\n  radius: MantineNumberSize;\n  color: MantineColor;\n}\n\nexport default createStyles((theme, { radius, color }: MenuButtonStyles) => ({\n  item: {\n    ...theme.fn.fontStyles(),\n    WebkitTapHighlightColor: 'transparent',\n    fontSize: theme.fontSizes.sm,\n    border: 0,\n    backgroundColor: 'transparent',\n    outline: 0,\n    width: '100%',\n    textAlign: 'left',\n    display: 'inline-block',\n    textDecoration: 'none',\n    boxSizing: 'border-box',\n    padding: `${theme.spacing.xs}px ${theme.spacing.sm}px`,\n    cursor: 'pointer',\n    borderRadius: theme.fn.size({ size: radius, sizes: theme.radius }),\n    color: color\n      ? theme.fn.themeColor(color, theme.colorScheme === 'dark' ? 5 : 7)\n      : theme.colorScheme === 'dark'\n      ? theme.colors.dark[0]\n      : theme.black,\n\n    '&:disabled': {\n      color: theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[5],\n      cursor: 'not-allowed',\n    },\n  },\n\n  itemHovered: {\n    backgroundColor: color\n      ? theme.fn.rgba(\n          theme.fn.themeColor(color, theme.colorScheme === 'dark' ? 9 : 0),\n          theme.colorScheme === 'dark' ? 0.2 : 1\n        )\n      : theme.colorScheme === 'dark'\n      ? theme.fn.rgba(theme.colors.dark[3], 0.35)\n      : theme.colors.gray[0],\n  },\n\n  itemInner: {\n    display: 'flex',\n    alignItems: 'center',\n    height: '100%',\n  },\n\n  itemBody: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    flex: 1,\n  },\n\n  itemIcon: {\n    marginRight: theme.spacing.xs,\n\n    '& *': {\n      display: 'block',\n    },\n  },\n\n  itemLabel: {\n    lineHeight: 1,\n  },\n}));\n"],"names":["createStyles"],"mappings":"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"}

package/cjs/components/Modal/Modal.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var hooks = require('@mantine/hooks');
-var styles = require('@mantine/styles');
 var CloseButton = require('../ActionIcon/CloseButton/CloseButton.js');
 var Text = require('../Text/Text.js');
 var Paper = require('../Paper/Paper.js');
@@ -68,7 +67,7 @@ function MantineModal(_a) {
     shadow = "lg",
     id,
     classNames,
-    styles: styles$1,
+    styles,
     sx,
     closeOnClickOutside = true
   } = _b, others = __objRest(_b, [
@@ -97,8 +96,7 @@ function MantineModal(_a) {
   const baseId = hooks.useUuid(id);
   const titleId = `${baseId}-title`;
   const bodyId = `${baseId}-body`;
-  const theme = styles.useMantineTheme();
-  const { classes, cx } = Modal_styles['default']({ size, overflow }, { sx, classNames, styles: styles$1, name: "Modal" });
+  const { classes, cx, theme } = Modal_styles['default']({ size, overflow }, { sx, classNames, styles, name: "Modal" });
   const focusTrapRef = hooks.useFocusTrap(opened);
   const _overlayOpacity = typeof overlayOpacity === "number" ? overlayOpacity : theme.colorScheme === "dark" ? 0.85 : 0.75;
   const [, lockScroll] = hooks.useScrollLock();

package/cjs/components/Modal/Modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import React from 'react';\nimport { useScrollLock, useFocusTrap, useFocusReturn, useUuid } from '@mantine/hooks';\nimport {\n  useMantineTheme,\n  DefaultProps,\n  MantineNumberSize,\n  MantineShadow,\n  ClassNames,\n  MantineMargin,\n} from '@mantine/styles';\nimport { CloseButton } from '../ActionIcon/CloseButton/CloseButton';\nimport { Text } from '../Text/Text';\nimport { Paper } from '../Paper/Paper';\nimport { Overlay } from '../Overlay/Overlay';\nimport { Portal } from '../Portal/Portal';\nimport { GroupedTransition, MantineTransition } from '../Transition';\nimport useStyles from './Modal.styles';\n\nexport type ModalStylesNames = Exclude<ClassNames<typeof useStyles>, 'clickOutsideOverlay'>;\n\nexport interface ModalProps\n  extends Omit<DefaultProps<ModalStylesNames>, MantineMargin>,\n    Omit<React.ComponentPropsWithoutRef<'div'>, 'title'> {\n  /** Mounts modal if true */\n  opened: boolean;\n\n  /** Called when close button clicked and when escape key is pressed */\n  onClose(): void;\n\n  /** Modal title, displayed in header before close button */\n  title?: React.ReactNode;\n\n  /** Modal z-index property */\n  zIndex?: number;\n\n  /** Control vertical overflow behavior */\n  overflow?: 'outside' | 'inside';\n\n  /** Hides close button, modal still can be closed with escape key and by clicking outside */\n  hideCloseButton?: boolean;\n\n  /** Overlay below modal opacity, defaults to 0.75 in light theme and to 0.85 in dark theme */\n  overlayOpacity?: number;\n\n  /** Overlay below modal color, defaults to theme.black in light theme and to theme.colors.dark[9] in dark theme */\n  overlayColor?: string;\n\n  /** Modal body width */\n  size?: string | number;\n\n  /** Modal body transition */\n  transition?: MantineTransition;\n\n  /** Duration in ms of modal transitions, set to 0 to disable all animations */\n  transitionDuration?: number;\n\n  /** Modal body transitionTimingFunction, defaults to theme.transitionTimingFunction */\n  transitionTimingFunction?: string;\n\n  /** Close button aria-label */\n  closeButtonLabel?: string;\n\n  /** id base, used to generate ids to connect modal title and body with aria- attributes, defaults to random id */\n  id?: string;\n\n  /** Modal shadow from theme or css value */\n  shadow?: MantineShadow;\n\n  /** Modal padding from theme or number value for padding in px */\n  padding?: MantineNumberSize;\n\n  /** Should modal be closed when outside click was registered? */\n  closeOnClickOutside?: boolean;\n}\n\nexport function MantineModal({\n  className,\n  opened,\n  title,\n  onClose,\n  children,\n  hideCloseButton = false,\n  overlayOpacity,\n  size = 'md',\n  transitionDuration = 300,\n  closeButtonLabel,\n  overlayColor,\n  zIndex = 1000,\n  overflow = 'outside',\n  transition = 'pop',\n  padding = 'lg',\n  shadow = 'lg',\n  id,\n  classNames,\n  styles,\n  sx,\n  closeOnClickOutside = true,\n  ...others\n}: ModalProps) {\n  const baseId = useUuid(id);\n  const titleId = `${baseId}-title`;\n  const bodyId = `${baseId}-body`;\n  const theme = useMantineTheme();\n  const { classes, cx } = useStyles({ size, overflow }, { sx, classNames, styles, name: 'Modal' });\n  const focusTrapRef = useFocusTrap(opened);\n  const _overlayOpacity =\n    typeof overlayOpacity === 'number'\n      ? overlayOpacity\n      : theme.colorScheme === 'dark'\n      ? 0.85\n      : 0.75;\n\n  const [, lockScroll] = useScrollLock();\n  useFocusReturn({ opened, transitionDuration });\n\n  return (\n    <GroupedTransition\n      onExited={() => lockScroll(false)}\n      onEntered={() => lockScroll(true)}\n      mounted={opened}\n      transitions={{\n        modal: { duration: transitionDuration, transition },\n        overlay: { duration: transitionDuration / 2, transition: 'fade', timingFunction: 'ease' },\n      }}\n    >\n      {(transitionStyles) => (\n        <div className={cx(classes.root, className)} {...others}>\n          <div\n            className={classes.inner}\n            onKeyDownCapture={(event) => {\n              const shouldTrigger =\n                (event.target as any)?.getAttribute('data-mantine-stop-propagation') !== 'true';\n              shouldTrigger && event.nativeEvent.code === 'Escape' && onClose();\n            }}\n            style={{ zIndex: zIndex + 1 }}\n            ref={focusTrapRef}\n          >\n            {closeOnClickOutside && (\n              // eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events\n              <div onClick={onClose} className={classes.clickOutsideOverlay} />\n            )}\n\n            <Paper<'div'>\n              className={classes.modal}\n              shadow={shadow}\n              padding={padding}\n              role=\"dialog\"\n              aria-labelledby={titleId}\n              aria-describedby={bodyId}\n              aria-modal\n              style={{\n                ...transitionStyles.modal,\n                marginLeft: 'calc(var(--removed-scroll-width, 0px) * -1)',\n              }}\n              tabIndex={-1}\n            >\n              {(title || !hideCloseButton) && (\n                <div className={classes.header}>\n                  <Text id={titleId} className={classes.title}>\n                    {title}\n                  </Text>\n\n                  {!hideCloseButton && (\n                    <CloseButton iconSize={16} onClick={onClose} aria-label={closeButtonLabel} />\n                  )}\n                </div>\n              )}\n\n              <div id={bodyId} className={classes.body}>\n                {children}\n              </div>\n            </Paper>\n          </div>\n\n          <div style={transitionStyles.overlay}>\n            <Overlay\n              color={\n                overlayColor || (theme.colorScheme === 'dark' ? theme.colors.dark[9] : theme.black)\n              }\n              opacity={_overlayOpacity}\n              zIndex={zIndex}\n            />\n          </div>\n        </div>\n      )}\n    </GroupedTransition>\n  );\n}\n\nexport function Modal(props: React.ComponentPropsWithoutRef<typeof MantineModal>) {\n  return (\n    <Portal zIndex={props.zIndex || 1000}>\n      <MantineModal {...props} />\n    </Portal>\n  );\n}\n\nModal.displayName = '@mantine/core/Modal';\n"],"names":["styles","useUuid","useMantineTheme","useStyles","useFocusTrap","useScrollLock","useFocusReturn","React","GroupedTransition","Paper","Text","CloseButton","Overlay","Portal"],"mappings":"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"}
+{"version":3,"file":"Modal.js","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import React from 'react';\nimport { useScrollLock, useFocusTrap, useFocusReturn, useUuid } from '@mantine/hooks';\nimport {\n  DefaultProps,\n  MantineNumberSize,\n  MantineShadow,\n  ClassNames,\n  MantineMargin,\n} from '@mantine/styles';\nimport { CloseButton } from '../ActionIcon/CloseButton/CloseButton';\nimport { Text } from '../Text/Text';\nimport { Paper } from '../Paper/Paper';\nimport { Overlay } from '../Overlay/Overlay';\nimport { Portal } from '../Portal/Portal';\nimport { GroupedTransition, MantineTransition } from '../Transition';\nimport useStyles from './Modal.styles';\n\nexport type ModalStylesNames = Exclude<ClassNames<typeof useStyles>, 'clickOutsideOverlay'>;\n\nexport interface ModalProps\n  extends Omit<DefaultProps<ModalStylesNames>, MantineMargin>,\n    Omit<React.ComponentPropsWithoutRef<'div'>, 'title'> {\n  /** Mounts modal if true */\n  opened: boolean;\n\n  /** Called when close button clicked and when escape key is pressed */\n  onClose(): void;\n\n  /** Modal title, displayed in header before close button */\n  title?: React.ReactNode;\n\n  /** Modal z-index property */\n  zIndex?: number;\n\n  /** Control vertical overflow behavior */\n  overflow?: 'outside' | 'inside';\n\n  /** Hides close button, modal still can be closed with escape key and by clicking outside */\n  hideCloseButton?: boolean;\n\n  /** Overlay below modal opacity, defaults to 0.75 in light theme and to 0.85 in dark theme */\n  overlayOpacity?: number;\n\n  /** Overlay below modal color, defaults to theme.black in light theme and to theme.colors.dark[9] in dark theme */\n  overlayColor?: string;\n\n  /** Modal body width */\n  size?: string | number;\n\n  /** Modal body transition */\n  transition?: MantineTransition;\n\n  /** Duration in ms of modal transitions, set to 0 to disable all animations */\n  transitionDuration?: number;\n\n  /** Modal body transitionTimingFunction, defaults to theme.transitionTimingFunction */\n  transitionTimingFunction?: string;\n\n  /** Close button aria-label */\n  closeButtonLabel?: string;\n\n  /** id base, used to generate ids to connect modal title and body with aria- attributes, defaults to random id */\n  id?: string;\n\n  /** Modal shadow from theme or css value */\n  shadow?: MantineShadow;\n\n  /** Modal padding from theme or number value for padding in px */\n  padding?: MantineNumberSize;\n\n  /** Should modal be closed when outside click was registered? */\n  closeOnClickOutside?: boolean;\n}\n\nexport function MantineModal({\n  className,\n  opened,\n  title,\n  onClose,\n  children,\n  hideCloseButton = false,\n  overlayOpacity,\n  size = 'md',\n  transitionDuration = 300,\n  closeButtonLabel,\n  overlayColor,\n  zIndex = 1000,\n  overflow = 'outside',\n  transition = 'pop',\n  padding = 'lg',\n  shadow = 'lg',\n  id,\n  classNames,\n  styles,\n  sx,\n  closeOnClickOutside = true,\n  ...others\n}: ModalProps) {\n  const baseId = useUuid(id);\n  const titleId = `${baseId}-title`;\n  const bodyId = `${baseId}-body`;\n  const { classes, cx, theme } = useStyles(\n    { size, overflow },\n    { sx, classNames, styles, name: 'Modal' }\n  );\n  const focusTrapRef = useFocusTrap(opened);\n  const _overlayOpacity =\n    typeof overlayOpacity === 'number'\n      ? overlayOpacity\n      : theme.colorScheme === 'dark'\n      ? 0.85\n      : 0.75;\n\n  const [, lockScroll] = useScrollLock();\n  useFocusReturn({ opened, transitionDuration });\n\n  return (\n    <GroupedTransition\n      onExited={() => lockScroll(false)}\n      onEntered={() => lockScroll(true)}\n      mounted={opened}\n      transitions={{\n        modal: { duration: transitionDuration, transition },\n        overlay: { duration: transitionDuration / 2, transition: 'fade', timingFunction: 'ease' },\n      }}\n    >\n      {(transitionStyles) => (\n        <div className={cx(classes.root, className)} {...others}>\n          <div\n            className={classes.inner}\n            onKeyDownCapture={(event) => {\n              const shouldTrigger =\n                (event.target as any)?.getAttribute('data-mantine-stop-propagation') !== 'true';\n              shouldTrigger && event.nativeEvent.code === 'Escape' && onClose();\n            }}\n            style={{ zIndex: zIndex + 1 }}\n            ref={focusTrapRef}\n          >\n            {closeOnClickOutside && (\n              // eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events\n              <div onClick={onClose} className={classes.clickOutsideOverlay} />\n            )}\n\n            <Paper<'div'>\n              className={classes.modal}\n              shadow={shadow}\n              padding={padding}\n              role=\"dialog\"\n              aria-labelledby={titleId}\n              aria-describedby={bodyId}\n              aria-modal\n              style={{\n                ...transitionStyles.modal,\n                marginLeft: 'calc(var(--removed-scroll-width, 0px) * -1)',\n              }}\n              tabIndex={-1}\n            >\n              {(title || !hideCloseButton) && (\n                <div className={classes.header}>\n                  <Text id={titleId} className={classes.title}>\n                    {title}\n                  </Text>\n\n                  {!hideCloseButton && (\n                    <CloseButton iconSize={16} onClick={onClose} aria-label={closeButtonLabel} />\n                  )}\n                </div>\n              )}\n\n              <div id={bodyId} className={classes.body}>\n                {children}\n              </div>\n            </Paper>\n          </div>\n\n          <div style={transitionStyles.overlay}>\n            <Overlay\n              color={\n                overlayColor || (theme.colorScheme === 'dark' ? theme.colors.dark[9] : theme.black)\n              }\n              opacity={_overlayOpacity}\n              zIndex={zIndex}\n            />\n          </div>\n        </div>\n      )}\n    </GroupedTransition>\n  );\n}\n\nexport function Modal(props: React.ComponentPropsWithoutRef<typeof MantineModal>) {\n  return (\n    <Portal zIndex={props.zIndex || 1000}>\n      <MantineModal {...props} />\n    </Portal>\n  );\n}\n\nModal.displayName = '@mantine/core/Modal';\n"],"names":["useUuid","useStyles","useFocusTrap","useScrollLock","useFocusReturn","React","GroupedTransition","Paper","Text","CloseButton","Overlay","Portal"],"mappings":"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"}

package/cjs/components/Modal/Modal.styles.js

@@ -46,7 +46,7 @@ var useStyles = styles.createStyles((theme, { overflow, size }) => ({
     wordBreak: "break-word"
   },
   modal: {
-    width: styles.getSizeValue({ sizes, size }),
+    width: theme.fn.size({ sizes, size }),
     outline: 0,
     backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[7] : theme.white
   },

package/cjs/components/Modal/Modal.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.styles.js","sources":["../../../src/components/Modal/Modal.styles.ts"],"sourcesContent":["import { createStyles, getSizeValue } from '@mantine/styles';\n\nexport const sizes = {\n  xs: 320,\n  sm: 380,\n  md: 440,\n  lg: 620,\n  xl: 780,\n  full: '100%',\n};\n\ninterface ModalStyles {\n  overflow: 'outside' | 'inside';\n  size: string | number;\n}\n\nexport default createStyles((theme, { overflow, size }: ModalStyles) => ({\n  root: {\n    position: 'fixed',\n    top: 0,\n    left: 0,\n    right: 0,\n    bottom: 0,\n  },\n\n  inner: {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    right: 0,\n    bottom: 0,\n    overflowY: 'auto',\n    padding: `${theme.spacing.xl * 2}px ${theme.spacing.md}px`,\n    display: 'flex',\n    justifyContent: 'center',\n    alignItems: 'flex-start',\n  },\n\n  clickOutsideOverlay: {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    right: 0,\n    bottom: 0,\n  },\n\n  title: {\n    marginRight: theme.spacing.md,\n    textOverflow: 'ellipsis',\n    display: 'block',\n    wordBreak: 'break-word',\n  },\n\n  modal: {\n    width: getSizeValue({ sizes, size }),\n    outline: 0,\n    backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[7] : theme.white,\n  },\n\n  header: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    marginBottom: theme.spacing.md,\n    marginRight: -9,\n  },\n\n  body: {\n    maxHeight: overflow === 'inside' ? 'calc(100vh - 185px)' : null,\n    overflowY: overflow === 'inside' ? 'auto' : null,\n    wordBreak: 'break-word',\n  },\n}));\n"],"names":["createStyles","getSizeValue"],"mappings":";;;;;;AACY,MAAC,KAAK,GAAG;AACrB,EAAE,EAAE,EAAE,GAAG;AACT,EAAE,EAAE,EAAE,GAAG;AACT,EAAE,EAAE,EAAE,GAAG;AACT,EAAE,EAAE,EAAE,GAAG;AACT,EAAE,EAAE,EAAE,GAAG;AACT,EAAE,IAAI,EAAE,MAAM;AACd,EAAE;AACF,gBAAeA,mBAAY,CAAC,CAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM;AAC5D,EAAE,IAAI,EAAE;AACR,IAAI,QAAQ,EAAE,OAAO;AACrB,IAAI,GAAG,EAAE,CAAC;AACV,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,KAAK,EAAE,CAAC;AACZ,IAAI,MAAM,EAAE,CAAC;AACb,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,QAAQ,EAAE,UAAU;AACxB,IAAI,GAAG,EAAE,CAAC;AACV,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,KAAK,EAAE,CAAC;AACZ,IAAI,MAAM,EAAE,CAAC;AACb,IAAI,SAAS,EAAE,MAAM;AACrB,IAAI,OAAO,EAAE,CAAC,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,CAAC;AAC9D,IAAI,OAAO,EAAE,MAAM;AACnB,IAAI,cAAc,EAAE,QAAQ;AAC5B,IAAI,UAAU,EAAE,YAAY;AAC5B,GAAG;AACH,EAAE,mBAAmB,EAAE;AACvB,IAAI,QAAQ,EAAE,UAAU;AACxB,IAAI,GAAG,EAAE,CAAC;AACV,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,KAAK,EAAE,CAAC;AACZ,IAAI,MAAM,EAAE,CAAC;AACb,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE;AACjC,IAAI,YAAY,EAAE,UAAU;AAC5B,IAAI,OAAO,EAAE,OAAO;AACpB,IAAI,SAAS,EAAE,YAAY;AAC3B,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,KAAK,EAAEC,mBAAY,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC;AACxC,IAAI,OAAO,EAAE,CAAC;AACd,IAAI,eAAe,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK;AACtF,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,OAAO,EAAE,MAAM;AACnB,IAAI,UAAU,EAAE,QAAQ;AACxB,IAAI,cAAc,EAAE,eAAe;AACnC,IAAI,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE;AAClC,IAAI,WAAW,EAAE,CAAC,CAAC;AACnB,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,SAAS,EAAE,QAAQ,KAAK,QAAQ,GAAG,qBAAqB,GAAG,IAAI;AACnE,IAAI,SAAS,EAAE,QAAQ,KAAK,QAAQ,GAAG,MAAM,GAAG,IAAI;AACpD,IAAI,SAAS,EAAE,YAAY;AAC3B,GAAG;AACH,CAAC,CAAC,CAAC;;;;;"}
+{"version":3,"file":"Modal.styles.js","sources":["../../../src/components/Modal/Modal.styles.ts"],"sourcesContent":["import { createStyles } from '@mantine/styles';\n\nexport const sizes = {\n  xs: 320,\n  sm: 380,\n  md: 440,\n  lg: 620,\n  xl: 780,\n  full: '100%',\n};\n\ninterface ModalStyles {\n  overflow: 'outside' | 'inside';\n  size: string | number;\n}\n\nexport default createStyles((theme, { overflow, size }: ModalStyles) => ({\n  root: {\n    position: 'fixed',\n    top: 0,\n    left: 0,\n    right: 0,\n    bottom: 0,\n  },\n\n  inner: {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    right: 0,\n    bottom: 0,\n    overflowY: 'auto',\n    padding: `${theme.spacing.xl * 2}px ${theme.spacing.md}px`,\n    display: 'flex',\n    justifyContent: 'center',\n    alignItems: 'flex-start',\n  },\n\n  clickOutsideOverlay: {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    right: 0,\n    bottom: 0,\n  },\n\n  title: {\n    marginRight: theme.spacing.md,\n    textOverflow: 'ellipsis',\n    display: 'block',\n    wordBreak: 'break-word',\n  },\n\n  modal: {\n    width: theme.fn.size({ sizes, size }),\n    outline: 0,\n    backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[7] : theme.white,\n  },\n\n  header: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    marginBottom: theme.spacing.md,\n    marginRight: -9,\n  },\n\n  body: {\n    maxHeight: overflow === 'inside' ? 'calc(100vh - 185px)' : null,\n    overflowY: overflow === 'inside' ? 'auto' : null,\n    wordBreak: 'break-word',\n  },\n}));\n"],"names":["createStyles"],"mappings":";;;;;;AACY,MAAC,KAAK,GAAG;AACrB,EAAE,EAAE,EAAE,GAAG;AACT,EAAE,EAAE,EAAE,GAAG;AACT,EAAE,EAAE,EAAE,GAAG;AACT,EAAE,EAAE,EAAE,GAAG;AACT,EAAE,EAAE,EAAE,GAAG;AACT,EAAE,IAAI,EAAE,MAAM;AACd,EAAE;AACF,gBAAeA,mBAAY,CAAC,CAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM;AAC5D,EAAE,IAAI,EAAE;AACR,IAAI,QAAQ,EAAE,OAAO;AACrB,IAAI,GAAG,EAAE,CAAC;AACV,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,KAAK,EAAE,CAAC;AACZ,IAAI,MAAM,EAAE,CAAC;AACb,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,QAAQ,EAAE,UAAU;AACxB,IAAI,GAAG,EAAE,CAAC;AACV,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,KAAK,EAAE,CAAC;AACZ,IAAI,MAAM,EAAE,CAAC;AACb,IAAI,SAAS,EAAE,MAAM;AACrB,IAAI,OAAO,EAAE,CAAC,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,CAAC;AAC9D,IAAI,OAAO,EAAE,MAAM;AACnB,IAAI,cAAc,EAAE,QAAQ;AAC5B,IAAI,UAAU,EAAE,YAAY;AAC5B,GAAG;AACH,EAAE,mBAAmB,EAAE;AACvB,IAAI,QAAQ,EAAE,UAAU;AACxB,IAAI,GAAG,EAAE,CAAC;AACV,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,KAAK,EAAE,CAAC;AACZ,IAAI,MAAM,EAAE,CAAC;AACb,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE;AACjC,IAAI,YAAY,EAAE,UAAU;AAC5B,IAAI,OAAO,EAAE,OAAO;AACpB,IAAI,SAAS,EAAE,YAAY;AAC3B,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC;AACzC,IAAI,OAAO,EAAE,CAAC;AACd,IAAI,eAAe,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK;AACtF,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,OAAO,EAAE,MAAM;AACnB,IAAI,UAAU,EAAE,QAAQ;AACxB,IAAI,cAAc,EAAE,eAAe;AACnC,IAAI,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE;AAClC,IAAI,WAAW,EAAE,CAAC,CAAC;AACnB,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,SAAS,EAAE,QAAQ,KAAK,QAAQ,GAAG,qBAAqB,GAAG,IAAI;AACnE,IAAI,SAAS,EAAE,QAAQ,KAAK,QAAQ,GAAG,MAAM,GAAG,IAAI;AACpD,IAAI,SAAS,EAAE,YAAY;AAC3B,GAAG;AACH,CAAC,CAAC,CAAC;;;;;"}

package/cjs/components/MultiSelect/DefaultValue/DefaultValue.js

@@ -72,7 +72,7 @@ function DefaultValue(_a) {
     className: classes.label
   }, label), !disabled && /* @__PURE__ */ React__default.createElement(CloseButton.CloseButton, {
     "aria-hidden": true,
-    onClick: onRemove,
+    onMouseDown: onRemove,
     size: buttonSizes[size],
     radius: 2,
     color: "blue",

package/cjs/components/MultiSelect/DefaultValue/DefaultValue.js.map

@@ -1 +1 @@
-{"version":3,"file":"DefaultValue.js","sources":["../../../../src/components/MultiSelect/DefaultValue/DefaultValue.tsx"],"sourcesContent":["import React from 'react';\nimport { DefaultProps, MantineSize, MantineNumberSize, ClassNames } from '@mantine/styles';\nimport { CloseButton } from '../../ActionIcon/CloseButton/CloseButton';\nimport useStyles from './DefaultValue.styles';\n\nexport type DefaultValueStylesNames = ClassNames<typeof useStyles>;\n\nexport interface MultiSelectValueProps\n  extends DefaultProps<DefaultValueStylesNames>,\n    React.ComponentPropsWithoutRef<'div'> {\n  label: string;\n  onRemove(): void;\n  disabled: boolean;\n  size: MantineSize;\n  radius: MantineNumberSize;\n}\n\nconst buttonSizes = {\n  xs: 16,\n  sm: 22,\n  md: 24,\n  lg: 26,\n  xl: 30,\n};\n\nexport function DefaultValue({\n  label,\n  classNames,\n  styles,\n  className,\n  onRemove,\n  disabled,\n  size,\n  radius,\n  ...others\n}: MultiSelectValueProps) {\n  const { classes, cx } = useStyles(\n    { size, disabled, radius },\n    { classNames, styles, name: 'MultiSelect' }\n  );\n\n  return (\n    <div className={cx(classes.defaultValue, className)} {...others}>\n      <span className={classes.label}>{label}</span>\n\n      {!disabled && (\n        <CloseButton\n          aria-hidden\n          onClick={onRemove}\n          size={buttonSizes[size]}\n          radius={2}\n          color=\"blue\"\n          variant=\"transparent\"\n          iconSize={buttonSizes[size] / 2}\n          className={classes.defaultValueRemove}\n          tabIndex={-1}\n        />\n      )}\n    </div>\n  );\n}\n\nDefaultValue.displayName = '@mantine/core/MultiSelect/DefaultValue';\n"],"names":["useStyles","React","CloseButton"],"mappings":"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"}
+{"version":3,"file":"DefaultValue.js","sources":["../../../../src/components/MultiSelect/DefaultValue/DefaultValue.tsx"],"sourcesContent":["import React from 'react';\nimport { DefaultProps, MantineSize, MantineNumberSize, ClassNames } from '@mantine/styles';\nimport { CloseButton } from '../../ActionIcon/CloseButton/CloseButton';\nimport useStyles from './DefaultValue.styles';\n\nexport type DefaultValueStylesNames = ClassNames<typeof useStyles>;\n\nexport interface MultiSelectValueProps\n  extends DefaultProps<DefaultValueStylesNames>,\n    React.ComponentPropsWithoutRef<'div'> {\n  label: string;\n  onRemove(): void;\n  disabled: boolean;\n  size: MantineSize;\n  radius: MantineNumberSize;\n}\n\nconst buttonSizes = {\n  xs: 16,\n  sm: 22,\n  md: 24,\n  lg: 26,\n  xl: 30,\n};\n\nexport function DefaultValue({\n  label,\n  classNames,\n  styles,\n  className,\n  onRemove,\n  disabled,\n  size,\n  radius,\n  ...others\n}: MultiSelectValueProps) {\n  const { classes, cx } = useStyles(\n    { size, disabled, radius },\n    { classNames, styles, name: 'MultiSelect' }\n  );\n\n  return (\n    <div className={cx(classes.defaultValue, className)} {...others}>\n      <span className={classes.label}>{label}</span>\n\n      {!disabled && (\n        <CloseButton\n          aria-hidden\n          onMouseDown={onRemove}\n          size={buttonSizes[size]}\n          radius={2}\n          color=\"blue\"\n          variant=\"transparent\"\n          iconSize={buttonSizes[size] / 2}\n          className={classes.defaultValueRemove}\n          tabIndex={-1}\n        />\n      )}\n    </div>\n  );\n}\n\nDefaultValue.displayName = '@mantine/core/MultiSelect/DefaultValue';\n"],"names":["useStyles","React","CloseButton"],"mappings":";;;;;;;;;;;;AAAA,IAAI,SAAS,GAAG,MAAM,CAAC,cAAc,CAAC;AACtC,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,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;AAIF,MAAM,WAAW,GAAG;AACpB,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,EAAE,EAAE,EAAE;AACR,CAAC,CAAC;AACK,SAAS,YAAY,CAAC,EAAE,EAAE;AACjC,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE;AACf,IAAI,KAAK;AACT,IAAI,UAAU;AACd,IAAI,MAAM;AACV,IAAI,SAAS;AACb,IAAI,QAAQ;AACZ,IAAI,QAAQ;AACZ,IAAI,IAAI;AACR,IAAI,MAAM;AACV,GAAG,GAAG,EAAE,EAAE,MAAM,GAAG,SAAS,CAAC,EAAE,EAAE;AACjC,IAAI,OAAO;AACX,IAAI,YAAY;AAChB,IAAI,QAAQ;AACZ,IAAI,WAAW;AACf,IAAI,UAAU;AACd,IAAI,UAAU;AACd,IAAI,MAAM;AACV,IAAI,QAAQ;AACZ,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE,GAAGA,8BAAS,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,IAAI,EAAE,aAAa,EAAE,CAAC,CAAC;AAC7G,EAAE,uBAAuBC,cAAK,CAAC,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC;AACnE,IAAI,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,YAAY,EAAE,SAAS,CAAC;AAClD,GAAG,EAAE,MAAM,CAAC,kBAAkBA,cAAK,CAAC,aAAa,CAAC,MAAM,EAAE;AAC1D,IAAI,SAAS,EAAE,OAAO,CAAC,KAAK;AAC5B,GAAG,EAAE,KAAK,CAAC,EAAE,CAAC,QAAQ,oBAAoBA,cAAK,CAAC,aAAa,CAACC,uBAAW,EAAE;AAC3E,IAAI,aAAa,EAAE,IAAI;AACvB,IAAI,WAAW,EAAE,QAAQ;AACzB,IAAI,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC;AAC3B,IAAI,MAAM,EAAE,CAAC;AACb,IAAI,KAAK,EAAE,MAAM;AACjB,IAAI,OAAO,EAAE,aAAa;AAC1B,IAAI,QAAQ,EAAE,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC;AACnC,IAAI,SAAS,EAAE,OAAO,CAAC,kBAAkB;AACzC,IAAI,QAAQ,EAAE,CAAC,CAAC;AAChB,GAAG,CAAC,CAAC,CAAC;AACN,CAAC;AACD,YAAY,CAAC,WAAW,GAAG,wCAAwC;;;;"}

package/cjs/components/MultiSelect/DefaultValue/DefaultValue.styles.js

@@ -25,19 +25,19 @@ var useStyles = styles.createStyles((theme, { size, disabled, radius }) => ({
     backgroundColor: disabled ? theme.colorScheme === "dark" ? theme.colors.dark[5] : theme.colors.gray[3] : theme.colorScheme === "dark" ? theme.colors.dark[7] : theme.colors.gray[1],
     color: disabled ? theme.colorScheme === "dark" ? theme.colors.dark[1] : theme.colors.gray[7] : theme.colorScheme === "dark" ? theme.colors.dark[0] : theme.colors.gray[7],
     lineHeight: 1,
-    height: styles.getSizeValue({ size, sizes }),
-    paddingLeft: styles.getSizeValue({ size, sizes: theme.spacing }),
-    paddingRight: disabled ? styles.getSizeValue({ size, sizes: theme.spacing }) : 0,
+    height: theme.fn.size({ size, sizes }),
+    paddingLeft: theme.fn.size({ size, sizes: theme.spacing }),
+    paddingRight: disabled ? theme.fn.size({ size, sizes: theme.spacing }) : 0,
     fontWeight: 500,
-    fontSize: styles.getSizeValue({ size, sizes: fontSizes }),
-    borderRadius: styles.getSizeValue({ size: radius, sizes: theme.radius }),
+    fontSize: theme.fn.size({ size, sizes: fontSizes }),
+    borderRadius: theme.fn.size({ size: radius, sizes: theme.radius }),
     cursor: disabled ? "not-allowed" : "default",
     userSelect: "none",
     maxWidth: "calc(100% - 20px)"
   },
   defaultValueRemove: {
     color: theme.colorScheme === "dark" ? theme.colors.dark[0] : theme.colors.gray[7],
-    marginLeft: styles.getSizeValue({ size, sizes: theme.spacing }) / 6
+    marginLeft: theme.fn.size({ size, sizes: theme.spacing }) / 6
   },
   label: {
     display: "block",

package/cjs/components/MultiSelect/DefaultValue/DefaultValue.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"DefaultValue.styles.js","sources":["../../../../src/components/MultiSelect/DefaultValue/DefaultValue.styles.ts"],"sourcesContent":["import { createStyles, getSizeValue, MantineNumberSize, MantineSize } from '@mantine/styles';\n\ninterface DefaultLabelStyles {\n  size: MantineSize;\n  radius: MantineNumberSize;\n  disabled: boolean;\n}\n\nconst sizes = {\n  xs: 16,\n  sm: 22,\n  md: 26,\n  lg: 30,\n  xl: 36,\n};\n\nconst fontSizes = {\n  xs: 10,\n  sm: 12,\n  md: 14,\n  lg: 16,\n  xl: 18,\n};\n\nexport default createStyles((theme, { size, disabled, radius }: DefaultLabelStyles) => ({\n  defaultValue: {\n    display: 'flex',\n    alignItems: 'center',\n    backgroundColor: disabled\n      ? theme.colorScheme === 'dark'\n        ? theme.colors.dark[5]\n        : theme.colors.gray[3]\n      : theme.colorScheme === 'dark'\n      ? theme.colors.dark[7]\n      : theme.colors.gray[1],\n    color: disabled\n      ? theme.colorScheme === 'dark'\n        ? theme.colors.dark[1]\n        : theme.colors.gray[7]\n      : theme.colorScheme === 'dark'\n      ? theme.colors.dark[0]\n      : theme.colors.gray[7],\n    lineHeight: 1,\n    height: getSizeValue({ size, sizes }),\n    paddingLeft: getSizeValue({ size, sizes: theme.spacing }),\n    paddingRight: disabled ? getSizeValue({ size, sizes: theme.spacing }) : 0,\n    fontWeight: 500,\n    fontSize: getSizeValue({ size, sizes: fontSizes }),\n    borderRadius: getSizeValue({ size: radius, sizes: theme.radius }),\n    cursor: disabled ? 'not-allowed' : 'default',\n    userSelect: 'none',\n    maxWidth: 'calc(100% - 20px)',\n  },\n\n  defaultValueRemove: {\n    color: theme.colorScheme === 'dark' ? theme.colors.dark[0] : theme.colors.gray[7],\n    marginLeft: getSizeValue({ size, sizes: theme.spacing }) / 6,\n  },\n\n  label: {\n    display: 'block',\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    whiteSpace: 'nowrap',\n  },\n}));\n"],"names":["createStyles","getSizeValue"],"mappings":"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"}
+{"version":3,"file":"DefaultValue.styles.js","sources":["../../../../src/components/MultiSelect/DefaultValue/DefaultValue.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, MantineSize } from '@mantine/styles';\n\ninterface DefaultLabelStyles {\n  size: MantineSize;\n  radius: MantineNumberSize;\n  disabled: boolean;\n}\n\nconst sizes = {\n  xs: 16,\n  sm: 22,\n  md: 26,\n  lg: 30,\n  xl: 36,\n};\n\nconst fontSizes = {\n  xs: 10,\n  sm: 12,\n  md: 14,\n  lg: 16,\n  xl: 18,\n};\n\nexport default createStyles((theme, { size, disabled, radius }: DefaultLabelStyles) => ({\n  defaultValue: {\n    display: 'flex',\n    alignItems: 'center',\n    backgroundColor: disabled\n      ? theme.colorScheme === 'dark'\n        ? theme.colors.dark[5]\n        : theme.colors.gray[3]\n      : theme.colorScheme === 'dark'\n      ? theme.colors.dark[7]\n      : theme.colors.gray[1],\n    color: disabled\n      ? theme.colorScheme === 'dark'\n        ? theme.colors.dark[1]\n        : theme.colors.gray[7]\n      : theme.colorScheme === 'dark'\n      ? theme.colors.dark[0]\n      : theme.colors.gray[7],\n    lineHeight: 1,\n    height: theme.fn.size({ size, sizes }),\n    paddingLeft: theme.fn.size({ size, sizes: theme.spacing }),\n    paddingRight: disabled ? theme.fn.size({ size, sizes: theme.spacing }) : 0,\n    fontWeight: 500,\n    fontSize: theme.fn.size({ size, sizes: fontSizes }),\n    borderRadius: theme.fn.size({ size: radius, sizes: theme.radius }),\n    cursor: disabled ? 'not-allowed' : 'default',\n    userSelect: 'none',\n    maxWidth: 'calc(100% - 20px)',\n  },\n\n  defaultValueRemove: {\n    color: theme.colorScheme === 'dark' ? theme.colors.dark[0] : theme.colors.gray[7],\n    marginLeft: theme.fn.size({ size, sizes: theme.spacing }) / 6,\n  },\n\n  label: {\n    display: 'block',\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    whiteSpace: 'nowrap',\n  },\n}));\n"],"names":["createStyles"],"mappings":"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"}

package/cjs/components/MultiSelect/MultiSelect.js

@@ -110,7 +110,9 @@ const MultiSelect = React.forwardRef((_a, ref) => {
     sx,
     dropdownComponent,
     onDropdownClose,
-    onDropdownOpen
+    onDropdownOpen,
+    maxSelectedValues,
+    zIndex
   } = _b, others = __objRest(_b, [
     "className",
     "style",
@@ -160,16 +162,20 @@ const MultiSelect = React.forwardRef((_a, ref) => {
     "sx",
     "dropdownComponent",
     "onDropdownClose",
-    "onDropdownOpen"
+    "onDropdownOpen",
+    "maxSelectedValues",
+    "zIndex"
   ]);
-  const { classes, cx } = MultiSelect_styles['default']({ size, invalid: !!error }, { classNames, styles: styles$1, name: "MultiSelect" });
+  const { classes, cx, theme } = MultiSelect_styles['default']({ size, invalid: !!error }, { classNames, styles: styles$1, name: "MultiSelect" });
   const { mergedStyles, rest } = styles.useExtractedMargins({ others, style });
   const dropdownRef = React.useRef();
   const inputRef = React.useRef();
+  const wrapperRef = React.useRef();
   const itemsRefs = React.useRef({});
   const uuid = hooks.useUuid(id);
   const [dropdownOpened, _setDropdownOpened] = React.useState(initiallyOpened);
   const [hovered, setHovered] = React.useState(-1);
+  const [direction, setDirection] = React.useState("column");
   const [searchValue, setSearchValue] = React.useState("");
   const { scrollIntoView, targetRef, scrollableRef } = hooks.useScrollIntoView({
     duration: 0,
@@ -197,7 +203,14 @@ const MultiSelect = React.forwardRef((_a, ref) => {
     rule: (val) => Array.isArray(val),
     onChange
   });
-  const handleValueRemove = (_val) => setValue(_value.filter((val) => val !== _val));
+  const valuesOverflow = React.useRef(!!maxSelectedValues && maxSelectedValues < _value.length);
+  const handleValueRemove = (_val) => {
+    const newValue = _value.filter((val) => val !== _val);
+    setValue(newValue);
+    if (!!maxSelectedValues && newValue.length < maxSelectedValues) {
+      valuesOverflow.current = false;
+    }
+  };
   const handleInputChange = (event) => {
     handleSearchChange(event.currentTarget.value);
     setDropdownOpened(true);
@@ -230,6 +243,10 @@ const MultiSelect = React.forwardRef((_a, ref) => {
   hooks.useDidUpdate(() => {
     setHovered(getNextIndex(-1, (index) => index + 1, (index) => index < filteredData.length - 1));
   }, [searchValue]);
+  hooks.useDidUpdate(() => {
+    if (!disabled && _value.length >= data.length)
+      setDropdownOpened(false);
+  }, [_value]);
   const handleItemSelect = (item) => {
     setTimeout(() => {
       clearSearchOnChange && handleSearchChange("");
@@ -237,6 +254,10 @@ const MultiSelect = React.forwardRef((_a, ref) => {
         handleValueRemove(item.value);
       } else {
         setValue([..._value, item.value]);
+        if (_value.length === maxSelectedValues - 1) {
+          valuesOverflow.current = true;
+          setDropdownOpened(false);
+        }
         if (hovered === filteredData.length - 1) {
           setHovered(filteredData.length - 2);
         }
@@ -247,37 +268,44 @@ const MultiSelect = React.forwardRef((_a, ref) => {
     });
   };
   const handleInputKeydown = (event) => {
+    const isColumn = direction === "column";
+    const handleNext = () => {
+      setHovered((current) => {
+        var _a2;
+        const nextIndex = getNextIndex(current, (index) => index + 1, (index) => index < filteredData.length - 1);
+        if (dropdownOpened) {
+          targetRef.current = itemsRefs.current[(_a2 = filteredData[nextIndex]) == null ? void 0 : _a2.value];
+          scrollIntoView({
+            alignment: isColumn ? "end" : "start"
+          });
+        }
+        return nextIndex;
+      });
+    };
+    const handlePrevious = () => {
+      setHovered((current) => {
+        var _a2;
+        const nextIndex = getNextIndex(current, (index) => index - 1, (index) => index > 0);
+        if (dropdownOpened) {
+          targetRef.current = itemsRefs.current[(_a2 = filteredData[nextIndex]) == null ? void 0 : _a2.value];
+          scrollIntoView({
+            alignment: isColumn ? "start" : "end"
+          });
+        }
+        return nextIndex;
+      });
+    };
     switch (event.nativeEvent.code) {
       case "ArrowUp": {
         event.preventDefault();
         setDropdownOpened(true);
-        setHovered((current) => {
-          var _a2;
-          const nextIndex = getNextIndex(current, (index) => index - 1, (index) => index > 0);
-          if (dropdownOpened) {
-            targetRef.current = itemsRefs.current[(_a2 = filteredData[nextIndex]) == null ? void 0 : _a2.value];
-            scrollIntoView({
-              alignment: "start"
-            });
-          }
-          return nextIndex;
-        });
+        isColumn ? handlePrevious() : handleNext();
         break;
       }
       case "ArrowDown": {
         event.preventDefault();
         setDropdownOpened(true);
-        setHovered((current) => {
-          var _a2;
-          const nextIndex = getNextIndex(current, (index) => index + 1, (index) => index < filteredData.length - 1);
-          if (dropdownOpened) {
-            targetRef.current = itemsRefs.current[(_a2 = filteredData[nextIndex]) == null ? void 0 : _a2.value];
-            scrollIntoView({
-              alignment: "end"
-            });
-          }
-          return nextIndex;
-        });
+        isColumn ? handleNext() : handlePrevious();
         break;
       }
       case "Enter": {
@@ -313,7 +341,13 @@ const MultiSelect = React.forwardRef((_a, ref) => {
   }).filter((val) => !!val).map((item) => /* @__PURE__ */ React__default.createElement(Value, __spreadProps(__spreadValues({}, item), {
     disabled,
     className: classes.value,
-    onRemove: () => handleValueRemove(item.value),
+    onRemove: (e) => {
+      if (dropdownOpened) {
+        e.preventDefault();
+        e.stopPropagation();
+      }
+      handleValueRemove(item.value);
+    },
     key: item.value,
     size,
     styles: styles$1,
@@ -352,7 +386,8 @@ const MultiSelect = React.forwardRef((_a, ref) => {
     "aria-controls": uuid,
     "aria-expanded": dropdownOpened,
     onMouseLeave: () => setHovered(-1),
-    tabIndex: -1
+    tabIndex: -1,
+    ref: wrapperRef
   }, /* @__PURE__ */ React__default.createElement(Input.Input, __spreadValues({
     __staticSelector: "MultiSelect",
     style: { overflow: "hidden" },
@@ -368,18 +403,19 @@ const MultiSelect = React.forwardRef((_a, ref) => {
     onMouseDown: (event) => {
       var _a2;
       event.preventDefault();
-      !disabled && setDropdownOpened(!dropdownOpened);
+      !disabled && !valuesOverflow.current && setDropdownOpened(!dropdownOpened);
       (_a2 = inputRef.current) == null ? void 0 : _a2.focus();
     },
     classNames: __spreadProps(__spreadValues({}, classNames), {
       input: cx({ [classes.input]: !searchable }, classNames == null ? void 0 : classNames.input)
     })
   }, getSelectRightSectionProps.getSelectRightSectionProps({
+    theme,
     rightSection,
     rightSectionWidth,
     styles: styles$1,
     size,
-    shouldClear: clearable && _value.length > 0,
+    shouldClear: !disabled && clearable && _value.length > 0,
     clearButtonLabel,
     onClear: handleClear,
     error
@@ -399,7 +435,7 @@ const MultiSelect = React.forwardRef((_a, ref) => {
     onChange: handleInputChange,
     onFocus: handleInputFocus,
     onBlur: handleInputBlur,
-    readOnly: !searchable,
+    readOnly: !searchable || valuesOverflow.current,
     placeholder: _value.length === 0 ? placeholder : void 0,
     disabled,
     "data-mantine-stop-propagation": dropdownOpened,
@@ -416,7 +452,11 @@ const MultiSelect = React.forwardRef((_a, ref) => {
     styles: styles$1,
     ref: hooks.useMergedRef(dropdownRef, scrollableRef),
     __staticSelector: "MultiSelect",
-    dropdownComponent
+    dropdownComponent,
+    referenceElement: wrapperRef.current,
+    direction,
+    onDirectionChange: setDirection,
+    zIndex
   }, /* @__PURE__ */ React__default.createElement(SelectItems.SelectItems, {
     data: filteredData,
     hovered,