@mantine/core 3.6.13 → 3.7.0-alpha.1

package/esm/components/RadioGroup/RadioGroup.js

@@ -1,5 +1,6 @@
 import React, { forwardRef, cloneElement } from 'react';
 import { useUuid, useUncontrolled } from '@mantine/hooks';
+import { useMantineDefaultProps } from '@mantine/styles';
 import { InputWrapper } from '../InputWrapper/InputWrapper.js';
 import { Radio } from './Radio/Radio.js';
 import { Group } from '../Group/Group.js';
@@ -33,27 +34,31 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-const RadioGroup = forwardRef((_a, ref) => {
-  var _b = _a, {
+const defaultProps = {
+  orientation: "horizontal",
+  spacing: "sm"
+};
+const RadioGroup = forwardRef((props, ref) => {
+  const _a = useMantineDefaultProps("RadioGroup", defaultProps, props), {
     name,
     children,
     value,
     defaultValue,
     onChange,
-    variant = "horizontal",
-    spacing = "sm",
+    orientation,
+    spacing,
     color,
     size,
     classNames,
     styles,
     wrapperProps
-  } = _b, others = __objRest(_b, [
+  } = _a, others = __objRest(_a, [
     "name",
     "children",
     "value",
     "defaultValue",
     "onChange",
-    "variant",
+    "orientation",
     "spacing",
     "color",
     "size",
@@ -90,7 +95,7 @@ const RadioGroup = forwardRef((_a, ref) => {
   }, wrapperProps), others), /* @__PURE__ */ React.createElement(Group, {
     role: "radiogroup",
     spacing,
-    direction: variant === "horizontal" ? "row" : "column",
+    direction: orientation === "horizontal" ? "row" : "column",
     style: { paddingTop: 5 }
   }, radios));
 });

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

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.js","sources":["../../../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef } from 'react';\nimport { useUncontrolled, useUuid } from '@mantine/hooks';\nimport { DefaultProps, MantineNumberSize, MantineSize, MantineColor } from '@mantine/styles';\nimport { filterChildrenByType } from '../../utils';\nimport {\n  InputWrapper,\n  InputWrapperBaseProps,\n  InputWrapperStylesNames,\n} from '../InputWrapper/InputWrapper';\nimport { Radio, RadioStylesNames } from './Radio/Radio';\nimport { Group } from '../Group/Group';\n\nexport type RadioGroupStylesNames = InputWrapperStylesNames | RadioStylesNames;\n\nexport interface RadioGroupProps\n  extends DefaultProps<RadioGroupStylesNames>,\n    InputWrapperBaseProps,\n    Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange'> {\n  /** <Radio /> components only */\n  children: React.ReactNode;\n\n  /** Input name attribute, used to bind radios in one group, by default generated randomly with use-id hook */\n  name?: string;\n\n  /** Value of currently selected radio */\n  value?: string;\n\n  /** Called when value changes */\n  onChange?(value: string): void;\n\n  /** Initial value for uncontrolled component */\n  defaultValue?: string;\n\n  /** Radios position */\n  variant?: 'horizontal' | 'vertical';\n\n  /** Spacing between radios in horizontal variant */\n  spacing?: MantineNumberSize;\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  /** Props spread to InputWrapper */\n  wrapperProps?: { [key: string]: any };\n}\n\nexport const RadioGroup = forwardRef<HTMLDivElement, RadioGroupProps>(\n  (\n    {\n      name,\n      children,\n      value,\n      defaultValue,\n      onChange,\n      variant = 'horizontal',\n      spacing = 'sm',\n      color,\n      size,\n      classNames,\n      styles,\n      wrapperProps,\n      ...others\n    }: RadioGroupProps,\n    ref\n  ) => {\n    const uuid = useUuid(name);\n    const [_value, setValue] = useUncontrolled({\n      value,\n      defaultValue,\n      finalValue: '',\n      onChange,\n      rule: (val) => typeof val === 'string',\n    });\n\n    const radios = filterChildrenByType(children, Radio).map((radio, index) =>\n      cloneElement(radio, {\n        key: index,\n        checked: _value === radio.props.value,\n        name: uuid,\n        color,\n        size,\n        classNames,\n        styles,\n        __staticSelector: 'RadioGroup',\n        onChange: (event: React.ChangeEvent<HTMLInputElement>) =>\n          setValue(event.currentTarget.value),\n      })\n    );\n\n    return (\n      <InputWrapper\n        labelElement=\"div\"\n        size={size}\n        __staticSelector=\"RadioGroup\"\n        classNames={classNames}\n        styles={styles}\n        ref={ref}\n        {...wrapperProps}\n        {...others}\n      >\n        <Group\n          role=\"radiogroup\"\n          spacing={spacing}\n          direction={variant === 'horizontal' ? 'row' : 'column'}\n          style={{ paddingTop: 5 }}\n        >\n          {radios}\n        </Group>\n      </InputWrapper>\n    );\n  }\n);\n\nRadioGroup.displayName = '@mantine/core/RadioGroup';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"RadioGroup.js","sources":["../../../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef } from 'react';\nimport { useUncontrolled, useUuid } from '@mantine/hooks';\nimport {\n  DefaultProps,\n  MantineNumberSize,\n  MantineSize,\n  MantineColor,\n  useMantineDefaultProps,\n} from '@mantine/styles';\nimport { filterChildrenByType } from '../../utils';\nimport {\n  InputWrapper,\n  InputWrapperBaseProps,\n  InputWrapperStylesNames,\n} from '../InputWrapper/InputWrapper';\nimport { Radio, RadioStylesNames } from './Radio/Radio';\nimport { Group } from '../Group/Group';\n\nexport type RadioGroupStylesNames = InputWrapperStylesNames | RadioStylesNames;\n\nexport interface RadioGroupProps\n  extends DefaultProps<RadioGroupStylesNames>,\n    InputWrapperBaseProps,\n    Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange'> {\n  /** <Radio /> components only */\n  children: React.ReactNode;\n\n  /** Input name attribute, used to bind radios in one group, by default generated randomly with use-id hook */\n  name?: string;\n\n  /** Value of currently selected radio */\n  value?: string;\n\n  /** Called when value changes */\n  onChange?(value: string): void;\n\n  /** Initial value for uncontrolled component */\n  defaultValue?: string;\n\n  /** Horizontal or vertical orientation */\n  orientation?: 'horizontal' | 'vertical';\n\n  /** Spacing between radios in horizontal orientation */\n  spacing?: MantineNumberSize;\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  /** Props spread to InputWrapper */\n  wrapperProps?: { [key: string]: any };\n}\n\nconst defaultProps: Partial<RadioGroupProps> = {\n  orientation: 'horizontal',\n  spacing: 'sm',\n};\n\nexport const RadioGroup = forwardRef<HTMLDivElement, RadioGroupProps>(\n  (props: RadioGroupProps, ref) => {\n    const {\n      name,\n      children,\n      value,\n      defaultValue,\n      onChange,\n      orientation,\n      spacing,\n      color,\n      size,\n      classNames,\n      styles,\n      wrapperProps,\n      ...others\n    } = useMantineDefaultProps('RadioGroup', defaultProps, props);\n\n    const uuid = useUuid(name);\n    const [_value, setValue] = useUncontrolled({\n      value,\n      defaultValue,\n      finalValue: '',\n      onChange,\n      rule: (val) => typeof val === 'string',\n    });\n\n    const radios = filterChildrenByType(children, Radio).map((radio, index) =>\n      cloneElement(radio, {\n        key: index,\n        checked: _value === radio.props.value,\n        name: uuid,\n        color,\n        size,\n        classNames,\n        styles,\n        __staticSelector: 'RadioGroup',\n        onChange: (event: React.ChangeEvent<HTMLInputElement>) =>\n          setValue(event.currentTarget.value),\n      })\n    );\n\n    return (\n      <InputWrapper\n        labelElement=\"div\"\n        size={size}\n        __staticSelector=\"RadioGroup\"\n        classNames={classNames}\n        styles={styles}\n        ref={ref}\n        {...wrapperProps}\n        {...others}\n      >\n        <Group\n          role=\"radiogroup\"\n          spacing={spacing}\n          direction={orientation === 'horizontal' ? 'row' : 'column'}\n          style={{ paddingTop: 5 }}\n        >\n          {radios}\n        </Group>\n      </InputWrapper>\n    );\n  }\n);\n\nRadioGroup.displayName = '@mantine/core/RadioGroup';\n"],"names":[],"mappings":"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"}

package/esm/components/RingProgress/RingProgress.js

@@ -1,4 +1,5 @@
 import React, { forwardRef } from 'react';
+import { useMantineDefaultProps } from '@mantine/styles';
 import { Curve } from './Curve/Curve.js';
 import { getCurves } from './get-curves/get-curves.js';
 import useStyles from './RingProgress.styles.js';
@@ -32,18 +33,22 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-const RingProgress = forwardRef((_a, ref) => {
-  var _b = _a, {
+const defaultProps = {
+  size: 120,
+  thickness: 12
+};
+const RingProgress = forwardRef((props, ref) => {
+  const _a = useMantineDefaultProps("RingProgress", defaultProps, props), {
     className,
     style,
     label,
     sections,
-    size = 120,
-    thickness = size / 10,
+    size,
+    thickness,
     classNames,
     styles,
     roundCaps
-  } = _b, others = __objRest(_b, [
+  } = _a, others = __objRest(_a, [
     "className",
     "style",
     "label",
@@ -61,7 +66,7 @@ const RingProgress = forwardRef((_a, ref) => {
     sections,
     renderRoundedLineCaps: roundCaps
   }).map((curve, index) => {
-    var _a2, _b2;
+    var _a2, _b;
     return /* @__PURE__ */ React.createElement(Curve, {
       key: index,
       value: (_a2 = curve.data) == null ? void 0 : _a2.value,
@@ -69,7 +74,7 @@ const RingProgress = forwardRef((_a, ref) => {
       thickness,
       sum: curve.sum,
       offset: curve.offset,
-      color: (_b2 = curve.data) == null ? void 0 : _b2.color,
+      color: (_b = curve.data) == null ? void 0 : _b.color,
       root: curve.root,
       lineRoundCaps: curve.lineRoundCaps
     });

package/esm/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, ClassNames } 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 = ClassNames<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\nexport const RingProgress = forwardRef<HTMLDivElement, RingProgressProps>(\n  (\n    {\n      className,\n      style,\n      label,\n      sections,\n      size = 120,\n      thickness = size / 10,\n      classNames,\n      styles,\n      roundCaps,\n      ...others\n    }: RingProgressProps,\n    ref\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":[],"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, ClassNames, 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 = ClassNames<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":[],"mappings":"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"}

package/esm/components/ScrollArea/ScrollArea.js

@@ -1,6 +1,6 @@
 import React, { forwardRef, useState } from 'react';
 import * as RadixScrollArea from '@radix-ui/react-scroll-area';
-import { useMantineTheme } from '@mantine/styles';
+import { useMantineDefaultProps, useMantineTheme } from '@mantine/styles';
 import useStyles from './ScrollArea.styles.js';
 import { Box } from '../Box/Box.js';
 
@@ -32,20 +32,26 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-const ScrollArea = forwardRef((_a, ref) => {
-  var _b = _a, {
+const defaultProps = {
+  scrollbarSize: 12,
+  scrollHideDelay: 1e3,
+  type: "hover",
+  offsetScrollbars: false
+};
+const ScrollArea = forwardRef((props, ref) => {
+  const _a = useMantineDefaultProps("ScrollArea", defaultProps, props), {
     children,
     className,
     classNames,
     styles,
-    scrollbarSize = 12,
-    scrollHideDelay = 1e3,
-    type = "hover",
+    scrollbarSize,
+    scrollHideDelay,
+    type,
     dir,
-    offsetScrollbars = false,
+    offsetScrollbars,
     viewportRef,
     onScrollPositionChange
-  } = _b, others = __objRest(_b, [
+  } = _a, others = __objRest(_a, [
     "children",
     "className",
     "classNames",

package/esm/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, ClassNames, useMantineTheme } from '@mantine/styles';\nimport { Box } from '../Box';\nimport useStyles from './ScrollArea.styles';\n\nexport type ScrollAreaStylesNames = ClassNames<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\nexport const ScrollArea = forwardRef<HTMLDivElement, ScrollAreaProps>(\n  (\n    {\n      children,\n      className,\n      classNames,\n      styles,\n      scrollbarSize = 12,\n      scrollHideDelay = 1000,\n      type = 'hover',\n      dir,\n      offsetScrollbars = false,\n      viewportRef,\n      onScrollPositionChange,\n      ...others\n    }: ScrollAreaProps,\n    ref\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":[],"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 { DefaultProps, ClassNames, useMantineTheme, useMantineDefaultProps } from '@mantine/styles';\nimport { Box } from '../Box';\nimport useStyles from './ScrollArea.styles';\n\nexport type ScrollAreaStylesNames = ClassNames<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":[],"mappings":"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"}

package/esm/components/ScrollArea/ScrollArea.styles.js

@@ -1,66 +1,63 @@
 import { createStyles } from '@mantine/styles';
 
-var useStyles = createStyles((theme, { scrollbarSize, offsetScrollbars, scrollbarHovered }, getRef) => {
-  const thumb = getRef("thumb");
-  return {
-    root: {
-      overflow: "hidden"
-    },
-    viewport: {
-      width: "100%",
-      height: "100%",
-      paddingRight: offsetScrollbars ? scrollbarSize : void 0
-    },
-    scrollbar: {
-      display: "flex",
-      userSelect: "none",
-      touchAction: "none",
-      boxSizing: "border-box",
-      padding: scrollbarSize / 5,
-      transition: "background-color 150ms ease, opacity 150ms ease",
-      "&:hover": {
-        backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[8] : theme.colors.gray[0],
-        [`& .${thumb}`]: {
-          backgroundColor: theme.colorScheme === "dark" ? theme.fn.rgba("#ffffff", 0.5) : theme.fn.rgba(theme.black, 0.5)
-        }
-      },
-      '&[data-orientation="vertical"]': {
-        width: scrollbarSize
-      },
-      '&[data-orientation="horizontal"]': {
-        flexDirection: "column",
-        height: scrollbarSize
-      },
-      '&[data-state="hidden"]': {
-        opacity: 0
+var useStyles = createStyles((theme, { scrollbarSize, offsetScrollbars, scrollbarHovered }, getRef) => ({
+  root: {
+    overflow: "hidden"
+  },
+  viewport: {
+    width: "100%",
+    height: "100%",
+    paddingRight: offsetScrollbars ? scrollbarSize : void 0
+  },
+  scrollbar: {
+    display: "flex",
+    userSelect: "none",
+    touchAction: "none",
+    boxSizing: "border-box",
+    padding: scrollbarSize / 5,
+    transition: "background-color 150ms ease, opacity 150ms ease",
+    "&:hover": {
+      backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[8] : theme.colors.gray[0],
+      [`& .${getRef("thumb")}`]: {
+        backgroundColor: theme.colorScheme === "dark" ? theme.fn.rgba("#ffffff", 0.5) : theme.fn.rgba(theme.black, 0.5)
       }
     },
-    thumb: {
-      ref: thumb,
-      flex: 1,
-      backgroundColor: theme.colorScheme === "dark" ? theme.fn.rgba("#ffffff", 0.4) : theme.fn.rgba(theme.black, 0.4),
-      borderRadius: scrollbarSize,
-      position: "relative",
-      transition: "background-color 150ms ease",
-      "&::before": {
-        content: '""',
-        position: "absolute",
-        top: "50%",
-        left: "50%",
-        transform: "translate(-50%, -50%)",
-        width: "100%",
-        height: "100%",
-        minWidth: 44,
-        minHeight: 44
-      }
+    '&[data-orientation="vertical"]': {
+      width: scrollbarSize
     },
-    corner: {
-      backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[6] : theme.colors.gray[0],
-      transition: "opacity 150ms ease",
-      opacity: scrollbarHovered ? 1 : 0
+    '&[data-orientation="horizontal"]': {
+      flexDirection: "column",
+      height: scrollbarSize
+    },
+    '&[data-state="hidden"]': {
+      opacity: 0
+    }
+  },
+  thumb: {
+    ref: getRef("thumb"),
+    flex: 1,
+    backgroundColor: theme.colorScheme === "dark" ? theme.fn.rgba("#ffffff", 0.4) : theme.fn.rgba(theme.black, 0.4),
+    borderRadius: scrollbarSize,
+    position: "relative",
+    transition: "background-color 150ms ease",
+    "&::before": {
+      content: '""',
+      position: "absolute",
+      top: "50%",
+      left: "50%",
+      transform: "translate(-50%, -50%)",
+      width: "100%",
+      height: "100%",
+      minWidth: 44,
+      minHeight: 44
     }
-  };
-});
+  },
+  corner: {
+    backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[6] : theme.colors.gray[0],
+    transition: "opacity 150ms ease",
+    opacity: scrollbarHovered ? 1 : 0
+  }
+}));
 
 export default useStyles;
 //# sourceMappingURL=ScrollArea.styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ScrollArea.styles.js","sources":["../../../src/components/ScrollArea/ScrollArea.styles.ts"],"sourcesContent":["import { createStyles } from '@mantine/styles';\n\ninterface ScrollAreaStyles {\n  scrollbarSize: number;\n  offsetScrollbars: boolean;\n  scrollbarHovered: boolean;\n}\n\nexport default createStyles(\n  (theme, { scrollbarSize, offsetScrollbars, scrollbarHovered }: ScrollAreaStyles, getRef) => {\n    const thumb = getRef('thumb');\n    return {\n      root: {\n        overflow: 'hidden',\n      },\n\n      viewport: {\n        width: '100%',\n        height: '100%',\n        paddingRight: offsetScrollbars ? scrollbarSize : undefined,\n      },\n\n      scrollbar: {\n        display: 'flex',\n        userSelect: 'none',\n        touchAction: 'none',\n        boxSizing: 'border-box',\n        padding: scrollbarSize / 5,\n        transition: 'background-color 150ms ease, opacity 150ms ease',\n\n        '&:hover': {\n          backgroundColor:\n            theme.colorScheme === 'dark' ? theme.colors.dark[8] : theme.colors.gray[0],\n          [`& .${thumb}`]: {\n            backgroundColor:\n              theme.colorScheme === 'dark'\n                ? theme.fn.rgba('#ffffff', 0.5)\n                : theme.fn.rgba(theme.black, 0.5),\n          },\n        },\n\n        '&[data-orientation=\"vertical\"]': {\n          width: scrollbarSize,\n        },\n\n        '&[data-orientation=\"horizontal\"]': {\n          flexDirection: 'column',\n          height: scrollbarSize,\n        },\n\n        '&[data-state=\"hidden\"]': {\n          opacity: 0,\n        },\n      },\n\n      thumb: {\n        ref: thumb,\n        flex: 1,\n        backgroundColor:\n          theme.colorScheme === 'dark'\n            ? theme.fn.rgba('#ffffff', 0.4)\n            : theme.fn.rgba(theme.black, 0.4),\n        borderRadius: scrollbarSize,\n        position: 'relative',\n        transition: 'background-color 150ms ease',\n\n        '&::before': {\n          content: '\"\"',\n          position: 'absolute',\n          top: '50%',\n          left: '50%',\n          transform: 'translate(-50%, -50%)',\n          width: '100%',\n          height: '100%',\n          minWidth: 44,\n          minHeight: 44,\n        },\n      },\n\n      corner: {\n        backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[0],\n        transition: 'opacity 150ms ease',\n        opacity: scrollbarHovered ? 1 : 0,\n      },\n    };\n  }\n);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ScrollArea.styles.js","sources":["../../../src/components/ScrollArea/ScrollArea.styles.ts"],"sourcesContent":["import { createStyles } from '@mantine/styles';\n\nexport interface ScrollAreaStylesParams {\n  scrollbarSize: number;\n  offsetScrollbars: boolean;\n  scrollbarHovered: boolean;\n}\n\nexport default createStyles(\n  (\n    theme,\n    { scrollbarSize, offsetScrollbars, scrollbarHovered }: ScrollAreaStylesParams,\n    getRef\n  ) => ({\n    root: {\n      overflow: 'hidden',\n    },\n\n    viewport: {\n      width: '100%',\n      height: '100%',\n      paddingRight: offsetScrollbars ? scrollbarSize : undefined,\n    },\n\n    scrollbar: {\n      display: 'flex',\n      userSelect: 'none',\n      touchAction: 'none',\n      boxSizing: 'border-box',\n      padding: scrollbarSize / 5,\n      transition: 'background-color 150ms ease, opacity 150ms ease',\n\n      '&:hover': {\n        backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[8] : theme.colors.gray[0],\n        [`& .${getRef('thumb')}`]: {\n          backgroundColor:\n            theme.colorScheme === 'dark'\n              ? theme.fn.rgba('#ffffff', 0.5)\n              : theme.fn.rgba(theme.black, 0.5),\n        },\n      },\n\n      '&[data-orientation=\"vertical\"]': {\n        width: scrollbarSize,\n      },\n\n      '&[data-orientation=\"horizontal\"]': {\n        flexDirection: 'column',\n        height: scrollbarSize,\n      },\n\n      '&[data-state=\"hidden\"]': {\n        opacity: 0,\n      },\n    },\n\n    thumb: {\n      ref: getRef('thumb'),\n      flex: 1,\n      backgroundColor:\n        theme.colorScheme === 'dark'\n          ? theme.fn.rgba('#ffffff', 0.4)\n          : theme.fn.rgba(theme.black, 0.4),\n      borderRadius: scrollbarSize,\n      position: 'relative',\n      transition: 'background-color 150ms ease',\n\n      '&::before': {\n        content: '\"\"',\n        position: 'absolute',\n        top: '50%',\n        left: '50%',\n        transform: 'translate(-50%, -50%)',\n        width: '100%',\n        height: '100%',\n        minWidth: 44,\n        minHeight: 44,\n      },\n    },\n\n    corner: {\n      backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[0],\n      transition: 'opacity 150ms ease',\n      opacity: scrollbarHovered ? 1 : 0,\n    },\n  })\n);\n"],"names":[],"mappings":";;AACA,gBAAe,YAAY,CAAC,CAAC,KAAK,EAAE,EAAE,aAAa,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,EAAE,MAAM,MAAM;AACvG,EAAE,IAAI,EAAE;AACR,IAAI,QAAQ,EAAE,QAAQ;AACtB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,KAAK,EAAE,MAAM;AACjB,IAAI,MAAM,EAAE,MAAM;AAClB,IAAI,YAAY,EAAE,gBAAgB,GAAG,aAAa,GAAG,KAAK,CAAC;AAC3D,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,OAAO,EAAE,MAAM;AACnB,IAAI,UAAU,EAAE,MAAM;AACtB,IAAI,WAAW,EAAE,MAAM;AACvB,IAAI,SAAS,EAAE,YAAY;AAC3B,IAAI,OAAO,EAAE,aAAa,GAAG,CAAC;AAC9B,IAAI,UAAU,EAAE,iDAAiD;AACjE,IAAI,SAAS,EAAE;AACf,MAAM,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;AACjG,MAAM,CAAC,CAAC,GAAG,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG;AACjC,QAAQ,eAAe,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,SAAS,EAAE,GAAG,CAAC,GAAG,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,GAAG,CAAC;AACvH,OAAO;AACP,KAAK;AACL,IAAI,gCAAgC,EAAE;AACtC,MAAM,KAAK,EAAE,aAAa;AAC1B,KAAK;AACL,IAAI,kCAAkC,EAAE;AACxC,MAAM,aAAa,EAAE,QAAQ;AAC7B,MAAM,MAAM,EAAE,aAAa;AAC3B,KAAK;AACL,IAAI,wBAAwB,EAAE;AAC9B,MAAM,OAAO,EAAE,CAAC;AAChB,KAAK;AACL,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,GAAG,EAAE,MAAM,CAAC,OAAO,CAAC;AACxB,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,eAAe,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,SAAS,EAAE,GAAG,CAAC,GAAG,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,GAAG,CAAC;AACnH,IAAI,YAAY,EAAE,aAAa;AAC/B,IAAI,QAAQ,EAAE,UAAU;AACxB,IAAI,UAAU,EAAE,6BAA6B;AAC7C,IAAI,WAAW,EAAE;AACjB,MAAM,OAAO,EAAE,IAAI;AACnB,MAAM,QAAQ,EAAE,UAAU;AAC1B,MAAM,GAAG,EAAE,KAAK;AAChB,MAAM,IAAI,EAAE,KAAK;AACjB,MAAM,SAAS,EAAE,uBAAuB;AACxC,MAAM,KAAK,EAAE,MAAM;AACnB,MAAM,MAAM,EAAE,MAAM;AACpB,MAAM,QAAQ,EAAE,EAAE;AAClB,MAAM,SAAS,EAAE,EAAE;AACnB,KAAK;AACL,GAAG;AACH,EAAE,MAAM,EAAE;AACV,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,UAAU,EAAE,oBAAoB;AACpC,IAAI,OAAO,EAAE,gBAAgB,GAAG,CAAC,GAAG,CAAC;AACrC,GAAG;AACH,CAAC,CAAC,CAAC;;;;"}

package/esm/components/SegmentedControl/SegmentedControl.js

@@ -1,5 +1,6 @@
 import React, { forwardRef, useState, useRef, useEffect } from 'react';
 import { useReducedMotion, useUncontrolled, useUuid, useResizeObserver, useMergedRef } from '@mantine/hooks';
+import { useMantineDefaultProps } from '@mantine/styles';
 import useStyles, { WRAPPER_PADDING } from './SegmentedControl.styles.js';
 import { Box } from '../Box/Box.js';
 
@@ -31,25 +32,30 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-const SegmentedControl = forwardRef((_a, ref) => {
-  var _b = _a, {
+const defaultProps = {
+  disabled: false,
+  size: "sm",
+  transitionDuration: 200
+};
+const SegmentedControl = forwardRef((props, ref) => {
+  const _a = useMantineDefaultProps("SegmentedControl", defaultProps, props), {
     className,
-    disabled = false,
+    disabled,
     data: _data,
     name,
     value,
     onChange,
     color,
     fullWidth,
-    radius = "sm",
-    size = "sm",
-    transitionDuration = 200,
+    radius,
+    size,
+    transitionDuration,
     transitionTimingFunction,
     classNames,
     styles,
     defaultValue,
     orientation
-  } = _b, others = __objRest(_b, [
+  } = _a, others = __objRest(_a, [
     "className",
     "disabled",
     "data",

package/esm/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} from '@mantine/hooks';\nimport {\n  DefaultProps,\n  MantineNumberSize,\n  MantineSize,\n  MantineColor,\n  ClassNames,\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}\n\nexport type SegmentedControlStylesNames = ClassNames<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\nexport const SegmentedControl = forwardRef<HTMLDivElement, SegmentedControlProps>(\n  (\n    {\n      className,\n      disabled = false,\n      data: _data,\n      name,\n      value,\n      onChange,\n      color,\n      fullWidth,\n      radius = 'sm',\n      size = 'sm',\n      transitionDuration = 200,\n      transitionTimingFunction,\n      classNames,\n      styles,\n      defaultValue,\n      orientation,\n      ...others\n    },\n    ref\n  ) => {\n    const reduceMotion = useReducedMotion();\n    const data = _data.map((item: any) =>\n      typeof item === 'string' ? { label: item, value: item } : item\n    );\n\n    const [shouldAnimate, setShouldAnimate] = useState(false);\n    const [_value, handleValueChange] = useUncontrolled({\n      value,\n      defaultValue,\n      finalValue: Array.isArray(data) ? data[0].value : 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    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    useEffect(() => {\n      setShouldAnimate(true);\n    }, []);\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}\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,\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 && (\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);\n\nSegmentedControl.displayName = '@mantine/core/SegmentedControl';\n"],"names":[],"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  useUuid,\n  useMergedRef,\n} from '@mantine/hooks';\nimport {\n  DefaultProps,\n  MantineNumberSize,\n  MantineSize,\n  MantineColor,\n  ClassNames,\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}\n\nexport type SegmentedControlStylesNames = ClassNames<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((item: any) =>\n    typeof item === 'string' ? { label: item, value: item } : item\n  );\n\n  const [shouldAnimate, setShouldAnimate] = useState(false);\n  const [_value, handleValueChange] = useUncontrolled({\n    value,\n    defaultValue,\n    finalValue: Array.isArray(data) ? data[0].value : 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  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  useEffect(() => {\n    setShouldAnimate(true);\n  }, []);\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}\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,\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 && (\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":[],"mappings":"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"}

package/esm/components/SegmentedControl/SegmentedControl.styles.js

@@ -37,15 +37,13 @@ var useStyles = createStyles((theme, {
   size,
   orientation
 }, getRef) => {
-  const label = getRef("label");
-  const control = getRef("control");
   const vertical = orientation === "vertical";
   return {
     label: __spreadProps(__spreadValues(__spreadValues({
-      ref: label
+      ref: getRef("label")
     }, theme.fn.focusStyles()), theme.fn.fontStyles()), {
       WebkitTapHighlightColor: "transparent",
-      borderRadius: theme.fn.size({ size: radius, sizes: theme.radius }),
+      borderRadius: theme.fn.radius(radius),
       fontWeight: 500,
       fontSize: size in theme.fontSizes ? theme.fontSizes[size] : theme.fontSizes.sm,
       cursor: "pointer",
@@ -63,7 +61,7 @@ var useStyles = createStyles((theme, {
       }
     }),
     control: {
-      ref: control,
+      ref: getRef("control"),
       position: "relative",
       boxSizing: "border-box",
       flex: 1,
@@ -71,7 +69,7 @@ var useStyles = createStyles((theme, {
       transition: `border-left-color ${shouldAnimate ? 0 : transitionDuration}ms ${transitionTimingFunction || theme.transitionTimingFunction}`,
       "&:not(:first-of-type)": {
         borderStyle: "solid",
-        borderWidth: orientation === "vertical" ? "1px 0 0 0" : "0 0 0 1px",
+        borderWidth: vertical ? "1px 0 0 0" : "0 0 0 1px",
         borderColor: theme.colorScheme === "dark" ? theme.colors.dark[4] : theme.colors.gray[3]
       }
     },
@@ -84,13 +82,13 @@ var useStyles = createStyles((theme, {
       opacity: 0,
       "&:focus": {
         outline: "none",
-        [`& + .${label}`]: {
+        [`& + .${getRef("label")}`]: {
           outline: "none",
-          boxShadow: `0 0 0 2px ${theme.colorScheme === "dark" ? theme.colors.dark[9] : theme.white}, 0 0 0 4px ${theme.colors[theme.primaryColor][5]}`
+          boxShadow: theme.focusRing === "always" || theme.focusRing === "auto" ? `0 0 0 2px ${theme.colorScheme === "dark" ? theme.colors.dark[9] : theme.white}, 0 0 0 4px ${theme.colors[theme.primaryColor][theme.colorScheme === "dark" ? 7 : 5]}` : void 0
         },
         "&:focus:not(:focus-visible)": {
-          [`& + .${label}`]: {
-            boxShadow: "none"
+          [`& + .${getRef("label")}`]: {
+            boxShadow: theme.focusRing === "auto" || theme.focusRing === "never" ? "none" : void 0
           }
         }
       }
@@ -101,14 +99,14 @@ var useStyles = createStyles((theme, {
       width: vertical && !fullWidth ? "max-content" : "inherit",
       flexDirection: vertical ? "column" : "row",
       backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[8] : theme.colors.gray[1],
-      borderRadius: theme.fn.size({ size: radius, sizes: theme.radius }),
+      borderRadius: theme.fn.radius(radius),
       overflow: "hidden",
       padding: WRAPPER_PADDING
     },
     controlActive: {
       borderLeftColor: "transparent !important",
       borderTopColor: "transparent !important",
-      [`& + .${control}`]: {
+      [`& + .${getRef("control")}`]: {
         borderLeftColor: "transparent !important",
         borderTopColor: "transparent !important"
       }
@@ -125,7 +123,7 @@ var useStyles = createStyles((theme, {
     },
     active: {
       boxSizing: "border-box",
-      borderRadius: theme.fn.size({ size: radius, sizes: theme.radius }),
+      borderRadius: theme.fn.radius(radius),
       position: "absolute",
       zIndex: 1,
       boxShadow: color || theme.colorScheme === "dark" ? "none" : theme.shadows.xs,