@mantine/core 4.2.3 → 5.0.0-alpha.2

package/esm/components/Badge/Badge.styles.js

@@ -20,26 +20,11 @@ var __spreadValues = (a, b) => {
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 const sizes = {
-  xs: {
-    fontSize: 9,
-    height: 16
-  },
-  sm: {
-    fontSize: 10,
-    height: 18
-  },
-  md: {
-    fontSize: 11,
-    height: 20
-  },
-  lg: {
-    fontSize: 13,
-    height: 26
-  },
-  xl: {
-    fontSize: 16,
-    height: 32
-  }
+  xs: { fontSize: 9, height: 16 },
+  sm: { fontSize: 10, height: 18 },
+  md: { fontSize: 11, height: 20 },
+  lg: { fontSize: 13, height: 26 },
+  xl: { fontSize: 16, height: 32 }
 };
 const dotSizes = {
   xs: 4,
@@ -48,20 +33,34 @@ const dotSizes = {
   lg: 8,
   xl: 10
 };
-const heights = Object.keys(sizes).reduce((acc, key) => {
-  acc[key] = sizes[key].height;
-  return acc;
-}, {});
-var useStyles = createStyles((theme, { color, size, radius, gradientFrom, gradientTo, gradientDeg, fullWidth }) => {
-  const dotSize = theme.fn.size({ size, sizes: dotSizes });
+function getVariantStyles({ theme, variant, color, size, gradient }) {
+  if (variant === "dot") {
+    const dotSize = theme.fn.size({ size, sizes: dotSizes });
+    return {
+      backgroundColor: "transparent",
+      color: theme.colorScheme === "dark" ? theme.colors.dark[0] : theme.colors.gray[7],
+      border: `1px solid ${theme.colorScheme === "dark" ? theme.colors.dark[3] : theme.colors.gray[3]}`,
+      paddingLeft: theme.fn.size({ size, sizes: theme.spacing }) / 1.5 - dotSize / 2,
+      "&::before": {
+        content: '""',
+        display: "block",
+        width: dotSize,
+        height: dotSize,
+        borderRadius: dotSize,
+        backgroundColor: theme.fn.themeColor(color, theme.colorScheme === "dark" ? 4 : theme.fn.primaryShade("light")),
+        marginRight: dotSize
+      }
+    };
+  }
+  const colors = theme.fn.variant({ color, variant, gradient });
+  return {
+    background: colors.background,
+    color: colors.color,
+    border: `${variant === "gradient" ? 0 : 1}px solid ${colors.border}`
+  };
+}
+var useStyles = createStyles((theme, { color, size, radius, gradient, fullWidth, variant }) => {
   const { fontSize, height } = size in sizes ? sizes[size] : sizes.md;
-  const lightColors = theme.fn.variant({ color, variant: "light" });
-  const filledColors = theme.fn.variant({ color, variant: "filled" });
-  const outlineColors = theme.fn.variant({ color, variant: "outline" });
-  const gradientColors = theme.fn.variant({
-    variant: "gradient",
-    gradient: { from: gradientFrom, to: gradientTo, deg: gradientDeg }
-  });
   return {
     leftSection: {
       marginRight: theme.spacing.xs / 2
@@ -74,7 +73,7 @@ var useStyles = createStyles((theme, { color, size, radius, gradientFrom, gradie
       overflow: "hidden",
       textOverflow: "ellipsis"
     },
-    root: __spreadProps(__spreadValues(__spreadValues({}, theme.fn.focusStyles()), theme.fn.fontStyles()), {
+    root: __spreadValues(__spreadProps(__spreadValues(__spreadValues({}, theme.fn.focusStyles()), theme.fn.fontStyles()), {
       fontSize,
       height,
       WebkitTapHighlightColor: "transparent",
@@ -93,45 +92,9 @@ var useStyles = createStyles((theme, { color, size, radius, gradientFrom, gradie
       cursor: "default",
       textOverflow: "ellipsis",
       overflow: "hidden"
-    }),
-    light: {
-      backgroundColor: lightColors.background,
-      color: lightColors.color,
-      border: "1px solid transparent"
-    },
-    filled: {
-      backgroundColor: filledColors.background,
-      color: filledColors.color,
-      border: "1px solid transparent"
-    },
-    outline: {
-      backgroundColor: outlineColors.background,
-      color: outlineColors.color,
-      border: `1px solid ${outlineColors.border}`
-    },
-    gradient: {
-      backgroundImage: gradientColors.background,
-      color: gradientColors.color,
-      border: 0
-    },
-    dot: {
-      backgroundColor: "transparent",
-      color: theme.colorScheme === "dark" ? theme.colors.dark[0] : theme.colors.gray[7],
-      border: `1px solid ${theme.colorScheme === "dark" ? theme.colors.dark[3] : theme.colors.gray[3]}`,
-      paddingLeft: theme.fn.size({ size, sizes: theme.spacing }) / 1.5 - dotSize / 2,
-      "&::before": {
-        content: '""',
-        display: "block",
-        width: dotSize,
-        height: dotSize,
-        borderRadius: dotSize,
-        backgroundColor: theme.fn.themeColor(color, theme.colorScheme === "dark" ? 4 : theme.fn.primaryShade("light")),
-        marginRight: dotSize
-      }
-    }
+    }), getVariantStyles({ theme, variant, color, size, gradient }))
   };
 });
 
 export default useStyles;
-export { heights };
 //# sourceMappingURL=Badge.styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Badge.styles.js","sources":["../../../src/components/Badge/Badge.styles.ts"],"sourcesContent":["import { createStyles, MantineSize, MantineNumberSize, MantineColor } from '@mantine/styles';\n\nexport interface BadgeStylesParams {\n  color: MantineColor;\n  size: MantineSize;\n  radius: MantineNumberSize;\n  gradientFrom: string;\n  gradientTo: string;\n  gradientDeg: number;\n  fullWidth: boolean;\n}\n\nconst sizes = {\n  xs: {\n    fontSize: 9,\n    height: 16,\n  },\n  sm: {\n    fontSize: 10,\n    height: 18,\n  },\n  md: {\n    fontSize: 11,\n    height: 20,\n  },\n  lg: {\n    fontSize: 13,\n    height: 26,\n  },\n  xl: {\n    fontSize: 16,\n    height: 32,\n  },\n} as const;\n\nconst dotSizes = {\n  xs: 4,\n  sm: 4,\n  md: 6,\n  lg: 8,\n  xl: 10,\n};\n\nexport const heights = Object.keys(sizes).reduce((acc, key) => {\n  acc[key] = sizes[key].height;\n  return acc;\n}, {} as Record<MantineSize, number>);\n\nexport default createStyles(\n  (\n    theme,\n    { color, size, radius, gradientFrom, gradientTo, gradientDeg, fullWidth }: BadgeStylesParams\n  ) => {\n    const dotSize = theme.fn.size({ size, sizes: dotSizes });\n    const { fontSize, height } = size in sizes ? sizes[size] : sizes.md;\n    const lightColors = theme.fn.variant({ color, variant: 'light' });\n    const filledColors = theme.fn.variant({ color, variant: 'filled' });\n    const outlineColors = theme.fn.variant({ color, variant: 'outline' });\n    const gradientColors = theme.fn.variant({\n      variant: 'gradient',\n      gradient: { from: gradientFrom, to: gradientTo, deg: gradientDeg },\n    });\n\n    return {\n      leftSection: {\n        marginRight: theme.spacing.xs / 2,\n      },\n\n      rightSection: {\n        marginLeft: theme.spacing.xs / 2,\n      },\n\n      inner: {\n        whiteSpace: 'nowrap',\n        overflow: 'hidden',\n        textOverflow: 'ellipsis',\n      },\n\n      root: {\n        ...theme.fn.focusStyles(),\n        ...theme.fn.fontStyles(),\n        fontSize,\n        height,\n        WebkitTapHighlightColor: 'transparent',\n        lineHeight: `${height - 2}px`,\n        textDecoration: 'none',\n        padding: `0 ${theme.fn.size({ size, sizes: theme.spacing }) / 1.5}px`,\n        boxSizing: 'border-box',\n        display: fullWidth ? 'flex' : 'inline-flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        width: fullWidth ? '100%' : 'auto',\n        textTransform: 'uppercase',\n        borderRadius: theme.fn.radius(radius),\n        fontWeight: 700,\n        letterSpacing: 0.25,\n        cursor: 'default',\n        textOverflow: 'ellipsis',\n        overflow: 'hidden',\n      },\n\n      light: {\n        backgroundColor: lightColors.background,\n        color: lightColors.color,\n        border: '1px solid transparent',\n      },\n\n      filled: {\n        backgroundColor: filledColors.background,\n        color: filledColors.color,\n        border: '1px solid transparent',\n      },\n\n      outline: {\n        backgroundColor: outlineColors.background,\n        color: outlineColors.color,\n        border: `1px solid ${outlineColors.border}`,\n      },\n\n      gradient: {\n        backgroundImage: gradientColors.background,\n        color: gradientColors.color,\n        border: 0,\n      },\n\n      dot: {\n        backgroundColor: 'transparent',\n        color: theme.colorScheme === 'dark' ? theme.colors.dark[0] : theme.colors.gray[7],\n        border: `1px solid ${\n          theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[3]\n        }`,\n        paddingLeft: theme.fn.size({ size, sizes: theme.spacing }) / 1.5 - dotSize / 2,\n\n        '&::before': {\n          content: '\"\"',\n          display: 'block',\n          width: dotSize,\n          height: dotSize,\n          borderRadius: dotSize,\n          backgroundColor: theme.fn.themeColor(\n            color,\n            theme.colorScheme === 'dark' ? 4 : theme.fn.primaryShade('light')\n          ),\n          marginRight: dotSize,\n        },\n      },\n    };\n  }\n);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Badge.styles.js","sources":["../../../src/components/Badge/Badge.styles.ts"],"sourcesContent":["import {\n  createStyles,\n  MantineSize,\n  MantineNumberSize,\n  MantineColor,\n  MantineGradient,\n  MantineTheme,\n} from '@mantine/styles';\n\nexport type BadgeVariant = 'light' | 'filled' | 'outline' | 'dot' | 'gradient';\n\nexport interface BadgeStylesParams {\n  color: MantineColor;\n  size: MantineSize;\n  radius: MantineNumberSize;\n  gradient: MantineGradient;\n  variant: BadgeVariant;\n  fullWidth: boolean;\n}\n\nconst sizes = {\n  xs: { fontSize: 9, height: 16 },\n  sm: { fontSize: 10, height: 18 },\n  md: { fontSize: 11, height: 20 },\n  lg: { fontSize: 13, height: 26 },\n  xl: { fontSize: 16, height: 32 },\n};\n\nconst dotSizes = {\n  xs: 4,\n  sm: 4,\n  md: 6,\n  lg: 8,\n  xl: 10,\n};\n\ninterface GetVariantStylesInput {\n  theme: MantineTheme;\n  variant: BadgeVariant;\n  color: MantineColor;\n  size: MantineSize;\n  gradient: MantineGradient;\n}\n\nfunction getVariantStyles({ theme, variant, color, size, gradient }: GetVariantStylesInput) {\n  if (variant === 'dot') {\n    const dotSize = theme.fn.size({ size, sizes: dotSizes });\n    return {\n      backgroundColor: 'transparent',\n      color: theme.colorScheme === 'dark' ? theme.colors.dark[0] : theme.colors.gray[7],\n      border: `1px solid ${\n        theme.colorScheme === 'dark' ? theme.colors.dark[3] : theme.colors.gray[3]\n      }`,\n      paddingLeft: theme.fn.size({ size, sizes: theme.spacing }) / 1.5 - dotSize / 2,\n\n      '&::before': {\n        content: '\"\"',\n        display: 'block',\n        width: dotSize,\n        height: dotSize,\n        borderRadius: dotSize,\n        backgroundColor: theme.fn.themeColor(\n          color,\n          theme.colorScheme === 'dark' ? 4 : theme.fn.primaryShade('light')\n        ),\n        marginRight: dotSize,\n      },\n    };\n  }\n\n  const colors = theme.fn.variant({ color, variant, gradient });\n\n  return {\n    background: colors.background,\n    color: colors.color,\n    border: `${variant === 'gradient' ? 0 : 1}px solid ${colors.border}`,\n  };\n}\n\nexport default createStyles(\n  (theme, { color, size, radius, gradient, fullWidth, variant }: BadgeStylesParams) => {\n    const { fontSize, height } = size in sizes ? sizes[size] : sizes.md;\n\n    return {\n      leftSection: {\n        marginRight: theme.spacing.xs / 2,\n      },\n\n      rightSection: {\n        marginLeft: theme.spacing.xs / 2,\n      },\n\n      inner: {\n        whiteSpace: 'nowrap',\n        overflow: 'hidden',\n        textOverflow: 'ellipsis',\n      },\n\n      root: {\n        ...theme.fn.focusStyles(),\n        ...theme.fn.fontStyles(),\n        fontSize,\n        height,\n        WebkitTapHighlightColor: 'transparent',\n        lineHeight: `${height - 2}px`,\n        textDecoration: 'none',\n        padding: `0 ${theme.fn.size({ size, sizes: theme.spacing }) / 1.5}px`,\n        boxSizing: 'border-box',\n        display: fullWidth ? 'flex' : 'inline-flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        width: fullWidth ? '100%' : 'auto',\n        textTransform: 'uppercase',\n        borderRadius: theme.fn.radius(radius),\n        fontWeight: 700,\n        letterSpacing: 0.25,\n        cursor: 'default',\n        textOverflow: 'ellipsis',\n        overflow: 'hidden',\n        ...getVariantStyles({ theme, variant, color, size, gradient }),\n      },\n    };\n  }\n);\n"],"names":[],"mappings":";;AAAA,IAAI,SAAS,GAAG,MAAM,CAAC,cAAc,CAAC;AACtC,IAAI,UAAU,GAAG,MAAM,CAAC,gBAAgB,CAAC;AACzC,IAAI,iBAAiB,GAAG,MAAM,CAAC,yBAAyB,CAAC;AACzD,IAAI,mBAAmB,GAAG,MAAM,CAAC,qBAAqB,CAAC;AACvD,IAAI,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC;AACnD,IAAI,YAAY,GAAG,MAAM,CAAC,SAAS,CAAC,oBAAoB,CAAC;AACzD,IAAI,eAAe,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,KAAK,GAAG,IAAI,GAAG,GAAG,SAAS,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,GAAG,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AAChK,IAAI,cAAc,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK;AAC/B,EAAE,KAAK,IAAI,IAAI,IAAI,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC;AAChC,IAAI,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC;AAClC,MAAM,eAAe,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AACxC,EAAE,IAAI,mBAAmB;AACzB,IAAI,KAAK,IAAI,IAAI,IAAI,mBAAmB,CAAC,CAAC,CAAC,EAAE;AAC7C,MAAM,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC;AACpC,QAAQ,eAAe,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AAC1C,KAAK;AACL,EAAE,OAAO,CAAC,CAAC;AACX,CAAC,CAAC;AACF,IAAI,aAAa,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK,UAAU,CAAC,CAAC,EAAE,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC;AAIlE,MAAM,KAAK,GAAG;AACd,EAAE,EAAE,EAAE,EAAE,QAAQ,EAAE,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE;AACjC,EAAE,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE;AAClC,EAAE,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE;AAClC,EAAE,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE;AAClC,EAAE,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE;AAClC,CAAC,CAAC;AACF,MAAM,QAAQ,GAAG;AACjB,EAAE,EAAE,EAAE,CAAC;AACP,EAAE,EAAE,EAAE,CAAC;AACP,EAAE,EAAE,EAAE,CAAC;AACP,EAAE,EAAE,EAAE,CAAC;AACP,EAAE,EAAE,EAAE,EAAE;AACR,CAAC,CAAC;AACF,SAAS,gBAAgB,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;AACrE,EAAE,IAAI,OAAO,KAAK,KAAK,EAAE;AACzB,IAAI,MAAM,OAAO,GAAG,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC;AAC7D,IAAI,OAAO;AACX,MAAM,eAAe,EAAE,aAAa;AACpC,MAAM,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;AACvF,MAAM,MAAM,EAAE,CAAC,UAAU,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;AACvG,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC,GAAG,GAAG,GAAG,OAAO,GAAG,CAAC;AACpF,MAAM,WAAW,EAAE;AACnB,QAAQ,OAAO,EAAE,IAAI;AACrB,QAAQ,OAAO,EAAE,OAAO;AACxB,QAAQ,KAAK,EAAE,OAAO;AACtB,QAAQ,MAAM,EAAE,OAAO;AACvB,QAAQ,YAAY,EAAE,OAAO;AAC7B,QAAQ,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,CAAC,GAAG,KAAK,CAAC,EAAE,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;AACtH,QAAQ,WAAW,EAAE,OAAO;AAC5B,OAAO;AACP,KAAK,CAAC;AACN,GAAG;AACH,EAAE,MAAM,MAAM,GAAG,KAAK,CAAC,EAAE,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,CAAC,CAAC;AAChE,EAAE,OAAO;AACT,IAAI,UAAU,EAAE,MAAM,CAAC,UAAU;AACjC,IAAI,KAAK,EAAE,MAAM,CAAC,KAAK;AACvB,IAAI,MAAM,EAAE,CAAC,EAAE,OAAO,KAAK,UAAU,GAAG,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;AACxE,GAAG,CAAC;AACJ,CAAC;AACD,gBAAe,YAAY,CAAC,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK;AAC9F,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,IAAI,IAAI,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,EAAE,CAAC;AACtE,EAAE,OAAO;AACT,IAAI,WAAW,EAAE;AACjB,MAAM,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC;AACvC,KAAK;AACL,IAAI,YAAY,EAAE;AAClB,MAAM,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC;AACtC,KAAK;AACL,IAAI,KAAK,EAAE;AACX,MAAM,UAAU,EAAE,QAAQ;AAC1B,MAAM,QAAQ,EAAE,QAAQ;AACxB,MAAM,YAAY,EAAE,UAAU;AAC9B,KAAK;AACL,IAAI,IAAI,EAAE,cAAc,CAAC,aAAa,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,EAAE,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,EAAE,CAAC,EAAE;AAC1H,MAAM,QAAQ;AACd,MAAM,MAAM;AACZ,MAAM,uBAAuB,EAAE,aAAa;AAC5C,MAAM,UAAU,EAAE,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,EAAE,CAAC;AACnC,MAAM,cAAc,EAAE,MAAM;AAC5B,MAAM,OAAO,EAAE,CAAC,EAAE,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC,GAAG,GAAG,CAAC,EAAE,CAAC;AAC3E,MAAM,SAAS,EAAE,YAAY;AAC7B,MAAM,OAAO,EAAE,SAAS,GAAG,MAAM,GAAG,aAAa;AACjD,MAAM,UAAU,EAAE,QAAQ;AAC1B,MAAM,cAAc,EAAE,QAAQ;AAC9B,MAAM,KAAK,EAAE,SAAS,GAAG,MAAM,GAAG,MAAM;AACxC,MAAM,aAAa,EAAE,WAAW;AAChC,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,MAAM,CAAC,MAAM,CAAC;AAC3C,MAAM,UAAU,EAAE,GAAG;AACrB,MAAM,aAAa,EAAE,IAAI;AACzB,MAAM,MAAM,EAAE,SAAS;AACvB,MAAM,YAAY,EAAE,UAAU;AAC9B,MAAM,QAAQ,EAAE,QAAQ;AACxB,KAAK,CAAC,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;AACpE,GAAG,CAAC;AACJ,CAAC,CAAC;;;;"}

package/esm/components/Blockquote/Blockquote.js.map

@@ -1 +1 @@
-{"version":3,"file":"Blockquote.js","sources":["../../../src/components/Blockquote/Blockquote.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, MantineColor, Selectors, useMantineDefaultProps } from '@mantine/styles';\nimport { Box } from '../Box';\nimport { QuoteIcon } from './QuoteIcon';\nimport useStyles from './Blockquote.styles';\n\nexport type BlockquoteStylesNames = Selectors<typeof useStyles>;\n\nexport interface BlockquoteProps\n  extends DefaultProps<BlockquoteStylesNames>,\n    Omit<React.ComponentPropsWithoutRef<'blockquote'>, 'cite'> {\n  /** Icon color from theme */\n  color?: MantineColor;\n\n  /** Icon, defaults to quote icon */\n  icon?: React.ReactNode;\n\n  /** Describe a reference to a cited quote */\n  cite?: React.ReactNode;\n}\n\nconst defaultProps: Partial<BlockquoteProps> = {\n  color: 'gray',\n  icon: <QuoteIcon />,\n};\n\nexport const Blockquote = forwardRef<HTMLQuoteElement, BlockquoteProps>(\n  (props: BlockquoteProps, ref) => {\n    const { className, color, icon, cite, children, classNames, styles, ...others } =\n      useMantineDefaultProps('Blockquote', defaultProps, props);\n    const { classes, cx } = useStyles({ color }, { classNames, styles, name: 'Blockquote' });\n\n    return (\n      <Box component=\"blockquote\" className={cx(classes.root, className)} ref={ref} {...others}>\n        <div className={classes.inner}>\n          {icon && <div className={classes.icon}>{icon}</div>}\n          <div className={classes.body}>\n            {children}\n            {cite && <cite className={classes.cite}>{cite}</cite>}\n          </div>\n        </div>\n      </Box>\n    );\n  }\n);\n\nBlockquote.displayName = '@mantine/core/Blockquote';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Blockquote.js","sources":["../../../src/components/Blockquote/Blockquote.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, MantineColor, Selectors, useMantineDefaultProps } from '@mantine/styles';\nimport { Box } from '../Box';\nimport { QuoteIcon } from './QuoteIcon';\nimport useStyles, { BlockquoteStylesParams } from './Blockquote.styles';\n\nexport type BlockquoteStylesNames = Selectors<typeof useStyles>;\n\nexport interface BlockquoteProps\n  extends DefaultProps<BlockquoteStylesNames, BlockquoteStylesParams>,\n    Omit<React.ComponentPropsWithoutRef<'blockquote'>, 'cite'> {\n  /** Icon color from theme */\n  color?: MantineColor;\n\n  /** Icon, defaults to quote icon */\n  icon?: React.ReactNode;\n\n  /** Describe a reference to a cited quote */\n  cite?: React.ReactNode;\n}\n\nconst defaultProps: Partial<BlockquoteProps> = {\n  color: 'gray',\n  icon: <QuoteIcon />,\n};\n\nexport const Blockquote = forwardRef<HTMLQuoteElement, BlockquoteProps>(\n  (props: BlockquoteProps, ref) => {\n    const { className, color, icon, cite, children, classNames, styles, ...others } =\n      useMantineDefaultProps('Blockquote', defaultProps, props);\n    const { classes, cx } = useStyles({ color }, { classNames, styles, name: 'Blockquote' });\n\n    return (\n      <Box component=\"blockquote\" className={cx(classes.root, className)} ref={ref} {...others}>\n        <div className={classes.inner}>\n          {icon && <div className={classes.icon}>{icon}</div>}\n          <div className={classes.body}>\n            {children}\n            {cite && <cite className={classes.cite}>{cite}</cite>}\n          </div>\n        </div>\n      </Box>\n    );\n  }\n);\n\nBlockquote.displayName = '@mantine/core/Blockquote';\n"],"names":[],"mappings":"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"}

package/esm/components/Box/Box.js

@@ -1,5 +1,6 @@
 import React, { forwardRef } from 'react';
 import { extractSystemStyles } from '@mantine/styles';
+import { createPolymorphicComponent } from '@mantine/utils';
 import { useSx } from './use-sx/use-sx.js';
 
 var __defProp = Object.defineProperty;
@@ -30,7 +31,7 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-const Box = forwardRef((_a, ref) => {
+const _Box = forwardRef((_a, ref) => {
   var _b = _a, { className, component, style, sx } = _b, others = __objRest(_b, ["className", "component", "style", "sx"]);
   const { systemStyles, rest } = extractSystemStyles(others);
   const Element = component || "div";
@@ -40,7 +41,8 @@ const Box = forwardRef((_a, ref) => {
     style
   }, rest));
 });
-Box.displayName = "@mantine/core/Box";
+_Box.displayName = "@mantine/core/Box";
+const Box = createPolymorphicComponent(_Box);
 
-export { Box };
+export { Box, _Box };
 //# sourceMappingURL=Box.js.map

package/esm/components/Box/Box.js.map

@@ -1 +1 @@
-{"version":3,"file":"Box.js","sources":["../../../src/components/Box/Box.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport {\n  DefaultProps,\n  PolymorphicComponentProps,\n  PolymorphicRef,\n  extractSystemStyles,\n} from '@mantine/styles';\nimport { useSx, BoxSx } from './use-sx/use-sx';\n\ninterface _BoxProps extends Omit<DefaultProps, 'sx'> {\n  sx?: BoxSx;\n}\n\nexport type BoxProps<C> = PolymorphicComponentProps<C, _BoxProps>;\n\ntype BoxComponent = (<C = 'div'>(props: BoxProps<C>) => React.ReactElement) & {\n  displayName?: string;\n};\n\nexport const Box: BoxComponent = forwardRef(\n  ({ className, component, style, sx, ...others }: BoxProps<'div'>, ref: PolymorphicRef<'div'>) => {\n    const { systemStyles, rest } = extractSystemStyles(others);\n    const Element = component || 'div';\n    return (\n      <Element ref={ref} className={useSx(sx, systemStyles, className)} style={style} {...rest} />\n    );\n  }\n) as any;\n\nBox.displayName = '@mantine/core/Box';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Box.js","sources":["../../../src/components/Box/Box.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, extractSystemStyles } from '@mantine/styles';\nimport { createPolymorphicComponent } from '@mantine/utils';\nimport { useSx } from './use-sx/use-sx';\n\nexport interface BoxProps extends DefaultProps {\n  children?: React.ReactNode;\n}\n\nexport const _Box = forwardRef<HTMLDivElement, BoxProps & { component: any }>(\n  ({ className, component, style, sx, ...others }, ref) => {\n    const { systemStyles, rest } = extractSystemStyles(others);\n    const Element = component || 'div';\n    return (\n      <Element ref={ref} className={useSx(sx, systemStyles, className)} style={style} {...rest} />\n    );\n  }\n);\n\n_Box.displayName = '@mantine/core/Box';\n\nexport const Box = createPolymorphicComponent<'div', BoxProps>(_Box);\n"],"names":[],"mappings":"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"}

package/esm/components/Box/use-sx/use-sx.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-sx.js","sources":["../../../../src/components/Box/use-sx/use-sx.ts"],"sourcesContent":["import {\n  CSSObject,\n  MantineStyleSystemProps,\n  MantineTheme,\n  useCss,\n  useMantineTheme,\n} from '@mantine/styles';\nimport { getSystemStyles } from './get-system-styles/get-system-styles';\n\ntype Sx = CSSObject | ((theme: MantineTheme) => CSSObject);\nexport type BoxSx = Sx | Sx[];\n\nfunction extractSx(sx: Sx, theme: MantineTheme) {\n  return typeof sx === 'function' ? sx(theme) : sx;\n}\n\nexport function useSx(sx: BoxSx, systemProps: MantineStyleSystemProps, className: string) {\n  const theme = useMantineTheme();\n  const { css, cx } = useCss();\n\n  if (Array.isArray(sx)) {\n    return cx(\n      className,\n      css(getSystemStyles(systemProps, theme)),\n      sx.map((partial) => css(extractSx(partial, theme)))\n    );\n  }\n\n  return cx(className, css(extractSx(sx, theme)), css(getSystemStyles(systemProps, theme)));\n}\n"],"names":[],"mappings":";;;AAKA,SAAS,SAAS,CAAC,EAAE,EAAE,KAAK,EAAE;AAC9B,EAAE,OAAO,OAAO,EAAE,KAAK,UAAU,GAAG,EAAE,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC;AACnD,CAAC;AACM,SAAS,KAAK,CAAC,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE;AAClD,EAAE,MAAM,KAAK,GAAG,eAAe,EAAE,CAAC;AAClC,EAAE,MAAM,EAAE,GAAG,EAAE,EAAE,EAAE,GAAG,MAAM,EAAE,CAAC;AAC/B,EAAE,IAAI,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;AACzB,IAAI,OAAO,EAAE,CAAC,SAAS,EAAE,GAAG,CAAC,eAAe,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,GAAG,CAAC,CAAC,OAAO,KAAK,GAAG,CAAC,SAAS,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;AACxH,GAAG;AACH,EAAE,OAAO,EAAE,CAAC,SAAS,EAAE,GAAG,CAAC,SAAS,CAAC,EAAE,EAAE,KAAK,CAAC,CAAC,EAAE,GAAG,CAAC,eAAe,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC;AAC5F;;;;"}
+{"version":3,"file":"use-sx.js","sources":["../../../../src/components/Box/use-sx/use-sx.ts"],"sourcesContent":["import {\n  MantineStyleSystemProps,\n  MantineTheme,\n  Sx,\n  useCss,\n  useMantineTheme,\n} from '@mantine/styles';\nimport { getSystemStyles } from './get-system-styles/get-system-styles';\n\nfunction extractSx(sx: Sx, theme: MantineTheme) {\n  return typeof sx === 'function' ? sx(theme) : sx;\n}\n\nexport function useSx(sx: Sx | Sx[], systemProps: MantineStyleSystemProps, className: string) {\n  const theme = useMantineTheme();\n  const { css, cx } = useCss();\n\n  if (Array.isArray(sx)) {\n    return cx(\n      className,\n      css(getSystemStyles(systemProps, theme)),\n      sx.map((partial) => css(extractSx(partial, theme)))\n    );\n  }\n\n  return cx(className, css(extractSx(sx, theme)), css(getSystemStyles(systemProps, theme)));\n}\n"],"names":[],"mappings":";;;AAKA,SAAS,SAAS,CAAC,EAAE,EAAE,KAAK,EAAE;AAC9B,EAAE,OAAO,OAAO,EAAE,KAAK,UAAU,GAAG,EAAE,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC;AACnD,CAAC;AACM,SAAS,KAAK,CAAC,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE;AAClD,EAAE,MAAM,KAAK,GAAG,eAAe,EAAE,CAAC;AAClC,EAAE,MAAM,EAAE,GAAG,EAAE,EAAE,EAAE,GAAG,MAAM,EAAE,CAAC;AAC/B,EAAE,IAAI,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;AACzB,IAAI,OAAO,EAAE,CAAC,SAAS,EAAE,GAAG,CAAC,eAAe,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,GAAG,CAAC,CAAC,OAAO,KAAK,GAAG,CAAC,SAAS,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;AACxH,GAAG;AACH,EAAE,OAAO,EAAE,CAAC,SAAS,EAAE,GAAG,CAAC,SAAS,CAAC,EAAE,EAAE,KAAK,CAAC,CAAC,EAAE,GAAG,CAAC,eAAe,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC;AAC5F;;;;"}

package/esm/components/Breadcrumbs/Breadcrumbs.js

@@ -1,5 +1,6 @@
 import React, { forwardRef } from 'react';
 import { useMantineDefaultProps } from '@mantine/styles';
+import { isElement } from '@mantine/utils';
 import useStyles from './Breadcrumbs.styles.js';
 import { Text } from '../Text/Text.js';
 import { Box } from '../Box/Box.js';
@@ -39,7 +40,15 @@ const Breadcrumbs = forwardRef((props, ref) => {
   const _a = useMantineDefaultProps("Breadcrumbs", defaultProps, props), { className, children, separator, classNames, styles } = _a, others = __objRest(_a, ["className", "children", "separator", "classNames", "styles"]);
   const { classes, cx } = useStyles(null, { classNames, styles, name: "Breadcrumbs" });
   const items = React.Children.toArray(children).reduce((acc, child, index, array) => {
-    acc.push(React.cloneElement(child, { className: classes.breadcrumb, key: index }));
+    var _a2;
+    const item = isElement(child) ? React.cloneElement(child, {
+      className: cx(classes.breadcrumb, (_a2 = child.props) == null ? void 0 : _a2.className),
+      key: index
+    }) : /* @__PURE__ */ React.createElement("div", {
+      className: classes.breadcrumb,
+      key: index
+    }, child);
+    acc.push(item);
     if (index !== array.length - 1) {
       acc.push(/* @__PURE__ */ React.createElement(Text, {
         size: "sm",

package/esm/components/Breadcrumbs/Breadcrumbs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumbs.js","sources":["../../../src/components/Breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, Selectors, useMantineDefaultProps } from '@mantine/styles';\nimport { Text } from '../Text';\nimport { Box } from '../Box';\nimport useStyles from './Breadcrumbs.styles';\n\nexport type BreadcrumbsStylesNames = Selectors<typeof useStyles>;\n\nexport interface BreadcrumbsProps\n  extends DefaultProps<BreadcrumbsStylesNames>,\n    React.ComponentPropsWithoutRef<'div'> {\n  /** Separator between breadcrumbs */\n  separator?: React.ReactNode;\n\n  /** React nodes that should be separated */\n  children: React.ReactNode;\n}\n\nconst defaultProps: Partial<BreadcrumbsProps> = {\n  separator: '/',\n};\n\nexport const Breadcrumbs = forwardRef<HTMLDivElement, BreadcrumbsProps>(\n  (props: BreadcrumbsProps, ref) => {\n    const { className, children, separator, classNames, styles, ...others } =\n      useMantineDefaultProps('Breadcrumbs', defaultProps, props);\n\n    const { classes, cx } = useStyles(null, { classNames, styles, name: 'Breadcrumbs' });\n\n    const items = React.Children.toArray(children).reduce(\n      (acc: any[], child: any, index, array) => {\n        acc.push(React.cloneElement(child, { className: classes.breadcrumb, key: index }));\n\n        if (index !== array.length - 1) {\n          acc.push(\n            <Text size=\"sm\" className={classes.separator} key={`separator-${index}`}>\n              {separator}\n            </Text>\n          );\n        }\n\n        return acc;\n      },\n      []\n    );\n\n    return (\n      <Box className={cx(classes.root, className)} ref={ref} {...others}>\n        {items}\n      </Box>\n    );\n  }\n);\n\nBreadcrumbs.displayName = '@mantine/core/Breadcrumbs';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Breadcrumbs.js","sources":["../../../src/components/Breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { DefaultProps, Selectors, useMantineDefaultProps } from '@mantine/styles';\nimport { isElement } from '@mantine/utils';\nimport { Text } from '../Text';\nimport { Box } from '../Box';\nimport useStyles from './Breadcrumbs.styles';\n\nexport type BreadcrumbsStylesNames = Selectors<typeof useStyles>;\n\nexport interface BreadcrumbsProps\n  extends DefaultProps<BreadcrumbsStylesNames>,\n    React.ComponentPropsWithoutRef<'div'> {\n  /** Separator between breadcrumbs */\n  separator?: React.ReactNode;\n\n  /** React nodes that should be separated */\n  children: React.ReactNode;\n}\n\nconst defaultProps: Partial<BreadcrumbsProps> = {\n  separator: '/',\n};\n\nexport const Breadcrumbs = forwardRef<HTMLDivElement, BreadcrumbsProps>(\n  (props: BreadcrumbsProps, ref) => {\n    const { className, children, separator, classNames, styles, ...others } =\n      useMantineDefaultProps('Breadcrumbs', defaultProps, props);\n\n    const { classes, cx } = useStyles(null, { classNames, styles, name: 'Breadcrumbs' });\n\n    const items = React.Children.toArray(children).reduce(\n      (acc: React.ReactNode[], child: React.ReactElement, index, array) => {\n        const item = isElement(child) ? (\n          React.cloneElement(child, {\n            className: cx(classes.breadcrumb, child.props?.className),\n            key: index,\n          })\n        ) : (\n          <div className={classes.breadcrumb} key={index}>\n            {child}\n          </div>\n        );\n\n        acc.push(item);\n\n        if (index !== array.length - 1) {\n          acc.push(\n            <Text size=\"sm\" className={classes.separator} key={`separator-${index}`}>\n              {separator}\n            </Text>\n          );\n        }\n\n        return acc;\n      },\n      []\n    );\n\n    return (\n      <Box className={cx(classes.root, className)} ref={ref} {...others}>\n        {items}\n      </Box>\n    );\n  }\n);\n\nBreadcrumbs.displayName = '@mantine/core/Breadcrumbs';\n"],"names":[],"mappings":"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"}

package/esm/components/Breadcrumbs/Breadcrumbs.styles.js

@@ -2,7 +2,8 @@ import { createStyles } from '@mantine/styles';
 
 var useStyles = createStyles((theme) => ({
   root: {
-    display: "flex"
+    display: "flex",
+    alignItems: "center"
   },
   breadcrumb: {
     lineHeight: 1,

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

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumbs.styles.js","sources":["../../../src/components/Breadcrumbs/Breadcrumbs.styles.ts"],"sourcesContent":["import { createStyles } from '@mantine/styles';\n\nexport default createStyles((theme) => ({\n  root: {\n    display: 'flex',\n  },\n\n  breadcrumb: {\n    lineHeight: 1,\n    whiteSpace: 'nowrap',\n    WebkitTapHighlightColor: 'transparent',\n  },\n\n  separator: {\n    marginLeft: theme.spacing.xs,\n    marginRight: theme.spacing.xs,\n    color: theme.colorScheme === 'dark' ? theme.colors.dark[2] : theme.colors.gray[7],\n    lineHeight: 1,\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n}));\n"],"names":[],"mappings":";;AACA,gBAAe,YAAY,CAAC,CAAC,KAAK,MAAM;AACxC,EAAE,IAAI,EAAE;AACR,IAAI,OAAO,EAAE,MAAM;AACnB,GAAG;AACH,EAAE,UAAU,EAAE;AACd,IAAI,UAAU,EAAE,CAAC;AACjB,IAAI,UAAU,EAAE,QAAQ;AACxB,IAAI,uBAAuB,EAAE,aAAa;AAC1C,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE;AAChC,IAAI,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE;AACjC,IAAI,KAAK,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;AACrF,IAAI,UAAU,EAAE,CAAC;AACjB,IAAI,OAAO,EAAE,MAAM;AACnB,IAAI,UAAU,EAAE,QAAQ;AACxB,IAAI,cAAc,EAAE,QAAQ;AAC5B,GAAG;AACH,CAAC,CAAC,CAAC;;;;"}
+{"version":3,"file":"Breadcrumbs.styles.js","sources":["../../../src/components/Breadcrumbs/Breadcrumbs.styles.ts"],"sourcesContent":["import { createStyles } from '@mantine/styles';\n\nexport default createStyles((theme) => ({\n  root: {\n    display: 'flex',\n    alignItems: 'center',\n  },\n\n  breadcrumb: {\n    lineHeight: 1,\n    whiteSpace: 'nowrap',\n    WebkitTapHighlightColor: 'transparent',\n  },\n\n  separator: {\n    marginLeft: theme.spacing.xs,\n    marginRight: theme.spacing.xs,\n    color: theme.colorScheme === 'dark' ? theme.colors.dark[2] : theme.colors.gray[7],\n    lineHeight: 1,\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n}));\n"],"names":[],"mappings":";;AACA,gBAAe,YAAY,CAAC,CAAC,KAAK,MAAM;AACxC,EAAE,IAAI,EAAE;AACR,IAAI,OAAO,EAAE,MAAM;AACnB,IAAI,UAAU,EAAE,QAAQ;AACxB,GAAG;AACH,EAAE,UAAU,EAAE;AACd,IAAI,UAAU,EAAE,CAAC;AACjB,IAAI,UAAU,EAAE,QAAQ;AACxB,IAAI,uBAAuB,EAAE,aAAa;AAC1C,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE;AAChC,IAAI,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE;AACjC,IAAI,KAAK,EAAE,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;AACrF,IAAI,UAAU,EAAE,CAAC;AACjB,IAAI,OAAO,EAAE,MAAM;AACnB,IAAI,UAAU,EAAE,QAAQ;AACxB,IAAI,cAAc,EAAE,QAAQ;AAC5B,GAAG;AACH,CAAC,CAAC,CAAC;;;;"}

package/esm/components/Burger/Burger.js

@@ -1,7 +1,7 @@
 import React, { forwardRef } from 'react';
-import { useMantineDefaultProps, useMantineTheme } from '@mantine/styles';
+import { useMantineDefaultProps } from '@mantine/styles';
 import useStyles from './Burger.styles.js';
-import { UnstyledButton } from '../Button/UnstyledButton/UnstyledButton.js';
+import { UnstyledButton } from '../UnstyledButton/UnstyledButton.js';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
@@ -32,32 +32,18 @@ var __objRest = (source, exclude) => {
   return target;
 };
 const defaultProps = {
-  size: "md"
+  size: "md",
+  transitionDuration: 300
 };
 const Burger = forwardRef((props, ref) => {
-  const _a = useMantineDefaultProps("Burger", defaultProps, props), {
-    className,
-    opened,
-    color,
-    size = "md",
-    classNames,
-    styles
-  } = _a, others = __objRest(_a, [
-    "className",
-    "opened",
-    "color",
-    "size",
-    "classNames",
-    "styles"
-  ]);
-  const theme = useMantineTheme();
-  const _color = color || (theme.colorScheme === "dark" ? theme.white : theme.black);
-  const { classes, cx } = useStyles({ color: _color, size }, { classNames, styles, name: "Burger" });
+  const _a = useMantineDefaultProps("Burger", defaultProps, props), { className, opened, color, size, classNames, styles, transitionDuration } = _a, others = __objRest(_a, ["className", "opened", "color", "size", "classNames", "styles", "transitionDuration"]);
+  const { classes, cx } = useStyles({ color, size, transitionDuration }, { classNames, styles, name: "Burger" });
   return /* @__PURE__ */ React.createElement(UnstyledButton, __spreadValues({
     className: cx(classes.root, className),
     ref
   }, others), /* @__PURE__ */ React.createElement("div", {
-    className: cx(classes.burger, { [classes.opened]: opened })
+    "data-opened": opened || void 0,
+    className: classes.burger
   }));
 });
 Burger.displayName = "@mantine/core/Burger";

package/esm/components/Burger/Burger.js.map

@@ -1 +1 @@
-{"version":3,"file":"Burger.js","sources":["../../../src/components/Burger/Burger.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport {\n  useMantineTheme,\n  DefaultProps,\n  MantineNumberSize,\n  MantineColor,\n  Selectors,\n  useMantineDefaultProps,\n} from '@mantine/styles';\nimport { UnstyledButton } from '../Button';\nimport useStyles from './Burger.styles';\n\nexport type BurgerStylesNames = Exclude<Selectors<typeof useStyles>, 'opened'>;\n\nexport interface BurgerProps\n  extends DefaultProps<BurgerStylesNames>,\n    React.ComponentPropsWithoutRef<'button'> {\n  /** Burger state: true for cross, false for burger */\n  opened: boolean;\n\n  /** Burger color value, not connected to theme.colors, defaults to theme.black with light color scheme and theme.white with dark */\n  color?: MantineColor;\n\n  /** Predefined burger size or number to set width and height in px */\n  size?: MantineNumberSize;\n}\n\nconst defaultProps: Partial<BurgerProps> = {\n  size: 'md',\n};\n\nexport const Burger = forwardRef<HTMLButtonElement, BurgerProps>((props: BurgerProps, ref) => {\n  const {\n    className,\n    opened,\n    color,\n    size = 'md',\n    classNames,\n    styles,\n    ...others\n  } = useMantineDefaultProps('Burger', defaultProps, props);\n  const theme = useMantineTheme();\n  const _color = color || (theme.colorScheme === 'dark' ? theme.white : theme.black);\n  const { classes, cx } = useStyles(\n    { color: _color, size },\n    { classNames, styles, name: 'Burger' }\n  );\n\n  return (\n    <UnstyledButton className={cx(classes.root, className)} ref={ref} {...others}>\n      <div className={cx(classes.burger, { [classes.opened]: opened })} />\n    </UnstyledButton>\n  );\n});\n\nBurger.displayName = '@mantine/core/Burger';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Burger.js","sources":["../../../src/components/Burger/Burger.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport {\n  DefaultProps,\n  MantineNumberSize,\n  MantineColor,\n  Selectors,\n  useMantineDefaultProps,\n} from '@mantine/styles';\nimport { UnstyledButton } from '../UnstyledButton';\nimport useStyles from './Burger.styles';\n\nexport type BurgerStylesNames = Selectors<typeof useStyles>;\n\nexport interface BurgerProps\n  extends DefaultProps<BurgerStylesNames>,\n    React.ComponentPropsWithoutRef<'button'> {\n  /** Burger state: true for cross, false for burger */\n  opened: boolean;\n\n  /** Burger color value, not connected to theme.colors, defaults to theme.black with light color scheme and theme.white with dark */\n  color?: MantineColor;\n\n  /** Predefined burger size or number to set width and height in px */\n  size?: MantineNumberSize;\n\n  /** Transition duration in ms */\n  transitionDuration?: number;\n}\n\nconst defaultProps: Partial<BurgerProps> = {\n  size: 'md',\n  transitionDuration: 300,\n};\n\nexport const Burger = forwardRef<HTMLButtonElement, BurgerProps>((props: BurgerProps, ref) => {\n  const { className, opened, color, size, classNames, styles, transitionDuration, ...others } =\n    useMantineDefaultProps('Burger', defaultProps, props);\n\n  const { classes, cx } = useStyles(\n    { color, size, transitionDuration },\n    { classNames, styles, name: 'Burger' }\n  );\n\n  return (\n    <UnstyledButton className={cx(classes.root, className)} ref={ref} {...others}>\n      <div data-opened={opened || undefined} className={classes.burger} />\n    </UnstyledButton>\n  );\n});\n\nBurger.displayName = '@mantine/core/Burger';\n"],"names":[],"mappings":"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"}

package/esm/components/Burger/Burger.styles.js

@@ -7,12 +7,10 @@ const sizes = {
   lg: 34,
   xl: 42
 };
-var useStyles = createStyles((theme, { size, color }, getRef) => {
+var useStyles = createStyles((theme, { size, color, transitionDuration }) => {
   const sizeValue = theme.fn.size({ size, sizes });
+  const _color = color || (theme.colorScheme === "dark" ? theme.white : theme.black);
   return {
-    opened: {
-      ref: getRef("opened")
-    },
     root: {
       borderRadius: theme.radius.sm,
       width: sizeValue + theme.spacing.xs,
@@ -28,10 +26,10 @@ var useStyles = createStyles((theme, { size, color }, getRef) => {
         display: "block",
         width: sizeValue,
         height: Math.ceil(sizeValue / 12),
-        backgroundColor: color,
+        backgroundColor: _color,
         outline: "1px solid transparent",
         transitionProperty: "background-color, transform",
-        transitionDuration: "300ms",
+        transitionDuration: `${transitionDuration}ms`,
         "@media (prefers-reduced-motion)": {
           transitionDuration: "0ms"
         }
@@ -47,7 +45,7 @@ var useStyles = createStyles((theme, { size, color }, getRef) => {
       "&:after": {
         top: sizeValue / 3
       },
-      [`&.${getRef("opened")}`]: {
+      "&[data-opened]": {
         backgroundColor: "transparent",
         "&:before": {
           transform: `translateY(${sizeValue / 3}px) rotate(45deg)`
@@ -61,5 +59,4 @@ var useStyles = createStyles((theme, { size, color }, getRef) => {
 });
 
 export default useStyles;
-export { sizes };
 //# sourceMappingURL=Burger.styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Burger.styles.js","sources":["../../../src/components/Burger/Burger.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, MantineColor } from '@mantine/styles';\n\nexport interface BurgerStylesParams {\n  size: MantineNumberSize;\n  color: MantineColor;\n}\n\nexport const sizes = {\n  xs: 12,\n  sm: 18,\n  md: 24,\n  lg: 34,\n  xl: 42,\n};\n\nexport default createStyles((theme, { size, color }: BurgerStylesParams, getRef) => {\n  const sizeValue = theme.fn.size({ size, sizes });\n\n  return {\n    opened: {\n      ref: getRef('opened'),\n    },\n\n    root: {\n      borderRadius: theme.radius.sm,\n      width: sizeValue + theme.spacing.xs,\n      height: sizeValue + theme.spacing.xs,\n      padding: theme.spacing.xs / 2,\n      cursor: 'pointer',\n    },\n\n    burger: {\n      position: 'relative',\n      userSelect: 'none',\n      boxSizing: 'border-box',\n\n      '&, &:before, &:after': {\n        display: 'block',\n        width: sizeValue,\n        height: Math.ceil(sizeValue / 12),\n        backgroundColor: color,\n        outline: '1px solid transparent',\n        transitionProperty: 'background-color, transform',\n        transitionDuration: '300ms',\n\n        '@media (prefers-reduced-motion)': {\n          transitionDuration: '0ms',\n        },\n      },\n\n      '&:before, &:after': {\n        position: 'absolute',\n        content: '\"\"',\n        left: 0,\n      },\n\n      '&:before': {\n        top: (sizeValue / 3) * -1,\n      },\n\n      '&:after': {\n        top: sizeValue / 3,\n      },\n\n      [`&.${getRef('opened')}`]: {\n        backgroundColor: 'transparent',\n\n        '&:before': {\n          transform: `translateY(${sizeValue / 3}px) rotate(45deg)`,\n        },\n\n        '&:after': {\n          transform: `translateY(-${sizeValue / 3}px) rotate(-45deg)`,\n        },\n      },\n    },\n  };\n});\n"],"names":[],"mappings":";;AACY,MAAC,KAAK,GAAG;AACrB,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,EAAE,EAAE,EAAE;AACR,EAAE;AACF,gBAAe,YAAY,CAAC,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,MAAM,KAAK;AAChE,EAAE,MAAM,SAAS,GAAG,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,CAAC;AACnD,EAAE,OAAO;AACT,IAAI,MAAM,EAAE;AACZ,MAAM,GAAG,EAAE,MAAM,CAAC,QAAQ,CAAC;AAC3B,KAAK;AACL,IAAI,IAAI,EAAE;AACV,MAAM,YAAY,EAAE,KAAK,CAAC,MAAM,CAAC,EAAE;AACnC,MAAM,KAAK,EAAE,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE;AACzC,MAAM,MAAM,EAAE,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE;AAC1C,MAAM,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC;AACnC,MAAM,MAAM,EAAE,SAAS;AACvB,KAAK;AACL,IAAI,MAAM,EAAE;AACZ,MAAM,QAAQ,EAAE,UAAU;AAC1B,MAAM,UAAU,EAAE,MAAM;AACxB,MAAM,SAAS,EAAE,YAAY;AAC7B,MAAM,sBAAsB,EAAE;AAC9B,QAAQ,OAAO,EAAE,OAAO;AACxB,QAAQ,KAAK,EAAE,SAAS;AACxB,QAAQ,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;AACzC,QAAQ,eAAe,EAAE,KAAK;AAC9B,QAAQ,OAAO,EAAE,uBAAuB;AACxC,QAAQ,kBAAkB,EAAE,6BAA6B;AACzD,QAAQ,kBAAkB,EAAE,OAAO;AACnC,QAAQ,iCAAiC,EAAE;AAC3C,UAAU,kBAAkB,EAAE,KAAK;AACnC,SAAS;AACT,OAAO;AACP,MAAM,mBAAmB,EAAE;AAC3B,QAAQ,QAAQ,EAAE,UAAU;AAC5B,QAAQ,OAAO,EAAE,IAAI;AACrB,QAAQ,IAAI,EAAE,CAAC;AACf,OAAO;AACP,MAAM,UAAU,EAAE;AAClB,QAAQ,GAAG,EAAE,SAAS,GAAG,CAAC,GAAG,CAAC,CAAC;AAC/B,OAAO;AACP,MAAM,SAAS,EAAE;AACjB,QAAQ,GAAG,EAAE,SAAS,GAAG,CAAC;AAC1B,OAAO;AACP,MAAM,CAAC,CAAC,EAAE,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG;AACjC,QAAQ,eAAe,EAAE,aAAa;AACtC,QAAQ,UAAU,EAAE;AACpB,UAAU,SAAS,EAAE,CAAC,WAAW,EAAE,SAAS,GAAG,CAAC,CAAC,iBAAiB,CAAC;AACnE,SAAS;AACT,QAAQ,SAAS,EAAE;AACnB,UAAU,SAAS,EAAE,CAAC,YAAY,EAAE,SAAS,GAAG,CAAC,CAAC,kBAAkB,CAAC;AACrE,SAAS;AACT,OAAO;AACP,KAAK;AACL,GAAG,CAAC;AACJ,CAAC,CAAC;;;;;"}
+{"version":3,"file":"Burger.styles.js","sources":["../../../src/components/Burger/Burger.styles.ts"],"sourcesContent":["import { createStyles, MantineNumberSize, MantineColor } from '@mantine/styles';\n\nexport interface BurgerStylesParams {\n  size: MantineNumberSize;\n  color: MantineColor;\n  transitionDuration: number;\n}\n\nconst sizes = {\n  xs: 12,\n  sm: 18,\n  md: 24,\n  lg: 34,\n  xl: 42,\n};\n\nexport default createStyles((theme, { size, color, transitionDuration }: BurgerStylesParams) => {\n  const sizeValue = theme.fn.size({ size, sizes });\n  const _color = color || (theme.colorScheme === 'dark' ? theme.white : theme.black);\n\n  return {\n    root: {\n      borderRadius: theme.radius.sm,\n      width: sizeValue + theme.spacing.xs,\n      height: sizeValue + theme.spacing.xs,\n      padding: theme.spacing.xs / 2,\n      cursor: 'pointer',\n    },\n\n    burger: {\n      position: 'relative',\n      userSelect: 'none',\n      boxSizing: 'border-box',\n\n      '&, &:before, &:after': {\n        display: 'block',\n        width: sizeValue,\n        height: Math.ceil(sizeValue / 12),\n        backgroundColor: _color,\n        outline: '1px solid transparent',\n        transitionProperty: 'background-color, transform',\n        transitionDuration: `${transitionDuration}ms`,\n\n        '@media (prefers-reduced-motion)': {\n          transitionDuration: '0ms',\n        },\n      },\n\n      '&:before, &:after': {\n        position: 'absolute',\n        content: '\"\"',\n        left: 0,\n      },\n\n      '&:before': {\n        top: (sizeValue / 3) * -1,\n      },\n\n      '&:after': {\n        top: sizeValue / 3,\n      },\n\n      '&[data-opened]': {\n        backgroundColor: 'transparent',\n\n        '&:before': {\n          transform: `translateY(${sizeValue / 3}px) rotate(45deg)`,\n        },\n\n        '&:after': {\n          transform: `translateY(-${sizeValue / 3}px) rotate(-45deg)`,\n        },\n      },\n    },\n  };\n});\n"],"names":[],"mappings":";;AACA,MAAM,KAAK,GAAG;AACd,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,EAAE,EAAE,EAAE;AACR,EAAE,EAAE,EAAE,EAAE;AACR,CAAC,CAAC;AACF,gBAAe,YAAY,CAAC,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,kBAAkB,EAAE,KAAK;AAC5E,EAAE,MAAM,SAAS,GAAG,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,CAAC;AACnD,EAAE,MAAM,MAAM,GAAG,KAAK,KAAK,KAAK,CAAC,WAAW,KAAK,MAAM,GAAG,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC;AACrF,EAAE,OAAO;AACT,IAAI,IAAI,EAAE;AACV,MAAM,YAAY,EAAE,KAAK,CAAC,MAAM,CAAC,EAAE;AACnC,MAAM,KAAK,EAAE,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE;AACzC,MAAM,MAAM,EAAE,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE;AAC1C,MAAM,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC;AACnC,MAAM,MAAM,EAAE,SAAS;AACvB,KAAK;AACL,IAAI,MAAM,EAAE;AACZ,MAAM,QAAQ,EAAE,UAAU;AAC1B,MAAM,UAAU,EAAE,MAAM;AACxB,MAAM,SAAS,EAAE,YAAY;AAC7B,MAAM,sBAAsB,EAAE;AAC9B,QAAQ,OAAO,EAAE,OAAO;AACxB,QAAQ,KAAK,EAAE,SAAS;AACxB,QAAQ,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;AACzC,QAAQ,eAAe,EAAE,MAAM;AAC/B,QAAQ,OAAO,EAAE,uBAAuB;AACxC,QAAQ,kBAAkB,EAAE,6BAA6B;AACzD,QAAQ,kBAAkB,EAAE,CAAC,EAAE,kBAAkB,CAAC,EAAE,CAAC;AACrD,QAAQ,iCAAiC,EAAE;AAC3C,UAAU,kBAAkB,EAAE,KAAK;AACnC,SAAS;AACT,OAAO;AACP,MAAM,mBAAmB,EAAE;AAC3B,QAAQ,QAAQ,EAAE,UAAU;AAC5B,QAAQ,OAAO,EAAE,IAAI;AACrB,QAAQ,IAAI,EAAE,CAAC;AACf,OAAO;AACP,MAAM,UAAU,EAAE;AAClB,QAAQ,GAAG,EAAE,SAAS,GAAG,CAAC,GAAG,CAAC,CAAC;AAC/B,OAAO;AACP,MAAM,SAAS,EAAE;AACjB,QAAQ,GAAG,EAAE,SAAS,GAAG,CAAC;AAC1B,OAAO;AACP,MAAM,gBAAgB,EAAE;AACxB,QAAQ,eAAe,EAAE,aAAa;AACtC,QAAQ,UAAU,EAAE;AACpB,UAAU,SAAS,EAAE,CAAC,WAAW,EAAE,SAAS,GAAG,CAAC,CAAC,iBAAiB,CAAC;AACnE,SAAS;AACT,QAAQ,SAAS,EAAE;AACnB,UAAU,SAAS,EAAE,CAAC,YAAY,EAAE,SAAS,GAAG,CAAC,CAAC,kBAAkB,CAAC;AACrE,SAAS;AACT,OAAO;AACP,KAAK;AACL,GAAG,CAAC;AACJ,CAAC,CAAC;;;;"}

package/esm/components/Button/Button.js

@@ -1,8 +1,9 @@
 import React, { forwardRef } from 'react';
 import { useMantineDefaultProps } from '@mantine/styles';
-import useStyles, { heights } from './Button.styles.js';
+import { createPolymorphicComponent } from '@mantine/utils';
+import useStyles, { sizes } from './Button.styles.js';
 import { Loader } from '../Loader/Loader.js';
-import { Box } from '../Box/Box.js';
+import { UnstyledButton } from '../UnstyledButton/UnstyledButton.js';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
@@ -36,10 +37,9 @@ const defaultProps = {
   size: "sm",
   type: "button",
   variant: "filled",
-  loaderPosition: "left",
-  gradient: { from: "blue", to: "cyan", deg: 45 }
+  loaderPosition: "left"
 };
-const Button = forwardRef((props, ref) => {
+const _Button = forwardRef((props, ref) => {
   const _a = useMantineDefaultProps("Button", defaultProps, props), {
     className,
     size,
@@ -52,7 +52,6 @@ const Button = forwardRef((props, ref) => {
     fullWidth,
     variant,
     radius,
-    component,
     uppercase,
     compact,
     loading,
@@ -60,7 +59,8 @@ const Button = forwardRef((props, ref) => {
     loaderProps,
     gradient,
     classNames,
-    styles
+    styles,
+    unstyled
   } = _a, others = __objRest(_a, [
     "className",
     "size",
@@ -73,7 +73,6 @@ const Button = forwardRef((props, ref) => {
     "fullWidth",
     "variant",
     "radius",
-    "component",
     "uppercase",
     "compact",
     "loading",
@@ -81,7 +80,8 @@ const Button = forwardRef((props, ref) => {
     "loaderProps",
     "gradient",
     "classNames",
-    "styles"
+    "styles",
+    "unstyled"
   ]);
   const { classes, cx, theme } = useStyles({
     radius,
@@ -89,23 +89,22 @@ const Button = forwardRef((props, ref) => {
     size,
     fullWidth,
     compact,
-    gradientFrom: gradient.from,
-    gradientTo: gradient.to,
-    gradientDeg: gradient.deg
-  }, { classNames, styles, name: "Button" });
+    gradient,
+    variant
+  }, { name: "Button", unstyled, classNames, styles });
   const colors = theme.fn.variant({ color, variant });
   const loader = /* @__PURE__ */ React.createElement(Loader, __spreadValues({
     color: colors.color,
-    size: theme.fn.size({ size, sizes: heights }) / 2
+    size: theme.fn.size({ size, sizes }).height / 2
   }, loaderProps));
-  return /* @__PURE__ */ React.createElement(Box, __spreadValues({
-    component: component || "button",
-    className: cx(classes[variant], { [classes.loading]: loading }, classes.root, className),
+  return /* @__PURE__ */ React.createElement(UnstyledButton, __spreadValues({
+    className: cx(classes.root, className),
     type,
     disabled: disabled || loading,
+    "data-disabled": disabled || void 0,
+    "data-loading": loading || void 0,
     ref,
-    onTouchStart: () => {
-    }
+    unstyled
   }, others), /* @__PURE__ */ React.createElement("div", {
     className: classes.inner
   }, (leftIcon || loading && loaderPosition === "left") && /* @__PURE__ */ React.createElement("span", {
@@ -117,7 +116,8 @@ const Button = forwardRef((props, ref) => {
     className: cx(classes.icon, classes.rightIcon)
   }, loading && loaderPosition === "right" ? loader : rightIcon)));
 });
-Button.displayName = "@mantine/core/Button";
+_Button.displayName = "@mantine/core/Button";
+const Button = createPolymorphicComponent(_Button);
 
-export { Button };
+export { Button, _Button };
 //# sourceMappingURL=Button.js.map