@mantine/core 2.5.0-alpha.5 → 2.6.0-alpha.1

package/esm/components/Popover/PopoverBody/PopoverBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"PopoverBody.js","sources":["../../../../src/components/Popover/PopoverBody/PopoverBody.tsx"],"sourcesContent":["import React from 'react';\nimport { useMantineTheme, DefaultProps, MantineNumberSize, mergeStyles } from '../../../theme';\nimport { Text } from '../../Text/Text';\nimport { CloseButton } from '../../ActionIcon/CloseButton/CloseButton';\nimport useStyles from './PopoverBody.styles';\n\nexport type PopoverBodyStylesNames = keyof ReturnType<typeof useStyles>;\n\ninterface PopoverBodyProps\n  extends DefaultProps<PopoverBodyStylesNames>,\n    React.ComponentPropsWithoutRef<'div'> {\n  shadow: string;\n  radius: MantineNumberSize;\n  spacing: MantineNumberSize;\n  elementRef: React.ForwardedRef<HTMLDivElement>;\n  withCloseButton: boolean;\n  titleId: string;\n  bodyId: string;\n  onClose(): void;\n  closeButtonLabel: string;\n}\n\nexport function PopoverBody({\n  classNames,\n  styles,\n  themeOverride,\n  shadow,\n  spacing,\n  radius,\n  elementRef,\n  withCloseButton,\n  title,\n  titleId,\n  bodyId,\n  onClose,\n  closeButtonLabel,\n  children,\n  ...others\n}: PopoverBodyProps) {\n  const theme = useMantineTheme(themeOverride);\n  const classes = useStyles({ theme, shadow, radius, spacing }, classNames, 'popover');\n  const _styles = mergeStyles(classes, styles);\n\n  return (\n    <div\n      role=\"dialog\"\n      tabIndex={-1}\n      aria-labelledby={titleId}\n      aria-describedby={bodyId}\n      className={classes.wrapper}\n      style={_styles.wrapper}\n      ref={elementRef}\n      {...others}\n    >\n      <div className={classes.popover} style={_styles.popover}>\n        <div className={classes.body} style={_styles.body}>\n          {!!title && (\n            <div className={classes.header} style={_styles.header}>\n              <Text size=\"sm\" id={titleId} className={classes.title} style={_styles.title}>\n                {title}\n              </Text>\n            </div>\n          )}\n\n          {withCloseButton && (\n            <CloseButton\n              themeOverride={themeOverride}\n              size=\"sm\"\n              onClick={onClose}\n              aria-label={closeButtonLabel}\n              className={classes.close}\n              style={_styles.close}\n            />\n          )}\n\n          <div className={classes.inner} id={bodyId} style={_styles.inner}>\n            {children}\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nPopoverBody.displayName = '@mantine/core/PopoverBody';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"PopoverBody.js","sources":["../../../../src/components/Popover/PopoverBody/PopoverBody.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  mergeStyles,\n  DefaultProps,\n  MantineNumberSize,\n  MantineShadow,\n  ClassNames,\n} from '@mantine/styles';\nimport { Text } from '../../Text/Text';\nimport { CloseButton } from '../../ActionIcon/CloseButton/CloseButton';\nimport useStyles from './PopoverBody.styles';\n\nexport type PopoverBodyStylesNames = ClassNames<typeof useStyles>;\n\ninterface PopoverBodyProps\n  extends DefaultProps<PopoverBodyStylesNames>,\n    React.ComponentPropsWithoutRef<'div'> {\n  shadow: MantineShadow;\n  radius: MantineNumberSize;\n  spacing: MantineNumberSize;\n  elementRef: React.ForwardedRef<HTMLDivElement>;\n  withCloseButton: boolean;\n  titleId: string;\n  bodyId: string;\n  onClose(): void;\n  closeButtonLabel: string;\n}\n\nexport function PopoverBody({\n  classNames,\n  styles,\n  shadow,\n  spacing,\n  radius,\n  elementRef,\n  withCloseButton,\n  title,\n  titleId,\n  bodyId,\n  onClose,\n  closeButtonLabel,\n  children,\n  ...others\n}: PopoverBodyProps) {\n  const { classes } = useStyles({ shadow, radius, spacing }, classNames, 'popover');\n  const _styles = mergeStyles(classes, styles);\n\n  return (\n    <div\n      role=\"dialog\"\n      tabIndex={-1}\n      aria-labelledby={titleId}\n      aria-describedby={bodyId}\n      className={classes.wrapper}\n      style={_styles.wrapper}\n      ref={elementRef}\n      {...others}\n    >\n      <div className={classes.popover} style={_styles.popover}>\n        <div className={classes.body} style={_styles.body}>\n          {!!title && (\n            <div className={classes.header} style={_styles.header}>\n              <Text size=\"sm\" id={titleId} className={classes.title} style={_styles.title}>\n                {title}\n              </Text>\n            </div>\n          )}\n\n          {withCloseButton && (\n            <CloseButton\n              size=\"sm\"\n              onClick={onClose}\n              aria-label={closeButtonLabel}\n              className={classes.close}\n              style={_styles.close}\n            />\n          )}\n\n          <div className={classes.inner} id={bodyId} style={_styles.inner}>\n            {children}\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nPopoverBody.displayName = '@mantine/core/PopoverBody';\n"],"names":[],"mappings":"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"}

package/esm/components/Popover/PopoverBody/PopoverBody.styles.js

@@ -1,36 +1,35 @@
-import { createMemoStyles } from '../../../theme/create-memo-styles.js';
-import { getSizeValue } from '../../../theme/utils/get-size-value/get-size-value.js';
+import { createStyles, getSizeValue } from '@mantine/styles';
 
-var useStyles = createMemoStyles({
+var useStyles = createStyles((theme, { radius, shadow, spacing }) => ({
   title: {},
   wrapper: {},
-  popover: ({ theme, radius }) => ({
+  popover: {
     background: theme.colorScheme === "dark" ? theme.colors.dark[6] : theme.white,
     pointerEvents: "all",
     borderRadius: getSizeValue({ size: radius, sizes: theme.radius })
-  }),
-  body: ({ theme, radius, shadow }) => ({
+  },
+  body: {
     border: `1px solid ${theme.colorScheme === "dark" ? theme.colors.dark[6] : theme.colors.gray[2]}`,
     boxShadow: shadow in theme.shadows ? theme.shadows[shadow] : shadow,
     borderRadius: getSizeValue({ size: radius, sizes: theme.radius })
-  }),
-  inner: ({ theme, spacing }) => ({
+  },
+  inner: {
     padding: getSizeValue({ size: spacing, sizes: theme.spacing })
-  }),
-  header: ({ theme, spacing }) => ({
+  },
+  header: {
     borderBottom: `1px solid ${theme.colorScheme === "dark" ? theme.colors.dark[7] : theme.colors.gray[2]}`,
     padding: [theme.spacing.xs / 1.5, getSizeValue({ size: spacing, sizes: theme.spacing })],
     display: "flex",
     alignItems: "center",
     justifyContent: "space-between"
-  }),
+  },
   close: {
     position: "absolute",
     top: 7,
     zIndex: 2,
     right: 10
   }
-});
+}));
 
 export default useStyles;
 //# sourceMappingURL=PopoverBody.styles.js.map

package/esm/components/Popover/PopoverBody/PopoverBody.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"PopoverBody.styles.js","sources":["../../../../src/components/Popover/PopoverBody/PopoverBody.styles.ts"],"sourcesContent":["import { createMemoStyles, MantineTheme, MantineNumberSize, getSizeValue } from '../../../theme';\n\ninterface PopoverBodyStyles {\n  theme: MantineTheme;\n  shadow: string;\n  radius: MantineNumberSize;\n  spacing: MantineNumberSize;\n}\n\nexport default createMemoStyles({\n  title: {},\n  wrapper: {},\n\n  popover: ({ theme, radius }: PopoverBodyStyles) => ({\n    background: theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.white,\n    pointerEvents: 'all',\n    borderRadius: getSizeValue({ size: radius, sizes: theme.radius }),\n  }),\n\n  body: ({ theme, radius, shadow }: PopoverBodyStyles) => ({\n    border: `1px solid ${\n      theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[2]\n    }`,\n    boxShadow: shadow in theme.shadows ? theme.shadows[shadow] : shadow,\n    borderRadius: getSizeValue({ size: radius, sizes: theme.radius }),\n  }),\n\n  inner: ({ theme, spacing }: PopoverBodyStyles) => ({\n    padding: getSizeValue({ size: spacing, sizes: theme.spacing }),\n  }),\n\n  header: ({ theme, spacing }: PopoverBodyStyles) => ({\n    borderBottom: `1px solid ${\n      theme.colorScheme === 'dark' ? theme.colors.dark[7] : theme.colors.gray[2]\n    }`,\n    padding: [theme.spacing.xs / 1.5, getSizeValue({ size: spacing, sizes: theme.spacing })],\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n  }),\n\n  close: {\n    position: 'absolute',\n    top: 7,\n    zIndex: 2,\n    right: 10,\n  },\n});\n"],"names":[],"mappings":";;;AACA,gBAAe,gBAAgB,CAAC;AAChC,EAAE,KAAK,EAAE,EAAE;AACX,EAAE,OAAO,EAAE,EAAE;AACb,EAAE,OAAO,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM;AACnC,IAAI,UAAU,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK;AACjF,IAAI,aAAa,EAAE,KAAK;AACxB,IAAI,YAAY,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC;AACrE,GAAG,CAAC;AACJ,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM;AACxC,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,SAAS,EAAE,MAAM,IAAI,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,MAAM;AACvE,IAAI,YAAY,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC;AACrE,GAAG,CAAC;AACJ,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM;AAClC,IAAI,OAAO,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC;AAClE,GAAG,CAAC;AACJ,EAAE,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM;AACnC,IAAI,YAAY,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;AAC3G,IAAI,OAAO,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,GAAG,GAAG,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC,CAAC;AAC5F,IAAI,OAAO,EAAE,MAAM;AACnB,IAAI,UAAU,EAAE,QAAQ;AACxB,IAAI,cAAc,EAAE,eAAe;AACnC,GAAG,CAAC;AACJ,EAAE,KAAK,EAAE;AACT,IAAI,QAAQ,EAAE,UAAU;AACxB,IAAI,GAAG,EAAE,CAAC;AACV,IAAI,MAAM,EAAE,CAAC;AACb,IAAI,KAAK,EAAE,EAAE;AACb,GAAG;AACH,CAAC,CAAC;;;;"}
+{"version":3,"file":"PopoverBody.styles.js","sources":["../../../../src/components/Popover/PopoverBody/PopoverBody.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, getSizeValue, MantineShadow } from '@mantine/styles';\n\ninterface PopoverBodyStyles {\n  shadow: MantineShadow;\n  radius: MantineNumberSize;\n  spacing: MantineNumberSize;\n}\n\nexport default createStyles((theme, { radius, shadow, spacing }: PopoverBodyStyles) => ({\n  title: {},\n  wrapper: {},\n\n  popover: {\n    background: theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.white,\n    pointerEvents: 'all',\n    borderRadius: getSizeValue({ size: radius, sizes: theme.radius }),\n  },\n\n  body: {\n    border: `1px solid ${\n      theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[2]\n    }`,\n    boxShadow: shadow in theme.shadows ? theme.shadows[shadow] : shadow,\n    borderRadius: getSizeValue({ size: radius, sizes: theme.radius }),\n  },\n\n  inner: {\n    padding: getSizeValue({ size: spacing, sizes: theme.spacing }),\n  },\n\n  header: {\n    borderBottom: `1px solid ${\n      theme.colorScheme === 'dark' ? theme.colors.dark[7] : theme.colors.gray[2]\n    }`,\n    padding: [theme.spacing.xs / 1.5, getSizeValue({ size: spacing, sizes: theme.spacing })],\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n  },\n\n  close: {\n    position: 'absolute',\n    top: 7,\n    zIndex: 2,\n    right: 10,\n  },\n}));\n"],"names":[],"mappings":";;AACA,gBAAe,YAAY,CAAC,CAAC,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM;AACrE,EAAE,KAAK,EAAE,EAAE;AACX,EAAE,OAAO,EAAE,EAAE;AACb,EAAE,OAAO,EAAE;AACX,IAAI,UAAU,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK;AACjF,IAAI,aAAa,EAAE,KAAK;AACxB,IAAI,YAAY,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC;AACrE,GAAG;AACH,EAAE,IAAI,EAAE;AACR,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,SAAS,EAAE,MAAM,IAAI,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,MAAM;AACvE,IAAI,YAAY,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC;AACrE,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,OAAO,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC;AAClE,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,YAAY,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;AAC3G,IAAI,OAAO,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,GAAG,GAAG,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC,CAAC;AAC5F,IAAI,OAAO,EAAE,MAAM;AACnB,IAAI,UAAU,EAAE,QAAQ;AACxB,IAAI,cAAc,EAAE,eAAe;AACnC,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,QAAQ,EAAE,UAAU;AACxB,IAAI,GAAG,EAAE,CAAC;AACV,IAAI,MAAM,EAAE,CAAC;AACb,IAAI,KAAK,EAAE,EAAE;AACb,GAAG;AACH,CAAC,CAAC,CAAC;;;;"}

package/esm/components/Popper/Popper.js

@@ -1,10 +1,9 @@
 import React, { useState } from 'react';
-import cx from 'clsx';
 import { usePopper } from 'react-popper';
 import { useDidUpdate } from '@mantine/hooks';
 import useStyles from './Popper.styles.js';
-import { Portal } from '../Portal/Portal.js';
 import { Transition } from '../Transition/Transition.js';
+import { Portal } from '../Portal/Portal.js';
 
 var __defProp = Object.defineProperty;
 var __defProps = Object.defineProperties;
@@ -54,7 +53,7 @@ function Popper({
 }) {
   var _a;
   const padding = withArrow ? gutter + arrowSize : gutter;
-  const classes = useStyles({ arrowSize });
+  const { classes, cx } = useStyles({ arrowSize });
   const [popperElement, setPopperElement] = useState(null);
   const { styles, attributes, forceUpdate } = usePopper(referenceElement, popperElement, {
     placement: placement === "center" ? position : `${position}-${placement}`,

package/esm/components/Popper/Popper.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popper.js","sources":["../../../src/components/Popper/Popper.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport cx from 'clsx';\nimport { usePopper } from 'react-popper';\nimport { useDidUpdate } from '@mantine/hooks';\nimport useStyles from './Popper.styles';\nimport { Portal } from '../Portal/Portal';\nimport { Transition, MantineTransition } from '../Transition/Transition';\n\nexport interface SharedPopperProps {\n  /** Position relative to reference element */\n  position?: 'top' | 'left' | 'bottom' | 'right';\n\n  /** Placement relative to reference element */\n  placement?: 'start' | 'center' | 'end';\n\n  /** Spacing between element and popper in px  */\n  gutter?: number;\n\n  /** Arrow size in px */\n  arrowSize?: number;\n\n  /** Renders arrow if true */\n  withArrow?: boolean;\n\n  /** Popper z-index */\n  zIndex?: number;\n\n  /** Customize mount/unmount transition */\n  transition?: MantineTransition;\n\n  /** Mount/unmount transition duration in ms */\n  transitionDuration?: number;\n\n  /** Mount/unmount transition timing function, defaults to theme.transitionTimingFunction */\n  transitionTimingFunction?: string;\n}\n\nexport interface PopperProps<T extends HTMLElement> extends SharedPopperProps {\n  /** Element at which popper should be attached */\n  referenceElement: T;\n\n  /** Popper content */\n  children: React.ReactNode;\n\n  /** True to show popper, false to hide */\n  mounted: boolean;\n\n  /** Arrow class name */\n  arrowClassName?: string;\n\n  /** Arrow inline styles */\n  arrowStyle?: React.CSSProperties;\n\n  /** useEffect dependencies to force update popper position */\n  forceUpdateDependencies?: any[];\n}\n\nfunction parsePopperPosition(position: string) {\n  if (typeof position !== 'string') {\n    return { position: 'top', placement: 'center' };\n  }\n\n  const splitted = position.split('-');\n\n  if (splitted.length === 1) {\n    return { position, placement: 'center' };\n  }\n\n  return { position: splitted[0], placement: splitted[1] };\n}\n\nexport function Popper<T extends HTMLElement = HTMLDivElement>({\n  position = 'top',\n  placement = 'center',\n  gutter = 5,\n  arrowSize = 2,\n  withArrow = false,\n  referenceElement,\n  children,\n  mounted,\n  transition = 'pop-top-left',\n  transitionDuration,\n  transitionTimingFunction,\n  arrowClassName,\n  arrowStyle,\n  zIndex = 1,\n  forceUpdateDependencies = [],\n}: PopperProps<T>) {\n  const padding = withArrow ? gutter + arrowSize : gutter;\n  const classes = useStyles({ arrowSize });\n  const [popperElement, setPopperElement] = useState(null);\n\n  const { styles, attributes, forceUpdate } = usePopper(referenceElement, popperElement, {\n    placement: placement === 'center' ? position : `${position}-${placement}`,\n    modifiers: [{ name: 'offset', options: { offset: [0, padding] } }],\n  });\n\n  const parsedAttributes = parsePopperPosition(attributes.popper?.['data-popper-placement']);\n\n  useDidUpdate(() => {\n    typeof forceUpdate === 'function' && forceUpdate();\n  }, forceUpdateDependencies);\n\n  return (\n    <Transition\n      mounted={mounted}\n      duration={transitionDuration}\n      transition={transition}\n      timingFunction={transitionTimingFunction}\n    >\n      {(transitionStyles) => (\n        <div>\n          <Portal zIndex={zIndex}>\n            <div\n              ref={setPopperElement}\n              style={{ ...styles.popper, pointerEvents: 'none' }}\n              {...attributes.popper}\n            >\n              <div style={transitionStyles}>\n                {children}\n                {withArrow && (\n                  <div\n                    style={arrowStyle}\n                    className={cx(\n                      classes.arrow,\n                      classes[parsedAttributes.placement],\n                      classes[parsedAttributes.position],\n                      arrowClassName\n                    )}\n                  />\n                )}\n              </div>\n            </div>\n          </Portal>\n        </div>\n      )}\n    </Transition>\n  );\n}\n\nPopper.displayName = '@mantine/core/Popper';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Popper.js","sources":["../../../src/components/Popper/Popper.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { usePopper } from 'react-popper';\nimport { useDidUpdate } from '@mantine/hooks';\nimport { Portal } from '../Portal';\nimport { Transition, MantineTransition } from '../Transition';\nimport useStyles from './Popper.styles';\n\nexport interface SharedPopperProps {\n  /** Position relative to reference element */\n  position?: 'top' | 'left' | 'bottom' | 'right';\n\n  /** Placement relative to reference element */\n  placement?: 'start' | 'center' | 'end';\n\n  /** Spacing between element and popper in px  */\n  gutter?: number;\n\n  /** Arrow size in px */\n  arrowSize?: number;\n\n  /** Renders arrow if true */\n  withArrow?: boolean;\n\n  /** Popper z-index */\n  zIndex?: number;\n\n  /** Customize mount/unmount transition */\n  transition?: MantineTransition;\n\n  /** Mount/unmount transition duration in ms */\n  transitionDuration?: number;\n\n  /** Mount/unmount transition timing function, defaults to theme.transitionTimingFunction */\n  transitionTimingFunction?: string;\n}\n\nexport interface PopperProps<T extends HTMLElement> extends SharedPopperProps {\n  /** Element at which popper should be attached */\n  referenceElement: T;\n\n  /** Popper content */\n  children: React.ReactNode;\n\n  /** True to show popper, false to hide */\n  mounted: boolean;\n\n  /** Arrow class name */\n  arrowClassName?: string;\n\n  /** Arrow inline styles */\n  arrowStyle?: React.CSSProperties;\n\n  /** useEffect dependencies to force update popper position */\n  forceUpdateDependencies?: any[];\n}\n\nfunction parsePopperPosition(position: string) {\n  if (typeof position !== 'string') {\n    return { position: 'top', placement: 'center' };\n  }\n\n  const splitted = position.split('-');\n\n  if (splitted.length === 1) {\n    return { position, placement: 'center' };\n  }\n\n  return { position: splitted[0], placement: splitted[1] };\n}\n\nexport function Popper<T extends HTMLElement = HTMLDivElement>({\n  position = 'top',\n  placement = 'center',\n  gutter = 5,\n  arrowSize = 2,\n  withArrow = false,\n  referenceElement,\n  children,\n  mounted,\n  transition = 'pop-top-left',\n  transitionDuration,\n  transitionTimingFunction,\n  arrowClassName,\n  arrowStyle,\n  zIndex = 1,\n  forceUpdateDependencies = [],\n}: PopperProps<T>) {\n  const padding = withArrow ? gutter + arrowSize : gutter;\n  const { classes, cx } = useStyles({ arrowSize });\n  const [popperElement, setPopperElement] = useState(null);\n\n  const { styles, attributes, forceUpdate } = usePopper(referenceElement, popperElement, {\n    placement: placement === 'center' ? position : `${position}-${placement}`,\n    modifiers: [{ name: 'offset', options: { offset: [0, padding] } }],\n  });\n\n  const parsedAttributes = parsePopperPosition(attributes.popper?.['data-popper-placement']);\n\n  useDidUpdate(() => {\n    typeof forceUpdate === 'function' && forceUpdate();\n  }, forceUpdateDependencies);\n\n  return (\n    <Transition\n      mounted={mounted}\n      duration={transitionDuration}\n      transition={transition}\n      timingFunction={transitionTimingFunction}\n    >\n      {(transitionStyles) => (\n        <div>\n          <Portal zIndex={zIndex}>\n            <div\n              ref={setPopperElement}\n              style={{ ...styles.popper, pointerEvents: 'none' }}\n              {...attributes.popper}\n            >\n              <div style={transitionStyles}>\n                {children}\n                {withArrow && (\n                  <div\n                    style={arrowStyle}\n                    className={cx(\n                      classes.arrow,\n                      classes[parsedAttributes.placement],\n                      classes[parsedAttributes.position],\n                      arrowClassName\n                    )}\n                  />\n                )}\n              </div>\n            </div>\n          </Portal>\n        </div>\n      )}\n    </Transition>\n  );\n}\n\nPopper.displayName = '@mantine/core/Popper';\n"],"names":[],"mappings":"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"}

package/esm/components/Popper/Popper.styles.js

@@ -1,4 +1,4 @@
-import { createMemoStyles } from '../../theme/create-memo-styles.js';
+import { createStyles } from '@mantine/styles';
 
 var __defProp = Object.defineProperty;
 var __defProps = Object.defineProperties;
@@ -19,60 +19,70 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-const horizontalPlacement = (arrowSize) => ({
-  "&$center": {
+const horizontalPlacement = (arrowSize, classes) => ({
+  [`&.${classes.center}`]: {
     top: `calc(50% - ${arrowSize}px)`
   },
-  "&$end": {
+  [`&.${classes.end}`]: {
     bottom: arrowSize * 2
   },
-  "&$start": {
+  [`&.${classes.start}`]: {
     top: arrowSize * 2
   }
 });
-const verticalPlacement = (arrowSize) => ({
-  "&$center": {
+const verticalPlacement = (arrowSize, classes) => ({
+  [`&.${classes.center}`]: {
     left: `calc(50% - ${arrowSize}px)`
   },
-  "&$end": {
+  [`&.${classes.end}`]: {
     right: arrowSize * 2
   },
-  "&$start": {
+  [`&.${classes.start}`]: {
     left: arrowSize * 2
   }
 });
-var useStyles = createMemoStyles({
-  center: {},
-  start: {},
-  end: {},
-  arrow: ({ arrowSize }) => ({
-    width: arrowSize * 2,
-    height: arrowSize * 2,
-    position: "absolute",
-    transform: "rotate(45deg)",
-    border: "1px solid transparent",
-    zIndex: 1
-  }),
-  left: ({ arrowSize }) => __spreadProps(__spreadValues({}, horizontalPlacement(arrowSize)), {
-    right: -arrowSize,
-    borderLeft: 0,
-    borderBottom: 0
-  }),
-  right: ({ arrowSize }) => __spreadProps(__spreadValues({}, horizontalPlacement(arrowSize)), {
-    left: -arrowSize,
-    borderRight: 0,
-    borderTop: 0
-  }),
-  top: ({ arrowSize }) => __spreadProps(__spreadValues({}, verticalPlacement(arrowSize)), {
-    bottom: -arrowSize,
-    borderLeft: 0,
-    borderTop: 0
-  }),
-  bottom: ({ arrowSize }) => __spreadProps(__spreadValues({}, verticalPlacement(arrowSize)), {
-    top: -arrowSize,
-    borderRight: 0,
-    borderBottom: 0
-  })
+var useStyles = createStyles((_theme, { arrowSize }, getRef) => {
+  const center = { ref: getRef("center") };
+  const start = { ref: getRef("start") };
+  const end = { ref: getRef("end") };
+  const placementClasses = {
+    center: center.ref,
+    start: start.ref,
+    end: end.ref
+  };
+  return {
+    center,
+    start,
+    end,
+    arrow: {
+      width: arrowSize * 2,
+      height: arrowSize * 2,
+      position: "absolute",
+      transform: "rotate(45deg)",
+      border: "1px solid transparent",
+      zIndex: 1
+    },
+    left: __spreadProps(__spreadValues({}, horizontalPlacement(arrowSize, placementClasses)), {
+      right: -arrowSize,
+      borderLeft: 0,
+      borderBottom: 0
+    }),
+    right: __spreadProps(__spreadValues({}, horizontalPlacement(arrowSize, placementClasses)), {
+      left: -arrowSize,
+      borderRight: 0,
+      borderTop: 0
+    }),
+    top: __spreadProps(__spreadValues({}, verticalPlacement(arrowSize, placementClasses)), {
+      bottom: -arrowSize,
+      borderLeft: 0,
+      borderTop: 0
+    }),
+    bottom: __spreadProps(__spreadValues({}, verticalPlacement(arrowSize, placementClasses)), {
+      top: -arrowSize,
+      borderRight: 0,
+      borderBottom: 0
+    })
+  };
 });
 
 export default useStyles;

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

@@ -1 +1 @@
-{"version":3,"file":"Popper.styles.js","sources":["../../../src/components/Popper/Popper.styles.ts"],"sourcesContent":["import { createMemoStyles } from '../../theme';\n\ninterface PopperStyles {\n  arrowSize: number;\n}\n\nconst horizontalPlacement = (arrowSize: number) => ({\n  '&$center': {\n    top: `calc(50% - ${arrowSize}px)`,\n  },\n\n  '&$end': {\n    bottom: arrowSize * 2,\n  },\n\n  '&$start': {\n    top: arrowSize * 2,\n  },\n});\n\nconst verticalPlacement = (arrowSize: number) => ({\n  '&$center': {\n    left: `calc(50% - ${arrowSize}px)`,\n  },\n\n  '&$end': {\n    right: arrowSize * 2,\n  },\n\n  '&$start': {\n    left: arrowSize * 2,\n  },\n});\n\nexport default createMemoStyles({\n  center: {},\n  start: {},\n  end: {},\n\n  arrow: ({ arrowSize }: PopperStyles) => ({\n    width: arrowSize * 2,\n    height: arrowSize * 2,\n    position: 'absolute',\n    transform: 'rotate(45deg)',\n    border: '1px solid transparent',\n    zIndex: 1,\n  }),\n\n  left: ({ arrowSize }: PopperStyles) => ({\n    ...horizontalPlacement(arrowSize),\n    right: -arrowSize,\n    borderLeft: 0,\n    borderBottom: 0,\n  }),\n\n  right: ({ arrowSize }: PopperStyles) => ({\n    ...horizontalPlacement(arrowSize),\n    left: -arrowSize,\n    borderRight: 0,\n    borderTop: 0,\n  }),\n\n  top: ({ arrowSize }: PopperStyles) => ({\n    ...verticalPlacement(arrowSize),\n    bottom: -arrowSize,\n    borderLeft: 0,\n    borderTop: 0,\n  }),\n\n  bottom: ({ arrowSize }: PopperStyles) => ({\n    ...verticalPlacement(arrowSize),\n    top: -arrowSize,\n    borderRight: 0,\n    borderBottom: 0,\n  }),\n});\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Popper.styles.js","sources":["../../../src/components/Popper/Popper.styles.ts"],"sourcesContent":["import { createStyles } from '@mantine/styles';\n\ninterface PopperStyles {\n  arrowSize: number;\n}\n\ninterface PlacementClasses {\n  center: string;\n  end: string;\n  start: string;\n}\n\nconst horizontalPlacement = (arrowSize: number, classes: PlacementClasses) => ({\n  [`&.${classes.center}`]: {\n    top: `calc(50% - ${arrowSize}px)`,\n  },\n\n  [`&.${classes.end}`]: {\n    bottom: arrowSize * 2,\n  },\n\n  [`&.${classes.start}`]: {\n    top: arrowSize * 2,\n  },\n});\n\nconst verticalPlacement = (arrowSize: number, classes: PlacementClasses) => ({\n  [`&.${classes.center}`]: {\n    left: `calc(50% - ${arrowSize}px)`,\n  },\n\n  [`&.${classes.end}`]: {\n    right: arrowSize * 2,\n  },\n\n  [`&.${classes.start}`]: {\n    left: arrowSize * 2,\n  },\n});\n\nexport default createStyles((_theme, { arrowSize }: PopperStyles, getRef) => {\n  const center = { ref: getRef('center') } as const;\n  const start = { ref: getRef('start') } as const;\n  const end = { ref: getRef('end') } as const;\n\n  const placementClasses = {\n    center: center.ref,\n    start: start.ref,\n    end: end.ref,\n  };\n\n  return {\n    center,\n    start,\n    end,\n\n    arrow: {\n      width: arrowSize * 2,\n      height: arrowSize * 2,\n      position: 'absolute',\n      transform: 'rotate(45deg)',\n      border: '1px solid transparent',\n      zIndex: 1,\n    },\n\n    left: {\n      ...horizontalPlacement(arrowSize, placementClasses),\n      right: -arrowSize,\n      borderLeft: 0,\n      borderBottom: 0,\n    },\n\n    right: {\n      ...horizontalPlacement(arrowSize, placementClasses),\n      left: -arrowSize,\n      borderRight: 0,\n      borderTop: 0,\n    },\n\n    top: {\n      ...verticalPlacement(arrowSize, placementClasses),\n      bottom: -arrowSize,\n      borderLeft: 0,\n      borderTop: 0,\n    },\n\n    bottom: {\n      ...verticalPlacement(arrowSize, placementClasses),\n      top: -arrowSize,\n      borderRight: 0,\n      borderBottom: 0,\n    },\n  };\n});\n"],"names":[],"mappings":"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"}

package/esm/components/Progress/Progress.js

@@ -1,10 +1,6 @@
 import React from 'react';
-import cx from 'clsx';
-import { useReducedMotion } from '@mantine/hooks';
-import useStyles, { sizes } from './Progress.styles.js';
-import { useMantineTheme } from '../../theme/use-mantine-theme/use-mantine-theme.js';
-import { mergeStyles } from '../../theme/utils/merge-styles/merge-styles.js';
-import { getThemeColor } from '../../theme/utils/get-theme-color/get-theme-color.js';
+import { useMantineTheme, mergeStyles, getThemeColor } from '@mantine/styles';
+import useStyles from './Progress.styles.js';
 
 var __defProp = Object.defineProperty;
 var __defProps = Object.defineProperties;
@@ -37,7 +33,6 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-const PROGRESS_SIZES = sizes;
 function getCumulativeSections(sections) {
   return sections.reduce((acc, section) => {
     acc.sections.push(__spreadProps(__spreadValues({}, section), { accumulated: acc.accumulated }));
@@ -54,7 +49,6 @@ function Progress(_a) {
     size = "md",
     radius = "sm",
     striped = false,
-    themeOverride,
     "aria-label": ariaLabel,
     classNames,
     styles,
@@ -67,15 +61,13 @@ function Progress(_a) {
     "size",
     "radius",
     "striped",
-    "themeOverride",
     "aria-label",
     "classNames",
     "styles",
     "sections"
   ]);
-  const theme = useMantineTheme(themeOverride);
-  const reduceMotion = useReducedMotion();
-  const classes = useStyles({ color, size, radius, striped, reduceMotion, theme }, classNames, "progress");
+  const theme = useMantineTheme();
+  const { classes, cx } = useStyles({ color, size, radius, striped }, classNames, "progress");
   const _styles = mergeStyles(classes, styles);
   const segments = Array.isArray(sections) ? getCumulativeSections(sections).map((section, index) => /* @__PURE__ */ React.createElement("div", {
     key: index,
@@ -101,5 +93,5 @@ function Progress(_a) {
 }
 Progress.displayName = "@mantine/core/Progress";
 
-export { PROGRESS_SIZES, Progress };
+export { Progress };
 //# sourceMappingURL=Progress.js.map

package/esm/components/Progress/Progress.js.map

@@ -1 +1 @@
-{"version":3,"file":"Progress.js","sources":["../../../src/components/Progress/Progress.tsx"],"sourcesContent":["import React from 'react';\nimport cx from 'clsx';\nimport { useReducedMotion } from '@mantine/hooks';\nimport {\n  DefaultProps,\n  useMantineTheme,\n  MantineNumberSize,\n  mergeStyles,\n  getThemeColor,\n} from '../../theme';\nimport useStyles, { sizes } from './Progress.styles';\n\nexport const PROGRESS_SIZES = sizes;\n\nexport type ProgressStylesNames = keyof ReturnType<typeof useStyles>;\n\nexport interface ProgressProps\n  extends DefaultProps<ProgressStylesNames>,\n    React.ComponentPropsWithoutRef<'div'> {\n  /** Percent of filled bar (0-100) */\n  value?: number;\n\n  /** Progress color from theme */\n  color?: string;\n\n  /** Predefined progress height or number for height in px */\n  size?: MantineNumberSize;\n\n  /** Predefined progress radius from theme.radius or number for height in px */\n  radius?: MantineNumberSize;\n\n  /** Adds stripes */\n  striped?: boolean;\n\n  /** Replaces value if present, renders multiple sections instead of single one */\n  sections?: { value: number; color: string }[];\n}\n\nfunction getCumulativeSections(\n  sections: { value: number; color: string }[]\n): { value: number; color: string; accumulated: number }[] {\n  return sections.reduce(\n    (acc, section) => {\n      acc.sections.push({ ...section, accumulated: acc.accumulated });\n      acc.accumulated += section.value;\n      return acc;\n    },\n    { accumulated: 0, sections: [] }\n  ).sections;\n}\n\nexport function Progress({\n  className,\n  style,\n  value,\n  color,\n  size = 'md',\n  radius = 'sm',\n  striped = false,\n  themeOverride,\n  'aria-label': ariaLabel,\n  classNames,\n  styles,\n  sections,\n  ...others\n}: ProgressProps) {\n  const theme = useMantineTheme(themeOverride);\n  const reduceMotion = useReducedMotion();\n  const classes = useStyles(\n    { color, size, radius, striped, reduceMotion, theme },\n    classNames,\n    'progress'\n  );\n  const _styles = mergeStyles(classes, styles);\n\n  const segments = Array.isArray(sections)\n    ? getCumulativeSections(sections).map((section, index) => (\n        <div\n          key={index}\n          className={classes.bar}\n          style={{\n            ..._styles.bar,\n            width: `${section.value}%`,\n            left: `${section.accumulated}%`,\n            backgroundColor: getThemeColor({ theme, color: section.color, shade: 7 }),\n          }}\n        />\n      ))\n    : null;\n\n  return (\n    <div className={cx(classes.root, className)} style={{ ...style, ..._styles.root }} {...others}>\n      {segments || (\n        <div\n          role=\"progressbar\"\n          aria-valuemax={100}\n          aria-valuemin={0}\n          aria-valuenow={value}\n          aria-label={ariaLabel}\n          className={classes.bar}\n          style={{ ..._styles.bar, width: `${value}%` }}\n        />\n      )}\n    </div>\n  );\n}\n\nProgress.displayName = '@mantine/core/Progress';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Progress.js","sources":["../../../src/components/Progress/Progress.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  useMantineTheme,\n  mergeStyles,\n  DefaultProps,\n  MantineNumberSize,\n  getThemeColor,\n  MantineColor,\n  ClassNames,\n} from '@mantine/styles';\nimport useStyles from './Progress.styles';\n\nexport type ProgressStylesNames = ClassNames<typeof useStyles>;\n\nexport interface ProgressProps\n  extends DefaultProps<ProgressStylesNames>,\n    React.ComponentPropsWithoutRef<'div'> {\n  /** Percent of filled bar (0-100) */\n  value?: number;\n\n  /** Progress color from theme */\n  color?: MantineColor;\n\n  /** Predefined progress height or number for height in px */\n  size?: MantineNumberSize;\n\n  /** Predefined progress radius from theme.radius or number for height in px */\n  radius?: MantineNumberSize;\n\n  /** Adds stripes */\n  striped?: boolean;\n\n  /** Replaces value if present, renders multiple sections instead of single one */\n  sections?: { value: number; color: MantineColor }[];\n}\n\nfunction getCumulativeSections(\n  sections: { value: number; color: MantineColor }[]\n): { value: number; color: MantineColor; accumulated: number }[] {\n  return sections.reduce(\n    (acc, section) => {\n      acc.sections.push({ ...section, accumulated: acc.accumulated });\n      acc.accumulated += section.value;\n      return acc;\n    },\n    { accumulated: 0, sections: [] }\n  ).sections;\n}\n\nexport function Progress({\n  className,\n  style,\n  value,\n  color,\n  size = 'md',\n  radius = 'sm',\n  striped = false,\n  'aria-label': ariaLabel,\n  classNames,\n  styles,\n  sections,\n  ...others\n}: ProgressProps) {\n  const theme = useMantineTheme();\n  const { classes, cx } = useStyles({ color, size, radius, striped }, classNames, 'progress');\n  const _styles = mergeStyles(classes, styles);\n\n  const segments = Array.isArray(sections)\n    ? getCumulativeSections(sections).map((section, index) => (\n        <div\n          key={index}\n          className={classes.bar}\n          style={{\n            ..._styles.bar,\n            width: `${section.value}%`,\n            left: `${section.accumulated}%`,\n            backgroundColor: getThemeColor({ theme, color: section.color, shade: 7 }),\n          }}\n        />\n      ))\n    : null;\n\n  return (\n    <div className={cx(classes.root, className)} style={{ ...style, ..._styles.root }} {...others}>\n      {segments || (\n        <div\n          role=\"progressbar\"\n          aria-valuemax={100}\n          aria-valuemin={0}\n          aria-valuenow={value}\n          aria-label={ariaLabel}\n          className={classes.bar}\n          style={{ ..._styles.bar, width: `${value}%` }}\n        />\n      )}\n    </div>\n  );\n}\n\nProgress.displayName = '@mantine/core/Progress';\n"],"names":[],"mappings":";;;;AAAA,IAAI,SAAS,GAAG,MAAM,CAAC,cAAc,CAAC;AACtC,IAAI,UAAU,GAAG,MAAM,CAAC,gBAAgB,CAAC;AACzC,IAAI,iBAAiB,GAAG,MAAM,CAAC,yBAAyB,CAAC;AACzD,IAAI,mBAAmB,GAAG,MAAM,CAAC,qBAAqB,CAAC;AACvD,IAAI,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC;AACnD,IAAI,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,oBAAoB,CAAC;AACzD,IAAI,eAAe,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,KAAK,GAAG,IAAI,GAAG,GAAG,SAAS,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,GAAG,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AAChK,IAAI,cAAc,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK;AAC/B,EAAE,KAAK,IAAI,IAAI,IAAI,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC;AAChC,IAAI,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC;AAClC,MAAM,eAAe,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AACxC,EAAE,IAAI,mBAAmB;AACzB,IAAI,KAAK,IAAI,IAAI,IAAI,mBAAmB,CAAC,CAAC,CAAC,EAAE;AAC7C,MAAM,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC;AACpC,QAAQ,eAAe,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AAC1C,KAAK;AACL,EAAE,OAAO,CAAC,CAAC;AACX,CAAC,CAAC;AACF,IAAI,aAAa,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK,UAAU,CAAC,CAAC,EAAE,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC;AAClE,IAAI,SAAS,GAAG,CAAC,MAAM,EAAE,OAAO,KAAK;AACrC,EAAE,IAAI,MAAM,GAAG,EAAE,CAAC;AAClB,EAAE,KAAK,IAAI,IAAI,IAAI,MAAM;AACzB,IAAI,IAAI,YAAY,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;AACpE,MAAM,MAAM,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;AAClC,EAAE,IAAI,MAAM,IAAI,IAAI,IAAI,mBAAmB;AAC3C,IAAI,KAAK,IAAI,IAAI,IAAI,mBAAmB,CAAC,MAAM,CAAC,EAAE;AAClD,MAAM,IAAI,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,YAAY,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC;AACtE,QAAQ,MAAM,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;AACpC,KAAK;AACL,EAAE,OAAO,MAAM,CAAC;AAChB,CAAC,CAAC;AAQF,SAAS,qBAAqB,CAAC,QAAQ,EAAE;AACzC,EAAE,OAAO,QAAQ,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,OAAO,KAAK;AAC3C,IAAI,GAAG,CAAC,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,cAAc,CAAC,EAAE,EAAE,OAAO,CAAC,EAAE,EAAE,WAAW,EAAE,GAAG,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC;AACpG,IAAI,GAAG,CAAC,WAAW,IAAI,OAAO,CAAC,KAAK,CAAC;AACrC,IAAI,OAAO,GAAG,CAAC;AACf,GAAG,EAAE,EAAE,WAAW,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC;AAChD,CAAC;AACM,SAAS,QAAQ,CAAC,EAAE,EAAE;AAC7B,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE;AACf,IAAI,SAAS;AACb,IAAI,KAAK;AACT,IAAI,KAAK;AACT,IAAI,KAAK;AACT,IAAI,IAAI,GAAG,IAAI;AACf,IAAI,MAAM,GAAG,IAAI;AACjB,IAAI,OAAO,GAAG,KAAK;AACnB,IAAI,YAAY,EAAE,SAAS;AAC3B,IAAI,UAAU;AACd,IAAI,MAAM;AACV,IAAI,QAAQ;AACZ,GAAG,GAAG,EAAE,EAAE,MAAM,GAAG,SAAS,CAAC,EAAE,EAAE;AACjC,IAAI,WAAW;AACf,IAAI,OAAO;AACX,IAAI,OAAO;AACX,IAAI,OAAO;AACX,IAAI,MAAM;AACV,IAAI,QAAQ;AACZ,IAAI,SAAS;AACb,IAAI,YAAY;AAChB,IAAI,YAAY;AAChB,IAAI,QAAQ;AACZ,IAAI,UAAU;AACd,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,KAAK,GAAG,eAAe,EAAE,CAAC;AAClC,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,SAAS,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,UAAU,EAAE,UAAU,CAAC,CAAC;AAC9F,EAAE,MAAM,OAAO,GAAG,WAAW,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;AAC/C,EAAE,MAAM,QAAQ,GAAG,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,qBAAqB,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,KAAK,qBAAqB,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE;AAChJ,IAAI,GAAG,EAAE,KAAK;AACd,IAAI,SAAS,EAAE,OAAO,CAAC,GAAG;AAC1B,IAAI,KAAK,EAAE,aAAa,CAAC,cAAc,CAAC,EAAE,EAAE,OAAO,CAAC,GAAG,CAAC,EAAE;AAC1D,MAAM,KAAK,EAAE,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC;AAChC,MAAM,IAAI,EAAE,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC;AACrC,MAAM,eAAe,EAAE,aAAa,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,KAAK,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC;AAC/E,KAAK,CAAC;AACN,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC;AACb,EAAE,uBAAuB,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC;AACnE,IAAI,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,SAAS,CAAC;AAC1C,IAAI,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,EAAE,EAAE,KAAK,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC;AAClE,GAAG,EAAE,MAAM,CAAC,EAAE,QAAQ,oBAAoB,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE;AACrE,IAAI,IAAI,EAAE,aAAa;AACvB,IAAI,eAAe,EAAE,GAAG;AACxB,IAAI,eAAe,EAAE,CAAC;AACtB,IAAI,eAAe,EAAE,KAAK;AAC1B,IAAI,YAAY,EAAE,SAAS;AAC3B,IAAI,SAAS,EAAE,OAAO,CAAC,GAAG;AAC1B,IAAI,KAAK,EAAE,aAAa,CAAC,cAAc,CAAC,EAAE,EAAE,OAAO,CAAC,GAAG,CAAC,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC;AACjF,GAAG,CAAC,CAAC,CAAC;AACN,CAAC;AACD,QAAQ,CAAC,WAAW,GAAG,wBAAwB;;;;"}

package/esm/components/Progress/Progress.styles.js

@@ -1,6 +1,4 @@
-import { createMemoStyles } from '../../theme/create-memo-styles.js';
-import { getSizeValue } from '../../theme/utils/get-size-value/get-size-value.js';
-import { getThemeColor } from '../../theme/utils/get-theme-color/get-theme-color.js';
+import { createStyles, getSizeValue, getThemeColor } from '@mantine/styles';
 
 const sizes = {
   xs: 3,
@@ -9,22 +7,22 @@ const sizes = {
   lg: 12,
   xl: 16
 };
-var useStyles = createMemoStyles({
-  root: ({ radius, size, theme }) => ({
+var useStyles = createStyles((theme, { color, radius, size, striped }) => ({
+  root: {
     position: "relative",
     height: getSizeValue({ size, sizes }),
     backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[4] : theme.colors.gray[2],
     borderRadius: getSizeValue({ size: radius, sizes: theme.radius }),
     overflow: "hidden"
-  }),
-  bar: ({ theme, color, radius, reduceMotion, striped }) => ({
+  },
+  bar: {
     position: "absolute",
     top: 0,
     bottom: 0,
     left: 0,
     height: "100%",
     backgroundColor: getThemeColor({ theme, color, shade: theme.colorScheme === "dark" ? 4 : 6 }),
-    transition: reduceMotion ? "none" : `width 200ms ${theme.transitionTimingFunction}`,
+    transition: `width 200ms ${theme.transitionTimingFunction}`,
     backgroundSize: [theme.spacing.md, theme.spacing.md],
     backgroundImage: striped ? "linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent)" : "none",
     "&:last-child": {
@@ -34,9 +32,12 @@ var useStyles = createMemoStyles({
     "&:first-child": {
       borderTopLeftRadius: getSizeValue({ size: radius, sizes: theme.radius }),
       borderBottomLeftRadius: getSizeValue({ size: radius, sizes: theme.radius })
+    },
+    "@media (prefers-reduced-motion)": {
+      transitionDuration: "0ms"
     }
-  })
-});
+  }
+}));
 
 export default useStyles;
 export { sizes };

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

@@ -1 +1 @@
-{"version":3,"file":"Progress.styles.js","sources":["../../../src/components/Progress/Progress.styles.ts"],"sourcesContent":["import {\n  createMemoStyles,\n  MantineTheme,\n  MantineNumberSize,\n  getThemeColor,\n  getSizeValue,\n} from '../../theme';\n\nexport const sizes = {\n  xs: 3,\n  sm: 5,\n  md: 8,\n  lg: 12,\n  xl: 16,\n};\n\ninterface ProgressStyles {\n  theme: MantineTheme;\n  color: string;\n  radius: MantineNumberSize;\n  reduceMotion: boolean;\n  size: MantineNumberSize;\n  striped: boolean;\n}\n\nexport default createMemoStyles({\n  root: ({ radius, size, theme }: ProgressStyles) => ({\n    position: 'relative',\n    height: getSizeValue({ size, sizes }),\n    backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[2],\n    borderRadius: getSizeValue({ size: radius, sizes: theme.radius }),\n    overflow: 'hidden',\n  }),\n\n  bar: ({ theme, color, radius, reduceMotion, striped }: ProgressStyles) => ({\n    position: 'absolute',\n    top: 0,\n    bottom: 0,\n    left: 0,\n    height: '100%',\n    backgroundColor: getThemeColor({ theme, color, shade: theme.colorScheme === 'dark' ? 4 : 6 }),\n    transition: reduceMotion ? 'none' : `width 200ms ${theme.transitionTimingFunction}`,\n    backgroundSize: [theme.spacing.md, theme.spacing.md],\n    backgroundImage: striped\n      ? 'linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent)'\n      : 'none',\n\n    '&:last-child': {\n      borderTopRightRadius: getSizeValue({ size: radius, sizes: theme.radius }),\n      borderBottomRightRadius: getSizeValue({ size: radius, sizes: theme.radius }),\n    },\n\n    '&:first-child': {\n      borderTopLeftRadius: getSizeValue({ size: radius, sizes: theme.radius }),\n      borderBottomLeftRadius: getSizeValue({ size: radius, sizes: theme.radius }),\n    },\n  }),\n});\n"],"names":[],"mappings":";;;;AAKY,MAAC,KAAK,GAAG;AACrB,EAAE,EAAE,EAAE,CAAC;AACP,EAAE,EAAE,EAAE,CAAC;AACP,EAAE,EAAE,EAAE,CAAC;AACP,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,EAAE,EAAE,EAAE;AACR,EAAE;AACF,gBAAe,gBAAgB,CAAC;AAChC,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM;AACtC,IAAI,QAAQ,EAAE,UAAU;AACxB,IAAI,MAAM,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;AACzC,IAAI,eAAe,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;AAC/F,IAAI,YAAY,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC;AACrE,IAAI,QAAQ,EAAE,QAAQ;AACtB,GAAG,CAAC;AACJ,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM;AAC7D,IAAI,QAAQ,EAAE,UAAU;AACxB,IAAI,GAAG,EAAE,CAAC;AACV,IAAI,MAAM,EAAE,CAAC;AACb,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,MAAM,EAAE,MAAM;AAClB,IAAI,eAAe,EAAE,aAAa,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC;AACjG,IAAI,UAAU,EAAE,YAAY,GAAG,MAAM,GAAG,CAAC,YAAY,EAAE,KAAK,CAAC,wBAAwB,CAAC,CAAC;AACvF,IAAI,cAAc,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC;AACxD,IAAI,eAAe,EAAE,OAAO,GAAG,qLAAqL,GAAG,MAAM;AAC7N,IAAI,cAAc,EAAE;AACpB,MAAM,oBAAoB,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC;AAC/E,MAAM,uBAAuB,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC;AAClF,KAAK;AACL,IAAI,eAAe,EAAE;AACrB,MAAM,mBAAmB,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC;AAC9E,MAAM,sBAAsB,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC;AACjF,KAAK;AACL,GAAG,CAAC;AACJ,CAAC,CAAC;;;;;"}
+{"version":3,"file":"Progress.styles.js","sources":["../../../src/components/Progress/Progress.styles.ts"],"sourcesContent":["import {\n  createStyles,\n  MantineNumberSize,\n  getThemeColor,\n  getSizeValue,\n  MantineColor,\n} from '@mantine/styles';\n\nexport const sizes = {\n  xs: 3,\n  sm: 5,\n  md: 8,\n  lg: 12,\n  xl: 16,\n};\n\ninterface ProgressStyles {\n  color: MantineColor;\n  radius: MantineNumberSize;\n  size: MantineNumberSize;\n  striped: boolean;\n}\n\nexport default createStyles((theme, { color, radius, size, striped }: ProgressStyles) => ({\n  root: {\n    position: 'relative',\n    height: getSizeValue({ size, sizes }),\n    backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[2],\n    borderRadius: getSizeValue({ size: radius, sizes: theme.radius }),\n    overflow: 'hidden',\n  },\n\n  bar: {\n    position: 'absolute',\n    top: 0,\n    bottom: 0,\n    left: 0,\n    height: '100%',\n    backgroundColor: getThemeColor({ theme, color, shade: theme.colorScheme === 'dark' ? 4 : 6 }),\n    transition: `width 200ms ${theme.transitionTimingFunction}`,\n    backgroundSize: [theme.spacing.md, theme.spacing.md],\n    backgroundImage: striped\n      ? 'linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent)'\n      : 'none',\n\n    '&:last-child': {\n      borderTopRightRadius: getSizeValue({ size: radius, sizes: theme.radius }),\n      borderBottomRightRadius: getSizeValue({ size: radius, sizes: theme.radius }),\n    },\n\n    '&:first-child': {\n      borderTopLeftRadius: getSizeValue({ size: radius, sizes: theme.radius }),\n      borderBottomLeftRadius: getSizeValue({ size: radius, sizes: theme.radius }),\n    },\n\n    '@media (prefers-reduced-motion)': {\n      transitionDuration: '0ms',\n    },\n  },\n}));\n"],"names":[],"mappings":";;AAKY,MAAC,KAAK,GAAG;AACrB,EAAE,EAAE,EAAE,CAAC;AACP,EAAE,EAAE,EAAE,CAAC;AACP,EAAE,EAAE,EAAE,CAAC;AACP,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,EAAE,EAAE,EAAE;AACR,EAAE;AACF,gBAAe,YAAY,CAAC,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM;AAC1E,EAAE,IAAI,EAAE;AACR,IAAI,QAAQ,EAAE,UAAU;AACxB,IAAI,MAAM,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;AACzC,IAAI,eAAe,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;AAC/F,IAAI,YAAY,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC;AACrE,IAAI,QAAQ,EAAE,QAAQ;AACtB,GAAG;AACH,EAAE,GAAG,EAAE;AACP,IAAI,QAAQ,EAAE,UAAU;AACxB,IAAI,GAAG,EAAE,CAAC;AACV,IAAI,MAAM,EAAE,CAAC;AACb,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,MAAM,EAAE,MAAM;AAClB,IAAI,eAAe,EAAE,aAAa,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC;AACjG,IAAI,UAAU,EAAE,CAAC,YAAY,EAAE,KAAK,CAAC,wBAAwB,CAAC,CAAC;AAC/D,IAAI,cAAc,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC;AACxD,IAAI,eAAe,EAAE,OAAO,GAAG,qLAAqL,GAAG,MAAM;AAC7N,IAAI,cAAc,EAAE;AACpB,MAAM,oBAAoB,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC;AAC/E,MAAM,uBAAuB,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC;AAClF,KAAK;AACL,IAAI,eAAe,EAAE;AACrB,MAAM,mBAAmB,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC;AAC9E,MAAM,sBAAsB,EAAE,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC;AACjF,KAAK;AACL,IAAI,iCAAiC,EAAE;AACvC,MAAM,kBAAkB,EAAE,KAAK;AAC/B,KAAK;AACL,GAAG;AACH,CAAC,CAAC,CAAC;;;;;"}

package/esm/components/RadioGroup/Radio/Radio.js

@@ -1,9 +1,7 @@
 import React from 'react';
-import cx from 'clsx';
 import { useId } from '@mantine/hooks';
+import { mergeStyles } from '@mantine/styles';
 import useStyles from './Radio.styles.js';
-import { useMantineTheme } from '../../../theme/use-mantine-theme/use-mantine-theme.js';
-import { mergeStyles } from '../../../theme/utils/merge-styles/merge-styles.js';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
@@ -37,7 +35,6 @@ function Radio(_a) {
   var _b = _a, {
     className,
     style,
-    themeOverride,
     id,
     children,
     size,
@@ -50,7 +47,6 @@ function Radio(_a) {
   } = _b, others = __objRest(_b, [
     "className",
     "style",
-    "themeOverride",
     "id",
     "children",
     "size",
@@ -61,8 +57,7 @@ function Radio(_a) {
     "classNames",
     "styles"
   ]);
-  const theme = useMantineTheme(themeOverride);
-  const classes = useStyles({ color, size, theme }, classNames, "radio-group");
+  const { classes, cx } = useStyles({ color, size }, classNames, "radio-group");
   const _styles = mergeStyles(classes, styles);
   const uuid = useId(id);
   return /* @__PURE__ */ React.createElement("div", {

package/esm/components/RadioGroup/Radio/Radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.js","sources":["../../../../src/components/RadioGroup/Radio/Radio.tsx"],"sourcesContent":["import React from 'react';\nimport cx from 'clsx';\nimport { useId } from '@mantine/hooks';\nimport { DefaultProps, useMantineTheme, MantineSize, mergeStyles } from '../../../theme';\nimport useStyles from './Radio.styles';\n\nexport type RadioStylesNames = Exclude<keyof ReturnType<typeof useStyles>, 'labelDisabled'>;\n\nexport interface RadioProps\n  extends DefaultProps<RadioStylesNames>,\n    Omit<React.ComponentPropsWithoutRef<'input'>, 'size'> {\n  /** Radio label */\n  children: React.ReactNode;\n\n  /** Radio value */\n  value: string;\n\n  /** Active radio color */\n  color?: string;\n\n  /** Predefined label fontSize, radio width, height and border-radius */\n  size?: MantineSize;\n\n  /** Get input ref */\n  elementRef?: React.ForwardedRef<HTMLInputElement>;\n}\n\nexport function Radio({\n  className,\n  style,\n  themeOverride,\n  id,\n  children,\n  size,\n  elementRef,\n  title,\n  disabled,\n  color,\n  classNames,\n  styles,\n  ...others\n}: RadioProps) {\n  const theme = useMantineTheme(themeOverride);\n  const classes = useStyles({ color, size, theme }, classNames, 'radio-group');\n  const _styles = mergeStyles(classes, styles);\n  const uuid = useId(id);\n\n  return (\n    <div\n      className={cx(classes.radioWrapper, className)}\n      style={{ ...style, ..._styles.radioWrapper }}\n      title={title}\n    >\n      <label\n        className={cx(classes.label, { [classes.labelDisabled]: disabled })}\n        htmlFor={uuid}\n        style={_styles.label}\n      >\n        <input\n          ref={elementRef}\n          className={classes.radio}\n          type=\"radio\"\n          id={uuid}\n          disabled={disabled}\n          style={_styles.radio}\n          {...others}\n        />\n        <span>{children}</span>\n      </label>\n    </div>\n  );\n}\n\nRadio.displayName = '@mantine/core/Radio';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Radio.js","sources":["../../../../src/components/RadioGroup/Radio/Radio.tsx"],"sourcesContent":["import React from 'react';\nimport { useId } from '@mantine/hooks';\nimport { mergeStyles, DefaultProps, MantineSize, MantineColor, ClassNames } from '@mantine/styles';\nimport useStyles from './Radio.styles';\n\nexport type RadioStylesNames = Exclude<ClassNames<typeof useStyles>, 'labelDisabled'>;\n\nexport interface RadioProps\n  extends DefaultProps<RadioStylesNames>,\n    Omit<React.ComponentPropsWithoutRef<'input'>, 'size'> {\n  /** Radio label */\n  children: React.ReactNode;\n\n  /** Radio value */\n  value: string;\n\n  /** Active radio color from theme.colors */\n  color?: MantineColor;\n\n  /** Predefined label fontSize, radio width, height and border-radius */\n  size?: MantineSize;\n\n  /** Get input ref */\n  elementRef?: React.ForwardedRef<HTMLInputElement>;\n}\n\nexport function Radio({\n  className,\n  style,\n  id,\n  children,\n  size,\n  elementRef,\n  title,\n  disabled,\n  color,\n  classNames,\n  styles,\n  ...others\n}: RadioProps) {\n  const { classes, cx } = useStyles({ color, size }, classNames, 'radio-group');\n  const _styles = mergeStyles(classes, styles);\n  const uuid = useId(id);\n\n  return (\n    <div\n      className={cx(classes.radioWrapper, className)}\n      style={{ ...style, ..._styles.radioWrapper }}\n      title={title}\n    >\n      <label\n        className={cx(classes.label, { [classes.labelDisabled]: disabled })}\n        htmlFor={uuid}\n        style={_styles.label}\n      >\n        <input\n          ref={elementRef}\n          className={classes.radio}\n          type=\"radio\"\n          id={uuid}\n          disabled={disabled}\n          style={_styles.radio}\n          {...others}\n        />\n        <span>{children}</span>\n      </label>\n    </div>\n  );\n}\n\nRadio.displayName = '@mantine/core/Radio';\n"],"names":[],"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;AAKK,SAAS,KAAK,CAAC,EAAE,EAAE;AAC1B,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE;AACf,IAAI,SAAS;AACb,IAAI,KAAK;AACT,IAAI,EAAE;AACN,IAAI,QAAQ;AACZ,IAAI,IAAI;AACR,IAAI,UAAU;AACd,IAAI,KAAK;AACT,IAAI,QAAQ;AACZ,IAAI,KAAK;AACT,IAAI,UAAU;AACd,IAAI,MAAM;AACV,GAAG,GAAG,EAAE,EAAE,MAAM,GAAG,SAAS,CAAC,EAAE,EAAE;AACjC,IAAI,WAAW;AACf,IAAI,OAAO;AACX,IAAI,IAAI;AACR,IAAI,UAAU;AACd,IAAI,MAAM;AACV,IAAI,YAAY;AAChB,IAAI,OAAO;AACX,IAAI,UAAU;AACd,IAAI,OAAO;AACX,IAAI,YAAY;AAChB,IAAI,QAAQ;AACZ,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,SAAS,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,UAAU,EAAE,aAAa,CAAC,CAAC;AAChF,EAAE,MAAM,OAAO,GAAG,WAAW,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;AAC/C,EAAE,MAAM,IAAI,GAAG,KAAK,CAAC,EAAE,CAAC,CAAC;AACzB,EAAE,uBAAuB,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE;AACpD,IAAI,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,YAAY,EAAE,SAAS,CAAC;AAClD,IAAI,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,EAAE,EAAE,KAAK,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC;AAC1E,IAAI,KAAK;AACT,GAAG,kBAAkB,KAAK,CAAC,aAAa,CAAC,OAAO,EAAE;AAClD,IAAI,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,OAAO,CAAC,aAAa,GAAG,QAAQ,EAAE,CAAC;AACvE,IAAI,OAAO,EAAE,IAAI;AACjB,IAAI,KAAK,EAAE,OAAO,CAAC,KAAK;AACxB,GAAG,kBAAkB,KAAK,CAAC,aAAa,CAAC,OAAO,EAAE,cAAc,CAAC;AACjE,IAAI,GAAG,EAAE,UAAU;AACnB,IAAI,SAAS,EAAE,OAAO,CAAC,KAAK;AAC5B,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,EAAE,EAAE,IAAI;AACZ,IAAI,QAAQ;AACZ,IAAI,KAAK,EAAE,OAAO,CAAC,KAAK;AACxB,GAAG,EAAE,MAAM,CAAC,CAAC,kBAAkB,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC;AAC7E,CAAC;AACD,KAAK,CAAC,WAAW,GAAG,qBAAqB;;;;"}