@mantine/dates - npm Package Compare versions

Comparing version 2.5.1 to 2.6.0-alpha.0

cjs/components/Calendar/Calendar.js

@@ -51,3 +51,2 @@ 'use strict';
     locale = "en",
-    themeOverride,
     nextMonthLabel,
@@ -78,3 +77,2 @@ previousMonthLabel,
     "locale",
-    "themeOverride",
     "nextMonthLabel",
@@ -115,3 +113,2 @@ "previousMonthLabel",
     size,
-    themeOverride,
     nextMonthLabel,
@@ -135,3 +132,2 @@ previousMonthLabel,
   }), /* @__PURE__ */ React__default.createElement(Month.Month, {
-    themeOverride,
     month: _month,
@@ -138,0 +134,0 @@ value,

cjs/components/Calendar/CalendarHeader/CalendarHeader.js

@@ -24,3 +24,2 @@ 'use strict';
   size,
-  themeOverride,
   nextMonthLabel,
@@ -44,3 +43,3 @@ previousMonthLabel,
 }) {
-  const theme = core.useMantineTheme(themeOverride);
+  const theme = core.useMantineTheme();
   const iconSize = core.getSizeValue({ size, sizes: iconSizes });
@@ -51,3 +50,2 @@ const iconButtonSize = core.getSizeValue({ size, sizes: Day_styles.sizes });
     noWrap: true,
-    themeOverride,
     style: { marginBottom: theme.spacing.xs / 2 }
@@ -58,3 +56,2 @@ }, /* @__PURE__ */ React__default.createElement(core.ActionIcon, {
     disabled: previousMonthDisabled,
-    themeOverride,
     size: iconButtonSize,
@@ -75,3 +72,2 @@ "data-mantine-stop-propagation": true
     labelFormat,
-    themeOverride,
     size,
@@ -85,3 +81,2 @@ __staticSelector,
     disabled: nextMonthDisabled,
-    themeOverride,
     size: iconButtonSize,
@@ -88,0 +83,0 @@ "data-mantine-stop-propagation": true

cjs/components/Calendar/CalendarLabel/CalendarLabel.js

@@ -25,3 +25,2 @@ 'use strict';
   value,
-  themeOverride,
   labelFormat,
@@ -34,5 +33,4 @@ onChange,
 }) {
-  const theme = core.useMantineTheme(themeOverride);
   const selectSize = size === "lg" || size === "xl" ? "md" : "xs";
-  const classes = CalendarLabel_styles['default']({ theme }, classNames, __staticSelector);
+  const { classes } = CalendarLabel_styles['default'](null, classNames, __staticSelector);
   const _styles = core.mergeStyles(classes, styles);
@@ -42,3 +40,2 @@ return withSelect ? /* @__PURE__ */ React__default.createElement(core.Group, {
     noWrap: true,
-    themeOverride,
     className: classes.selectGroup,
@@ -51,3 +48,2 @@ style: _styles.selectGroup
     size: selectSize,
-    themeOverride,
     value: value.getMonth(),
@@ -64,3 +60,2 @@ onChange: (event) => onChange(dayjs__default(value).set("month", parseInt(event.currentTarget.value, 10)).toDate()),
     size: selectSize,
-    themeOverride,
     value: value.getFullYear(),
@@ -67,0 +62,0 @@ onChange: (event) => onChange(dayjs__default(value).set("year", parseInt(event.currentTarget.value, 10)).toDate()),

cjs/components/Calendar/CalendarLabel/CalendarLabel.styles.js

@@ -7,3 +7,3 @@ 'use strict';
 
-var useStyles = core.createMemoStyles({
+var useStyles = core.createStyles({
   selectGroup: {},
@@ -10,0 +10,0 @@ select: {},

cjs/components/DatePicker/DatePicker.js

@@ -49,3 +49,2 @@ 'use strict';
     defaultValue,
-    themeOverride,
     classNames,
@@ -83,3 +82,2 @@ styles,
     "defaultValue",
-    "themeOverride",
     "classNames",
@@ -160,3 +158,2 @@ "styles",
     locale,
-    themeOverride,
     nextMonthLabel,
@@ -163,0 +160,0 @@ previousMonthLabel,

cjs/components/DatePickerBase/DatePickerBase.js

@@ -6,3 +6,2 @@ 'use strict';
 var React = require('react');
-var cx = require('clsx');
 var core = require('@mantine/core');
@@ -15,3 +14,2 @@ var hooks = require('@mantine/hooks');
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
@@ -58,3 +56,2 @@ var __defProp = Object.defineProperty;
   var _b = _a, {
-    themeOverride,
     classNames,
@@ -90,3 +87,2 @@ className,
   } = _b, others = __objRest(_b, [
-    "themeOverride",
     "classNames",
@@ -122,4 +118,3 @@ "className",
   ]);
-  const theme = core.useMantineTheme(themeOverride);
-  const classes = DatePickerBase_styles['default']({ theme, size, invalid: !!error }, classNames, __staticSelector);
+  const { classes, cx } = DatePickerBase_styles['default']({ size, invalid: !!error }, classNames, __staticSelector);
   const _styles = core.mergeStyles(classes, styles);
@@ -152,3 +147,2 @@ const [dropdownElement, setDropdownElement] = React.useState(null);
   const rightSection = clearable ? /* @__PURE__ */ React__default.createElement(core.CloseButton, {
-    themeOverride,
     variant: "transparent",
@@ -167,3 +161,2 @@ "aria-label": clearButtonLabel,
     style,
-    themeOverride,
     classNames,
@@ -180,6 +173,5 @@ styles,
   }, /* @__PURE__ */ React__default.createElement(core.Input, __spreadValues({
-    themeOverride,
     component: "button",
     type: "button",
-    classNames: __spreadProps(__spreadValues({}, classNames), { input: cx__default(classes.input, classNames == null ? void 0 : classNames.input) }),
+    classNames: __spreadProps(__spreadValues({}, classNames), { input: cx(classes.input, classNames == null ? void 0 : classNames.input) }),
     styles: __spreadProps(__spreadValues({}, styles), { input: __spreadProps(__spreadValues({}, styles == null ? void 0 : styles.input), { cursor: "pointer" }) }),
@@ -186,0 +178,0 @@ onClick: () => setDropdownOpened(!dropdownOpened),

cjs/components/DatePickerBase/DatePickerBase.styles.js

@@ -26,11 +26,11 @@ 'use strict';
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var useStyles = core.createMemoStyles({
-  wrapper: ({ theme }) => __spreadProps(__spreadValues({}, core.getFontStyles(theme)), {
+var useStyles = core.createStyles((theme, { size, invalid }) => ({
+  wrapper: __spreadProps(__spreadValues({}, core.getFontStyles(theme)), {
     position: "relative",
     cursor: "pointer"
   }),
-  placeholder: ({ theme, size, invalid }) => ({
+  placeholder: {
     lineHeight: `${core.getSizeValue({ size, sizes: core.INPUT_SIZES }) - 2}px`,
     color: invalid ? theme.colors.red[theme.colorScheme === "dark" ? 6 : 7] : theme.colorScheme === "dark" ? theme.colors.dark[3] : theme.colors.gray[5]
-  }),
+  },
   dropdownWrapper: {
@@ -44,3 +44,3 @@ position: "relative",
   },
-  dropdown: ({ theme }) => ({
+  dropdown: {
     position: "absolute",
@@ -64,6 +64,6 @@ left: 0,
     }
-  })
-});
+  }
+}));
 
 exports.default = useStyles;
 //# sourceMappingURL=DatePickerBase.styles.js.map

cjs/components/DateRangePicker/DateRangePicker.js

@@ -50,3 +50,2 @@ 'use strict';
     defaultValue,
-    themeOverride,
     classNames,
@@ -84,3 +83,2 @@ styles,
     "defaultValue",
-    "themeOverride",
     "classNames",
@@ -161,3 +159,2 @@ "styles",
     locale,
-    themeOverride,
     nextMonthLabel,
@@ -164,0 +161,0 @@ previousMonthLabel,

cjs/components/Month/Day/Day.js

@@ -6,3 +6,2 @@ 'use strict';
 var React = require('react');
-var cx = require('clsx');
 var core = require('@mantine/core');
@@ -14,3 +13,2 @@ var Day_styles = require('./Day.styles.js');
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
@@ -60,3 +58,2 @@ var __defProp = Object.defineProperty;
     onMouseEnter,
-    themeOverride,
     classNames,
@@ -84,3 +81,2 @@ disabled,
     "onMouseEnter",
-    "themeOverride",
     "classNames",
@@ -98,4 +94,3 @@ "disabled",
   ]);
-  const theme = core.useMantineTheme(themeOverride);
-  const classes = Day_styles['default']({ theme, size, fullWidth }, classNames, __staticSelector);
+  const { classes, cx } = Day_styles['default']({ size, fullWidth }, classNames, __staticSelector);
   const _styles = core.mergeStyles(classes, styles);
@@ -113,3 +108,3 @@ return /* @__PURE__ */ React__default.createElement("button", __spreadProps(__spreadValues({}, others), {
     disabled,
-    className: cx__default(classes.day, {
+    className: cx(classes.day, {
       [classes.outside]: outside,
@@ -116,0 +111,0 @@ [classes.weekend]: weekend,

cjs/components/Month/Day/Day.styles.js

@@ -33,3 +33,3 @@ 'use strict';
 };
-var useStyles = core.createMemoStyles({
+var useStyles = core.createStyles((theme, { size, fullWidth }) => ({
   weekend: {},
@@ -41,3 +41,3 @@ outside: {},
   lastInRange: {},
-  day: ({ theme, size, fullWidth }) => __spreadProps(__spreadValues(__spreadValues({}, core.getFontStyles(theme)), core.getFocusStyles(theme)), {
+  day: __spreadProps(__spreadValues(__spreadValues({}, core.getFontStyles(theme)), core.getFocusStyles(theme)), {
     position: "relative",
@@ -86,3 +86,3 @@ WebkitTapHighlightColor: "transparent",
   })
-});
+}));
 
@@ -89,0 +89,0 @@ exports.default = useStyles;

cjs/components/Month/Month.js

@@ -6,3 +6,2 @@ 'use strict';
 var React = require('react');
-var cx = require('clsx');
 var core = require('@mantine/core');
@@ -21,3 +20,2 @@ var hooks = require('@mantine/hooks');
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var dayjs__default = /*#__PURE__*/_interopDefaultLegacy(dayjs);
@@ -67,3 +65,2 @@
     dayStyle,
-    themeOverride,
     classNames,
@@ -91,3 +88,2 @@ styles,
     "dayStyle",
-    "themeOverride",
     "classNames",
@@ -105,4 +101,3 @@ "styles",
   ]);
-  const theme = core.useMantineTheme(themeOverride);
-  const classes = Month_styles['default']({ theme, fullWidth }, classNames, __staticSelector);
+  const { classes, cx } = Month_styles['default']({ fullWidth }, classNames, __staticSelector);
   const _styles = core.mergeStyles(classes, styles);
@@ -190,3 +185,2 @@ const daysRefs = React.useRef({});
         onKeyDown: handleKeyDown,
-        themeOverride,
         className: typeof dayClassName === "function" ? dayClassName(date, dayProps) : null,
@@ -208,3 +202,3 @@ style: typeof dayStyle === "function" ? dayStyle(date, dayProps) : null,
   return /* @__PURE__ */ React__default.createElement("table", __spreadValues({
-    className: cx__default(classes.root, className),
+    className: cx(classes.root, className),
     style: __spreadValues(__spreadValues({}, style), _styles.root)
@@ -211,0 +205,0 @@ }, others), !hideWeekdays && /* @__PURE__ */ React__default.createElement("thead", null, /* @__PURE__ */ React__default.createElement("tr", null, weekdays)), /* @__PURE__ */ React__default.createElement("tbody", null, rows));

cjs/components/Month/Month.styles.js

@@ -26,7 +26,7 @@ 'use strict';
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var useStyles = core.createMemoStyles({
-  weekday: ({ theme }) => ({
+var useStyles = core.createStyles((theme, { fullWidth }) => ({
+  weekday: {
     color: theme.colorScheme === "dark" ? theme.colors.dark[1] : theme.colors.gray[5]
-  }),
-  root: ({ theme, fullWidth }) => __spreadProps(__spreadValues({}, core.getFontStyles(theme)), {
+  },
+  root: __spreadProps(__spreadValues({}, core.getFontStyles(theme)), {
     borderCollapse: "collapse",
@@ -41,3 +41,3 @@ width: fullWidth ? "100%" : "auto",
   },
-  weekdayCell: ({ theme }) => ({
+  weekdayCell: {
     boxSizing: "border-box",
@@ -50,6 +50,6 @@ padding: 0,
     userSelect: "none"
-  })
-});
+  }
+}));
 
 exports.default = useStyles;
 //# sourceMappingURL=Month.styles.js.map

cjs/components/RangeCalendar/RangeCalendar.js

@@ -56,3 +56,2 @@ 'use strict';
     locale = "en",
-    themeOverride,
     nextMonthLabel,
@@ -82,3 +81,2 @@ previousMonthLabel,
     "locale",
-    "themeOverride",
     "nextMonthLabel",
@@ -105,3 +103,3 @@ "previousMonthLabel",
   ]);
-  const theme = core.useMantineTheme(themeOverride);
+  const theme = core.useMantineTheme();
   const [hoveredDay, setHoveredDay] = React.useState(null);
@@ -152,3 +150,2 @@ const [pickedDate, setPickedDate] = React.useState(null);
     size,
-    themeOverride,
     nextMonthLabel,
@@ -170,3 +167,2 @@ previousMonthLabel,
   }), /* @__PURE__ */ React__default.createElement(Month.Month, {
-    themeOverride,
     month: _month,
@@ -173,0 +169,0 @@ range: value,

cjs/components/TimeInput/TimeInput.js

@@ -6,3 +6,2 @@ 'use strict';
 var React = require('react');
-var cx = require('clsx');
 var core = require('@mantine/core');
@@ -19,3 +18,2 @@ var hooks = require('@mantine/hooks');
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var dayjs__default = /*#__PURE__*/_interopDefaultLegacy(dayjs);
@@ -62,3 +60,2 @@
     style,
-    themeOverride,
     size = "sm",
@@ -86,3 +83,2 @@ wrapperProps,
     "style",
-    "themeOverride",
     "size",
@@ -104,4 +100,3 @@ "wrapperProps",
   ]);
-  const theme = core.useMantineTheme(themeOverride);
-  const classes = TimeInput_styles['default']({ theme, size }, classNames, "time-input");
+  const { classes, cx } = TimeInput_styles['default']({ size }, classNames, "time-input");
   const _styles = core.mergeStyles(classes, styles);
@@ -156,3 +151,2 @@ const uuid = hooks.useId(id);
     style,
-    themeOverride,
     classNames,
@@ -166,3 +160,2 @@ styles,
     __staticSelector: "time-input",
-    themeOverride,
     required,
@@ -172,3 +165,3 @@ invalid: !!error,
     size,
-    className: cx__default({ [classes.disabled]: disabled }),
+    className: cx({ [classes.disabled]: disabled }),
     classNames,
@@ -175,0 +168,0 @@ styles,

cjs/components/TimeInput/TimeInput.styles.js

@@ -14,3 +14,3 @@ 'use strict';
 };
-var useStyles = core.createMemoStyles({
+var useStyles = core.createStyles((theme, { size }) => ({
   disabled: {
@@ -20,8 +20,8 @@ opacity: 0.6,
   },
-  controls: ({ size }) => ({
+  controls: {
     display: "flex",
     alignItems: "center",
     height: core.getSizeValue({ size, sizes: core.INPUT_SIZES }) - 2
-  }),
-  timeInput: ({ theme, size }) => ({
+  },
+  timeInput: {
     width: core.getSizeValue({ size, sizes: inputSizes }),
@@ -41,4 +41,4 @@ appearance: "none",
     }
-  })
-});
+  }
+}));
 
@@ -45,0 +45,0 @@ exports.default = useStyles;

cjs/components/TimeRangeInput/TimeRangeInput.js

@@ -6,3 +6,2 @@ 'use strict';
 var React = require('react');
-var cx = require('clsx');
 var core = require('@mantine/core');
@@ -19,3 +18,2 @@ var hooks = require('@mantine/hooks');
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var dayjs__default = /*#__PURE__*/_interopDefaultLegacy(dayjs);
@@ -62,3 +60,2 @@
     style,
-    themeOverride,
     size = "sm",
@@ -87,3 +84,2 @@ wrapperProps,
     "style",
-    "themeOverride",
     "size",
@@ -106,4 +102,3 @@ "wrapperProps",
   ]);
-  const theme = core.useMantineTheme(themeOverride);
-  const classes = TimeRangeInput_styles['default']({ theme, size }, classNames, "time-range-input");
+  const { classes, cx } = TimeRangeInput_styles['default']({ size }, classNames, "time-range-input");
   const _styles = core.mergeStyles(classes, styles);
@@ -178,3 +173,2 @@ const uuid = hooks.useId(id);
     style,
-    themeOverride,
     classNames,
@@ -188,3 +182,2 @@ styles,
     __staticSelector: "time-range-input",
-    themeOverride,
     required,
@@ -197,3 +190,3 @@ invalid: !!error,
     size,
-    className: cx__default({ [classes.disabled]: disabled }),
+    className: cx({ [classes.disabled]: disabled }),
     classNames,
@@ -200,0 +193,0 @@ styles,

cjs/components/TimeRangeInput/TimeRangeInput.styles.js

@@ -8,3 +8,3 @@ 'use strict';
 
-var useStyles = core.createMemoStyles({
+var useStyles = core.createStyles((theme, { size }) => ({
   disabled: {
@@ -14,8 +14,8 @@ opacity: 0.6,
   },
-  inputWrapper: ({ size }) => ({
+  inputWrapper: {
     display: "inline-flex",
     alignItems: "center",
     height: core.getSizeValue({ size, sizes: core.INPUT_SIZES }) - 2
-  }),
-  timeField: ({ theme, size }) => ({
+  },
+  timeField: {
     width: core.getSizeValue({ size, sizes: TimeInput_styles.inputSizes }),
@@ -35,4 +35,4 @@ appearance: "none",
     }
-  }),
-  separator: ({ theme, size }) => ({
+  },
+  separator: {
     paddingLeft: core.getSizeValue({ size, sizes: theme.spacing }) / 2,
@@ -42,6 +42,6 @@ paddingRight: core.getSizeValue({ size, sizes: theme.spacing }) / 2,
     marginBottom: 3
-  })
-});
+  }
+}));
 
 exports.default = useStyles;
 //# sourceMappingURL=TimeRangeInput.styles.js.map

esm/components/Calendar/Calendar.js

@@ -42,3 +42,2 @@ import React from 'react';
     locale = "en",
-    themeOverride,
     nextMonthLabel,
@@ -69,3 +68,2 @@ previousMonthLabel,
     "locale",
-    "themeOverride",
     "nextMonthLabel",
@@ -106,3 +104,2 @@ "previousMonthLabel",
     size,
-    themeOverride,
     nextMonthLabel,
@@ -126,3 +123,2 @@ previousMonthLabel,
   }), /* @__PURE__ */ React.createElement(Month, {
-    themeOverride,
     month: _month,
@@ -129,0 +125,0 @@ value,

esm/components/Calendar/CalendarHeader/CalendarHeader.js

@@ -16,3 +16,2 @@ import React from 'react';
   size,
-  themeOverride,
   nextMonthLabel,
@@ -36,3 +35,3 @@ previousMonthLabel,
 }) {
-  const theme = useMantineTheme(themeOverride);
+  const theme = useMantineTheme();
   const iconSize = getSizeValue({ size, sizes: iconSizes });
@@ -43,3 +42,2 @@ const iconButtonSize = getSizeValue({ size, sizes: sizes });
     noWrap: true,
-    themeOverride,
     style: { marginBottom: theme.spacing.xs / 2 }
@@ -50,3 +48,2 @@ }, /* @__PURE__ */ React.createElement(ActionIcon, {
     disabled: previousMonthDisabled,
-    themeOverride,
     size: iconButtonSize,
@@ -67,3 +64,2 @@ "data-mantine-stop-propagation": true
     labelFormat,
-    themeOverride,
     size,
@@ -77,3 +73,2 @@ __staticSelector,
     disabled: nextMonthDisabled,
-    themeOverride,
     size: iconButtonSize,
@@ -80,0 +75,0 @@ "data-mantine-stop-propagation": true

esm/components/Calendar/CalendarLabel/CalendarLabel.js

 import React from 'react';
 import dayjs from 'dayjs';
-import { useMantineTheme, mergeStyles, Group, NativeSelect, Text } from '@mantine/core';
+import { mergeStyles, Group, NativeSelect, Text } from '@mantine/core';
 import { upperFirst } from '@mantine/hooks';
@@ -16,3 +16,2 @@ import { getMonthsNames } from '../../../utils/get-months-names/get-months-names.js';
   value,
-  themeOverride,
   labelFormat,
@@ -25,5 +24,4 @@ onChange,
 }) {
-  const theme = useMantineTheme(themeOverride);
   const selectSize = size === "lg" || size === "xl" ? "md" : "xs";
-  const classes = useStyles({ theme }, classNames, __staticSelector);
+  const { classes } = useStyles(null, classNames, __staticSelector);
   const _styles = mergeStyles(classes, styles);
@@ -33,3 +31,2 @@ return withSelect ? /* @__PURE__ */ React.createElement(Group, {
     noWrap: true,
-    themeOverride,
     className: classes.selectGroup,
@@ -42,3 +39,2 @@ style: _styles.selectGroup
     size: selectSize,
-    themeOverride,
     value: value.getMonth(),
@@ -55,3 +51,2 @@ onChange: (event) => onChange(dayjs(value).set("month", parseInt(event.currentTarget.value, 10)).toDate()),
     size: selectSize,
-    themeOverride,
     value: value.getFullYear(),
@@ -58,0 +53,0 @@ onChange: (event) => onChange(dayjs(value).set("year", parseInt(event.currentTarget.value, 10)).toDate()),

esm/components/Calendar/CalendarLabel/CalendarLabel.styles.js

@@ -1,4 +0,4 @@
-import { createMemoStyles } from '@mantine/core';
+import { createStyles } from '@mantine/core';
 
-var useStyles = createMemoStyles({
+var useStyles = createStyles({
   selectGroup: {},
@@ -5,0 +5,0 @@ select: {},

esm/components/DatePicker/DatePicker.js

@@ -40,3 +40,2 @@ import React, { useState, useRef } from 'react';
     defaultValue,
-    themeOverride,
     classNames,
@@ -74,3 +73,2 @@ styles,
     "defaultValue",
-    "themeOverride",
     "classNames",
@@ -151,3 +149,2 @@ "styles",
     locale,
-    themeOverride,
     nextMonthLabel,
@@ -154,0 +151,0 @@ previousMonthLabel,

esm/components/DatePickerBase/DatePickerBase.js

 import React, { useState, useRef, useEffect } from 'react';
-import cx from 'clsx';
-import { useMantineTheme, mergeStyles, useClickOutsideRegister, InputWrapper, Input, getSizeValue, Text, Popper, Paper, Modal, CloseButton } from '@mantine/core';
+import { mergeStyles, useClickOutsideRegister, InputWrapper, Input, getSizeValue, Text, Popper, Paper, Modal, CloseButton } from '@mantine/core';
 import { useId, useFocusTrap, useClickOutside, useWindowEvent, useMergedRef, useReducedMotion } from '@mantine/hooks';
@@ -47,3 +46,2 @@ import useStyles from './DatePickerBase.styles.js';
   var _b = _a, {
-    themeOverride,
     classNames,
@@ -79,3 +77,2 @@ className,
   } = _b, others = __objRest(_b, [
-    "themeOverride",
     "classNames",
@@ -111,4 +108,3 @@ "className",
   ]);
-  const theme = useMantineTheme(themeOverride);
-  const classes = useStyles({ theme, size, invalid: !!error }, classNames, __staticSelector);
+  const { classes, cx } = useStyles({ size, invalid: !!error }, classNames, __staticSelector);
   const _styles = mergeStyles(classes, styles);
@@ -141,3 +137,2 @@ const [dropdownElement, setDropdownElement] = useState(null);
   const rightSection = clearable ? /* @__PURE__ */ React.createElement(CloseButton, {
-    themeOverride,
     variant: "transparent",
@@ -156,3 +151,2 @@ "aria-label": clearButtonLabel,
     style,
-    themeOverride,
     classNames,
@@ -169,3 +163,2 @@ styles,
   }, /* @__PURE__ */ React.createElement(Input, __spreadValues({
-    themeOverride,
     component: "button",
@@ -172,0 +165,0 @@ type: "button",

esm/components/DatePickerBase/DatePickerBase.styles.js

@@ -1,2 +0,2 @@
-import { createMemoStyles, getFontStyles, getSizeValue, INPUT_SIZES } from '@mantine/core';
+import { createStyles, getFontStyles, getSizeValue, INPUT_SIZES } from '@mantine/core';
 
@@ -22,11 +22,11 @@ var __defProp = Object.defineProperty;
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var useStyles = createMemoStyles({
-  wrapper: ({ theme }) => __spreadProps(__spreadValues({}, getFontStyles(theme)), {
+var useStyles = createStyles((theme, { size, invalid }) => ({
+  wrapper: __spreadProps(__spreadValues({}, getFontStyles(theme)), {
     position: "relative",
     cursor: "pointer"
   }),
-  placeholder: ({ theme, size, invalid }) => ({
+  placeholder: {
     lineHeight: `${getSizeValue({ size, sizes: INPUT_SIZES }) - 2}px`,
     color: invalid ? theme.colors.red[theme.colorScheme === "dark" ? 6 : 7] : theme.colorScheme === "dark" ? theme.colors.dark[3] : theme.colors.gray[5]
-  }),
+  },
   dropdownWrapper: {
@@ -40,3 +40,3 @@ position: "relative",
   },
-  dropdown: ({ theme }) => ({
+  dropdown: {
     position: "absolute",
@@ -60,6 +60,6 @@ left: 0,
     }
-  })
-});
+  }
+}));
 
 export default useStyles;
 //# sourceMappingURL=DatePickerBase.styles.js.map

esm/components/DateRangePicker/DateRangePicker.js

@@ -41,3 +41,2 @@ import React, { useState, useRef } from 'react';
     defaultValue,
-    themeOverride,
     classNames,
@@ -75,3 +74,2 @@ styles,
     "defaultValue",
-    "themeOverride",
     "classNames",
@@ -152,3 +150,2 @@ "styles",
     locale,
-    themeOverride,
     nextMonthLabel,
@@ -155,0 +152,0 @@ previousMonthLabel,

esm/components/Month/Day/Day.js

 import React from 'react';
-import cx from 'clsx';
-import { useMantineTheme, mergeStyles } from '@mantine/core';
+import { mergeStyles } from '@mantine/core';
 import useStyles from './Day.styles.js';
@@ -49,3 +48,2 @@
     onMouseEnter,
-    themeOverride,
     classNames,
@@ -73,3 +71,2 @@ disabled,
     "onMouseEnter",
-    "themeOverride",
     "classNames",
@@ -87,4 +84,3 @@ "disabled",
   ]);
-  const theme = useMantineTheme(themeOverride);
-  const classes = useStyles({ theme, size, fullWidth }, classNames, __staticSelector);
+  const { classes, cx } = useStyles({ size, fullWidth }, classNames, __staticSelector);
   const _styles = mergeStyles(classes, styles);
@@ -91,0 +87,0 @@ return /* @__PURE__ */ React.createElement("button", __spreadProps(__spreadValues({}, others), {

esm/components/Month/Day/Day.styles.js

@@ -1,2 +0,2 @@
-import { createMemoStyles, getSizeValue, hexToRgba, getFocusStyles, getFontStyles } from '@mantine/core';
+import { createStyles, getSizeValue, hexToRgba, getFocusStyles, getFontStyles } from '@mantine/core';
 
@@ -29,3 +29,3 @@ var __defProp = Object.defineProperty;
 };
-var useStyles = createMemoStyles({
+var useStyles = createStyles((theme, { size, fullWidth }) => ({
   weekend: {},
@@ -37,3 +37,3 @@ outside: {},
   lastInRange: {},
-  day: ({ theme, size, fullWidth }) => __spreadProps(__spreadValues(__spreadValues({}, getFontStyles(theme)), getFocusStyles(theme)), {
+  day: __spreadProps(__spreadValues(__spreadValues({}, getFontStyles(theme)), getFocusStyles(theme)), {
     position: "relative",
@@ -82,3 +82,3 @@ WebkitTapHighlightColor: "transparent",
   })
-});
+}));
 
@@ -85,0 +85,0 @@ export default useStyles;

esm/components/Month/Month.js

 import React, { useRef, useEffect } from 'react';
-import cx from 'clsx';
-import { useMantineTheme, mergeStyles, Text } from '@mantine/core';
+import { mergeStyles, Text } from '@mantine/core';
 import { upperFirst } from '@mantine/hooks';
@@ -55,3 +54,2 @@ import dayjs from 'dayjs';
     dayStyle,
-    themeOverride,
     classNames,
@@ -79,3 +77,2 @@ styles,
     "dayStyle",
-    "themeOverride",
     "classNames",
@@ -93,4 +90,3 @@ "styles",
   ]);
-  const theme = useMantineTheme(themeOverride);
-  const classes = useStyles({ theme, fullWidth }, classNames, __staticSelector);
+  const { classes, cx } = useStyles({ fullWidth }, classNames, __staticSelector);
   const _styles = mergeStyles(classes, styles);
@@ -178,3 +174,2 @@ const daysRefs = useRef({});
         onKeyDown: handleKeyDown,
-        themeOverride,
         className: typeof dayClassName === "function" ? dayClassName(date, dayProps) : null,
@@ -181,0 +176,0 @@ style: typeof dayStyle === "function" ? dayStyle(date, dayProps) : null,

esm/components/Month/Month.styles.js

@@ -1,2 +0,2 @@
-import { createMemoStyles, getFontStyles } from '@mantine/core';
+import { createStyles, getFontStyles } from '@mantine/core';
 
@@ -22,7 +22,7 @@ var __defProp = Object.defineProperty;
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var useStyles = createMemoStyles({
-  weekday: ({ theme }) => ({
+var useStyles = createStyles((theme, { fullWidth }) => ({
+  weekday: {
     color: theme.colorScheme === "dark" ? theme.colors.dark[1] : theme.colors.gray[5]
-  }),
-  root: ({ theme, fullWidth }) => __spreadProps(__spreadValues({}, getFontStyles(theme)), {
+  },
+  root: __spreadProps(__spreadValues({}, getFontStyles(theme)), {
     borderCollapse: "collapse",
@@ -37,3 +37,3 @@ width: fullWidth ? "100%" : "auto",
   },
-  weekdayCell: ({ theme }) => ({
+  weekdayCell: {
     boxSizing: "border-box",
@@ -46,6 +46,6 @@ padding: 0,
     userSelect: "none"
-  })
-});
+  }
+}));
 
 export default useStyles;
 //# sourceMappingURL=Month.styles.js.map

esm/components/RangeCalendar/RangeCalendar.js

@@ -47,3 +47,2 @@ import React, { useState } from 'react';
     locale = "en",
-    themeOverride,
     nextMonthLabel,
@@ -73,3 +72,2 @@ previousMonthLabel,
     "locale",
-    "themeOverride",
     "nextMonthLabel",
@@ -96,3 +94,3 @@ "previousMonthLabel",
   ]);
-  const theme = useMantineTheme(themeOverride);
+  const theme = useMantineTheme();
   const [hoveredDay, setHoveredDay] = useState(null);
@@ -143,3 +141,2 @@ const [pickedDate, setPickedDate] = useState(null);
     size,
-    themeOverride,
     nextMonthLabel,
@@ -161,3 +158,2 @@ previousMonthLabel,
   }), /* @__PURE__ */ React.createElement(Month, {
-    themeOverride,
     month: _month,
@@ -164,0 +160,0 @@ range: value,

esm/components/TimeInput/TimeInput.js

 import React, { useRef, useState } from 'react';
-import cx from 'clsx';
-import { useMantineTheme, mergeStyles, InputWrapper, Input } from '@mantine/core';
+import { mergeStyles, InputWrapper, Input } from '@mantine/core';
 import { useId, useUncontrolled, useMergedRef } from '@mantine/hooks';
@@ -50,3 +49,2 @@ import dayjs from 'dayjs';
     style,
-    themeOverride,
     size = "sm",
@@ -74,3 +72,2 @@ wrapperProps,
     "style",
-    "themeOverride",
     "size",
@@ -92,4 +89,3 @@ "wrapperProps",
   ]);
-  const theme = useMantineTheme(themeOverride);
-  const classes = useStyles({ theme, size }, classNames, "time-input");
+  const { classes, cx } = useStyles({ size }, classNames, "time-input");
   const _styles = mergeStyles(classes, styles);
@@ -144,3 +140,2 @@ const uuid = useId(id);
     style,
-    themeOverride,
     classNames,
@@ -154,3 +149,2 @@ styles,
     __staticSelector: "time-input",
-    themeOverride,
     required,
@@ -157,0 +151,0 @@ invalid: !!error,

esm/components/TimeInput/TimeInput.styles.js

@@ -1,2 +0,2 @@
-import { createMemoStyles, getSizeValue, INPUT_SIZES } from '@mantine/core';
+import { createStyles, getSizeValue, INPUT_SIZES } from '@mantine/core';
 
@@ -10,3 +10,3 @@ const inputSizes = {
 };
-var useStyles = createMemoStyles({
+var useStyles = createStyles((theme, { size }) => ({
   disabled: {
@@ -16,8 +16,8 @@ opacity: 0.6,
   },
-  controls: ({ size }) => ({
+  controls: {
     display: "flex",
     alignItems: "center",
     height: getSizeValue({ size, sizes: INPUT_SIZES }) - 2
-  }),
-  timeInput: ({ theme, size }) => ({
+  },
+  timeInput: {
     width: getSizeValue({ size, sizes: inputSizes }),
@@ -37,4 +37,4 @@ appearance: "none",
     }
-  })
-});
+  }
+}));
 
@@ -41,0 +41,0 @@ export default useStyles;

esm/components/TimeRangeInput/TimeRangeInput.js

 import React, { useRef, useState } from 'react';
-import cx from 'clsx';
-import { useMantineTheme, mergeStyles, InputWrapper, Input } from '@mantine/core';
+import { mergeStyles, InputWrapper, Input } from '@mantine/core';
 import { useId, useUncontrolled, useMergedRef } from '@mantine/hooks';
@@ -50,3 +49,2 @@ import dayjs from 'dayjs';
     style,
-    themeOverride,
     size = "sm",
@@ -75,3 +73,2 @@ wrapperProps,
     "style",
-    "themeOverride",
     "size",
@@ -94,4 +91,3 @@ "wrapperProps",
   ]);
-  const theme = useMantineTheme(themeOverride);
-  const classes = useStyles({ theme, size }, classNames, "time-range-input");
+  const { classes, cx } = useStyles({ size }, classNames, "time-range-input");
   const _styles = mergeStyles(classes, styles);
@@ -166,3 +162,2 @@ const uuid = useId(id);
     style,
-    themeOverride,
     classNames,
@@ -176,3 +171,2 @@ styles,
     __staticSelector: "time-range-input",
-    themeOverride,
     required,
@@ -179,0 +173,0 @@ invalid: !!error,

esm/components/TimeRangeInput/TimeRangeInput.styles.js

@@ -1,5 +0,5 @@
-import { createMemoStyles, getSizeValue, INPUT_SIZES } from '@mantine/core';
+import { createStyles, getSizeValue, INPUT_SIZES } from '@mantine/core';
 import { inputSizes } from '../TimeInput/TimeInput.styles.js';
 
-var useStyles = createMemoStyles({
+var useStyles = createStyles((theme, { size }) => ({
   disabled: {
@@ -9,8 +9,8 @@ opacity: 0.6,
   },
-  inputWrapper: ({ size }) => ({
+  inputWrapper: {
     display: "inline-flex",
     alignItems: "center",
     height: getSizeValue({ size, sizes: INPUT_SIZES }) - 2
-  }),
-  timeField: ({ theme, size }) => ({
+  },
+  timeField: {
     width: getSizeValue({ size, sizes: inputSizes }),
@@ -30,4 +30,4 @@ appearance: "none",
     }
-  }),
-  separator: ({ theme, size }) => ({
+  },
+  separator: {
     paddingLeft: getSizeValue({ size, sizes: theme.spacing }) / 2,
@@ -37,6 +37,6 @@ paddingRight: getSizeValue({ size, sizes: theme.spacing }) / 2,
     marginBottom: 3
-  })
-});
+  }
+}));
 
 export default useStyles;
 //# sourceMappingURL=TimeRangeInput.styles.js.map

lib/components/Calendar/Calendar.d.ts

@@ -41,3 +41,3 @@ import React from 'react';
 }
-export declare function Calendar({ classNames, styles, locale, themeOverride, nextMonthLabel, previousMonthLabel, initialMonth, month, onMonthChange, value, onChange, labelFormat, withSelect, yearsRange, dayClassName, dayStyle, disableOutsideEvents, minDate, maxDate, excludeDate, fullWidth, size, __staticSelector, monthLabel, yearLabel, ...others }: CalendarProps): JSX.Element;
+export declare function Calendar({ classNames, styles, locale, nextMonthLabel, previousMonthLabel, initialMonth, month, onMonthChange, value, onChange, labelFormat, withSelect, yearsRange, dayClassName, dayStyle, disableOutsideEvents, minDate, maxDate, excludeDate, fullWidth, size, __staticSelector, monthLabel, yearLabel, ...others }: CalendarProps): JSX.Element;
 export declare namespace Calendar {
@@ -44,0 +44,0 @@ var displayName: string;

lib/components/Calendar/CalendarHeader/CalendarHeader.d.ts

@@ -26,3 +26,3 @@ /// <reference types="react" />
 }
-export declare function CalendarHeader({ size, themeOverride, nextMonthLabel, previousMonthLabel, previousMonthDisabled, nextMonthDisabled, onPreviousMonth, onNextMonth, classNames, styles, locale, withSelect, yearsRange, month, setMonth, labelFormat, __staticSelector, monthLabel, yearLabel, }: CalendarHeaderProps): JSX.Element;
+export declare function CalendarHeader({ size, nextMonthLabel, previousMonthLabel, previousMonthDisabled, nextMonthDisabled, onPreviousMonth, onNextMonth, classNames, styles, locale, withSelect, yearsRange, month, setMonth, labelFormat, __staticSelector, monthLabel, yearLabel, }: CalendarHeaderProps): JSX.Element;
 export declare namespace CalendarHeader {
@@ -29,0 +29,0 @@ var displayName: string;

lib/components/Calendar/CalendarLabel/CalendarLabel.d.ts

 /// <reference types="react" />
 import { DefaultProps, MantineSize } from '@mantine/core';
 import useStyles from './CalendarLabel.styles';
-export declare type CalendarLabelStylesNames = keyof ReturnType<typeof useStyles>;
+export declare type CalendarLabelStylesNames = keyof ReturnType<typeof useStyles>['classes'];
 interface CalendarLabelProps extends DefaultProps<CalendarLabelStylesNames> {
@@ -20,3 +20,3 @@ locale: string;
 }
-export declare function CalendarLabel({ locale, classNames, styles, withSelect, yearsRange, value, themeOverride, labelFormat, onChange, size, __staticSelector, monthLabel, yearLabel, }: CalendarLabelProps): JSX.Element;
+export declare function CalendarLabel({ locale, classNames, styles, withSelect, yearsRange, value, labelFormat, onChange, size, __staticSelector, monthLabel, yearLabel, }: CalendarLabelProps): JSX.Element;
 export declare namespace CalendarLabel {
@@ -23,0 +23,0 @@ var displayName: string;

lib/components/Calendar/CalendarLabel/CalendarLabel.styles.d.ts

@@ -1,3 +0,6 @@
-declare const _default: (args?: unknown, classNames?: Partial<Record<"label" | "select" | "selectGroup", string>>, name?: string) => Record<"label" | "select" | "selectGroup", string>;
+declare const _default: (params: void, classNames?: Partial<Record<"label" | "select" | "selectGroup", string>>, name?: string) => {
+    classes: Record<"label" | "select" | "selectGroup", string>;
+    cx: (...args: any) => string;
+};
 export default _default;
 //# sourceMappingURL=CalendarLabel.styles.d.ts.map

lib/components/DatePicker/DatePicker.d.ts

@@ -20,3 +20,3 @@ /// <reference types="react" />
 }
-export declare function DatePicker({ value, onChange, defaultValue, themeOverride, classNames, styles, shadow, locale, inputFormat, transitionDuration, transitionTimingFunction, nextMonthLabel, previousMonthLabel, closeCalendarOnChange, labelFormat, withSelect, yearsRange, dayClassName, dayStyle, disableOutsideEvents, minDate, maxDate, excludeDate, elementRef, initialMonth, initiallyOpened, name, size, dropdownType, clearable, disabled, clearButtonLabel, ...others }: DatePickerProps): JSX.Element;
+export declare function DatePicker({ value, onChange, defaultValue, classNames, styles, shadow, locale, inputFormat, transitionDuration, transitionTimingFunction, nextMonthLabel, previousMonthLabel, closeCalendarOnChange, labelFormat, withSelect, yearsRange, dayClassName, dayStyle, disableOutsideEvents, minDate, maxDate, excludeDate, elementRef, initialMonth, initiallyOpened, name, size, dropdownType, clearable, disabled, clearButtonLabel, ...others }: DatePickerProps): JSX.Element;
 export declare namespace DatePicker {
@@ -23,0 +23,0 @@ var displayName: string;

lib/components/DatePickerBase/DatePickerBase.d.ts

@@ -5,3 +5,3 @@ import React from 'react';
 import useStyles from './DatePickerBase.styles';
-export declare type DatePickerStylesNames = keyof ReturnType<typeof useStyles> | CalendarStylesNames | InputStylesNames | InputWrapperStylesNames;
+export declare type DatePickerStylesNames = keyof ReturnType<typeof useStyles>['classes'] | CalendarStylesNames | InputStylesNames | InputWrapperStylesNames;
 export interface DatePickerBaseSharedProps extends InputBaseProps, InputWrapperBaseProps, DefaultProps<DatePickerStylesNames>, Omit<React.ComponentPropsWithoutRef<'button'>, 'value' | 'defaultValue' | 'onChange' | 'placeholder'> {
@@ -51,3 +51,3 @@ /** Props spread to root element (InputWrapper) */
 }
-export declare function DatePickerBase({ themeOverride, classNames, className, style, styles, wrapperProps, required, label, error, id, description, placeholder, shadow, transition, transitionDuration, transitionTimingFunction, elementRef, closeDropdownOnScroll, size, children, inputLabel, __staticSelector, dropdownOpened, setDropdownOpened, dropdownType, clearable, clearButtonLabel, onClear, positionDependencies, zIndex, ...others }: DatePickerBaseProps): JSX.Element;
+export declare function DatePickerBase({ classNames, className, style, styles, wrapperProps, required, label, error, id, description, placeholder, shadow, transition, transitionDuration, transitionTimingFunction, elementRef, closeDropdownOnScroll, size, children, inputLabel, __staticSelector, dropdownOpened, setDropdownOpened, dropdownType, clearable, clearButtonLabel, onClear, positionDependencies, zIndex, ...others }: DatePickerBaseProps): JSX.Element;
 export declare namespace DatePickerBase {
@@ -54,0 +54,0 @@ var displayName: string;

lib/components/DatePickerBase/DatePickerBase.styles.d.ts

@@ -1,9 +0,11 @@
-import { MantineTheme, MantineSize } from '@mantine/core';
+import { MantineSize } from '@mantine/core';
 interface DatePickerBaseStyles {
-    theme: MantineTheme;
     size: MantineSize;
     invalid: boolean;
 }
-declare const _default: (args?: DatePickerBaseStyles, classNames?: Partial<Record<"input" | "placeholder" | "wrapper" | "dropdownWrapper" | "dropdown", string>>, name?: string) => Record<"input" | "placeholder" | "wrapper" | "dropdownWrapper" | "dropdown", string>;
+declare const _default: (params: DatePickerBaseStyles, classNames?: Partial<Record<"input" | "placeholder" | "wrapper" | "dropdownWrapper" | "dropdown", string>>, name?: string) => {
+    classes: Record<"input" | "placeholder" | "wrapper" | "dropdownWrapper" | "dropdown", string>;
+    cx: (...args: any) => string;
+};
 export default _default;
 //# sourceMappingURL=DatePickerBase.styles.d.ts.map

lib/components/DateRangePicker/DateRangePicker.d.ts

@@ -22,3 +22,3 @@ /// <reference types="react" />
 }
-export declare function DateRangePicker({ value, onChange, defaultValue, themeOverride, classNames, styles, shadow, locale, inputFormat, transitionDuration, transitionTimingFunction, nextMonthLabel, previousMonthLabel, closeCalendarOnChange, labelFormat, withSelect, yearsRange, dayClassName, dayStyle, disableOutsideEvents, minDate, maxDate, excludeDate, elementRef, initialMonth, initiallyOpened, name, size, dropdownType, labelSeparator, clearable, clearButtonLabel, ...others }: DateRangePickerProps): JSX.Element;
+export declare function DateRangePicker({ value, onChange, defaultValue, classNames, styles, shadow, locale, inputFormat, transitionDuration, transitionTimingFunction, nextMonthLabel, previousMonthLabel, closeCalendarOnChange, labelFormat, withSelect, yearsRange, dayClassName, dayStyle, disableOutsideEvents, minDate, maxDate, excludeDate, elementRef, initialMonth, initiallyOpened, name, size, dropdownType, labelSeparator, clearable, clearButtonLabel, ...others }: DateRangePickerProps): JSX.Element;
 export declare namespace DateRangePicker {
@@ -25,0 +25,0 @@ var displayName: string;

lib/components/Month/Day/Day.d.ts

 import React from 'react';
 import { DefaultProps, MantineSize } from '@mantine/core';
 import useStyles from './Day.styles';
-export declare type DayStylesNames = keyof ReturnType<typeof useStyles>;
+export declare type DayStylesNames = keyof ReturnType<typeof useStyles>['classes'];
 export interface DayProps extends DefaultProps<DayStylesNames>, Omit<React.ComponentPropsWithoutRef<'button'>, 'value' | 'onKeyDown' | 'onMouseEnter'> {
@@ -24,3 +24,3 @@ value: Date;
 }
-export declare function Day({ className, style, value, selected, weekend, outside, onClick, elementRef, onKeyDown, onMouseEnter, themeOverride, classNames, disabled, styles, hasValue, firstInRange, lastInRange, __staticSelector, inRange, size, fullWidth, firstInMonth, ...others }: DayProps): JSX.Element;
+export declare function Day({ className, style, value, selected, weekend, outside, onClick, elementRef, onKeyDown, onMouseEnter, classNames, disabled, styles, hasValue, firstInRange, lastInRange, __staticSelector, inRange, size, fullWidth, firstInMonth, ...others }: DayProps): JSX.Element;
 export declare namespace Day {
@@ -27,0 +27,0 @@ var displayName: string;

lib/components/Month/Day/Day.styles.d.ts

@@ -1,4 +0,3 @@
-import { MantineTheme, MantineSize } from '@mantine/core';
+import { MantineSize } from '@mantine/core';
 interface DayStyles {
-    theme: MantineTheme;
     size: MantineSize;
@@ -14,4 +13,7 @@ fullWidth: boolean;
 };
-declare const _default: (args?: DayStyles, classNames?: Partial<Record<"weekend" | "outside" | "selected" | "inRange" | "firstInRange" | "lastInRange" | "day", string>>, name?: string) => Record<"weekend" | "outside" | "selected" | "inRange" | "firstInRange" | "lastInRange" | "day", string>;
+declare const _default: (params: DayStyles, classNames?: Partial<Record<"weekend" | "outside" | "selected" | "inRange" | "firstInRange" | "lastInRange" | "day", string>>, name?: string) => {
+    classes: Record<"weekend" | "outside" | "selected" | "inRange" | "firstInRange" | "lastInRange" | "day", string>;
+    cx: (...args: any) => string;
+};
 export default _default;
 //# sourceMappingURL=Day.styles.d.ts.map

lib/components/Month/Month.d.ts

@@ -26,3 +26,3 @@ import React from 'react';
 }
-export declare type MonthStylesNames = keyof ReturnType<typeof useStyles> | DayStylesNames;
+export declare type MonthStylesNames = keyof ReturnType<typeof useStyles>['classes'] | DayStylesNames;
 export interface MonthProps extends DefaultProps<MonthStylesNames>, MonthSettings, Omit<React.ComponentPropsWithoutRef<'table'>, 'onChange' | 'value'> {
@@ -46,3 +46,3 @@ /** Date at which month should be shown */
 }
-export declare function Month({ className, style, month, value, onChange, autoFocus, disableOutsideEvents, locale, dayClassName, dayStyle, themeOverride, classNames, styles, minDate, maxDate, excludeDate, onDayMouseEnter, range, hideWeekdays, __staticSelector, size, fullWidth, ...others }: MonthProps): JSX.Element;
+export declare function Month({ className, style, month, value, onChange, autoFocus, disableOutsideEvents, locale, dayClassName, dayStyle, classNames, styles, minDate, maxDate, excludeDate, onDayMouseEnter, range, hideWeekdays, __staticSelector, size, fullWidth, ...others }: MonthProps): JSX.Element;
 export declare namespace Month {
@@ -49,0 +49,0 @@ var displayName: string;

lib/components/Month/Month.styles.d.ts

@@ -1,8 +0,9 @@
-import { MantineTheme } from '@mantine/core';
 interface MonthStyles {
-    theme: MantineTheme;
     fullWidth: boolean;
 }
-declare const _default: (args?: MonthStyles, classNames?: Partial<Record<"cell" | "weekday" | "root" | "weekdayCell", string>>, name?: string) => Record<"cell" | "weekday" | "root" | "weekdayCell", string>;
+declare const _default: (params: MonthStyles, classNames?: Partial<Record<"cell" | "weekday" | "root" | "weekdayCell", string>>, name?: string) => {
+    classes: Record<"cell" | "weekday" | "root" | "weekdayCell", string>;
+    cx: (...args: any) => string;
+};
 export default _default;
 //# sourceMappingURL=Month.styles.d.ts.map

lib/components/RangeCalendar/RangeCalendar.d.ts

@@ -16,3 +16,3 @@ import React from 'react';
 }
-export declare function RangeCalendar({ classNames, styles, locale, themeOverride, nextMonthLabel, previousMonthLabel, initialMonth, month, onMonthChange, value, onChange, labelFormat, withSelect, yearsRange, dayClassName, dayStyle, disableOutsideEvents, minDate, maxDate, excludeDate, fullWidth, size, onMouseLeave, __staticSelector, ...others }: RangeCalendarProps): JSX.Element;
+export declare function RangeCalendar({ classNames, styles, locale, nextMonthLabel, previousMonthLabel, initialMonth, month, onMonthChange, value, onChange, labelFormat, withSelect, yearsRange, dayClassName, dayStyle, disableOutsideEvents, minDate, maxDate, excludeDate, fullWidth, size, onMouseLeave, __staticSelector, ...others }: RangeCalendarProps): JSX.Element;
 export declare namespace RangeCalendar {
@@ -19,0 +19,0 @@ var displayName: string;

lib/components/TimeInput/TimeInput.d.ts

 import React from 'react';
 import { InputBaseProps, InputWrapperBaseProps, InputStylesNames, InputWrapperStylesNames, DefaultProps, MantineSize } from '@mantine/core';
 import useStyles from './TimeInput.styles';
-export declare type TimeInputStylesNames = keyof ReturnType<typeof useStyles> | InputStylesNames | InputWrapperStylesNames;
+export declare type TimeInputStylesNames = keyof ReturnType<typeof useStyles>['classes'] | InputStylesNames | InputWrapperStylesNames;
 export interface TimeInputProps extends DefaultProps<TimeInputStylesNames>, InputBaseProps, InputWrapperBaseProps, Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange' | 'value' | 'defaultValue'> {
@@ -29,3 +29,3 @@ /** Input size */
 }
-export declare function TimeInput({ required, label, error, description, className, style, themeOverride, size, wrapperProps, classNames, styles, id, elementRef, value, defaultValue, onChange, withSeconds, name, hoursLabel, minutesLabel, secondsLabel, disabled, ...others }: TimeInputProps): JSX.Element;
+export declare function TimeInput({ required, label, error, description, className, style, size, wrapperProps, classNames, styles, id, elementRef, value, defaultValue, onChange, withSeconds, name, hoursLabel, minutesLabel, secondsLabel, disabled, ...others }: TimeInputProps): JSX.Element;
 export declare namespace TimeInput {
@@ -32,0 +32,0 @@ var displayName: string;

lib/components/TimeInput/TimeInput.styles.d.ts

@@ -1,4 +0,3 @@
-import { MantineTheme, MantineSize } from '@mantine/core';
+import { MantineSize } from '@mantine/core';
 interface TimeInputStyles {
-    theme: MantineTheme;
     size: MantineSize;
@@ -13,4 +12,7 @@ }
 };
-declare const _default: (args?: TimeInputStyles, classNames?: Partial<Record<"disabled" | "controls" | "timeInput", string>>, name?: string) => Record<"disabled" | "controls" | "timeInput", string>;
+declare const _default: (params: TimeInputStyles, classNames?: Partial<Record<"disabled" | "controls" | "timeInput", string>>, name?: string) => {
+    classes: Record<"disabled" | "controls" | "timeInput", string>;
+    cx: (...args: any) => string;
+};
 export default _default;
 //# sourceMappingURL=TimeInput.styles.d.ts.map

lib/components/TimeRangeInput/TimeRangeInput.d.ts

 import React from 'react';
 import { InputBaseProps, InputWrapperBaseProps, InputStylesNames, InputWrapperStylesNames, DefaultProps, MantineSize } from '@mantine/core';
 import useStyles from './TimeRangeInput.styles';
-export declare type TimeRangeInputStylesNames = Exclude<keyof ReturnType<typeof useStyles>, 'disabled'> | InputStylesNames | InputWrapperStylesNames;
+export declare type TimeRangeInputStylesNames = Exclude<keyof ReturnType<typeof useStyles>['classes'], 'disabled'> | InputStylesNames | InputWrapperStylesNames;
 export interface TimeRangeInputProps extends DefaultProps<TimeRangeInputStylesNames>, InputBaseProps, InputWrapperBaseProps, Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange' | 'value' | 'defaultValue'> {
@@ -31,3 +31,3 @@ /** Input size */
 }
-export declare function TimeRangeInput({ required, label, error, description, className, style, themeOverride, size, wrapperProps, classNames, styles, id, elementRef, value, defaultValue, onChange, withSeconds, name, hoursLabel, minutesLabel, secondsLabel, labelSeparator, disabled, ...others }: TimeRangeInputProps): JSX.Element;
+export declare function TimeRangeInput({ required, label, error, description, className, style, size, wrapperProps, classNames, styles, id, elementRef, value, defaultValue, onChange, withSeconds, name, hoursLabel, minutesLabel, secondsLabel, labelSeparator, disabled, ...others }: TimeRangeInputProps): JSX.Element;
 export declare namespace TimeRangeInput {
@@ -34,0 +34,0 @@ var displayName: string;

lib/components/TimeRangeInput/TimeRangeInput.styles.d.ts

@@ -1,8 +0,10 @@
-import { MantineTheme, MantineSize } from '@mantine/core';
+import { MantineSize } from '@mantine/core';
 interface TimeRangeInputStyles {
-    theme: MantineTheme;
     size: MantineSize;
 }
-declare const _default: (args?: TimeRangeInputStyles, classNames?: Partial<Record<"separator" | "disabled" | "inputWrapper" | "timeField", string>>, name?: string) => Record<"separator" | "disabled" | "inputWrapper" | "timeField", string>;
+declare const _default: (params: TimeRangeInputStyles, classNames?: Partial<Record<"disabled" | "separator" | "inputWrapper" | "timeField", string>>, name?: string) => {
+    classes: Record<"disabled" | "separator" | "inputWrapper" | "timeField", string>;
+    cx: (...args: any) => string;
+};
 export default _default;
 //# sourceMappingURL=TimeRangeInput.styles.d.ts.map

package.json

 {
   "name": "@mantine/dates",
   "description": "Calendars, date and time pickers based on Mantine components",
-  "version": "2.5.1",
+  "version": "2.6.0-alpha.0",
   "main": "cjs/index.js",
@@ -12,4 +12,4 @@ "module": "esm/index.js",
   "peerDependencies": {
-    "@mantine/core": "2.5.1",
-    "@mantine/hooks": "2.5.1",
+    "@mantine/core": "2.6.0-alpha.0",
+    "@mantine/hooks": "2.6.0-alpha.0",
     "dayjs": "^1.10.5",
@@ -21,3 +21,2 @@ "react": ">=16.8.0"
     "@popperjs/core": "^2.9.3",
-    "react-jss": "^10.7.1",
     "react-popper": "^2.2.5"
@@ -24,0 +23,0 @@ },

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Improved metrics

Dependency count

7

decreased by-12.5%

Worsened metrics

Total package byte prevSize

558998

decreased by-28.45%

Number of package files

208

decreased by-0.95%

Lines of code

5625

decreased by-4.4%

Dependency changes

• + Added@babel/code-frame@7.26.2(transitive)

• + Added@babel/generator@7.26.3(transitive)

• + Added@babel/helper-module-imports@7.25.9(transitive)

• + Added@babel/helper-string-parser@7.25.9(transitive)

• + Added@babel/helper-validator-identifier@7.25.9(transitive)

• + Added@babel/parser@7.26.3(transitive)

• + Added@babel/template@7.25.9(transitive)

• + Added@babel/traverse@7.26.4(transitive)

• + Added@babel/types@7.26.3(transitive)

• + Added@emotion/babel-plugin@11.13.5(transitive)

• + Added@emotion/cache@11.14.0(transitive)

• + Added@emotion/hash@0.9.2(transitive)

• + Added@emotion/memoize@0.9.0(transitive)

• + Added@emotion/react@11.14.0(transitive)

• + Added@emotion/serialize@1.3.3(transitive)

• + Added@emotion/sheet@1.4.0(transitive)

• + Added@emotion/unitless@0.10.0(transitive)

• + Added@emotion/use-insertion-effect-with-fallbacks@1.2.0(transitive)

• + Added@emotion/utils@1.4.2(transitive)

• + Added@emotion/weak-memoize@0.4.0(transitive)

• + Added@jridgewell/gen-mapping@0.3.8(transitive)

• + Added@jridgewell/resolve-uri@3.1.2(transitive)

• + Added@jridgewell/set-array@1.2.1(transitive)

• + Added@jridgewell/sourcemap-codec@1.5.0(transitive)

• + Added@jridgewell/trace-mapping@0.3.25(transitive)

• + Added@mantine/core@2.6.0-alpha.0(transitive)

• + Added@mantine/hooks@2.6.0-alpha.0(transitive)

• + Added@mantine/styles@2.6.0-alpha.0(transitive)

• + Added@types/parse-json@4.0.2(transitive)

• + Addedbabel-plugin-macros@3.1.0(transitive)

• + Addedcallsites@3.1.0(transitive)

• + Addedconvert-source-map@1.9.0(transitive)

• + Addedcosmiconfig@7.1.0(transitive)

• + Addeddebug@4.4.0(transitive)

• + Addederror-ex@1.3.2(transitive)

• + Addedescape-string-regexp@4.0.0(transitive)

• + Addedfind-root@1.1.0(transitive)

• + Addedfunction-bind@1.1.2(transitive)

• + Addedglobals@11.12.0(transitive)

• + Addedhasown@2.0.2(transitive)

• + Addedimport-fresh@3.3.0(transitive)

• + Addedis-arrayish@0.2.1(transitive)

• + Addedis-core-module@2.16.0(transitive)

• + Addedjsesc@3.1.0(transitive)

• + Addedjson-parse-even-better-errors@2.3.1(transitive)

• + Addedlines-and-columns@1.2.4(transitive)

• + Addedms@2.1.3(transitive)

• + Addedparent-module@1.0.1(transitive)

• + Addedparse-json@5.2.0(transitive)

• + Addedpath-parse@1.0.7(transitive)

• + Addedpath-type@4.0.0(transitive)

• + Addedpicocolors@1.1.1(transitive)

• + Addedresolve@1.22.9(transitive)

• + Addedresolve-from@4.0.0(transitive)

• + Addedsource-map@0.5.7(transitive)

• + Addedstylis@4.2.0(transitive)

• + Addedsupports-preserve-symlinks-flag@1.0.0(transitive)

• + Addedyaml@1.10.2(transitive)

• - Removedreact-jss@^10.7.1

• - Removed@emotion/is-prop-valid@0.7.3(transitive)

• - Removed@emotion/memoize@0.7.1(transitive)

• - Removed@mantine/core@2.5.1(transitive)

• - Removed@mantine/hooks@2.5.1(transitive)

• - Removedcss-jss@10.10.0(transitive)

• - Removedcss-vendor@2.0.8(transitive)

• - Removedhyphenate-style-name@1.1.0(transitive)

• - Removedis-in-browser@1.1.3(transitive)

• - Removedjss@10.10.0(transitive)

• - Removedjss-plugin-camel-case@10.10.0(transitive)

• - Removedjss-plugin-compose@10.10.0(transitive)

• - Removedjss-plugin-default-unit@10.10.0(transitive)

• - Removedjss-plugin-expand@10.10.0(transitive)

• - Removedjss-plugin-extend@10.10.0(transitive)

• - Removedjss-plugin-global@10.10.0(transitive)

• - Removedjss-plugin-nested@10.10.0(transitive)

• - Removedjss-plugin-props-sort@10.10.0(transitive)

• - Removedjss-plugin-rule-value-function@10.10.0(transitive)

• - Removedjss-plugin-rule-value-observable@10.10.0(transitive)

• - Removedjss-plugin-template@10.10.0(transitive)

• - Removedjss-plugin-vendor-prefixer@10.10.0(transitive)

• - Removedjss-preset-default@10.10.0(transitive)

• - Removedobject-assign@4.1.1(transitive)

• - Removedprop-types@15.8.1(transitive)

• - Removedreact-display-name@0.2.5(transitive)

• - Removedreact-jss@10.10.0(transitive)

• - Removedshallow-equal@1.2.1(transitive)

• - Removedsymbol-observable@1.2.0(transitive)

• - Removedtheming@3.3.0(transitive)

• - Removedtiny-warning@1.0.3(transitive)