@mantine/dates 6.0.19 → 7.0.0-beta.0

package/esm/components/MonthLevelGroup/MonthLevelGroup.js

@@ -1,9 +1,9 @@
-import React, { forwardRef, useRef } from 'react';
-import { useComponentDefaultProps, Box } from '@mantine/core';
 import dayjs from 'dayjs';
-import useStyles from './MonthLevelGroup.styles.js';
+import React, { useRef } from 'react';
+import { factory, useProps } from '@mantine/core';
 import { MonthLevel } from '../MonthLevel/MonthLevel.js';
 import { handleControlKeyDown } from '../../utils/handle-control-key-down.js';
+import { LevelsGroup } from '../LevelsGroup/LevelsGroup.js';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
@@ -36,9 +36,10 @@ var __objRest = (source, exclude) => {
 const defaultProps = {
   numberOfColumns: 1
 };
-const MonthLevelGroup = forwardRef((props, ref) => {
-  const _a = useComponentDefaultProps("MonthLevelGroup", defaultProps, props), {
-    month,
+const MonthLevelGroup = factory((_props, ref) => {
+  const props = useProps("MonthLevelGroup", defaultProps, _props);
+  const _a = props, {
+    month: month,
     locale,
     firstDayOfWeek,
     weekdayFormat,
@@ -54,7 +55,7 @@ const MonthLevelGroup = forwardRef((props, ref) => {
     __onDayClick,
     __onDayMouseEnter,
     withCellSpacing,
-    __preventFocus,
+    __preventFocus: __preventFocus,
     nextIcon,
     previousIcon,
     nextLabel,
@@ -65,8 +66,7 @@ const MonthLevelGroup = forwardRef((props, ref) => {
     nextDisabled,
     previousDisabled,
     hasNextLevel,
-    className,
-    classNames,
+    classNames: classNames,
     styles,
     unstyled,
     numberOfColumns,
@@ -75,9 +75,10 @@ const MonthLevelGroup = forwardRef((props, ref) => {
     __staticSelector,
     __stopPropagation,
     size,
-    variant,
-    static: isStatic
+    static: isStatic,
+    vars
   } = _a, others = __objRest(_a, [
+    // Month settings
     "month",
     "locale",
     "firstDayOfWeek",
@@ -94,6 +95,7 @@ const MonthLevelGroup = forwardRef((props, ref) => {
     "__onDayClick",
     "__onDayMouseEnter",
     "withCellSpacing",
+    // CalendarHeader settings
     "__preventFocus",
     "nextIcon",
     "previousIcon",
@@ -105,7 +107,7 @@ const MonthLevelGroup = forwardRef((props, ref) => {
     "nextDisabled",
     "previousDisabled",
     "hasNextLevel",
-    "className",
+    // Other settings
     "classNames",
     "styles",
     "unstyled",
@@ -115,84 +117,86 @@ const MonthLevelGroup = forwardRef((props, ref) => {
     "__staticSelector",
     "__stopPropagation",
     "size",
-    "variant",
-    "static"
+    "static",
+    "vars"
   ]);
-  const { classes, cx } = useStyles(null, {
-    name: ["MonthLevelGroup", __staticSelector],
-    classNames,
-    styles,
-    unstyled,
-    variant,
-    size
-  });
   const daysRefs = useRef([]);
   const months = Array(numberOfColumns).fill(0).map((_, monthIndex) => {
     const currentMonth = dayjs(month).add(monthIndex, "months").toDate();
-    return /* @__PURE__ */ React.createElement(MonthLevel, {
-      key: monthIndex,
-      month: currentMonth,
-      withNext: monthIndex === numberOfColumns - 1,
-      withPrevious: monthIndex === 0,
-      monthLabelFormat,
-      __stopPropagation,
-      __onDayClick,
-      __onDayMouseEnter,
-      __onDayKeyDown: (event, payload) => handleControlKeyDown({
-        levelIndex: monthIndex,
-        rowIndex: payload.rowIndex,
-        cellIndex: payload.cellIndex,
-        event,
-        controlsRef: daysRefs
-      }),
-      __getDayRef: (rowIndex, cellIndex, node) => {
-        if (!Array.isArray(daysRefs.current[monthIndex])) {
-          daysRefs.current[monthIndex] = [];
-        }
-        if (!Array.isArray(daysRefs.current[monthIndex][rowIndex])) {
-          daysRefs.current[monthIndex][rowIndex] = [];
-        }
-        daysRefs.current[monthIndex][rowIndex][cellIndex] = node;
-      },
-      levelControlAriaLabel: typeof levelControlAriaLabel === "function" ? levelControlAriaLabel(currentMonth) : levelControlAriaLabel,
-      locale,
-      firstDayOfWeek,
-      weekdayFormat,
-      weekendDays,
-      getDayProps,
-      excludeDate,
-      minDate,
-      maxDate,
-      renderDay,
-      hideOutsideDates,
-      hideWeekdays,
-      getDayAriaLabel,
-      __preventFocus,
-      nextIcon,
-      previousIcon,
-      nextLabel,
-      previousLabel,
-      onNext,
-      onPrevious,
-      onLevelClick,
-      nextDisabled,
-      previousDisabled,
-      hasNextLevel,
+    return /* @__PURE__ */ React.createElement(
+      MonthLevel,
+      {
+        key: monthIndex,
+        month: currentMonth,
+        withNext: monthIndex === numberOfColumns - 1,
+        withPrevious: monthIndex === 0,
+        monthLabelFormat,
+        __stopPropagation,
+        __onDayClick,
+        __onDayMouseEnter,
+        __onDayKeyDown: (event, payload) => handleControlKeyDown({
+          levelIndex: monthIndex,
+          rowIndex: payload.rowIndex,
+          cellIndex: payload.cellIndex,
+          event,
+          controlsRef: daysRefs
+        }),
+        __getDayRef: (rowIndex, cellIndex, node) => {
+          if (!Array.isArray(daysRefs.current[monthIndex])) {
+            daysRefs.current[monthIndex] = [];
+          }
+          if (!Array.isArray(daysRefs.current[monthIndex][rowIndex])) {
+            daysRefs.current[monthIndex][rowIndex] = [];
+          }
+          daysRefs.current[monthIndex][rowIndex][cellIndex] = node;
+        },
+        levelControlAriaLabel: typeof levelControlAriaLabel === "function" ? levelControlAriaLabel(currentMonth) : levelControlAriaLabel,
+        locale,
+        firstDayOfWeek,
+        weekdayFormat,
+        weekendDays,
+        getDayProps,
+        excludeDate,
+        minDate,
+        maxDate,
+        renderDay,
+        hideOutsideDates,
+        hideWeekdays,
+        getDayAriaLabel,
+        __preventFocus,
+        nextIcon,
+        previousIcon,
+        nextLabel,
+        previousLabel,
+        onNext,
+        onPrevious,
+        onLevelClick,
+        nextDisabled,
+        previousDisabled,
+        hasNextLevel,
+        classNames,
+        styles,
+        unstyled,
+        __staticSelector: __staticSelector || "MonthLevelGroup",
+        size,
+        static: isStatic,
+        withCellSpacing
+      }
+    );
+  });
+  return /* @__PURE__ */ React.createElement(
+    LevelsGroup,
+    __spreadValues({
       classNames,
       styles,
-      unstyled,
       __staticSelector: __staticSelector || "MonthLevelGroup",
-      size,
-      variant,
-      static: isStatic,
-      withCellSpacing
-    });
-  });
-  return /* @__PURE__ */ React.createElement(Box, __spreadValues({
-    className: cx(classes.monthLevelGroup, className),
-    ref
-  }, others), months);
+      ref,
+      size
+    }, others),
+    months
+  );
 });
+MonthLevelGroup.classes = __spreadValues(__spreadValues({}, LevelsGroup.classes), MonthLevel.classes);
 MonthLevelGroup.displayName = "@mantine/dates/MonthLevelGroup";
 
 export { MonthLevelGroup };

package/esm/components/MonthLevelGroup/MonthLevelGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"MonthLevelGroup.js","sources":["../../../src/components/MonthLevelGroup/MonthLevelGroup.tsx"],"sourcesContent":["import React, { forwardRef, useRef } from 'react';\nimport { DefaultProps, Box, Selectors, useComponentDefaultProps } from '@mantine/core';\nimport dayjs from 'dayjs';\nimport { MonthLevel, MonthLevelStylesNames, MonthLevelSettings } from '../MonthLevel';\nimport { handleControlKeyDown } from '../../utils';\nimport useStyles from './MonthLevelGroup.styles';\n\nexport type MonthLevelGroupStylesNames = Selectors<typeof useStyles> | MonthLevelStylesNames;\n\nexport interface MonthLevelGroupProps\n  extends DefaultProps<MonthLevelGroupStylesNames>,\n    Omit<MonthLevelSettings, 'withPrevious' | 'withNext' | '__onDayKeyDown' | '__getDayRef'>,\n    React.ComponentPropsWithoutRef<'div'> {\n  variant?: string;\n  __staticSelector?: string;\n\n  /** Number of columns to render next to each other */\n  numberOfColumns?: number;\n\n  /** Month that is currently displayed */\n  month: Date;\n\n  /** Function that returns level control aria-label based on month date */\n  levelControlAriaLabel?: ((month: Date) => string) | string;\n\n  /** Determines whether days should be static, static days can be used to display month if it is not expected that user will interact with the component in any way  */\n  static?: boolean;\n}\n\nconst defaultProps: Partial<MonthLevelGroupProps> = {\n  numberOfColumns: 1,\n};\n\nexport const MonthLevelGroup = forwardRef<HTMLDivElement, MonthLevelGroupProps>((props, ref) => {\n  const {\n    // Month settings\n    month,\n    locale,\n    firstDayOfWeek,\n    weekdayFormat,\n    weekendDays,\n    getDayProps,\n    excludeDate,\n    minDate,\n    maxDate,\n    renderDay,\n    hideOutsideDates,\n    hideWeekdays,\n    getDayAriaLabel,\n    __onDayClick,\n    __onDayMouseEnter,\n    withCellSpacing,\n\n    // CalendarHeader settings\n    __preventFocus,\n    nextIcon,\n    previousIcon,\n    nextLabel,\n    previousLabel,\n    onNext,\n    onPrevious,\n    onLevelClick,\n    nextDisabled,\n    previousDisabled,\n    hasNextLevel,\n\n    // Other settings\n    className,\n    classNames,\n    styles,\n    unstyled,\n    numberOfColumns,\n    levelControlAriaLabel,\n    monthLabelFormat,\n    __staticSelector,\n    __stopPropagation,\n    size,\n    variant,\n    static: isStatic,\n    ...others\n  } = useComponentDefaultProps('MonthLevelGroup', defaultProps, props);\n\n  const { classes, cx } = useStyles(null, {\n    name: ['MonthLevelGroup', __staticSelector],\n    classNames,\n    styles,\n    unstyled,\n    variant,\n    size,\n  });\n\n  const daysRefs = useRef<HTMLButtonElement[][][]>([]);\n\n  const months = Array(numberOfColumns)\n    .fill(0)\n    .map((_, monthIndex) => {\n      const currentMonth = dayjs(month).add(monthIndex, 'months').toDate();\n\n      return (\n        <MonthLevel\n          key={monthIndex}\n          month={currentMonth}\n          withNext={monthIndex === numberOfColumns - 1}\n          withPrevious={monthIndex === 0}\n          monthLabelFormat={monthLabelFormat}\n          __stopPropagation={__stopPropagation}\n          __onDayClick={__onDayClick}\n          __onDayMouseEnter={__onDayMouseEnter}\n          __onDayKeyDown={(event, payload) =>\n            handleControlKeyDown({\n              levelIndex: monthIndex,\n              rowIndex: payload.rowIndex,\n              cellIndex: payload.cellIndex,\n              event,\n              controlsRef: daysRefs,\n            })\n          }\n          __getDayRef={(rowIndex, cellIndex, node) => {\n            if (!Array.isArray(daysRefs.current[monthIndex])) {\n              daysRefs.current[monthIndex] = [];\n            }\n\n            if (!Array.isArray(daysRefs.current[monthIndex][rowIndex])) {\n              daysRefs.current[monthIndex][rowIndex] = [];\n            }\n\n            daysRefs.current[monthIndex][rowIndex][cellIndex] = node;\n          }}\n          levelControlAriaLabel={\n            typeof levelControlAriaLabel === 'function'\n              ? levelControlAriaLabel(currentMonth)\n              : levelControlAriaLabel\n          }\n          locale={locale}\n          firstDayOfWeek={firstDayOfWeek}\n          weekdayFormat={weekdayFormat}\n          weekendDays={weekendDays}\n          getDayProps={getDayProps}\n          excludeDate={excludeDate}\n          minDate={minDate}\n          maxDate={maxDate}\n          renderDay={renderDay}\n          hideOutsideDates={hideOutsideDates}\n          hideWeekdays={hideWeekdays}\n          getDayAriaLabel={getDayAriaLabel}\n          __preventFocus={__preventFocus}\n          nextIcon={nextIcon}\n          previousIcon={previousIcon}\n          nextLabel={nextLabel}\n          previousLabel={previousLabel}\n          onNext={onNext}\n          onPrevious={onPrevious}\n          onLevelClick={onLevelClick}\n          nextDisabled={nextDisabled}\n          previousDisabled={previousDisabled}\n          hasNextLevel={hasNextLevel}\n          classNames={classNames}\n          styles={styles}\n          unstyled={unstyled}\n          __staticSelector={__staticSelector || 'MonthLevelGroup'}\n          size={size}\n          variant={variant}\n          static={isStatic}\n          withCellSpacing={withCellSpacing}\n        />\n      );\n    });\n\n  return (\n    <Box className={cx(classes.monthLevelGroup, className)} ref={ref} {...others}>\n      {months}\n    </Box>\n  );\n});\n\nMonthLevelGroup.displayName = '@mantine/dates/MonthLevelGroup';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"MonthLevelGroup.js","sources":["../../../src/components/MonthLevelGroup/MonthLevelGroup.tsx"],"sourcesContent":["import dayjs from 'dayjs';\nimport React, { useRef } from 'react';\nimport { BoxProps, StylesApiProps, factory, ElementProps, useProps, Factory } from '@mantine/core';\nimport { MonthLevel, MonthLevelSettings, MonthLevelStylesNames } from '../MonthLevel';\nimport { LevelsGroup, LevelsGroupStylesNames } from '../LevelsGroup';\nimport { handleControlKeyDown } from '../../utils';\n\nexport type MonthLevelGroupStylesNames = MonthLevelStylesNames | LevelsGroupStylesNames;\n\nexport interface MonthLevelGroupProps\n  extends BoxProps,\n    Omit<MonthLevelSettings, 'withPrevious' | 'withNext' | '__onDayKeyDown' | '__getDayRef'>,\n    Omit<StylesApiProps<MonthLevelGroupFactory>, 'classNames' | 'styles'>,\n    ElementProps<'div'> {\n  classNames?: Partial<Record<string, string>>;\n  styles?: Partial<Record<string, React.CSSProperties>>;\n  __staticSelector?: string;\n\n  /** Number of columns to render next to each other */\n  numberOfColumns?: number;\n\n  /** Month that is currently displayed */\n  month: Date;\n\n  /** Function that returns level control aria-label based on month date */\n  levelControlAriaLabel?: ((month: Date) => string) | string;\n\n  /** Determines whether days should be static, static days can be used to display month if it is not expected that user will interact with the component in any way  */\n  static?: boolean;\n}\n\nexport type MonthLevelGroupFactory = Factory<{\n  props: MonthLevelGroupProps;\n  ref: HTMLDivElement;\n  stylesNames: MonthLevelGroupStylesNames;\n}>;\n\nconst defaultProps: Partial<MonthLevelGroupProps> = {\n  numberOfColumns: 1,\n};\n\nexport const MonthLevelGroup = factory<MonthLevelGroupFactory>((_props, ref) => {\n  const props = useProps('MonthLevelGroup', defaultProps, _props);\n  const {\n    // Month settings\n    month,\n    locale,\n    firstDayOfWeek,\n    weekdayFormat,\n    weekendDays,\n    getDayProps,\n    excludeDate,\n    minDate,\n    maxDate,\n    renderDay,\n    hideOutsideDates,\n    hideWeekdays,\n    getDayAriaLabel,\n    __onDayClick,\n    __onDayMouseEnter,\n    withCellSpacing,\n\n    // CalendarHeader settings\n    __preventFocus,\n    nextIcon,\n    previousIcon,\n    nextLabel,\n    previousLabel,\n    onNext,\n    onPrevious,\n    onLevelClick,\n    nextDisabled,\n    previousDisabled,\n    hasNextLevel,\n\n    // Other settings\n    classNames,\n    styles,\n    unstyled,\n    numberOfColumns,\n    levelControlAriaLabel,\n    monthLabelFormat,\n    __staticSelector,\n    __stopPropagation,\n    size,\n    static: isStatic,\n    vars,\n    ...others\n  } = props;\n\n  const daysRefs = useRef<HTMLButtonElement[][][]>([]);\n\n  const months = Array(numberOfColumns)\n    .fill(0)\n    .map((_, monthIndex) => {\n      const currentMonth = dayjs(month).add(monthIndex, 'months').toDate();\n\n      return (\n        <MonthLevel\n          key={monthIndex}\n          month={currentMonth}\n          withNext={monthIndex === numberOfColumns! - 1}\n          withPrevious={monthIndex === 0}\n          monthLabelFormat={monthLabelFormat}\n          __stopPropagation={__stopPropagation}\n          __onDayClick={__onDayClick}\n          __onDayMouseEnter={__onDayMouseEnter}\n          __onDayKeyDown={(event, payload) =>\n            handleControlKeyDown({\n              levelIndex: monthIndex,\n              rowIndex: payload.rowIndex,\n              cellIndex: payload.cellIndex,\n              event,\n              controlsRef: daysRefs,\n            })\n          }\n          __getDayRef={(rowIndex, cellIndex, node) => {\n            if (!Array.isArray(daysRefs.current[monthIndex])) {\n              daysRefs.current[monthIndex] = [];\n            }\n\n            if (!Array.isArray(daysRefs.current[monthIndex][rowIndex])) {\n              daysRefs.current[monthIndex][rowIndex] = [];\n            }\n\n            daysRefs.current[monthIndex][rowIndex][cellIndex] = node;\n          }}\n          levelControlAriaLabel={\n            typeof levelControlAriaLabel === 'function'\n              ? levelControlAriaLabel(currentMonth)\n              : levelControlAriaLabel\n          }\n          locale={locale}\n          firstDayOfWeek={firstDayOfWeek}\n          weekdayFormat={weekdayFormat}\n          weekendDays={weekendDays}\n          getDayProps={getDayProps}\n          excludeDate={excludeDate}\n          minDate={minDate}\n          maxDate={maxDate}\n          renderDay={renderDay}\n          hideOutsideDates={hideOutsideDates}\n          hideWeekdays={hideWeekdays}\n          getDayAriaLabel={getDayAriaLabel}\n          __preventFocus={__preventFocus}\n          nextIcon={nextIcon}\n          previousIcon={previousIcon}\n          nextLabel={nextLabel}\n          previousLabel={previousLabel}\n          onNext={onNext}\n          onPrevious={onPrevious}\n          onLevelClick={onLevelClick}\n          nextDisabled={nextDisabled}\n          previousDisabled={previousDisabled}\n          hasNextLevel={hasNextLevel}\n          classNames={classNames}\n          styles={styles}\n          unstyled={unstyled}\n          __staticSelector={__staticSelector || 'MonthLevelGroup'}\n          size={size}\n          static={isStatic}\n          withCellSpacing={withCellSpacing}\n        />\n      );\n    });\n\n  return (\n    <LevelsGroup\n      classNames={classNames}\n      styles={styles}\n      __staticSelector={__staticSelector || 'MonthLevelGroup'}\n      ref={ref}\n      size={size}\n      {...others}\n    >\n      {months}\n    </LevelsGroup>\n  );\n});\n\nMonthLevelGroup.classes = { ...LevelsGroup.classes, ...MonthLevel.classes };\nMonthLevelGroup.displayName = '@mantine/dates/MonthLevelGroup';\n"],"names":[],"mappings":"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"}

package/esm/components/MonthPicker/MonthPicker.js

@@ -1,5 +1,5 @@
-import React, { forwardRef } from 'react';
-import { useComponentDefaultProps } from '@mantine/core';
+import React from 'react';
+import { factory, useProps, useResolvedStylesApi } from '@mantine/core';
 import { useDatesState } from '../../hooks/use-dates-state/use-dates-state.js';
 import { Calendar } from '../Calendar/Calendar.js';
 
@@ -34,8 +34,13 @@ var __objRest = (source, exclude) => {
 const defaultProps = {
   type: "default"
 };
-const MonthPicker = forwardRef((props, ref) => {
-  const _a = useComponentDefaultProps("MonthPicker", defaultProps, props), {
+const MonthPicker = factory((_props, ref) => {
+  const props = useProps("MonthPicker", defaultProps, _props);
+  const _a = props, {
+    classNames,
+    styles,
+    unstyled,
+    vars,
     type,
     defaultValue,
     value,
@@ -45,8 +50,13 @@ const MonthPicker = forwardRef((props, ref) => {
     allowSingleDateInRange,
     allowDeselect,
     onMouseLeave,
-    onMonthSelect
+    onMonthSelect,
+    __updateDateOnMonthSelect
   } = _a, others = __objRest(_a, [
+    "classNames",
+    "styles",
+    "unstyled",
+    "vars",
     "type",
     "defaultValue",
     "value",
@@ -56,7 +66,8 @@ const MonthPicker = forwardRef((props, ref) => {
     "allowSingleDateInRange",
     "allowDeselect",
     "onMouseLeave",
-    "onMonthSelect"
+    "onMonthSelect",
+    "__updateDateOnMonthSelect"
   ]);
   const { onDateChange, onRootMouseLeave, onHoveredDateChange, getControlProps } = useDatesState({
     type,
@@ -68,20 +79,31 @@ const MonthPicker = forwardRef((props, ref) => {
     onChange,
     onMouseLeave
   });
-  return /* @__PURE__ */ React.createElement(Calendar, __spreadValues({
-    ref,
-    minLevel: "year",
-    __updateDateOnMonthSelect: false,
-    __staticSelector: __staticSelector || "MonthPicker",
-    onMouseLeave: onRootMouseLeave,
-    onMonthMouseEnter: (_event, date) => onHoveredDateChange(date),
-    onMonthSelect: (date) => {
-      onDateChange(date);
-      onMonthSelect == null ? void 0 : onMonthSelect(date);
-    },
-    getMonthControlProps: (date) => __spreadValues(__spreadValues({}, getControlProps(date)), getMonthControlProps == null ? void 0 : getMonthControlProps(date))
-  }, others));
+  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi({
+    classNames,
+    styles,
+    props
+  });
+  return /* @__PURE__ */ React.createElement(
+    Calendar,
+    __spreadValues({
+      ref,
+      minLevel: "year",
+      __updateDateOnMonthSelect: __updateDateOnMonthSelect != null ? __updateDateOnMonthSelect : false,
+      __staticSelector: __staticSelector || "MonthPicker",
+      onMouseLeave: onRootMouseLeave,
+      onMonthMouseEnter: (_event, date) => onHoveredDateChange(date),
+      onMonthSelect: (date) => {
+        onDateChange(date);
+        onMonthSelect == null ? void 0 : onMonthSelect(date);
+      },
+      getMonthControlProps: (date) => __spreadValues(__spreadValues({}, getControlProps(date)), getMonthControlProps == null ? void 0 : getMonthControlProps(date)),
+      classNames: resolvedClassNames,
+      styles: resolvedStyles
+    }, others)
+  );
 });
+MonthPicker.classes = Calendar.classes;
 MonthPicker.displayName = "@mantine/dates/MonthPicker";
 
 export { MonthPicker };

package/esm/components/MonthPicker/MonthPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"MonthPicker.js","sources":["../../../src/components/MonthPicker/MonthPicker.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { useComponentDefaultProps } from '@mantine/core';\nimport { useDatesState } from '../../hooks';\nimport { DecadeLevelBaseSettings } from '../DecadeLevel';\nimport { YearLevelBaseSettings } from '../YearLevel';\nimport { PickerBaseProps, DatePickerType, CalendarLevel } from '../../types';\nimport { Calendar, CalendarBaseProps, CalendarSystemProps } from '../Calendar';\n\ntype MonthPickerLevel = Exclude<CalendarLevel, 'month'>;\n\nexport interface MonthPickerBaseProps<Type extends DatePickerType = 'default'>\n  extends PickerBaseProps<Type>,\n    DecadeLevelBaseSettings,\n    YearLevelBaseSettings,\n    Omit<CalendarBaseProps, 'onNextMonth' | 'onPreviousMonth'> {\n  /** Max level that user can go up to (decade, year), defaults to decade */\n  maxLevel?: MonthPickerLevel;\n\n  /** Initial level displayed to the user (decade, year, month), used for uncontrolled component */\n  defaultLevel?: MonthPickerLevel;\n\n  /** Current level displayed to the user (decade, year, month), used for controlled component */\n  level?: MonthPickerLevel;\n\n  /** Called when level changes */\n  onLevelChange?(level: MonthPickerLevel): void;\n}\n\nexport interface MonthPickerProps<Type extends DatePickerType = 'default'>\n  extends MonthPickerBaseProps<Type>,\n    CalendarSystemProps {}\n\nconst defaultProps: Partial<MonthPickerProps> = {\n  type: 'default',\n};\n\ntype MonthPickerComponent = (<Type extends DatePickerType = 'default'>(\n  props: MonthPickerProps<Type>\n) => JSX.Element) & { displayName?: string };\n\nexport const MonthPicker: MonthPickerComponent = forwardRef(\n  <Type extends DatePickerType = 'default'>(\n    props: MonthPickerProps<Type>,\n    ref: React.ForwardedRef<HTMLDivElement>\n  ) => {\n    const {\n      type,\n      defaultValue,\n      value,\n      onChange,\n      __staticSelector,\n      getMonthControlProps,\n      allowSingleDateInRange,\n      allowDeselect,\n      onMouseLeave,\n      onMonthSelect,\n      ...others\n    } = useComponentDefaultProps('MonthPicker', defaultProps, props as any);\n\n    const { onDateChange, onRootMouseLeave, onHoveredDateChange, getControlProps } =\n      useDatesState<Type>({\n        type,\n        level: 'month',\n        allowDeselect,\n        allowSingleDateInRange,\n        value,\n        defaultValue,\n        onChange,\n        onMouseLeave,\n      });\n\n    return (\n      <Calendar\n        ref={ref}\n        minLevel=\"year\"\n        __updateDateOnMonthSelect={false}\n        __staticSelector={__staticSelector || 'MonthPicker'}\n        onMouseLeave={onRootMouseLeave}\n        onMonthMouseEnter={(_event, date) => onHoveredDateChange(date)}\n        onMonthSelect={(date) => {\n          onDateChange(date);\n          onMonthSelect?.(date);\n        }}\n        getMonthControlProps={(date) => ({\n          ...getControlProps(date),\n          ...getMonthControlProps?.(date),\n        })}\n        {...others}\n      />\n    );\n  }\n);\n\nMonthPicker.displayName = '@mantine/dates/MonthPicker';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"MonthPicker.js","sources":["../../../src/components/MonthPicker/MonthPicker.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  BoxProps,\n  StylesApiProps,\n  factory,\n  ElementProps,\n  useProps,\n  Factory,\n  useResolvedStylesApi,\n  MantineComponentStaticProperties,\n} from '@mantine/core';\nimport { useDatesState } from '../../hooks';\nimport { DecadeLevelBaseSettings } from '../DecadeLevel';\nimport { YearLevelBaseSettings } from '../YearLevel';\nimport { PickerBaseProps, DatePickerType, CalendarLevel } from '../../types';\nimport { Calendar, CalendarBaseProps } from '../Calendar';\nimport { DecadeLevelGroupStylesNames } from '../DecadeLevelGroup';\nimport { YearLevelGroupStylesNames } from '../YearLevelGroup';\n\nexport type MonthPickerStylesNames = DecadeLevelGroupStylesNames | YearLevelGroupStylesNames;\n\ntype MonthPickerLevel = Exclude<CalendarLevel, 'month'>;\n\nexport interface MonthPickerBaseProps<Type extends DatePickerType = 'default'>\n  extends PickerBaseProps<Type>,\n    DecadeLevelBaseSettings,\n    YearLevelBaseSettings,\n    Omit<CalendarBaseProps, 'onNextMonth' | 'onPreviousMonth'> {\n  /** Max level that user can go up to (decade, year), defaults to decade */\n  maxLevel?: MonthPickerLevel;\n\n  /** Initial level displayed to the user (decade, year, month), used for uncontrolled component */\n  defaultLevel?: MonthPickerLevel;\n\n  /** Current level displayed to the user (decade, year, month), used for controlled component */\n  level?: MonthPickerLevel;\n\n  /** Called when level changes */\n  onLevelChange?(level: MonthPickerLevel): void;\n}\n\nexport interface MonthPickerProps<Type extends DatePickerType = 'default'>\n  extends BoxProps,\n    MonthPickerBaseProps<Type>,\n    StylesApiProps<MonthPickerFactory>,\n    ElementProps<'div', 'onChange' | 'value' | 'defaultValue'> {\n  /** Called when month is selected */\n  onMonthSelect?(date: Date): void;\n}\n\nexport type MonthPickerFactory = Factory<{\n  props: MonthPickerProps;\n  ref: HTMLDivElement;\n  stylesNames: MonthPickerStylesNames;\n}>;\n\nconst defaultProps: Partial<MonthPickerProps> = {\n  type: 'default',\n};\n\ntype MonthPickerComponent = (<Type extends DatePickerType = 'default'>(\n  props: MonthPickerProps<Type>\n) => JSX.Element) & { displayName?: string } & MantineComponentStaticProperties<MonthPickerFactory>;\n\nexport const MonthPicker: MonthPickerComponent = factory<MonthPickerFactory>((_props, ref) => {\n  const props = useProps('MonthPicker', defaultProps, _props);\n  const {\n    classNames,\n    styles,\n    unstyled,\n    vars,\n    type,\n    defaultValue,\n    value,\n    onChange,\n    __staticSelector,\n    getMonthControlProps,\n    allowSingleDateInRange,\n    allowDeselect,\n    onMouseLeave,\n    onMonthSelect,\n    __updateDateOnMonthSelect,\n    ...others\n  } = props;\n\n  const { onDateChange, onRootMouseLeave, onHoveredDateChange, getControlProps } = useDatesState({\n    type: type as any,\n    level: 'month',\n    allowDeselect,\n    allowSingleDateInRange,\n    value,\n    defaultValue,\n    onChange,\n    onMouseLeave,\n  });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<MonthPickerFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  return (\n    <Calendar\n      ref={ref}\n      minLevel=\"year\"\n      __updateDateOnMonthSelect={__updateDateOnMonthSelect ?? false}\n      __staticSelector={__staticSelector || 'MonthPicker'}\n      onMouseLeave={onRootMouseLeave}\n      onMonthMouseEnter={(_event, date) => onHoveredDateChange(date)}\n      onMonthSelect={(date) => {\n        onDateChange(date);\n        onMonthSelect?.(date);\n      }}\n      getMonthControlProps={(date) => ({\n        ...getControlProps(date),\n        ...getMonthControlProps?.(date),\n      })}\n      classNames={resolvedClassNames}\n      styles={resolvedStyles}\n      {...others}\n    />\n  );\n}) as any;\n\nMonthPicker.classes = Calendar.classes;\nMonthPicker.displayName = '@mantine/dates/MonthPicker';\n"],"names":[],"mappings":"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"}

package/esm/components/MonthPickerInput/MonthPickerInput.js

@@ -1,5 +1,5 @@
-import React, { forwardRef } from 'react';
-import { useComponentDefaultProps } from '@mantine/core';
+import React from 'react';
+import { factory, useProps, useResolvedStylesApi } from '@mantine/core';
 import { pickCalendarProps } from '../Calendar/pick-calendar-levels-props/pick-calendar-levels-props.js';
 import { useDatesInput } from '../../hooks/use-dates-input/use-dates-input.js';
 import { PickerInputBase } from '../PickerInputBase/PickerInputBase.js';
@@ -42,99 +42,119 @@ const defaultProps = {
   valueFormat: "MMMM YYYY",
   closeOnChange: true,
   sortDates: true,
-  dropdownType: "popover"
+  dropdownType: "popover",
+  size: "sm"
 };
-const MonthPickerInput = forwardRef((props, ref) => {
-  const _a = useComponentDefaultProps("MonthPickerInput", defaultProps, props), {
-    type,
-    value,
-    defaultValue,
-    onChange,
-    valueFormat,
-    labelSeparator,
-    locale,
-    classNames,
-    styles,
-    unstyled,
-    closeOnChange,
-    variant,
-    size,
-    dropdownType,
-    sortDates,
-    minDate,
-    maxDate
-  } = _a, rest = __objRest(_a, [
-    "type",
-    "value",
-    "defaultValue",
-    "onChange",
-    "valueFormat",
-    "labelSeparator",
-    "locale",
-    "classNames",
-    "styles",
-    "unstyled",
-    "closeOnChange",
-    "variant",
-    "size",
-    "dropdownType",
-    "sortDates",
-    "minDate",
-    "maxDate"
-  ]);
-  const { calendarProps, others } = pickCalendarProps(rest);
-  const {
-    _value,
-    setValue,
-    formattedValue,
-    dropdownHandlers,
-    dropdownOpened,
-    onClear,
-    shouldClear
-  } = useDatesInput({
-    type,
-    value,
-    defaultValue,
-    onChange,
-    locale,
-    format: valueFormat,
-    labelSeparator,
-    closeOnChange,
-    sortDates
-  });
-  return /* @__PURE__ */ React.createElement(PickerInputBase, __spreadValues({
-    formattedValue,
-    dropdownOpened,
-    dropdownHandlers,
-    classNames,
-    styles,
-    unstyled,
-    __staticSelector: "MonthPickerInput",
-    ref,
-    onClear,
-    shouldClear,
-    value: _value,
-    type,
-    variant,
-    size,
-    dropdownType
-  }, others), /* @__PURE__ */ React.createElement(MonthPicker, __spreadProps(__spreadValues({}, calendarProps), {
-    type,
-    value: _value,
-    defaultDate: Array.isArray(_value) ? _value[0] || getDefaultClampedDate({ maxDate, minDate }) : _value || getDefaultClampedDate({ maxDate, minDate }),
-    onChange: setValue,
-    locale,
-    classNames,
-    styles,
-    unstyled,
-    __staticSelector: "MonthPickerInput",
-    __stopPropagation: dropdownType === "popover",
-    variant,
-    size,
-    minDate,
-    maxDate
-  })));
-});
+const MonthPickerInput = factory(
+  (_props, ref) => {
+    const props = useProps("MonthPickerInput", defaultProps, _props);
+    const _a = props, {
+      type,
+      value,
+      defaultValue,
+      onChange,
+      valueFormat,
+      labelSeparator,
+      locale,
+      classNames,
+      styles,
+      unstyled,
+      closeOnChange,
+      size,
+      variant,
+      dropdownType,
+      sortDates,
+      minDate,
+      maxDate,
+      vars
+    } = _a, rest = __objRest(_a, [
+      "type",
+      "value",
+      "defaultValue",
+      "onChange",
+      "valueFormat",
+      "labelSeparator",
+      "locale",
+      "classNames",
+      "styles",
+      "unstyled",
+      "closeOnChange",
+      "size",
+      "variant",
+      "dropdownType",
+      "sortDates",
+      "minDate",
+      "maxDate",
+      "vars"
+    ]);
+    const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi({
+      classNames,
+      styles,
+      props
+    });
+    const { calendarProps, others } = pickCalendarProps(rest);
+    const {
+      _value,
+      setValue,
+      formattedValue,
+      dropdownHandlers,
+      dropdownOpened,
+      onClear,
+      shouldClear
+    } = useDatesInput({
+      type,
+      value,
+      defaultValue,
+      onChange,
+      locale,
+      format: valueFormat,
+      labelSeparator,
+      closeOnChange,
+      sortDates
+    });
+    return /* @__PURE__ */ React.createElement(
+      PickerInputBase,
+      __spreadProps(__spreadValues({
+        formattedValue,
+        dropdownOpened,
+        dropdownHandlers,
+        classNames: resolvedClassNames,
+        styles: resolvedStyles,
+        unstyled,
+        ref,
+        onClear,
+        shouldClear,
+        value: _value,
+        size,
+        variant,
+        dropdownType
+      }, others), {
+        type,
+        __staticSelector: "MonthPickerInput"
+      }),
+      /* @__PURE__ */ React.createElement(
+        MonthPicker,
+        __spreadProps(__spreadValues({}, calendarProps), {
+          size,
+          variant,
+          type,
+          value: _value,
+          defaultDate: Array.isArray(_value) ? _value[0] || getDefaultClampedDate({ maxDate, minDate }) : _value || getDefaultClampedDate({ maxDate, minDate }),
+          onChange: setValue,
+          locale,
+          classNames: resolvedClassNames,
+          styles: resolvedStyles,
+          unstyled,
+          __staticSelector: "MonthPickerInput",
+          __stopPropagation: dropdownType === "popover",
+          minDate,
+          maxDate
+        })
+      )
+    );
+  }
+);
+MonthPickerInput.classes = __spreadValues(__spreadValues({}, PickerInputBase.classes), MonthPicker.classes);
 MonthPickerInput.displayName = "@mantine/dates/MonthPickerInput";
 
 export { MonthPickerInput };