@mantine/core 5.10.2 → 6.0.0-alpha.1

package/cjs/Switch/Switch.styles.js

@@ -24,50 +24,49 @@ var __spreadValues = (a, b) => {
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 const switchHeight = {
-  xs: 16,
-  sm: 20,
-  md: 24,
-  lg: 30,
-  xl: 36
+  xs: styles.rem(16),
+  sm: styles.rem(20),
+  md: styles.rem(24),
+  lg: styles.rem(30),
+  xl: styles.rem(36)
 };
 const switchWidth = {
-  xs: 32,
-  sm: 38,
-  md: 46,
-  lg: 56,
-  xl: 72
+  xs: styles.rem(32),
+  sm: styles.rem(38),
+  md: styles.rem(46),
+  lg: styles.rem(56),
+  xl: styles.rem(72)
 };
 const handleSizes = {
-  xs: 12,
-  sm: 14,
-  md: 18,
-  lg: 22,
-  xl: 28
+  xs: styles.rem(12),
+  sm: styles.rem(14),
+  md: styles.rem(18),
+  lg: styles.rem(22),
+  xl: styles.rem(28)
 };
 const labelFontSizes = {
-  xs: 5,
-  sm: 6,
-  md: 7,
-  lg: 9,
-  xl: 11
+  xs: styles.rem(5),
+  sm: styles.rem(6),
+  md: styles.rem(7),
+  lg: styles.rem(9),
+  xl: styles.rem(11)
 };
 const trackLabelPaddings = {
-  xs: 4,
-  sm: 5,
-  md: 6,
-  lg: 8,
-  xl: 10
+  xs: styles.rem(4),
+  sm: styles.rem(5),
+  md: styles.rem(6),
+  lg: styles.rem(8),
+  xl: styles.rem(10)
 };
-var useStyles = styles.createStyles((theme, { size, radius, color, labelPosition, error }) => {
-  const handleSize = theme.fn.size({ size, sizes: handleSizes });
-  const borderRadius = theme.fn.size({ size: radius, sizes: theme.radius });
+var useStyles = styles.createStyles((theme, { radius, color, labelPosition, error }, { size }) => {
+  const handleSize = styles.getSize({ size, sizes: handleSizes });
+  const borderRadius = styles.getSize({ size: radius, sizes: theme.radius });
   const colors = theme.fn.variant({ variant: "filled", color });
-  const trackWidth = theme.fn.size({ size, sizes: switchWidth });
-  const trackPadding = size === "xs" ? 1 : 2;
+  const trackWidth = styles.getSize({ size, sizes: switchWidth });
+  const trackPadding = styles.rem(size === "xs" ? 1 : 2);
   const errorColor = theme.fn.variant({ variant: "filled", color: "red" }).background;
   return {
     input: {
-      clip: "rect(1px, 1px, 1px, 1px)",
       height: 0,
       width: 0,
       overflow: "hidden",
@@ -84,8 +83,8 @@ var useStyles = styles.createStyles((theme, { size, radius, color, labelPosition
       position: "relative",
       borderRadius,
       backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[6] : theme.colors.gray[2],
-      border: `1px solid ${error ? errorColor : theme.colorScheme === "dark" ? theme.colors.dark[4] : theme.colors.gray[3]}`,
-      height: theme.fn.size({ size, sizes: switchHeight }),
+      border: `${styles.rem(1)} solid ${error ? errorColor : theme.colorScheme === "dark" ? theme.colors.dark[4] : theme.colors.gray[3]}`,
+      height: styles.getSize({ size, sizes: switchHeight }),
       minWidth: trackWidth,
       margin: 0,
       transitionProperty: "background-color, border-color",
@@ -95,13 +94,10 @@ var useStyles = styles.createStyles((theme, { size, radius, color, labelPosition
       appearance: "none",
       display: "flex",
       alignItems: "center",
-      fontSize: theme.fn.size({ size, sizes: labelFontSizes }),
+      fontSize: styles.getSize({ size, sizes: labelFontSizes }),
       fontWeight: 600,
       order: labelPosition === "left" ? 2 : 1,
       userSelect: "none",
-      MozUserSelect: "none",
-      WebkitUserSelect: "none",
-      MsUserSelect: "none",
       zIndex: 0,
       lineHeight: 0,
       color: theme.colorScheme === "dark" ? theme.colors.dark[1] : theme.colors.gray[6],
@@ -127,8 +123,8 @@ var useStyles = styles.createStyles((theme, { size, radius, color, labelPosition
       backgroundColor: theme.white,
       height: handleSize,
       width: handleSize,
-      border: `1px solid ${theme.colorScheme === "dark" ? theme.white : theme.colors.gray[3]}`,
-      left: `${trackPadding}px`,
+      border: `${styles.rem(1)} solid ${theme.colorScheme === "dark" ? theme.white : theme.colors.gray[3]}`,
+      left: trackPadding,
       transition: `left 150ms ${theme.transitionTimingFunction}`,
       "& > *": {
         margin: "auto"
@@ -137,7 +133,7 @@ var useStyles = styles.createStyles((theme, { size, radius, color, labelPosition
         transitionDuration: theme.respectReducedMotion ? "0ms" : ""
       },
       "input:checked + * > &": {
-        left: `calc(100% - ${handleSize}px - ${trackPadding}px)`,
+        left: `calc(100% - ${handleSize} - ${trackPadding})`,
         borderColor: theme.white
       },
       "input:disabled + * > &": {
@@ -149,12 +145,12 @@ var useStyles = styles.createStyles((theme, { size, radius, color, labelPosition
       height: "100%",
       display: "grid",
       placeContent: "center",
-      minWidth: trackWidth - handleSize,
-      paddingInline: theme.fn.size({ size, sizes: trackLabelPaddings }),
-      margin: `0 0 0 ${handleSize + trackPadding}px`,
+      minWidth: `calc(${trackWidth} - ${handleSize})`,
+      paddingInline: styles.getSize({ size, sizes: trackLabelPaddings }),
+      margin: `0 0 0 calc(${handleSize} + ${trackPadding})`,
       transition: `margin 150ms ${theme.transitionTimingFunction}`,
       "input:checked + * > &": {
-        margin: `0 ${handleSize + trackPadding}px 0 0`
+        margin: `0 calc(${handleSize} + ${trackPadding}) 0 0`
       }
     }
   };

package/cjs/Switch/Switch.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.styles.js","sources":["../../src/Switch/Switch.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, MantineSize, MantineColor } from '@mantine/styles';\n\nexport interface SwitchStylesParams {\n  color: MantineColor;\n  size: MantineSize;\n  radius: MantineNumberSize;\n  labelPosition: 'left' | 'right';\n  error: boolean;\n}\n\nconst switchHeight = {\n  xs: 16,\n  sm: 20,\n  md: 24,\n  lg: 30,\n  xl: 36,\n};\n\nconst switchWidth = {\n  xs: 32,\n  sm: 38,\n  md: 46,\n  lg: 56,\n  xl: 72,\n};\n\nconst handleSizes = {\n  xs: 12,\n  sm: 14,\n  md: 18,\n  lg: 22,\n  xl: 28,\n};\n\nconst labelFontSizes = {\n  xs: 5,\n  sm: 6,\n  md: 7,\n  lg: 9,\n  xl: 11,\n};\n\nconst trackLabelPaddings = {\n  xs: 4,\n  sm: 5,\n  md: 6,\n  lg: 8,\n  xl: 10,\n};\n\nexport default createStyles(\n  (theme, { size, radius, color, labelPosition, error }: SwitchStylesParams) => {\n    const handleSize = theme.fn.size({ size, sizes: handleSizes });\n    const borderRadius = theme.fn.size({ size: radius, sizes: theme.radius });\n    const colors = theme.fn.variant({ variant: 'filled', color });\n    const trackWidth = theme.fn.size({ size, sizes: switchWidth });\n    const trackPadding = size === 'xs' ? 1 : 2;\n    const errorColor = theme.fn.variant({ variant: 'filled', color: 'red' }).background;\n\n    return {\n      input: {\n        clip: 'rect(1px, 1px, 1px, 1px)',\n        height: 0,\n        width: 0,\n        overflow: 'hidden',\n        whiteSpace: 'nowrap',\n        padding: 0,\n        WebkitClipPath: 'inset(50%)',\n        clipPath: 'inset(50%)',\n        position: 'absolute',\n      },\n\n      track: {\n        ...theme.fn.focusStyles('input:focus + &'),\n        cursor: theme.cursorType,\n        overflow: 'hidden',\n        WebkitTapHighlightColor: 'transparent',\n        position: 'relative',\n        borderRadius,\n        backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[2],\n        border: `1px solid ${\n          error\n            ? errorColor\n            : theme.colorScheme === 'dark'\n            ? theme.colors.dark[4]\n            : theme.colors.gray[3]\n        }`,\n        height: theme.fn.size({ size, sizes: switchHeight }),\n        minWidth: trackWidth,\n        margin: 0,\n        transitionProperty: 'background-color, border-color',\n        transitionTimingFunction: theme.transitionTimingFunction,\n        transitionDuration: '150ms',\n        boxSizing: 'border-box',\n        appearance: 'none',\n        display: 'flex',\n        alignItems: 'center',\n        fontSize: theme.fn.size({ size, sizes: labelFontSizes }),\n        fontWeight: 600,\n        order: labelPosition === 'left' ? 2 : 1,\n        userSelect: 'none',\n        MozUserSelect: 'none',\n        WebkitUserSelect: 'none',\n        MsUserSelect: 'none',\n\n        zIndex: 0,\n        lineHeight: 0,\n        color: theme.colorScheme === 'dark' ? theme.colors.dark[1] : theme.colors.gray[6],\n        transition: `color 150ms ${theme.transitionTimingFunction}`,\n\n        'input:checked + &': {\n          backgroundColor: colors.background,\n          borderColor: colors.background,\n          color: theme.white,\n          transition: `color 150ms ${theme.transitionTimingFunction}`,\n        },\n\n        'input:disabled + &': {\n          backgroundColor:\n            theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[2],\n          borderColor: theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[2],\n          cursor: 'not-allowed',\n        },\n      },\n\n      thumb: {\n        position: 'absolute',\n        zIndex: 1,\n        borderRadius,\n        boxSizing: 'border-box',\n        display: 'flex',\n        backgroundColor: theme.white,\n        height: handleSize,\n        width: handleSize,\n        border: `1px solid ${theme.colorScheme === 'dark' ? theme.white : theme.colors.gray[3]}`,\n        left: `${trackPadding}px`,\n        transition: `left 150ms ${theme.transitionTimingFunction}`,\n\n        '& > *': {\n          margin: 'auto',\n        },\n\n        '@media (prefers-reduced-motion)': {\n          transitionDuration: theme.respectReducedMotion ? '0ms' : '',\n        },\n\n        'input:checked + * > &': {\n          left: `calc(100% - ${handleSize}px - ${trackPadding}px)`,\n          borderColor: theme.white,\n        },\n\n        'input:disabled + * > &': {\n          borderColor: theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[2],\n          backgroundColor:\n            theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[0],\n        },\n      },\n\n      trackLabel: {\n        height: '100%',\n        display: 'grid',\n        placeContent: 'center',\n\n        minWidth: trackWidth - handleSize,\n        paddingInline: theme.fn.size({ size, sizes: trackLabelPaddings }),\n        margin: `0 0 0 ${handleSize + trackPadding}px`,\n        transition: `margin 150ms ${theme.transitionTimingFunction}`,\n\n        'input:checked + * > &': {\n          margin: `0 ${handleSize + trackPadding}px 0 0`,\n        },\n      },\n    };\n  }\n);\n"],"names":["createStyles"],"mappings":"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"}
+{"version":3,"file":"Switch.styles.js","sources":["../../src/Switch/Switch.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, MantineColor, rem, getSize } from '@mantine/styles';\n\nexport interface SwitchStylesParams {\n  color: MantineColor;\n  radius: MantineNumberSize;\n  labelPosition: 'left' | 'right';\n  error: boolean;\n}\n\nconst switchHeight = {\n  xs: rem(16),\n  sm: rem(20),\n  md: rem(24),\n  lg: rem(30),\n  xl: rem(36),\n};\n\nconst switchWidth = {\n  xs: rem(32),\n  sm: rem(38),\n  md: rem(46),\n  lg: rem(56),\n  xl: rem(72),\n};\n\nconst handleSizes = {\n  xs: rem(12),\n  sm: rem(14),\n  md: rem(18),\n  lg: rem(22),\n  xl: rem(28),\n};\n\nconst labelFontSizes = {\n  xs: rem(5),\n  sm: rem(6),\n  md: rem(7),\n  lg: rem(9),\n  xl: rem(11),\n};\n\nconst trackLabelPaddings = {\n  xs: rem(4),\n  sm: rem(5),\n  md: rem(6),\n  lg: rem(8),\n  xl: rem(10),\n};\n\nexport default createStyles(\n  (theme, { radius, color, labelPosition, error }: SwitchStylesParams, { size }) => {\n    const handleSize = getSize({ size, sizes: handleSizes });\n    const borderRadius = getSize({ size: radius, sizes: theme.radius });\n    const colors = theme.fn.variant({ variant: 'filled', color });\n    const trackWidth = getSize({ size, sizes: switchWidth });\n    const trackPadding = rem(size === 'xs' ? 1 : 2);\n    const errorColor = theme.fn.variant({ variant: 'filled', color: 'red' }).background;\n\n    return {\n      input: {\n        height: 0,\n        width: 0,\n        overflow: 'hidden',\n        whiteSpace: 'nowrap',\n        padding: 0,\n        WebkitClipPath: 'inset(50%)',\n        clipPath: 'inset(50%)',\n        position: 'absolute',\n      },\n\n      track: {\n        ...theme.fn.focusStyles('input:focus + &'),\n        cursor: theme.cursorType,\n        overflow: 'hidden',\n        WebkitTapHighlightColor: 'transparent',\n        position: 'relative',\n        borderRadius,\n        backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[2],\n        border: `${rem(1)} solid ${\n          error\n            ? errorColor\n            : theme.colorScheme === 'dark'\n            ? theme.colors.dark[4]\n            : theme.colors.gray[3]\n        }`,\n        height: getSize({ size, sizes: switchHeight }),\n        minWidth: trackWidth,\n        margin: 0,\n        transitionProperty: 'background-color, border-color',\n        transitionTimingFunction: theme.transitionTimingFunction,\n        transitionDuration: '150ms',\n        boxSizing: 'border-box',\n        appearance: 'none',\n        display: 'flex',\n        alignItems: 'center',\n        fontSize: getSize({ size, sizes: labelFontSizes }),\n        fontWeight: 600,\n        order: labelPosition === 'left' ? 2 : 1,\n        userSelect: 'none',\n        zIndex: 0,\n        lineHeight: 0,\n        color: theme.colorScheme === 'dark' ? theme.colors.dark[1] : theme.colors.gray[6],\n        transition: `color 150ms ${theme.transitionTimingFunction}`,\n\n        'input:checked + &': {\n          backgroundColor: colors.background,\n          borderColor: colors.background,\n          color: theme.white,\n          transition: `color 150ms ${theme.transitionTimingFunction}`,\n        },\n\n        'input:disabled + &': {\n          backgroundColor:\n            theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[2],\n          borderColor: theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[2],\n          cursor: 'not-allowed',\n        },\n      },\n\n      thumb: {\n        position: 'absolute',\n        zIndex: 1,\n        borderRadius,\n        boxSizing: 'border-box',\n        display: 'flex',\n        backgroundColor: theme.white,\n        height: handleSize,\n        width: handleSize,\n        border: `${rem(1)} solid ${\n          theme.colorScheme === 'dark' ? theme.white : theme.colors.gray[3]\n        }`,\n        left: trackPadding,\n        transition: `left 150ms ${theme.transitionTimingFunction}`,\n\n        '& > *': {\n          margin: 'auto',\n        },\n\n        '@media (prefers-reduced-motion)': {\n          transitionDuration: theme.respectReducedMotion ? '0ms' : '',\n        },\n\n        'input:checked + * > &': {\n          left: `calc(100% - ${handleSize} - ${trackPadding})`,\n          borderColor: theme.white,\n        },\n\n        'input:disabled + * > &': {\n          borderColor: theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[2],\n          backgroundColor:\n            theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[0],\n        },\n      },\n\n      trackLabel: {\n        height: '100%',\n        display: 'grid',\n        placeContent: 'center',\n\n        minWidth: `calc(${trackWidth} - ${handleSize})`,\n        paddingInline: getSize({ size, sizes: trackLabelPaddings }),\n        margin: `0 0 0 calc(${handleSize} + ${trackPadding})`,\n        transition: `margin 150ms ${theme.transitionTimingFunction}`,\n\n        'input:checked + * > &': {\n          margin: `0 calc(${handleSize} + ${trackPadding}) 0 0`,\n        },\n      },\n    };\n  }\n);\n"],"names":["rem","createStyles","getSize"],"mappings":"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"}

package/cjs/Switch/SwitchGroup/SwitchGroup.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 var hooks = require('@mantine/hooks');
 var styles = require('@mantine/styles');
-var InputsGroup = require('../../Checkbox/CheckboxGroup/InputsGroup.js');
 var SwitchGroup_context = require('../SwitchGroup.context.js');
 var Input = require('../../Input/Input.js');
 
@@ -42,33 +41,10 @@ var __objRest = (source, exclude) => {
   return target;
 };
 const defaultProps = {
-  orientation: "horizontal",
-  spacing: "lg",
-  size: "sm",
-  offset: "xs"
+  size: "sm"
 };
 const SwitchGroup = React.forwardRef((props, ref) => {
-  const _a = styles.useComponentDefaultProps("SwitchGroup", defaultProps, props), {
-    children,
-    value,
-    defaultValue,
-    onChange,
-    orientation,
-    spacing,
-    size,
-    wrapperProps,
-    offset
-  } = _a, others = __objRest(_a, [
-    "children",
-    "value",
-    "defaultValue",
-    "onChange",
-    "orientation",
-    "spacing",
-    "size",
-    "wrapperProps",
-    "offset"
-  ]);
+  const _a = styles.useComponentDefaultProps("SwitchGroup", defaultProps, props), { children, value, defaultValue, onChange, size, wrapperProps } = _a, others = __objRest(_a, ["children", "value", "defaultValue", "onChange", "size", "wrapperProps"]);
   const [_value, setValue] = hooks.useUncontrolled({
     value,
     defaultValue,
@@ -86,11 +62,7 @@ const SwitchGroup = React.forwardRef((props, ref) => {
     size,
     __staticSelector: "SwitchGroup",
     ref
-  }, wrapperProps), others), /* @__PURE__ */ React__default.createElement(InputsGroup.InputsGroup, {
-    spacing,
-    orientation,
-    offset
-  }, children)));
+  }, wrapperProps), others), children));
 });
 SwitchGroup.displayName = "@mantine/core/SwitchGroup";
 

package/cjs/Switch/SwitchGroup/SwitchGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"SwitchGroup.js","sources":["../../../src/Switch/SwitchGroup/SwitchGroup.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { useUncontrolled } from '@mantine/hooks';\nimport {\n  DefaultProps,\n  MantineNumberSize,\n  MantineSize,\n  useComponentDefaultProps,\n} from '@mantine/styles';\nimport { Input, InputWrapperBaseProps, InputWrapperStylesNames } from '../../Input';\nimport { InputsGroup } from '../../Checkbox/CheckboxGroup/InputsGroup';\nimport { SwitchGroupProvider } from '../SwitchGroup.context';\n\nexport type SwitchGroupStylesNames = InputWrapperStylesNames;\n\nexport interface SwitchGroupProps\n  extends DefaultProps<SwitchGroupStylesNames>,\n    InputWrapperBaseProps,\n    Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange'> {\n  /** <Checkbox /> components only */\n  children: React.ReactNode;\n\n  /** Value of currently selected checkbox */\n  value?: string[];\n\n  /** Initial value for uncontrolled component */\n  defaultValue?: string[];\n\n  /** Called when value changes */\n  onChange?(value: string[]): void;\n\n  /** Horizontal or vertical orientation */\n  orientation?: 'horizontal' | 'vertical';\n\n  /** Spacing between checkboxes in horizontal orientation */\n  spacing?: MantineNumberSize;\n\n  /** Space between label and inputs */\n  offset?: MantineNumberSize;\n\n  /** Predefined label fontSize, checkbox width, height and border-radius */\n  size?: MantineSize;\n\n  /** Props spread to InputWrapper */\n  wrapperProps?: Record<string, any>;\n}\n\nconst defaultProps: Partial<SwitchGroupProps> = {\n  orientation: 'horizontal',\n  spacing: 'lg',\n  size: 'sm',\n  offset: 'xs',\n};\n\nexport const SwitchGroup = forwardRef<HTMLDivElement, SwitchGroupProps>(\n  (props: SwitchGroupProps, ref) => {\n    const {\n      children,\n      value,\n      defaultValue,\n      onChange,\n      orientation,\n      spacing,\n      size,\n      wrapperProps,\n      offset,\n      ...others\n    } = useComponentDefaultProps('SwitchGroup', defaultProps, props);\n\n    const [_value, setValue] = useUncontrolled({\n      value,\n      defaultValue,\n      finalValue: [],\n      onChange,\n    });\n\n    const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n      const itemValue = event.currentTarget.value;\n      setValue(\n        _value.includes(itemValue)\n          ? _value.filter((item) => item !== itemValue)\n          : [..._value, itemValue]\n      );\n    };\n\n    return (\n      <SwitchGroupProvider value={{ value: _value, onChange: handleChange, size }}>\n        <Input.Wrapper\n          labelElement=\"div\"\n          size={size}\n          __staticSelector=\"SwitchGroup\"\n          ref={ref}\n          {...wrapperProps}\n          {...others}\n        >\n          <InputsGroup spacing={spacing} orientation={orientation} offset={offset}>\n            {children}\n          </InputsGroup>\n        </Input.Wrapper>\n      </SwitchGroupProvider>\n    );\n  }\n);\n\nSwitchGroup.displayName = '@mantine/core/SwitchGroup';\n"],"names":["forwardRef","useComponentDefaultProps","useUncontrolled","React","SwitchGroupProvider","Input","InputsGroup"],"mappings":"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"}
+{"version":3,"file":"SwitchGroup.js","sources":["../../../src/Switch/SwitchGroup/SwitchGroup.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { useUncontrolled } from '@mantine/hooks';\nimport { DefaultProps, MantineSize, useComponentDefaultProps } from '@mantine/styles';\nimport { Input, InputWrapperBaseProps, InputWrapperStylesNames } from '../../Input';\nimport { SwitchGroupProvider } from '../SwitchGroup.context';\n\nexport type SwitchGroupStylesNames = InputWrapperStylesNames;\n\nexport interface SwitchGroupProps\n  extends DefaultProps<SwitchGroupStylesNames>,\n    InputWrapperBaseProps,\n    Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange'> {\n  /** <Checkbox /> components only */\n  children: React.ReactNode;\n\n  /** Value of currently selected checkbox */\n  value?: string[];\n\n  /** Initial value for uncontrolled component */\n  defaultValue?: string[];\n\n  /** Called when value changes */\n  onChange?(value: string[]): void;\n\n  /** Predefined label fontSize, checkbox width, height and border-radius */\n  size?: MantineSize;\n\n  /** Props spread to InputWrapper */\n  wrapperProps?: Record<string, any>;\n}\n\nconst defaultProps: Partial<SwitchGroupProps> = {\n  size: 'sm',\n};\n\nexport const SwitchGroup = forwardRef<HTMLDivElement, SwitchGroupProps>(\n  (props: SwitchGroupProps, ref) => {\n    const { children, value, defaultValue, onChange, size, wrapperProps, ...others } =\n      useComponentDefaultProps('SwitchGroup', defaultProps, props);\n\n    const [_value, setValue] = useUncontrolled({\n      value,\n      defaultValue,\n      finalValue: [],\n      onChange,\n    });\n\n    const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n      const itemValue = event.currentTarget.value;\n      setValue(\n        _value.includes(itemValue)\n          ? _value.filter((item) => item !== itemValue)\n          : [..._value, itemValue]\n      );\n    };\n\n    return (\n      <SwitchGroupProvider value={{ value: _value, onChange: handleChange, size }}>\n        <Input.Wrapper\n          labelElement=\"div\"\n          size={size}\n          __staticSelector=\"SwitchGroup\"\n          ref={ref}\n          {...wrapperProps}\n          {...others}\n        >\n          {children}\n        </Input.Wrapper>\n      </SwitchGroupProvider>\n    );\n  }\n);\n\nSwitchGroup.displayName = '@mantine/core/SwitchGroup';\n"],"names":["forwardRef","useComponentDefaultProps","useUncontrolled","React","SwitchGroupProvider","Input"],"mappings":"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"}

package/cjs/Table/Table.js

@@ -64,7 +64,8 @@ const Table = React.forwardRef((props, ref) => {
     fontSize,
     unstyled,
     withBorder,
-    withColumnBorders
+    withColumnBorders,
+    variant
   } = _a, others = __objRest(_a, [
     "className",
     "children",
@@ -76,9 +77,10 @@ const Table = React.forwardRef((props, ref) => {
     "fontSize",
     "unstyled",
     "withBorder",
-    "withColumnBorders"
+    "withColumnBorders",
+    "variant"
   ]);
-  const { classes, cx } = Table_styles['default']({ captionSide, verticalSpacing, horizontalSpacing, fontSize, withBorder, withColumnBorders }, { unstyled, name: "Table" });
+  const { classes, cx } = Table_styles['default']({ captionSide, verticalSpacing, horizontalSpacing, fontSize, withBorder, withColumnBorders }, { unstyled, name: "Table", variant });
   return /* @__PURE__ */ React__default.createElement(Box.Box, __spreadProps(__spreadValues({}, others), {
     component: "table",
     ref,

package/cjs/Table/Table.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.js","sources":["../../src/Table/Table.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, MantineNumberSize, useComponentDefaultProps } from '@mantine/styles';\nimport { Box } from '../Box';\nimport useStyles, { TableStylesParams } from './Table.styles';\n\nexport interface TableProps\n  extends DefaultProps<never, TableStylesParams>,\n    React.ComponentPropsWithoutRef<'table'> {\n  /** If true every odd row of table will have gray background color */\n  striped?: boolean;\n\n  /** If true row will have hover color */\n  highlightOnHover?: boolean;\n\n  /** Table caption position */\n  captionSide?: 'top' | 'bottom';\n\n  /** Horizontal cells spacing from theme.spacing or number to set value in px */\n  horizontalSpacing?: MantineNumberSize;\n\n  /** Vertical cells spacing from theme.spacing or number to set value in px */\n  verticalSpacing?: MantineNumberSize;\n\n  /** Sets font size of all text inside table */\n  fontSize?: MantineNumberSize;\n\n  /** Add border to table */\n  withBorder?: boolean;\n\n  /** Add border to columns */\n  withColumnBorders?: boolean;\n}\n\nconst defaultProps: Partial<TableProps> = {\n  striped: false,\n  highlightOnHover: false,\n  captionSide: 'top',\n  horizontalSpacing: 'xs',\n  fontSize: 'sm',\n  verticalSpacing: 7,\n  withBorder: false,\n  withColumnBorders: false,\n};\n\nexport const Table = forwardRef<HTMLTableElement, TableProps>((props, ref) => {\n  const {\n    className,\n    children,\n    striped,\n    highlightOnHover,\n    captionSide,\n    horizontalSpacing,\n    verticalSpacing,\n    fontSize,\n    unstyled,\n    withBorder,\n    withColumnBorders,\n    ...others\n  } = useComponentDefaultProps('Table', defaultProps, props);\n\n  const { classes, cx } = useStyles(\n    { captionSide, verticalSpacing, horizontalSpacing, fontSize, withBorder, withColumnBorders },\n    { unstyled, name: 'Table' }\n  );\n\n  return (\n    <Box\n      {...others}\n      component=\"table\"\n      ref={ref}\n      className={cx(classes.root, className)}\n      data-striped={striped || undefined}\n      data-hover={highlightOnHover || undefined}\n    >\n      {children}\n    </Box>\n  );\n});\n\nTable.displayName = '@mantine/core/Table';\n"],"names":["forwardRef","useComponentDefaultProps","useStyles","React","Box"],"mappings":"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"}
+{"version":3,"file":"Table.js","sources":["../../src/Table/Table.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, MantineNumberSize, useComponentDefaultProps } from '@mantine/styles';\nimport { Box } from '../Box';\nimport useStyles, { TableStylesParams } from './Table.styles';\n\nexport interface TableProps\n  extends DefaultProps<never, TableStylesParams>,\n    React.ComponentPropsWithoutRef<'table'> {\n  variant?: string;\n\n  /** If true every odd row of table will have gray background color */\n  striped?: boolean;\n\n  /** If true row will have hover color */\n  highlightOnHover?: boolean;\n\n  /** Table caption position */\n  captionSide?: 'top' | 'bottom';\n\n  /** Horizontal cells spacing from theme.spacing or any valid CSS value */\n  horizontalSpacing?: MantineNumberSize;\n\n  /** Vertical cells spacing from theme.spacing or any valid CSS value */\n  verticalSpacing?: MantineNumberSize;\n\n  /** Sets font size of all text inside table */\n  fontSize?: MantineNumberSize;\n\n  /** Add border to table */\n  withBorder?: boolean;\n\n  /** Add border to columns */\n  withColumnBorders?: boolean;\n}\n\nconst defaultProps: Partial<TableProps> = {\n  striped: false,\n  highlightOnHover: false,\n  captionSide: 'top',\n  horizontalSpacing: 'xs',\n  fontSize: 'sm',\n  verticalSpacing: 7,\n  withBorder: false,\n  withColumnBorders: false,\n};\n\nexport const Table = forwardRef<HTMLTableElement, TableProps>((props, ref) => {\n  const {\n    className,\n    children,\n    striped,\n    highlightOnHover,\n    captionSide,\n    horizontalSpacing,\n    verticalSpacing,\n    fontSize,\n    unstyled,\n    withBorder,\n    withColumnBorders,\n    variant,\n    ...others\n  } = useComponentDefaultProps('Table', defaultProps, props);\n\n  const { classes, cx } = useStyles(\n    { captionSide, verticalSpacing, horizontalSpacing, fontSize, withBorder, withColumnBorders },\n    { unstyled, name: 'Table', variant }\n  );\n\n  return (\n    <Box\n      {...others}\n      component=\"table\"\n      ref={ref}\n      className={cx(classes.root, className)}\n      data-striped={striped || undefined}\n      data-hover={highlightOnHover || undefined}\n    >\n      {children}\n    </Box>\n  );\n});\n\nTable.displayName = '@mantine/core/Table';\n"],"names":["forwardRef","useComponentDefaultProps","useStyles","React","Box"],"mappings":"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"}

package/cjs/Table/Table.styles.js

@@ -31,7 +31,7 @@ var useStyles = styles.createStyles((theme, {
   withBorder,
   withColumnBorders
 }) => {
-  const border = `1px solid ${theme.colorScheme === "dark" ? theme.colors.dark[4] : theme.colors.gray[3]}`;
+  const border = `${styles.rem(1)} solid ${theme.colorScheme === "dark" ? theme.colors.dark[4] : theme.colors.gray[3]}`;
   return {
     root: __spreadProps(__spreadValues({}, theme.fn.fontStyles()), {
       width: "100%",
@@ -39,7 +39,7 @@ var useStyles = styles.createStyles((theme, {
       captionSide,
       color: theme.colorScheme === "dark" ? theme.colors.dark[0] : theme.black,
       lineHeight: theme.lineHeight,
-      border: withBorder ? border : "",
+      border: withBorder ? border : void 0,
       "& caption": {
         marginTop: captionSide === "top" ? 0 : theme.spacing.xs,
         marginBottom: captionSide === "bottom" ? 0 : theme.spacing.xs,
@@ -50,11 +50,11 @@ var useStyles = styles.createStyles((theme, {
         textAlign: "left",
         fontWeight: "bold",
         color: theme.colorScheme === "dark" ? theme.colors.dark[0] : theme.colors.gray[7],
-        fontSize: theme.fn.size({ size: fontSize, sizes: theme.fontSizes }),
-        padding: `${theme.fn.size({
-          size: verticalSpacing,
+        fontSize: styles.getSize({ size: fontSize, sizes: theme.fontSizes }),
+        padding: `${styles.getSize({ size: verticalSpacing, sizes: theme.spacing })} ${styles.getSize({
+          size: horizontalSpacing,
           sizes: theme.spacing
-        })}px ${theme.fn.size({ size: horizontalSpacing, sizes: theme.spacing })}px`
+        })}`
       },
       "& thead tr th": {
         borderBottom: border
@@ -63,12 +63,12 @@ var useStyles = styles.createStyles((theme, {
         borderTop: border
       },
       "& tbody tr td": {
-        padding: `${theme.fn.size({
+        padding: `${styles.getSize({
           size: verticalSpacing,
           sizes: theme.spacing
-        })}px ${theme.fn.size({ size: horizontalSpacing, sizes: theme.spacing })}px`,
+        })} ${styles.getSize({ size: horizontalSpacing, sizes: theme.spacing })}`,
         borderTop: border,
-        fontSize: theme.fn.size({ size: fontSize, sizes: theme.fontSizes })
+        fontSize: styles.getSize({ size: fontSize, sizes: theme.fontSizes })
       },
       "& tbody tr:first-of-type td": {
         borderTop: "none"

package/cjs/Table/Table.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.styles.js","sources":["../../src/Table/Table.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize } from '@mantine/styles';\n\nexport interface TableStylesParams {\n  captionSide: 'top' | 'bottom';\n  horizontalSpacing: MantineNumberSize;\n  verticalSpacing: MantineNumberSize;\n  fontSize: MantineNumberSize;\n  withBorder: boolean;\n  withColumnBorders: boolean;\n}\n\nexport default createStyles(\n  (\n    theme,\n    {\n      captionSide,\n      horizontalSpacing,\n      verticalSpacing,\n      fontSize,\n      withBorder,\n      withColumnBorders,\n    }: TableStylesParams\n  ) => {\n    const border = `1px solid ${\n      theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[3]\n    }`;\n    return {\n      root: {\n        ...theme.fn.fontStyles(),\n        width: '100%',\n        borderCollapse: 'collapse',\n        captionSide,\n        color: theme.colorScheme === 'dark' ? theme.colors.dark[0] : theme.black,\n        lineHeight: theme.lineHeight,\n        border: withBorder ? border : '',\n\n        '& caption': {\n          marginTop: captionSide === 'top' ? 0 : theme.spacing.xs,\n          marginBottom: captionSide === 'bottom' ? 0 : theme.spacing.xs,\n          fontSize: theme.fontSizes.sm,\n          color: theme.colorScheme === 'dark' ? theme.colors.dark[2] : theme.colors.gray[6],\n        },\n\n        '& thead tr th, & tfoot tr th': {\n          textAlign: 'left',\n          fontWeight: 'bold',\n          color: theme.colorScheme === 'dark' ? theme.colors.dark[0] : theme.colors.gray[7],\n          fontSize: theme.fn.size({ size: fontSize, sizes: theme.fontSizes }),\n          padding: `${theme.fn.size({\n            size: verticalSpacing,\n            sizes: theme.spacing,\n          })}px ${theme.fn.size({ size: horizontalSpacing, sizes: theme.spacing })}px`,\n        },\n\n        '& thead tr th': {\n          borderBottom: border,\n        },\n\n        '& tfoot tr th': {\n          borderTop: border,\n        },\n\n        '& tbody tr td': {\n          padding: `${theme.fn.size({\n            size: verticalSpacing,\n            sizes: theme.spacing,\n          })}px ${theme.fn.size({ size: horizontalSpacing, sizes: theme.spacing })}px`,\n          borderTop: border,\n          fontSize: theme.fn.size({ size: fontSize, sizes: theme.fontSizes }),\n        },\n\n        '& tbody tr:first-of-type td': {\n          borderTop: 'none',\n        },\n\n        '& thead th, & tbody td': {\n          borderRight: withColumnBorders ? border : 'none',\n\n          '&:last-of-type': {\n            borderRight: 'none',\n            borderLeft: withColumnBorders ? border : 'none',\n          },\n        },\n\n        '&[data-striped] tbody tr:nth-of-type(odd)': {\n          backgroundColor:\n            theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[0],\n        },\n\n        '&[data-hover] tbody tr': theme.fn.hover({\n          backgroundColor:\n            theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.colors.gray[1],\n        }),\n      },\n    };\n  }\n);\n"],"names":["createStyles"],"mappings":"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"}
+{"version":3,"file":"Table.styles.js","sources":["../../src/Table/Table.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, rem, getSize } from '@mantine/styles';\n\nexport interface TableStylesParams {\n  captionSide: 'top' | 'bottom';\n  horizontalSpacing: MantineNumberSize;\n  verticalSpacing: MantineNumberSize;\n  fontSize: MantineNumberSize;\n  withBorder: boolean;\n  withColumnBorders: boolean;\n}\n\nexport default createStyles(\n  (\n    theme,\n    {\n      captionSide,\n      horizontalSpacing,\n      verticalSpacing,\n      fontSize,\n      withBorder,\n      withColumnBorders,\n    }: TableStylesParams\n  ) => {\n    const border = `${rem(1)} solid ${\n      theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[3]\n    }`;\n\n    return {\n      root: {\n        ...theme.fn.fontStyles(),\n        width: '100%',\n        borderCollapse: 'collapse',\n        captionSide,\n        color: theme.colorScheme === 'dark' ? theme.colors.dark[0] : theme.black,\n        lineHeight: theme.lineHeight,\n        border: withBorder ? border : undefined,\n\n        '& caption': {\n          marginTop: captionSide === 'top' ? 0 : theme.spacing.xs,\n          marginBottom: captionSide === 'bottom' ? 0 : theme.spacing.xs,\n          fontSize: theme.fontSizes.sm,\n          color: theme.colorScheme === 'dark' ? theme.colors.dark[2] : theme.colors.gray[6],\n        },\n\n        '& thead tr th, & tfoot tr th': {\n          textAlign: 'left',\n          fontWeight: 'bold',\n          color: theme.colorScheme === 'dark' ? theme.colors.dark[0] : theme.colors.gray[7],\n          fontSize: getSize({ size: fontSize, sizes: theme.fontSizes }),\n          padding: `${getSize({ size: verticalSpacing, sizes: theme.spacing })} ${getSize({\n            size: horizontalSpacing,\n            sizes: theme.spacing,\n          })}`,\n        },\n\n        '& thead tr th': {\n          borderBottom: border,\n        },\n\n        '& tfoot tr th': {\n          borderTop: border,\n        },\n\n        '& tbody tr td': {\n          padding: `${getSize({\n            size: verticalSpacing,\n            sizes: theme.spacing,\n          })} ${getSize({ size: horizontalSpacing, sizes: theme.spacing })}`,\n          borderTop: border,\n          fontSize: getSize({ size: fontSize, sizes: theme.fontSizes }),\n        },\n\n        '& tbody tr:first-of-type td': {\n          borderTop: 'none',\n        },\n\n        '& thead th, & tbody td': {\n          borderRight: withColumnBorders ? border : 'none',\n\n          '&:last-of-type': {\n            borderRight: 'none',\n            borderLeft: withColumnBorders ? border : 'none',\n          },\n        },\n\n        '&[data-striped] tbody tr:nth-of-type(odd)': {\n          backgroundColor:\n            theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[0],\n        },\n\n        '&[data-hover] tbody tr': theme.fn.hover({\n          backgroundColor:\n            theme.colorScheme === 'dark' ? theme.colors.dark[5] : theme.colors.gray[1],\n        }),\n      },\n    };\n  }\n);\n"],"names":["createStyles","rem","getSize"],"mappings":";;;;;;AAAA,IAAI,SAAS,GAAG,MAAM,CAAC,cAAc,CAAC;AACtC,IAAI,UAAU,GAAG,MAAM,CAAC,gBAAgB,CAAC;AACzC,IAAI,iBAAiB,GAAG,MAAM,CAAC,yBAAyB,CAAC;AACzD,IAAI,mBAAmB,GAAG,MAAM,CAAC,qBAAqB,CAAC;AACvD,IAAI,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC;AACnD,IAAI,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,oBAAoB,CAAC;AACzD,IAAI,eAAe,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,KAAK,GAAG,IAAI,GAAG,GAAG,SAAS,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,GAAG,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AAChK,IAAI,cAAc,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK;AAC/B,EAAE,KAAK,IAAI,IAAI,IAAI,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC;AAChC,IAAI,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC;AAClC,MAAM,eAAe,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AACxC,EAAE,IAAI,mBAAmB;AACzB,IAAI,KAAK,IAAI,IAAI,IAAI,mBAAmB,CAAC,CAAC,CAAC,EAAE;AAC7C,MAAM,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC;AACpC,QAAQ,eAAe,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AAC1C,KAAK;AACL,EAAE,OAAO,CAAC,CAAC;AACX,CAAC,CAAC;AACF,IAAI,aAAa,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK,UAAU,CAAC,CAAC,EAAE,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC;AAElE,gBAAeA,mBAAY,CAAC,CAAC,KAAK,EAAE;AACpC,EAAE,WAAW;AACb,EAAE,iBAAiB;AACnB,EAAE,eAAe;AACjB,EAAE,QAAQ;AACV,EAAE,UAAU;AACZ,EAAE,iBAAiB;AACnB,CAAC,KAAK;AACN,EAAE,MAAM,MAAM,GAAG,CAAC,EAAEC,UAAG,CAAC,CAAC,CAAC,CAAC,OAAO,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACjH,EAAE,OAAO;AACT,IAAI,IAAI,EAAE,aAAa,CAAC,cAAc,CAAC,EAAE,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,EAAE,CAAC,EAAE;AACnE,MAAM,KAAK,EAAE,MAAM;AACnB,MAAM,cAAc,EAAE,UAAU;AAChC,MAAM,WAAW;AACjB,MAAM,KAAK,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK;AAC9E,MAAM,UAAU,EAAE,KAAK,CAAC,UAAU;AAClC,MAAM,MAAM,EAAE,UAAU,GAAG,MAAM,GAAG,KAAK,CAAC;AAC1C,MAAM,WAAW,EAAE;AACnB,QAAQ,SAAS,EAAE,WAAW,KAAK,KAAK,GAAG,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE;AAC/D,QAAQ,YAAY,EAAE,WAAW,KAAK,QAAQ,GAAG,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE;AACrE,QAAQ,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,EAAE;AACpC,QAAQ,KAAK,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;AACzF,OAAO;AACP,MAAM,8BAA8B,EAAE;AACtC,QAAQ,SAAS,EAAE,MAAM;AACzB,QAAQ,UAAU,EAAE,MAAM;AAC1B,QAAQ,KAAK,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;AACzF,QAAQ,QAAQ,EAAEC,cAAO,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC;AACrE,QAAQ,OAAO,EAAE,CAAC,EAAEA,cAAO,CAAC,EAAE,IAAI,EAAE,eAAe,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,EAAEA,cAAO,CAAC;AACxF,UAAU,IAAI,EAAE,iBAAiB;AACjC,UAAU,KAAK,EAAE,KAAK,CAAC,OAAO;AAC9B,SAAS,CAAC,CAAC,CAAC;AACZ,OAAO;AACP,MAAM,eAAe,EAAE;AACvB,QAAQ,YAAY,EAAE,MAAM;AAC5B,OAAO;AACP,MAAM,eAAe,EAAE;AACvB,QAAQ,SAAS,EAAE,MAAM;AACzB,OAAO;AACP,MAAM,eAAe,EAAE;AACvB,QAAQ,OAAO,EAAE,CAAC,EAAEA,cAAO,CAAC;AAC5B,UAAU,IAAI,EAAE,eAAe;AAC/B,UAAU,KAAK,EAAE,KAAK,CAAC,OAAO;AAC9B,SAAS,CAAC,CAAC,CAAC,EAAEA,cAAO,CAAC,EAAE,IAAI,EAAE,iBAAiB,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC;AAC1E,QAAQ,SAAS,EAAE,MAAM;AACzB,QAAQ,QAAQ,EAAEA,cAAO,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC;AACrE,OAAO;AACP,MAAM,6BAA6B,EAAE;AACrC,QAAQ,SAAS,EAAE,MAAM;AACzB,OAAO;AACP,MAAM,wBAAwB,EAAE;AAChC,QAAQ,WAAW,EAAE,iBAAiB,GAAG,MAAM,GAAG,MAAM;AACxD,QAAQ,gBAAgB,EAAE;AAC1B,UAAU,WAAW,EAAE,MAAM;AAC7B,UAAU,UAAU,EAAE,iBAAiB,GAAG,MAAM,GAAG,MAAM;AACzD,SAAS;AACT,OAAO;AACP,MAAM,2CAA2C,EAAE;AACnD,QAAQ,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;AACnG,OAAO;AACP,MAAM,wBAAwB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC;AAC/C,QAAQ,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;AACnG,OAAO,CAAC;AACR,KAAK,CAAC;AACN,GAAG,CAAC;AACJ,CAAC,CAAC;;;;"}

package/cjs/Tabs/Tab/Tab.js

@@ -55,11 +55,16 @@ const Tab = React.forwardRef((props, ref) => {
     withRightSection: hasRightSection || hasIcon && !children,
     orientation: ctx.orientation,
     color: color || ctx.color,
-    variant: ctx.variant,
     radius: ctx.radius,
     inverted: ctx.inverted,
     placement: ctx.placement
-  }, { name: "Tabs", unstyled: ctx.unstyled, classNames: ctx.classNames, styles: ctx.styles });
+  }, {
+    name: "Tabs",
+    unstyled: ctx.unstyled,
+    classNames: ctx.classNames,
+    styles: ctx.styles,
+    variant: ctx.variant
+  });
   const isActive = value === ctx.value;
   const activateTab = (event) => {
     ctx.onTabChange(ctx.allowTabDeactivation ? value === ctx.value ? null : value : value);
@@ -86,11 +91,11 @@ const Tab = React.forwardRef((props, ref) => {
       orientation: ctx.orientation,
       onKeyDown
     })
-  }), icon && /* @__PURE__ */ React__default.createElement("div", {
+  }), icon && /* @__PURE__ */ React__default.createElement("span", {
     className: classes.tabIcon
-  }, icon), children && /* @__PURE__ */ React__default.createElement("div", {
+  }, icon), children && /* @__PURE__ */ React__default.createElement("span", {
     className: classes.tabLabel
-  }, children), rightSection && /* @__PURE__ */ React__default.createElement("div", {
+  }, children), rightSection && /* @__PURE__ */ React__default.createElement("span", {
     className: classes.tabRightSection
   }, rightSection));
 });

package/cjs/Tabs/Tab/Tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tab.js","sources":["../../../src/Tabs/Tab/Tab.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, Selectors, MantineColor, useComponentDefaultProps } from '@mantine/styles';\nimport { createScopedKeydownHandler } from '@mantine/utils';\nimport { UnstyledButton } from '../../UnstyledButton';\nimport { useTabsContext } from '../Tabs.context';\nimport useStyles from './Tab.styles';\n\nexport type TabStylesNames = Selectors<typeof useStyles>;\n\nexport interface TabProps extends DefaultProps, React.ComponentPropsWithoutRef<'button'> {\n  /** Value that is used to connect Tab with associated panel */\n  value: string;\n\n  /** Tab label */\n  children?: React.ReactNode;\n\n  /** Section of content displayed after label */\n  rightSection?: React.ReactNode;\n\n  /** Section of content displayed before label */\n  icon?: React.ReactNode;\n\n  /** Key of theme.colors */\n  color?: MantineColor;\n}\n\nconst defaultProps: Partial<TabProps> = {};\n\nexport const Tab = forwardRef<HTMLButtonElement, TabProps>((props, ref) => {\n  const { value, children, onKeyDown, onClick, className, icon, rightSection, color, ...others } =\n    useComponentDefaultProps('TabsTab', defaultProps, props);\n  const ctx = useTabsContext();\n\n  const hasIcon = !!icon;\n  const hasRightSection = !!rightSection;\n\n  const { theme, classes, cx } = useStyles(\n    {\n      withIcon: hasIcon || (hasRightSection && !children),\n      withRightSection: hasRightSection || (hasIcon && !children),\n      orientation: ctx.orientation,\n      color: color || ctx.color,\n      variant: ctx.variant,\n      radius: ctx.radius,\n      inverted: ctx.inverted,\n      placement: ctx.placement,\n    },\n    { name: 'Tabs', unstyled: ctx.unstyled, classNames: ctx.classNames, styles: ctx.styles }\n  );\n\n  const isActive = value === ctx.value;\n  const activateTab = (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n    ctx.onTabChange(ctx.allowTabDeactivation ? (value === ctx.value ? null : value) : value);\n    onClick?.(event);\n  };\n\n  return (\n    <UnstyledButton<'button'>\n      {...others}\n      unstyled={ctx.unstyled}\n      className={cx(classes.tab, className)}\n      data-active={isActive || undefined}\n      ref={ref}\n      type=\"button\"\n      role=\"tab\"\n      id={ctx.getTabId(value)}\n      aria-selected={isActive}\n      tabIndex={isActive || ctx.value === null ? 0 : -1}\n      aria-controls={ctx.getPanelId(value)}\n      onClick={activateTab}\n      onKeyDown={createScopedKeydownHandler({\n        siblingSelector: '[role=\"tab\"]',\n        parentSelector: '[role=\"tablist\"]',\n        activateOnFocus: ctx.activateTabWithKeyboard,\n        loop: ctx.loop,\n        dir: theme.dir,\n        orientation: ctx.orientation,\n        onKeyDown,\n      })}\n    >\n      {icon && <div className={classes.tabIcon}>{icon}</div>}\n      {children && <div className={classes.tabLabel}>{children}</div>}\n      {rightSection && <div className={classes.tabRightSection}>{rightSection}</div>}\n    </UnstyledButton>\n  );\n});\n\nTab.displayName = '@mantine/core/Tab';\n"],"names":["forwardRef","useComponentDefaultProps","useTabsContext","useStyles","React","UnstyledButton","createScopedKeydownHandler"],"mappings":"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"}
+{"version":3,"file":"Tab.js","sources":["../../../src/Tabs/Tab/Tab.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, Selectors, MantineColor, useComponentDefaultProps } from '@mantine/styles';\nimport { createScopedKeydownHandler } from '@mantine/utils';\nimport { UnstyledButton } from '../../UnstyledButton';\nimport { useTabsContext } from '../Tabs.context';\nimport useStyles from './Tab.styles';\n\nexport type TabStylesNames = Selectors<typeof useStyles>;\n\nexport interface TabProps extends DefaultProps, React.ComponentPropsWithoutRef<'button'> {\n  /** Value that is used to connect Tab with associated panel */\n  value: string;\n\n  /** Tab label */\n  children?: React.ReactNode;\n\n  /** Section of content displayed after label */\n  rightSection?: React.ReactNode;\n\n  /** Section of content displayed before label */\n  icon?: React.ReactNode;\n\n  /** Key of theme.colors */\n  color?: MantineColor;\n}\n\nconst defaultProps: Partial<TabProps> = {};\n\nexport const Tab = forwardRef<HTMLButtonElement, TabProps>((props, ref) => {\n  const { value, children, onKeyDown, onClick, className, icon, rightSection, color, ...others } =\n    useComponentDefaultProps('TabsTab', defaultProps, props);\n  const ctx = useTabsContext();\n\n  const hasIcon = !!icon;\n  const hasRightSection = !!rightSection;\n\n  const { theme, classes, cx } = useStyles(\n    {\n      withIcon: hasIcon || (hasRightSection && !children),\n      withRightSection: hasRightSection || (hasIcon && !children),\n      orientation: ctx.orientation,\n      color: color || ctx.color,\n      radius: ctx.radius,\n      inverted: ctx.inverted,\n      placement: ctx.placement,\n    },\n    {\n      name: 'Tabs',\n      unstyled: ctx.unstyled,\n      classNames: ctx.classNames,\n      styles: ctx.styles,\n      variant: ctx.variant,\n    }\n  );\n\n  const isActive = value === ctx.value;\n  const activateTab = (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n    ctx.onTabChange(ctx.allowTabDeactivation ? (value === ctx.value ? null : value) : value);\n    onClick?.(event);\n  };\n\n  return (\n    <UnstyledButton<'button'>\n      {...others}\n      unstyled={ctx.unstyled}\n      className={cx(classes.tab, className)}\n      data-active={isActive || undefined}\n      ref={ref}\n      type=\"button\"\n      role=\"tab\"\n      id={ctx.getTabId(value)}\n      aria-selected={isActive}\n      tabIndex={isActive || ctx.value === null ? 0 : -1}\n      aria-controls={ctx.getPanelId(value)}\n      onClick={activateTab}\n      onKeyDown={createScopedKeydownHandler({\n        siblingSelector: '[role=\"tab\"]',\n        parentSelector: '[role=\"tablist\"]',\n        activateOnFocus: ctx.activateTabWithKeyboard,\n        loop: ctx.loop,\n        dir: theme.dir,\n        orientation: ctx.orientation,\n        onKeyDown,\n      })}\n    >\n      {icon && <span className={classes.tabIcon}>{icon}</span>}\n      {children && <span className={classes.tabLabel}>{children}</span>}\n      {rightSection && <span className={classes.tabRightSection}>{rightSection}</span>}\n    </UnstyledButton>\n  );\n});\n\nTab.displayName = '@mantine/core/Tab';\n"],"names":["forwardRef","useComponentDefaultProps","useTabsContext","useStyles","React","UnstyledButton","createScopedKeydownHandler"],"mappings":"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"}

package/cjs/Tabs/Tab/Tab.styles.js

@@ -23,15 +23,15 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-function getVariantStyles(theme, { variant, orientation, color, radius, inverted, placement }) {
+function getVariantStyles(theme, { orientation, color, radius, inverted, placement }, variant) {
   const vertical = orientation === "vertical";
   const filledScheme = theme.fn.variant({ color, variant: "filled" });
-  const radiusValue = theme.fn.radius(radius);
-  const borderRadius = orientation === "vertical" ? placement === "left" ? `${radiusValue}px 0 0 ${radiusValue}px` : ` 0 ${radiusValue}px ${radiusValue}px 0` : inverted ? `0 0 ${radiusValue}px ${radiusValue}px` : `${radiusValue}px ${radiusValue}px 0 0`;
+  const radiusValue = styles.rem(theme.fn.radius(radius));
+  const borderRadius = orientation === "vertical" ? placement === "left" ? `${radiusValue} 0 0 ${radiusValue}` : ` 0 ${radiusValue} ${radiusValue} 0` : inverted ? `0 0 ${radiusValue} ${radiusValue}` : `${radiusValue} ${radiusValue} 0 0`;
   if (variant === "default") {
     return __spreadProps(__spreadValues({
-      [vertical ? placement === "left" ? "borderRight" : "borderLeft" : inverted ? "borderTop" : "borderBottom"]: "2px solid transparent",
-      [vertical ? placement === "left" ? "marginRight" : "marginLeft" : inverted ? "marginTop" : "marginBottom"]: -2,
+      [vertical ? placement === "left" ? "borderRight" : "borderLeft" : inverted ? "borderTop" : "borderBottom"]: `${styles.rem(2)} solid transparent`,
+      [vertical ? placement === "left" ? "marginRight" : "marginLeft" : inverted ? "marginTop" : "marginBottom"]: styles.rem(-2),
       borderRadius
     }, theme.fn.hover({
       backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[6] : theme.colors.gray[0],
@@ -46,7 +46,7 @@ function getVariantStyles(theme, { variant, orientation, color, radius, inverted
   if (variant === "outline") {
     return {
       borderRadius,
-      border: "1px solid transparent",
+      border: `${styles.rem(1)} solid transparent`,
       [vertical ? placement === "left" ? "borderRight" : "borderLeft" : inverted ? "borderTop" : "borderBottom"]: "none",
       "&[data-active]": {
         borderColor: theme.colorScheme === "dark" ? theme.colors.dark[4] : theme.colors.gray[3],
@@ -54,11 +54,11 @@ function getVariantStyles(theme, { variant, orientation, color, radius, inverted
           content: '""',
           backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[7] : theme.white,
           position: "absolute",
-          bottom: vertical ? 0 : inverted ? "unset" : -1,
-          top: vertical ? 0 : inverted ? -1 : "unset",
-          [vertical ? "width" : "height"]: 1,
-          right: vertical ? placement === "left" ? -1 : "unset" : 0,
-          left: vertical ? placement === "left" ? "unset" : -1 : 0
+          bottom: vertical ? 0 : inverted ? "unset" : styles.rem(-1),
+          top: vertical ? 0 : inverted ? styles.rem(-1) : "unset",
+          [vertical ? "width" : "height"]: styles.rem(1),
+          right: vertical ? placement === "left" ? styles.rem(-1) : "unset" : 0,
+          left: vertical ? placement === "left" ? "unset" : styles.rem(-1) : 0
         }
       }
     };
@@ -77,11 +77,11 @@ function getVariantStyles(theme, { variant, orientation, color, radius, inverted
   }
   return {};
 }
-var useStyles = styles.createStyles((theme, params) => ({
+var useStyles = styles.createStyles((theme, params, { variant }) => ({
   tabLabel: {},
   tab: __spreadValues({
     position: "relative",
-    padding: `${theme.spacing.xs}px ${theme.spacing.md}px`,
+    padding: `${theme.spacing.xs} ${theme.spacing.md}`,
     paddingLeft: params.withIcon ? theme.spacing.xs : void 0,
     paddingRight: params.withRightSection ? theme.spacing.xs : void 0,
     fontSize: theme.fontSizes.sm,
@@ -98,13 +98,13 @@ var useStyles = styles.createStyles((theme, params) => ({
     "&:focus": {
       zIndex: 1
     }
-  }, getVariantStyles(theme, params)),
+  }, getVariantStyles(theme, params, variant)),
   tabRightSection: {
     display: "flex",
     justifyContent: "center",
     alignItems: "center",
     "&:not(:only-child)": {
-      marginLeft: 7
+      marginLeft: styles.rem(7)
     }
   },
   tabIcon: {
@@ -112,7 +112,7 @@ var useStyles = styles.createStyles((theme, params) => ({
     justifyContent: "center",
     alignItems: "center",
     "&:not(:only-child)": {
-      marginRight: 7
+      marginRight: styles.rem(7)
     }
   }
 }));