@mantine/core 4.2.9 → 5.0.0-alpha.10

package/cjs/components/Radio/RadioIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioIcon.js","sources":["../../../src/components/Radio/RadioIcon.tsx"],"sourcesContent":["import React from 'react';\n\nexport function RadioIcon(props: React.ComponentPropsWithoutRef<'svg'>) {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 5 5\" {...props}>\n      <path fill=\"currentColor\" d=\"M0 2.5a2.5 2.5 0 115 0 2.5 2.5 0 01-5 0z\" />\n    </svg>\n  );\n}\n"],"names":["React"],"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;AAEK,SAAS,SAAS,CAAC,KAAK,EAAE;AACjC,EAAE,uBAAuBA,cAAK,CAAC,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC;AACnE,IAAI,KAAK,EAAE,4BAA4B;AACvC,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,SAAS;AACtB,GAAG,EAAE,KAAK,CAAC,kBAAkBA,cAAK,CAAC,aAAa,CAAC,MAAM,EAAE;AACzD,IAAI,IAAI,EAAE,cAAc;AACxB,IAAI,CAAC,EAAE,0CAA0C;AACjD,GAAG,CAAC,CAAC,CAAC;AACN;;;;"}

package/cjs/components/RingProgress/RingProgress.js

@@ -46,7 +46,7 @@ const defaultProps = {
   thickness: 12
 };
 const RingProgress = React.forwardRef((props, ref) => {
-  const _a = styles.useMantineDefaultProps("RingProgress", defaultProps, props), {
+  const _a = styles.useComponentDefaultProps("RingProgress", defaultProps, props), {
     className,
     style,
     label,
@@ -55,7 +55,8 @@ const RingProgress = React.forwardRef((props, ref) => {
     thickness,
     classNames,
     styles: styles$1,
-    roundCaps
+    roundCaps,
+    unstyled
   } = _a, others = __objRest(_a, [
     "className",
     "style",
@@ -65,9 +66,10 @@ const RingProgress = React.forwardRef((props, ref) => {
     "thickness",
     "classNames",
     "styles",
-    "roundCaps"
+    "roundCaps",
+    "unstyled"
   ]);
-  const { classes, cx } = RingProgress_styles['default'](null, { classNames, styles: styles$1, name: "RingProgress" });
+  const { classes, cx } = RingProgress_styles['default'](null, { classNames, styles: styles$1, unstyled, name: "RingProgress" });
   const curves = getCurves.getCurves({
     size,
     thickness,

package/cjs/components/RingProgress/RingProgress.js.map

@@ -1 +1 @@
-{"version":3,"file":"RingProgress.js","sources":["../../../src/components/RingProgress/RingProgress.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, MantineColor, Selectors, useMantineDefaultProps } from '@mantine/styles';\nimport { Box } from '../Box';\nimport { Curve } from './Curve/Curve';\nimport { getCurves } from './get-curves/get-curves';\nimport useStyles from './RingProgress.styles';\n\nexport type RingProgressStylesNames = Selectors<typeof useStyles>;\n\nexport interface RingProgressProps\n  extends DefaultProps<RingProgressStylesNames>,\n    React.ComponentPropsWithoutRef<'div'> {\n  /** Label displayed in the center of the ring */\n  label?: React.ReactNode;\n\n  /** Ring thickness */\n  thickness?: number;\n\n  /** Width and height of the progress ring in px */\n  size?: number;\n\n  /** Sets whether the edges of the progress circle are rounded */\n  roundCaps?: boolean;\n\n  /** Ring sections */\n  sections: { value: number; color: MantineColor }[];\n}\n\nconst defaultProps: Partial<RingProgressProps> = {\n  size: 120,\n  thickness: 12,\n};\n\nexport const RingProgress = forwardRef<HTMLDivElement, RingProgressProps>(\n  (props: RingProgressProps, ref) => {\n    const {\n      className,\n      style,\n      label,\n      sections,\n      size,\n      thickness,\n      classNames,\n      styles,\n      roundCaps,\n      ...others\n    } = useMantineDefaultProps('RingProgress', defaultProps, props);\n\n    const { classes, cx } = useStyles(null, { classNames, styles, name: 'RingProgress' });\n\n    const curves = getCurves({\n      size,\n      thickness,\n      sections,\n      renderRoundedLineCaps: roundCaps,\n    }).map((curve, index) => (\n      <Curve\n        key={index}\n        value={curve.data?.value}\n        size={size}\n        thickness={thickness}\n        sum={curve.sum}\n        offset={curve.offset}\n        color={curve.data?.color}\n        root={curve.root}\n        lineRoundCaps={curve.lineRoundCaps}\n      />\n    ));\n\n    return (\n      <Box\n        style={{ width: size, height: size, ...style }}\n        className={cx(classes.root, className)}\n        ref={ref}\n        {...others}\n      >\n        <svg width={size} height={size} style={{ transform: 'rotate(-90deg)' }}>\n          {curves}\n        </svg>\n\n        {label && (\n          <div className={classes.label} style={{ right: thickness * 2, left: thickness * 2 }}>\n            {label}\n          </div>\n        )}\n      </Box>\n    );\n  }\n);\n\nRingProgress.displayName = '@mantine/core/RingProgress';\n"],"names":["forwardRef","useMantineDefaultProps","styles","useStyles","getCurves","React","Curve","Box"],"mappings":"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"}
+{"version":3,"file":"RingProgress.js","sources":["../../../src/components/RingProgress/RingProgress.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, MantineColor, Selectors, useComponentDefaultProps } from '@mantine/styles';\nimport { Box } from '../Box';\nimport { Curve } from './Curve/Curve';\nimport { getCurves } from './get-curves/get-curves';\nimport useStyles from './RingProgress.styles';\n\nexport type RingProgressStylesNames = Selectors<typeof useStyles>;\n\nexport interface RingProgressProps\n  extends DefaultProps<RingProgressStylesNames>,\n    React.ComponentPropsWithoutRef<'div'> {\n  /** Label displayed in the center of the ring */\n  label?: React.ReactNode;\n\n  /** Ring thickness */\n  thickness?: number;\n\n  /** Width and height of the progress ring in px */\n  size?: number;\n\n  /** Sets whether the edges of the progress circle are rounded */\n  roundCaps?: boolean;\n\n  /** Ring sections */\n  sections: { value: number; color: MantineColor }[];\n}\n\nconst defaultProps: Partial<RingProgressProps> = {\n  size: 120,\n  thickness: 12,\n};\n\nexport const RingProgress = forwardRef<HTMLDivElement, RingProgressProps>((props, ref) => {\n  const {\n    className,\n    style,\n    label,\n    sections,\n    size,\n    thickness,\n    classNames,\n    styles,\n    roundCaps,\n    unstyled,\n    ...others\n  } = useComponentDefaultProps('RingProgress', defaultProps, props);\n\n  const { classes, cx } = useStyles(null, { classNames, styles, unstyled, name: 'RingProgress' });\n\n  const curves = getCurves({\n    size,\n    thickness,\n    sections,\n    renderRoundedLineCaps: roundCaps,\n  }).map((curve, index) => (\n    <Curve\n      key={index}\n      value={curve.data?.value}\n      size={size}\n      thickness={thickness}\n      sum={curve.sum}\n      offset={curve.offset}\n      color={curve.data?.color}\n      root={curve.root}\n      lineRoundCaps={curve.lineRoundCaps}\n    />\n  ));\n\n  return (\n    <Box\n      style={{ width: size, height: size, ...style }}\n      className={cx(classes.root, className)}\n      ref={ref}\n      {...others}\n    >\n      <svg width={size} height={size} style={{ transform: 'rotate(-90deg)' }}>\n        {curves}\n      </svg>\n\n      {label && (\n        <div className={classes.label} style={{ right: thickness * 2, left: thickness * 2 }}>\n          {label}\n        </div>\n      )}\n    </Box>\n  );\n});\n\nRingProgress.displayName = '@mantine/core/RingProgress';\n"],"names":["forwardRef","useComponentDefaultProps","styles","useStyles","getCurves","React","Curve","Box"],"mappings":"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"}

package/cjs/components/ScrollArea/ScrollArea.js

@@ -60,7 +60,7 @@ const defaultProps = {
   offsetScrollbars: false
 };
 const ScrollArea = React.forwardRef((props, ref) => {
-  const _a = styles.useMantineDefaultProps("ScrollArea", defaultProps, props), {
+  const _a = styles.useComponentDefaultProps("ScrollArea", defaultProps, props), {
     children,
     className,
     classNames,
@@ -71,7 +71,8 @@ const ScrollArea = React.forwardRef((props, ref) => {
     dir,
     offsetScrollbars,
     viewportRef,
-    onScrollPositionChange
+    onScrollPositionChange,
+    unstyled
   } = _a, others = __objRest(_a, [
     "children",
     "className",
@@ -83,11 +84,12 @@ const ScrollArea = React.forwardRef((props, ref) => {
     "dir",
     "offsetScrollbars",
     "viewportRef",
-    "onScrollPositionChange"
+    "onScrollPositionChange",
+    "unstyled"
   ]);
   const [scrollbarHovered, setScrollbarHovered] = React.useState(false);
   const theme = styles.useMantineTheme();
-  const { classes, cx } = ScrollArea_styles['default']({ scrollbarSize, offsetScrollbars, scrollbarHovered }, { name: "ScrollArea", classNames, styles: styles$1 });
+  const { classes, cx } = ScrollArea_styles['default']({ scrollbarSize, offsetScrollbars, scrollbarHovered }, { name: "ScrollArea", classNames, styles: styles$1, unstyled });
   return /* @__PURE__ */ React__default.createElement(RadixScrollArea__namespace.Root, {
     type,
     scrollHideDelay,

package/cjs/components/ScrollArea/ScrollArea.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollArea.js","sources":["../../../src/components/ScrollArea/ScrollArea.tsx"],"sourcesContent":["import React, { useState, forwardRef } from 'react';\nimport * as RadixScrollArea from '@radix-ui/react-scroll-area';\nimport { DefaultProps, Selectors, useMantineTheme, useMantineDefaultProps } from '@mantine/styles';\nimport { Box } from '../Box';\nimport useStyles from './ScrollArea.styles';\n\nexport type ScrollAreaStylesNames = Selectors<typeof useStyles>;\n\nexport interface ScrollAreaProps\n  extends DefaultProps<ScrollAreaStylesNames>,\n    React.ComponentPropsWithoutRef<'div'> {\n  /** Scrollbar size in px */\n  scrollbarSize?: number;\n\n  /** Scrollbars type */\n  type?: 'auto' | 'always' | 'scroll' | 'hover';\n\n  /** Scroll hide delay in ms, for scroll and hover types only */\n  scrollHideDelay?: number;\n\n  /** Reading direction of the scroll area */\n  dir?: 'ltr' | 'rtl';\n\n  /** Should scrollbars be offset with padding */\n  offsetScrollbars?: boolean;\n\n  /** Get viewport ref */\n  viewportRef?: React.ForwardedRef<HTMLDivElement>;\n\n  /** Subscribe to scroll position changes */\n  onScrollPositionChange?(position: { x: number; y: number }): void;\n}\n\nconst defaultProps: Partial<ScrollAreaProps> = {\n  scrollbarSize: 12,\n  scrollHideDelay: 1000,\n  type: 'hover',\n  offsetScrollbars: false,\n};\n\nexport const ScrollArea = forwardRef<HTMLDivElement, ScrollAreaProps>(\n  (props: ScrollAreaProps, ref) => {\n    const {\n      children,\n      className,\n      classNames,\n      styles,\n      scrollbarSize,\n      scrollHideDelay,\n      type,\n      dir,\n      offsetScrollbars,\n      viewportRef,\n      onScrollPositionChange,\n      ...others\n    } = useMantineDefaultProps('ScrollArea', defaultProps, props);\n\n    const [scrollbarHovered, setScrollbarHovered] = useState(false);\n    const theme = useMantineTheme();\n    const { classes, cx } = useStyles(\n      { scrollbarSize, offsetScrollbars, scrollbarHovered },\n      { name: 'ScrollArea', classNames, styles }\n    );\n\n    return (\n      <RadixScrollArea.Root\n        type={type}\n        scrollHideDelay={scrollHideDelay}\n        dir={dir || theme.dir}\n        ref={ref}\n        asChild\n      >\n        <Box className={cx(classes.root, className)} {...others}>\n          <RadixScrollArea.Viewport\n            className={classes.viewport}\n            ref={viewportRef}\n            onScroll={\n              typeof onScrollPositionChange === 'function'\n                ? ({ currentTarget }) =>\n                    onScrollPositionChange({\n                      x: currentTarget.scrollLeft,\n                      y: currentTarget.scrollTop,\n                    })\n                : undefined\n            }\n          >\n            {children}\n          </RadixScrollArea.Viewport>\n          <RadixScrollArea.Scrollbar\n            orientation=\"horizontal\"\n            className={classes.scrollbar}\n            forceMount\n            onMouseEnter={() => setScrollbarHovered(true)}\n            onMouseLeave={() => setScrollbarHovered(false)}\n          >\n            <RadixScrollArea.Thumb className={classes.thumb} />\n          </RadixScrollArea.Scrollbar>\n          <RadixScrollArea.Scrollbar\n            orientation=\"vertical\"\n            className={classes.scrollbar}\n            forceMount\n            onMouseEnter={() => setScrollbarHovered(true)}\n            onMouseLeave={() => setScrollbarHovered(false)}\n          >\n            <RadixScrollArea.Thumb className={classes.thumb} />\n          </RadixScrollArea.Scrollbar>\n          <RadixScrollArea.Corner className={classes.corner} />\n        </Box>\n      </RadixScrollArea.Root>\n    );\n  }\n);\n\nScrollArea.displayName = '@mantine/core/ScrollArea';\n"],"names":["forwardRef","useMantineDefaultProps","styles","useState","useMantineTheme","useStyles","React","RadixScrollArea","Box"],"mappings":"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"}
+{"version":3,"file":"ScrollArea.js","sources":["../../../src/components/ScrollArea/ScrollArea.tsx"],"sourcesContent":["import React, { useState, forwardRef } from 'react';\nimport * as RadixScrollArea from '@radix-ui/react-scroll-area';\nimport {\n  DefaultProps,\n  Selectors,\n  useMantineTheme,\n  useComponentDefaultProps,\n} from '@mantine/styles';\nimport { Box } from '../Box';\nimport useStyles, { ScrollAreaStylesParams } from './ScrollArea.styles';\n\nexport type ScrollAreaStylesNames = Selectors<typeof useStyles>;\n\nexport interface ScrollAreaProps\n  extends DefaultProps<ScrollAreaStylesNames, ScrollAreaStylesParams>,\n    React.ComponentPropsWithoutRef<'div'> {\n  /** Scrollbar size in px */\n  scrollbarSize?: number;\n\n  /** Scrollbars type */\n  type?: 'auto' | 'always' | 'scroll' | 'hover';\n\n  /** Scroll hide delay in ms, for scroll and hover types only */\n  scrollHideDelay?: number;\n\n  /** Reading direction of the scroll area */\n  dir?: 'ltr' | 'rtl';\n\n  /** Should scrollbars be offset with padding */\n  offsetScrollbars?: boolean;\n\n  /** Get viewport ref */\n  viewportRef?: React.ForwardedRef<HTMLDivElement>;\n\n  /** Subscribe to scroll position changes */\n  onScrollPositionChange?(position: { x: number; y: number }): void;\n}\n\nconst defaultProps: Partial<ScrollAreaProps> = {\n  scrollbarSize: 12,\n  scrollHideDelay: 1000,\n  type: 'hover',\n  offsetScrollbars: false,\n};\n\nexport const ScrollArea = forwardRef<HTMLDivElement, ScrollAreaProps>((props, ref) => {\n  const {\n    children,\n    className,\n    classNames,\n    styles,\n    scrollbarSize,\n    scrollHideDelay,\n    type,\n    dir,\n    offsetScrollbars,\n    viewportRef,\n    onScrollPositionChange,\n    unstyled,\n    ...others\n  } = useComponentDefaultProps('ScrollArea', defaultProps, props);\n\n  const [scrollbarHovered, setScrollbarHovered] = useState(false);\n  const theme = useMantineTheme();\n  const { classes, cx } = useStyles(\n    { scrollbarSize, offsetScrollbars, scrollbarHovered },\n    { name: 'ScrollArea', classNames, styles, unstyled }\n  );\n\n  return (\n    <RadixScrollArea.Root\n      type={type}\n      scrollHideDelay={scrollHideDelay}\n      dir={dir || theme.dir}\n      ref={ref}\n      asChild\n    >\n      <Box className={cx(classes.root, className)} {...others}>\n        <RadixScrollArea.Viewport\n          className={classes.viewport}\n          ref={viewportRef}\n          onScroll={\n            typeof onScrollPositionChange === 'function'\n              ? ({ currentTarget }) =>\n                  onScrollPositionChange({\n                    x: currentTarget.scrollLeft,\n                    y: currentTarget.scrollTop,\n                  })\n              : undefined\n          }\n        >\n          {children}\n        </RadixScrollArea.Viewport>\n        <RadixScrollArea.Scrollbar\n          orientation=\"horizontal\"\n          className={classes.scrollbar}\n          forceMount\n          onMouseEnter={() => setScrollbarHovered(true)}\n          onMouseLeave={() => setScrollbarHovered(false)}\n        >\n          <RadixScrollArea.Thumb className={classes.thumb} />\n        </RadixScrollArea.Scrollbar>\n        <RadixScrollArea.Scrollbar\n          orientation=\"vertical\"\n          className={classes.scrollbar}\n          forceMount\n          onMouseEnter={() => setScrollbarHovered(true)}\n          onMouseLeave={() => setScrollbarHovered(false)}\n        >\n          <RadixScrollArea.Thumb className={classes.thumb} />\n        </RadixScrollArea.Scrollbar>\n        <RadixScrollArea.Corner className={classes.corner} />\n      </Box>\n    </RadixScrollArea.Root>\n  );\n});\n\nScrollArea.displayName = '@mantine/core/ScrollArea';\n"],"names":["forwardRef","useComponentDefaultProps","styles","useState","useMantineTheme","useStyles","React","RadixScrollArea","Box"],"mappings":"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"}

package/cjs/components/SegmentedControl/SegmentedControl.js

@@ -47,7 +47,7 @@ const defaultProps = {
 };
 const SegmentedControl = React.forwardRef((props, ref) => {
   var _b, _c;
-  const _a = styles.useMantineDefaultProps("SegmentedControl", defaultProps, props), {
+  const _a = styles.useComponentDefaultProps("SegmentedControl", defaultProps, props), {
     className,
     disabled,
     data: _data,
@@ -63,7 +63,8 @@ const SegmentedControl = React.forwardRef((props, ref) => {
     classNames,
     styles: styles$1,
     defaultValue,
-    orientation
+    orientation,
+    unstyled
   } = _a, others = __objRest(_a, [
     "className",
     "disabled",
@@ -80,9 +81,12 @@ const SegmentedControl = React.forwardRef((props, ref) => {
     "classNames",
     "styles",
     "defaultValue",
-    "orientation"
+    "orientation",
+    "unstyled"
   ]);
-  const reduceMotion = hooks.useReducedMotion();
+  const theme = styles.useMantineTheme();
+  const shouldReduceMotion = hooks.useReducedMotion();
+  const reduceMotion = theme.respectReducedMotion ? shouldReduceMotion : false;
   const data = _data.map((item) => typeof item === "string" ? { label: item, value: item } : item);
   const mounted = React.useRef();
   const [shouldAnimate, setShouldAnimate] = React.useState(false);
@@ -90,10 +94,9 @@ const SegmentedControl = React.forwardRef((props, ref) => {
     value,
     defaultValue,
     finalValue: Array.isArray(data) ? (_c = (_b = data.find((item) => !item.disabled)) == null ? void 0 : _b.value) != null ? _c : data[0].value : null,
-    onChange,
-    rule: (val) => !!val
+    onChange
   });
-  const { classes, cx, theme } = SegmentedControl_styles['default']({
+  const { classes, cx } = SegmentedControl_styles['default']({
     size,
     fullWidth,
     color,
@@ -102,13 +105,13 @@ const SegmentedControl = React.forwardRef((props, ref) => {
     transitionDuration,
     transitionTimingFunction,
     orientation
-  }, { classNames, styles: styles$1, name: "SegmentedControl" });
+  }, { classNames, styles: styles$1, unstyled, name: "SegmentedControl" });
   const [activePosition, setActivePosition] = React.useState({
     width: 0,
     height: 0,
     translate: [0, 0]
   });
-  const uuid = hooks.useUuid(name);
+  const uuid = hooks.useId(name);
   const refs = React.useRef({});
   const [observerRef, containerRect] = hooks.useResizeObserver();
   hooks.useIsomorphicEffect(() => {

package/cjs/components/SegmentedControl/SegmentedControl.js.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControl.js","sources":["../../../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState, forwardRef } from 'react';\nimport {\n  useReducedMotion,\n  useResizeObserver,\n  useUncontrolled,\n  useUuid,\n  useMergedRef,\n  useIsomorphicEffect,\n} from '@mantine/hooks';\nimport {\n  DefaultProps,\n  MantineNumberSize,\n  MantineSize,\n  MantineColor,\n  Selectors,\n  useMantineDefaultProps,\n} from '@mantine/styles';\nimport { Box } from '../Box';\nimport useStyles, { WRAPPER_PADDING } from './SegmentedControl.styles';\n\nexport interface SegmentedControlItem {\n  value: string;\n  label: React.ReactNode;\n  disabled?: boolean;\n}\n\nexport type SegmentedControlStylesNames = Selectors<typeof useStyles>;\n\nexport interface SegmentedControlProps\n  extends DefaultProps<SegmentedControlStylesNames>,\n    Omit<React.ComponentPropsWithoutRef<'div'>, 'value' | 'onChange'> {\n  /** Data based on which controls are rendered */\n  data: string[] | SegmentedControlItem[];\n\n  /** Current selected value */\n  value?: string;\n\n  /** Disabled input state */\n  disabled?: boolean;\n\n  /** Called when value changes */\n  onChange?(value: string): void;\n\n  /** Name of the radio group, default to random id */\n  name?: string;\n\n  /** True if component should have 100% width */\n  fullWidth?: boolean;\n\n  /** Active control color from theme.colors, defaults to white in light color scheme and theme.colors.dark[9] in dark */\n  color?: MantineColor;\n\n  /** Controls font-size, paddings and height */\n  size?: MantineSize;\n\n  /** Border-radius from theme or number to set border-radius in px */\n  radius?: MantineNumberSize;\n\n  /** Transition duration in ms, set to 0 to turn off transitions */\n  transitionDuration?: number;\n\n  /** Transition timing function for all transitions, defaults to theme.transitionTimingFunction */\n  transitionTimingFunction?: string;\n\n  /** Default value for uncontrolled component */\n  defaultValue?: string;\n\n  /** Display Vertically */\n  orientation?: 'vertical' | 'horizontal';\n}\n\nconst defaultProps: Partial<SegmentedControlProps> = {\n  disabled: false,\n  size: 'sm',\n  transitionDuration: 200,\n};\n\nexport const SegmentedControl = forwardRef<HTMLDivElement, SegmentedControlProps>((props, ref) => {\n  const {\n    className,\n    disabled,\n    data: _data,\n    name,\n    value,\n    onChange,\n    color,\n    fullWidth,\n    radius,\n    size,\n    transitionDuration,\n    transitionTimingFunction,\n    classNames,\n    styles,\n    defaultValue,\n    orientation,\n    ...others\n  } = useMantineDefaultProps('SegmentedControl', defaultProps, props);\n\n  const reduceMotion = useReducedMotion();\n  const data = _data.map(\n    (item: string | SegmentedControlItem): SegmentedControlItem =>\n      typeof item === 'string' ? { label: item, value: item } : item\n  );\n  const mounted = useRef<Boolean>();\n\n  const [shouldAnimate, setShouldAnimate] = useState(false);\n  const [_value, handleValueChange] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: Array.isArray(data)\n      ? data.find((item) => !item.disabled)?.value ?? data[0].value\n      : null,\n    onChange,\n    rule: (val) => !!val,\n  });\n\n  const { classes, cx, theme } = useStyles(\n    {\n      size,\n      fullWidth,\n      color,\n      radius,\n      shouldAnimate: reduceMotion || !shouldAnimate,\n      transitionDuration,\n      transitionTimingFunction,\n      orientation,\n    },\n    { classNames, styles, name: 'SegmentedControl' }\n  );\n\n  const [activePosition, setActivePosition] = useState({\n    width: 0,\n    height: 0,\n    translate: [0, 0],\n  });\n  const uuid = useUuid(name);\n  const refs = useRef<Record<string, HTMLLabelElement>>({});\n  const [observerRef, containerRect] = useResizeObserver();\n\n  useIsomorphicEffect(() => {\n    if (!mounted.current) {\n      mounted.current = true;\n      setShouldAnimate(false);\n    } else {\n      setShouldAnimate(true);\n    }\n  });\n\n  useEffect(() => {\n    if (_value in refs.current && observerRef.current) {\n      const element = refs.current[_value];\n      const elementRect = element.getBoundingClientRect();\n      const scaledValue = element.offsetWidth / elementRect.width;\n      const width = elementRect.width * scaledValue || 0;\n      const height = elementRect.height * scaledValue || 0;\n\n      const offsetRight =\n        containerRect.width - element.parentElement.offsetLeft + WRAPPER_PADDING - width;\n      const offsetLeft = element.parentElement.offsetLeft - WRAPPER_PADDING;\n\n      setActivePosition({\n        width,\n        height,\n        translate: [\n          theme.dir === 'rtl' ? offsetRight : offsetLeft,\n          element.parentElement.offsetTop - WRAPPER_PADDING,\n        ],\n      });\n    }\n  }, [_value, containerRect]);\n\n  const controls = data.map((item) => (\n    <div\n      className={cx(classes.control, { [classes.controlActive]: _value === item.value })}\n      key={item.value}\n    >\n      <input\n        className={classes.input}\n        disabled={disabled || item.disabled}\n        type=\"radio\"\n        name={uuid}\n        value={item.value}\n        id={`${uuid}-${item.value}`}\n        checked={_value === item.value}\n        onChange={() => handleValueChange(item.value)}\n      />\n\n      <label\n        className={cx(classes.label, {\n          [classes.labelActive]: _value === item.value,\n          [classes.disabled]: disabled || item.disabled,\n        })}\n        htmlFor={`${uuid}-${item.value}`}\n        ref={(node) => {\n          refs.current[item.value] = node;\n        }}\n      >\n        {item.label}\n      </label>\n    </div>\n  ));\n\n  return (\n    <Box className={cx(classes.root, className)} ref={useMergedRef(observerRef, ref)} {...others}>\n      {!!_value && shouldAnimate && (\n        <Box\n          component=\"span\"\n          className={classes.active}\n          sx={{\n            width: activePosition.width,\n            height: activePosition.height,\n            transform: `translate(${activePosition.translate[0]}px, ${activePosition.translate[1]}px )`,\n          }}\n        />\n      )}\n\n      {controls}\n    </Box>\n  );\n});\n\nSegmentedControl.displayName = '@mantine/core/SegmentedControl';\n"],"names":["forwardRef","useMantineDefaultProps","styles","useReducedMotion","useRef","useState","useUncontrolled","useStyles","useUuid","useResizeObserver","useIsomorphicEffect","useEffect","WRAPPER_PADDING","React","Box","useMergedRef"],"mappings":"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"}
+{"version":3,"file":"SegmentedControl.js","sources":["../../../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState, forwardRef } from 'react';\nimport {\n  useReducedMotion,\n  useResizeObserver,\n  useUncontrolled,\n  useId,\n  useMergedRef,\n  useIsomorphicEffect,\n} from '@mantine/hooks';\nimport {\n  DefaultProps,\n  MantineNumberSize,\n  MantineSize,\n  MantineColor,\n  Selectors,\n  useComponentDefaultProps,\n  useMantineTheme,\n} from '@mantine/styles';\nimport { Box } from '../Box';\nimport useStyles, {\n  WRAPPER_PADDING,\n  SegmentedControlStylesParams,\n} from './SegmentedControl.styles';\n\nexport interface SegmentedControlItem {\n  value: string;\n  label: React.ReactNode;\n  disabled?: boolean;\n}\n\nexport type SegmentedControlStylesNames = Selectors<typeof useStyles>;\n\nexport interface SegmentedControlProps\n  extends DefaultProps<SegmentedControlStylesNames, SegmentedControlStylesParams>,\n    Omit<React.ComponentPropsWithoutRef<'div'>, 'value' | 'onChange'> {\n  /** Data based on which controls are rendered */\n  data: string[] | SegmentedControlItem[];\n\n  /** Current selected value */\n  value?: string;\n\n  /** Disabled input state */\n  disabled?: boolean;\n\n  /** Called when value changes */\n  onChange?(value: string): void;\n\n  /** Name of the radio group, default to random id */\n  name?: string;\n\n  /** True if component should have 100% width */\n  fullWidth?: boolean;\n\n  /** Active control color from theme.colors, defaults to white in light color scheme and theme.colors.dark[9] in dark */\n  color?: MantineColor;\n\n  /** Controls font-size, paddings and height */\n  size?: MantineSize;\n\n  /** Border-radius from theme or number to set border-radius in px */\n  radius?: MantineNumberSize;\n\n  /** Transition duration in ms, set to 0 to turn off transitions */\n  transitionDuration?: number;\n\n  /** Transition timing function for all transitions, defaults to theme.transitionTimingFunction */\n  transitionTimingFunction?: string;\n\n  /** Default value for uncontrolled component */\n  defaultValue?: string;\n\n  /** Display Vertically */\n  orientation?: 'vertical' | 'horizontal';\n}\n\nconst defaultProps: Partial<SegmentedControlProps> = {\n  disabled: false,\n  size: 'sm',\n  transitionDuration: 200,\n};\n\nexport const SegmentedControl = forwardRef<HTMLDivElement, SegmentedControlProps>((props, ref) => {\n  const {\n    className,\n    disabled,\n    data: _data,\n    name,\n    value,\n    onChange,\n    color,\n    fullWidth,\n    radius,\n    size,\n    transitionDuration,\n    transitionTimingFunction,\n    classNames,\n    styles,\n    defaultValue,\n    orientation,\n    unstyled,\n    ...others\n  } = useComponentDefaultProps('SegmentedControl', defaultProps, props);\n  const theme = useMantineTheme();\n  const shouldReduceMotion = useReducedMotion();\n  const reduceMotion = theme.respectReducedMotion ? shouldReduceMotion : false;\n\n  const data = _data.map(\n    (item: string | SegmentedControlItem): SegmentedControlItem =>\n      typeof item === 'string' ? { label: item, value: item } : item\n  );\n  const mounted = useRef<Boolean>();\n\n  const [shouldAnimate, setShouldAnimate] = useState(false);\n  const [_value, handleValueChange] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: Array.isArray(data)\n      ? data.find((item) => !item.disabled)?.value ?? data[0].value\n      : null,\n    onChange,\n  });\n\n  const { classes, cx } = useStyles(\n    {\n      size,\n      fullWidth,\n      color,\n      radius,\n      shouldAnimate: reduceMotion || !shouldAnimate,\n      transitionDuration,\n      transitionTimingFunction,\n      orientation,\n    },\n    { classNames, styles, unstyled, name: 'SegmentedControl' }\n  );\n\n  const [activePosition, setActivePosition] = useState({\n    width: 0,\n    height: 0,\n    translate: [0, 0],\n  });\n  const uuid = useId(name);\n  const refs = useRef<Record<string, HTMLLabelElement>>({});\n  const [observerRef, containerRect] = useResizeObserver();\n\n  useIsomorphicEffect(() => {\n    if (!mounted.current) {\n      mounted.current = true;\n      setShouldAnimate(false);\n    } else {\n      setShouldAnimate(true);\n    }\n  });\n\n  useEffect(() => {\n    if (_value in refs.current && observerRef.current) {\n      const element = refs.current[_value];\n      const elementRect = element.getBoundingClientRect();\n      const scaledValue = element.offsetWidth / elementRect.width;\n      const width = elementRect.width * scaledValue || 0;\n      const height = elementRect.height * scaledValue || 0;\n\n      const offsetRight =\n        containerRect.width - element.parentElement.offsetLeft + WRAPPER_PADDING - width;\n      const offsetLeft = element.parentElement.offsetLeft - WRAPPER_PADDING;\n\n      setActivePosition({\n        width,\n        height,\n        translate: [\n          theme.dir === 'rtl' ? offsetRight : offsetLeft,\n          element.parentElement.offsetTop - WRAPPER_PADDING,\n        ],\n      });\n    }\n  }, [_value, containerRect]);\n\n  const controls = data.map((item) => (\n    <div\n      className={cx(classes.control, { [classes.controlActive]: _value === item.value })}\n      key={item.value}\n    >\n      <input\n        className={classes.input}\n        disabled={disabled || item.disabled}\n        type=\"radio\"\n        name={uuid}\n        value={item.value}\n        id={`${uuid}-${item.value}`}\n        checked={_value === item.value}\n        onChange={() => handleValueChange(item.value)}\n      />\n\n      <label\n        className={cx(classes.label, {\n          [classes.labelActive]: _value === item.value,\n          [classes.disabled]: disabled || item.disabled,\n        })}\n        htmlFor={`${uuid}-${item.value}`}\n        ref={(node) => {\n          refs.current[item.value] = node;\n        }}\n      >\n        {item.label}\n      </label>\n    </div>\n  ));\n\n  return (\n    <Box className={cx(classes.root, className)} ref={useMergedRef(observerRef, ref)} {...others}>\n      {!!_value && shouldAnimate && (\n        <Box\n          component=\"span\"\n          className={classes.active}\n          sx={{\n            width: activePosition.width,\n            height: activePosition.height,\n            transform: `translate(${activePosition.translate[0]}px, ${activePosition.translate[1]}px )`,\n          }}\n        />\n      )}\n\n      {controls}\n    </Box>\n  );\n});\n\nSegmentedControl.displayName = '@mantine/core/SegmentedControl';\n"],"names":["forwardRef","useComponentDefaultProps","styles","useMantineTheme","useReducedMotion","useRef","useState","useUncontrolled","useStyles","useId","useResizeObserver","useIsomorphicEffect","useEffect","WRAPPER_PADDING","React","Box","useMergedRef"],"mappings":"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"}

package/cjs/components/Select/Select.js

@@ -5,15 +5,15 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 var hooks = require('@mantine/hooks');
 var styles = require('@mantine/styles');
+var utils = require('@mantine/utils');
 var SelectScrollArea = require('./SelectScrollArea/SelectScrollArea.js');
 var DefaultItem = require('./DefaultItem/DefaultItem.js');
 var getSelectRightSectionProps = require('./SelectRightSection/get-select-right-section-props.js');
 var SelectItems = require('./SelectItems/SelectItems.js');
-var SelectDropdown = require('./SelectDropdown/SelectDropdown.js');
+var SelectPopover = require('./SelectPopover/SelectPopover.js');
 var filterData = require('./filter-data/filter-data.js');
 var Select_styles = require('./Select.styles.js');
-var groupOptions = require('../../utils/group-options/group-options.js');
-var InputWrapper = require('../InputWrapper/InputWrapper.js');
+var useInputProps = require('../Input/use-input-props.js');
 var Input = require('../Input/Input.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e['default'] : e; }
@@ -78,18 +78,13 @@ const defaultProps = {
   filterDataOnExactSearchMatch: false,
   zIndex: styles.getDefaultZIndex("popover"),
   clearButtonTabIndex: 0,
-  positionDependencies: []
+  positionDependencies: [],
+  dropdownPosition: "flip"
 };
 const Select = React.forwardRef((props, ref) => {
-  const _a = styles.useMantineDefaultProps("Select", defaultProps, props), {
-    className,
-    style,
-    required,
-    label,
-    id,
-    error,
-    description,
-    size,
+  const _a = useInputProps.useInputProps("Select", defaultProps, props), {
+    inputProps,
+    wrapperProps,
     shadow,
     data,
     value,
@@ -103,9 +98,9 @@ const Select = React.forwardRef((props, ref) => {
     transitionDuration,
     initiallyOpened,
     transitionTimingFunction,
-    wrapperProps,
+    unstyled,
     classNames,
-    styles: styles$1,
+    styles,
     filter,
     maxDropdownHeight,
     searchable,
@@ -122,7 +117,6 @@ const Select = React.forwardRef((props, ref) => {
     shouldCreate,
     selectOnBlur,
     onCreate,
-    sx,
     dropdownComponent,
     onDropdownClose,
     onDropdownOpen,
@@ -132,23 +126,14 @@ const Select = React.forwardRef((props, ref) => {
     name,
     dropdownPosition,
     allowDeselect,
-    errorProps,
-    descriptionProps,
-    labelProps,
     placeholder,
     filterDataOnExactSearchMatch,
     clearButtonTabIndex,
     form,
     positionDependencies
   } = _a, others = __objRest(_a, [
-    "className",
-    "style",
-    "required",
-    "label",
-    "id",
-    "error",
-    "description",
-    "size",
+    "inputProps",
+    "wrapperProps",
     "shadow",
     "data",
     "value",
@@ -162,7 +147,7 @@ const Select = React.forwardRef((props, ref) => {
     "transitionDuration",
     "initiallyOpened",
     "transitionTimingFunction",
-    "wrapperProps",
+    "unstyled",
     "classNames",
     "styles",
     "filter",
@@ -181,7 +166,6 @@ const Select = React.forwardRef((props, ref) => {
     "shouldCreate",
     "selectOnBlur",
     "onCreate",
-    "sx",
     "dropdownComponent",
     "onDropdownClose",
     "onDropdownOpen",
@@ -191,9 +175,6 @@ const Select = React.forwardRef((props, ref) => {
     "name",
     "dropdownPosition",
     "allowDeselect",
-    "errorProps",
-    "descriptionProps",
-    "labelProps",
     "placeholder",
     "filterDataOnExactSearchMatch",
     "clearButtonTabIndex",
@@ -201,15 +182,12 @@ const Select = React.forwardRef((props, ref) => {
     "positionDependencies"
   ]);
   const { classes, cx, theme } = Select_styles['default']();
-  const { systemStyles, rest } = styles.extractSystemStyles(others);
   const [dropdownOpened, _setDropdownOpened] = React.useState(initiallyOpened);
   const [hovered, setHovered] = React.useState(-1);
   const inputRef = React.useRef();
-  const dropdownRef = React.useRef();
   const itemsRefs = React.useRef({});
   const [direction, setDirection] = React.useState("column");
   const isColumn = direction === "column";
-  const uuid = hooks.useUuid(id);
   const { scrollIntoView, targetRef, scrollableRef } = hooks.useScrollIntoView({
     duration: 0,
     offset: 5,
@@ -227,13 +205,12 @@ const Select = React.forwardRef((props, ref) => {
   const isCreatable = creatable && typeof getCreateLabel === "function";
   let createLabel = null;
   const formattedData = data.map((item) => typeof item === "string" ? { label: item, value: item } : item);
-  const sortedData = groupOptions.groupOptions({ data: formattedData });
-  const [_value, handleChange, inputMode] = hooks.useUncontrolled({
+  const sortedData = utils.groupOptions({ data: formattedData });
+  const [_value, handleChange, controlled] = hooks.useUncontrolled({
     value,
     defaultValue,
     finalValue: null,
-    onChange,
-    rule: (val) => typeof val === "string" || val === null
+    onChange
   });
   const selectedValue = sortedData.find((item) => item.value === _value);
   const [inputValue, setInputValue] = React.useState((selectedValue == null ? void 0 : selectedValue.label) || "");
@@ -246,7 +223,7 @@ const Select = React.forwardRef((props, ref) => {
   const handleClear = () => {
     var _a2;
     handleChange(null);
-    if (inputMode === "uncontrolled") {
+    if (!controlled) {
       handleSearchChange("");
     }
     (_a2 = inputRef.current) == null ? void 0 : _a2.focus();
@@ -273,7 +250,7 @@ const Select = React.forwardRef((props, ref) => {
       if (item.creatable) {
         typeof onCreate === "function" && onCreate(item.value);
       }
-      if (inputMode === "uncontrolled") {
+      if (!controlled) {
         handleSearchChange(item.label);
       }
       setHovered(-1);
@@ -332,7 +309,7 @@ const Select = React.forwardRef((props, ref) => {
   }, 0);
   const handleInputKeydown = (event) => {
     typeof onKeyDown === "function" && onKeyDown(event);
-    switch (event.nativeEvent.code) {
+    switch (event.key) {
       case "ArrowUp": {
         event.preventDefault();
         if (!dropdownOpened) {
@@ -445,27 +422,28 @@ const Select = React.forwardRef((props, ref) => {
     }
   };
   const shouldShowDropdown = filteredData.length > 0 ? dropdownOpened : dropdownOpened && !!nothingFound;
-  return /* @__PURE__ */ React__default.createElement(InputWrapper.InputWrapper, __spreadValues(__spreadValues({
-    required,
-    id: uuid,
-    label,
-    error,
-    description,
-    size,
-    className,
-    style,
-    classNames,
-    styles: styles$1,
+  return /* @__PURE__ */ React__default.createElement(Input.Input.Wrapper, __spreadProps(__spreadValues({}, wrapperProps), {
+    __staticSelector: "Select"
+  }), /* @__PURE__ */ React__default.createElement(SelectPopover.SelectPopover, {
+    opened: shouldShowDropdown,
+    transition,
+    transitionDuration,
+    shadow: "sm",
+    withinPortal,
     __staticSelector: "Select",
-    sx,
-    errorProps,
-    descriptionProps,
-    labelProps
-  }, systemStyles), wrapperProps), /* @__PURE__ */ React__default.createElement("div", {
+    onDirectionChange: setDirection,
+    switchDirectionOnFlip,
+    zIndex,
+    dropdownPosition,
+    positionDependencies,
+    classNames,
+    styles,
+    unstyled
+  }, /* @__PURE__ */ React__default.createElement(SelectPopover.SelectPopover.Target, null, /* @__PURE__ */ React__default.createElement("div", {
     role: "combobox",
     "aria-haspopup": "listbox",
-    "aria-owns": shouldShowDropdown ? `${uuid}-items` : null,
-    "aria-controls": uuid,
+    "aria-owns": shouldShowDropdown ? `${inputProps.id}-items` : null,
+    "aria-controls": inputProps.id,
     "aria-expanded": shouldShowDropdown,
     onMouseLeave: () => setHovered(-1),
     tabIndex: -1
@@ -474,23 +452,19 @@ const Select = React.forwardRef((props, ref) => {
     name,
     value: _value || "",
     form
-  }), /* @__PURE__ */ React__default.createElement(Input.Input, __spreadValues(__spreadProps(__spreadValues({
+  }), /* @__PURE__ */ React__default.createElement(Input.Input, __spreadValues(__spreadProps(__spreadValues(__spreadValues({
     autoComplete: "off",
     type: "search"
-  }, rest), {
-    required,
+  }, inputProps), others), {
     ref: hooks.useMergedRef(ref, inputRef),
-    id: uuid,
-    invalid: !!error,
-    size,
     onKeyDown: handleInputKeydown,
     __staticSelector: "Select",
     value: inputValue,
     placeholder,
     onChange: handleInputChange,
     "aria-autocomplete": "list",
-    "aria-controls": shouldShowDropdown ? `${uuid}-items` : null,
-    "aria-activedescendant": hovered !== -1 ? `${uuid}-${hovered}` : null,
+    "aria-controls": shouldShowDropdown ? `${inputProps.id}-items` : null,
+    "aria-activedescendant": hovered !== -1 ? `${inputProps.id}-${hovered}` : null,
     onClick: handleInputClick,
     onBlur: handleInputBlur,
     onFocus: handleInputFocus,
@@ -505,51 +479,37 @@ const Select = React.forwardRef((props, ref) => {
     theme,
     rightSection,
     rightSectionWidth,
-    styles: styles$1,
-    size,
+    styles,
+    size: inputProps.size,
     shouldClear: clearable && !!selectedValue,
     clearButtonLabel,
     onClear: handleClear,
-    error,
+    error: wrapperProps.error,
     clearButtonTabIndex
-  }))), /* @__PURE__ */ React__default.createElement(SelectDropdown.SelectDropdown, {
-    referenceElement: inputRef.current,
-    mounted: shouldShowDropdown,
-    transition,
-    transitionDuration,
-    transitionTimingFunction,
-    uuid,
-    shadow,
-    maxDropdownHeight,
-    classNames,
-    styles: styles$1,
-    ref: hooks.useMergedRef(dropdownRef, scrollableRef),
-    __staticSelector: "Select",
-    dropdownComponent: dropdownComponent || SelectScrollArea.SelectScrollArea,
+  }))))), /* @__PURE__ */ React__default.createElement(SelectPopover.SelectPopover.Dropdown, {
+    component: dropdownComponent || SelectScrollArea.SelectScrollArea,
+    maxHeight: maxDropdownHeight,
     direction,
-    onDirectionChange: setDirection,
-    switchDirectionOnFlip,
-    withinPortal,
-    zIndex,
-    dropdownPosition,
-    positionDependencies
+    id: inputProps.id,
+    innerRef: scrollableRef
   }, /* @__PURE__ */ React__default.createElement(SelectItems.SelectItems, {
     data: filteredData,
     hovered,
     classNames,
-    styles: styles$1,
+    styles,
     isItemSelected: (val) => val === _value,
-    uuid,
+    uuid: inputProps.id,
     __staticSelector: "Select",
     onItemHover: setHovered,
     onItemSelect: handleItemSelect,
     itemsRefs,
     itemComponent,
-    size,
+    size: inputProps.size,
     nothingFound,
     creatable: isCreatable && !!createLabel,
     createLabel,
-    "aria-label": label
+    "aria-label": wrapperProps.label,
+    unstyled
   }))));
 });
 Select.displayName = "@mantine/core/Select";