@mantine/schedule 9.0.0-alpha.7 → 9.0.1

package/esm/hooks/use-slot-drag-select.mjs

@@ -1,11 +1,10 @@
 "use client";
-import { useCallback, useEffect, useRef, useState } from "react";
+import { useCallback, useEffect, useEffectEvent, useRef, useState } from "react";
 //#region packages/@mantine/schedule/src/hooks/use-slot-drag-select.ts
 function useSlotDragSelect({ enabled = true, onDragEnd }) {
 	const [selectedRange, setSelectedRange] = useState(null);
 	const dragRef = useRef(null);
-	const onDragEndRef = useRef(onDragEnd);
-	onDragEndRef.current = onDragEnd;
+	const stableOnDragEnd = useEffectEvent(onDragEnd || (() => {}));
 	const handleSlotPointerDown = useCallback((_event, index, group) => {
 		if (!enabled) return;
 		dragRef.current = {
@@ -49,7 +48,7 @@ function useSlotDragSelect({ enabled = true, onDragEnd }) {
 		const handlePointerUp = () => {
 			if (dragRef.current) {
 				const { startIndex, currentIndex, group } = dragRef.current;
-				if (startIndex !== currentIndex) onDragEndRef.current?.(Math.min(startIndex, currentIndex), Math.max(startIndex, currentIndex), group);
+				if (startIndex !== currentIndex) stableOnDragEnd(Math.min(startIndex, currentIndex), Math.max(startIndex, currentIndex), group);
 			}
 			dragRef.current = null;
 			setSelectedRange(null);

package/esm/hooks/use-slot-drag-select.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-slot-drag-select.mjs","names":[],"sources":["../../src/hooks/use-slot-drag-select.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\n\ninterface DragState {\n  group: string;\n  startIndex: number;\n  currentIndex: number;\n}\n\ninterface SelectedRange {\n  group: string;\n  start: number;\n  end: number;\n}\n\ninterface UseSlotDragSelectInput {\n  enabled?: boolean;\n  onDragEnd?: (startIndex: number, endIndex: number, group: string) => void;\n}\n\nexport function useSlotDragSelect({ enabled = true, onDragEnd }: UseSlotDragSelectInput) {\n  const [selectedRange, setSelectedRange] = useState<SelectedRange | null>(null);\n  const dragRef = useRef<DragState | null>(null);\n  const onDragEndRef = useRef(onDragEnd);\n  onDragEndRef.current = onDragEnd;\n\n  const handleSlotPointerDown = useCallback(\n    (_event: React.PointerEvent<HTMLButtonElement>, index: number, group: string) => {\n      if (!enabled) {\n        return;\n      }\n      dragRef.current = { group, startIndex: index, currentIndex: index };\n      setSelectedRange({ group, start: index, end: index });\n    },\n    [enabled]\n  );\n\n  const isDragging = selectedRange !== null;\n\n  useEffect(() => {\n    if (!isDragging) {\n      return undefined;\n    }\n\n    const savedUserSelect = document.body.style.userSelect;\n    document.body.style.userSelect = 'none';\n\n    const handlePointerMove = (e: PointerEvent) => {\n      if (!dragRef.current) {\n        return;\n      }\n\n      const elements = document.elementsFromPoint(e.clientX, e.clientY);\n      for (const el of elements) {\n        const indexAttr = (el as HTMLElement).getAttribute?.('data-drag-slot-index');\n        const groupAttr = (el as HTMLElement).getAttribute?.('data-drag-slot-group');\n        if (indexAttr != null && groupAttr != null) {\n          if (groupAttr === dragRef.current.group) {\n            const newIndex = Number(indexAttr);\n            if (!isNaN(newIndex) && newIndex !== dragRef.current.currentIndex) {\n              dragRef.current.currentIndex = newIndex;\n              setSelectedRange({\n                group: groupAttr,\n                start: Math.min(dragRef.current.startIndex, newIndex),\n                end: Math.max(dragRef.current.startIndex, newIndex),\n              });\n            }\n          }\n          break;\n        }\n      }\n    };\n\n    const handlePointerUp = () => {\n      if (dragRef.current) {\n        const { startIndex, currentIndex, group } = dragRef.current;\n        if (startIndex !== currentIndex) {\n          onDragEndRef.current?.(\n            Math.min(startIndex, currentIndex),\n            Math.max(startIndex, currentIndex),\n            group\n          );\n        }\n      }\n      dragRef.current = null;\n      setSelectedRange(null);\n    };\n\n    document.addEventListener('pointermove', handlePointerMove);\n    document.addEventListener('pointerup', handlePointerUp);\n\n    return () => {\n      document.body.style.userSelect = savedUserSelect;\n      document.removeEventListener('pointermove', handlePointerMove);\n      document.removeEventListener('pointerup', handlePointerUp);\n    };\n  }, [isDragging]);\n\n  const isSlotSelected = useCallback(\n    (index: number, group: string): boolean => {\n      if (!selectedRange || selectedRange.group !== group) {\n        return false;\n      }\n      return index >= selectedRange.start && index <= selectedRange.end;\n    },\n    [selectedRange]\n  );\n\n  return {\n    handleSlotPointerDown,\n    isSlotSelected,\n    isDragging,\n  };\n}\n"],"mappings":";;;AAmBA,SAAgB,kBAAkB,EAAE,UAAU,MAAM,aAAqC;CACvF,MAAM,CAAC,eAAe,oBAAoB,SAA+B,KAAK;CAC9E,MAAM,UAAU,OAAyB,KAAK;CAC9C,MAAM,eAAe,OAAO,UAAU;AACtC,cAAa,UAAU;CAEvB,MAAM,wBAAwB,aAC3B,QAA+C,OAAe,UAAkB;AAC/E,MAAI,CAAC,QACH;AAEF,UAAQ,UAAU;GAAE;GAAO,YAAY;GAAO,cAAc;GAAO;AACnE,mBAAiB;GAAE;GAAO,OAAO;GAAO,KAAK;GAAO,CAAC;IAEvD,CAAC,QAAQ,CACV;CAED,MAAM,aAAa,kBAAkB;AAErC,iBAAgB;AACd,MAAI,CAAC,WACH;EAGF,MAAM,kBAAkB,SAAS,KAAK,MAAM;AAC5C,WAAS,KAAK,MAAM,aAAa;EAEjC,MAAM,qBAAqB,MAAoB;AAC7C,OAAI,CAAC,QAAQ,QACX;GAGF,MAAM,WAAW,SAAS,kBAAkB,EAAE,SAAS,EAAE,QAAQ;AACjE,QAAK,MAAM,MAAM,UAAU;IACzB,MAAM,YAAa,GAAmB,eAAe,uBAAuB;IAC5E,MAAM,YAAa,GAAmB,eAAe,uBAAuB;AAC5E,QAAI,aAAa,QAAQ,aAAa,MAAM;AAC1C,SAAI,cAAc,QAAQ,QAAQ,OAAO;MACvC,MAAM,WAAW,OAAO,UAAU;AAClC,UAAI,CAAC,MAAM,SAAS,IAAI,aAAa,QAAQ,QAAQ,cAAc;AACjE,eAAQ,QAAQ,eAAe;AAC/B,wBAAiB;QACf,OAAO;QACP,OAAO,KAAK,IAAI,QAAQ,QAAQ,YAAY,SAAS;QACrD,KAAK,KAAK,IAAI,QAAQ,QAAQ,YAAY,SAAS;QACpD,CAAC;;;AAGN;;;;EAKN,MAAM,wBAAwB;AAC5B,OAAI,QAAQ,SAAS;IACnB,MAAM,EAAE,YAAY,cAAc,UAAU,QAAQ;AACpD,QAAI,eAAe,aACjB,cAAa,UACX,KAAK,IAAI,YAAY,aAAa,EAClC,KAAK,IAAI,YAAY,aAAa,EAClC,MACD;;AAGL,WAAQ,UAAU;AAClB,oBAAiB,KAAK;;AAGxB,WAAS,iBAAiB,eAAe,kBAAkB;AAC3D,WAAS,iBAAiB,aAAa,gBAAgB;AAEvD,eAAa;AACX,YAAS,KAAK,MAAM,aAAa;AACjC,YAAS,oBAAoB,eAAe,kBAAkB;AAC9D,YAAS,oBAAoB,aAAa,gBAAgB;;IAE3D,CAAC,WAAW,CAAC;AAYhB,QAAO;EACL;EACA,gBAZqB,aACpB,OAAe,UAA2B;AACzC,OAAI,CAAC,iBAAiB,cAAc,UAAU,MAC5C,QAAO;AAET,UAAO,SAAS,cAAc,SAAS,SAAS,cAAc;KAEhE,CAAC,cAAc,CAChB;EAKC;EACD"}
+{"version":3,"file":"use-slot-drag-select.mjs","names":[],"sources":["../../src/hooks/use-slot-drag-select.ts"],"sourcesContent":["import { useCallback, useEffect, useEffectEvent, useRef, useState } from 'react';\n\ninterface DragState {\n  group: string;\n  startIndex: number;\n  currentIndex: number;\n}\n\ninterface SelectedRange {\n  group: string;\n  start: number;\n  end: number;\n}\n\ninterface UseSlotDragSelectInput {\n  enabled?: boolean;\n  onDragEnd?: (startIndex: number, endIndex: number, group: string) => void;\n}\n\nexport function useSlotDragSelect({ enabled = true, onDragEnd }: UseSlotDragSelectInput) {\n  const [selectedRange, setSelectedRange] = useState<SelectedRange | null>(null);\n  const dragRef = useRef<DragState | null>(null);\n  const stableOnDragEnd = useEffectEvent(onDragEnd || (() => {}));\n\n  const handleSlotPointerDown = useCallback(\n    (_event: React.PointerEvent<HTMLButtonElement>, index: number, group: string) => {\n      if (!enabled) {\n        return;\n      }\n      dragRef.current = { group, startIndex: index, currentIndex: index };\n      setSelectedRange({ group, start: index, end: index });\n    },\n    [enabled]\n  );\n\n  const isDragging = selectedRange !== null;\n\n  useEffect(() => {\n    if (!isDragging) {\n      return undefined;\n    }\n\n    const savedUserSelect = document.body.style.userSelect;\n    document.body.style.userSelect = 'none';\n\n    const handlePointerMove = (e: PointerEvent) => {\n      if (!dragRef.current) {\n        return;\n      }\n\n      const elements = document.elementsFromPoint(e.clientX, e.clientY);\n      for (const el of elements) {\n        const indexAttr = (el as HTMLElement).getAttribute?.('data-drag-slot-index');\n        const groupAttr = (el as HTMLElement).getAttribute?.('data-drag-slot-group');\n        if (indexAttr != null && groupAttr != null) {\n          if (groupAttr === dragRef.current.group) {\n            const newIndex = Number(indexAttr);\n            if (!isNaN(newIndex) && newIndex !== dragRef.current.currentIndex) {\n              dragRef.current.currentIndex = newIndex;\n              setSelectedRange({\n                group: groupAttr,\n                start: Math.min(dragRef.current.startIndex, newIndex),\n                end: Math.max(dragRef.current.startIndex, newIndex),\n              });\n            }\n          }\n          break;\n        }\n      }\n    };\n\n    const handlePointerUp = () => {\n      if (dragRef.current) {\n        const { startIndex, currentIndex, group } = dragRef.current;\n        if (startIndex !== currentIndex) {\n          stableOnDragEnd(\n            Math.min(startIndex, currentIndex),\n            Math.max(startIndex, currentIndex),\n            group\n          );\n        }\n      }\n      dragRef.current = null;\n      setSelectedRange(null);\n    };\n\n    document.addEventListener('pointermove', handlePointerMove);\n    document.addEventListener('pointerup', handlePointerUp);\n\n    return () => {\n      document.body.style.userSelect = savedUserSelect;\n      document.removeEventListener('pointermove', handlePointerMove);\n      document.removeEventListener('pointerup', handlePointerUp);\n    };\n  }, [isDragging]);\n\n  const isSlotSelected = useCallback(\n    (index: number, group: string): boolean => {\n      if (!selectedRange || selectedRange.group !== group) {\n        return false;\n      }\n      return index >= selectedRange.start && index <= selectedRange.end;\n    },\n    [selectedRange]\n  );\n\n  return {\n    handleSlotPointerDown,\n    isSlotSelected,\n    isDragging,\n  };\n}\n"],"mappings":";;;AAmBA,SAAgB,kBAAkB,EAAE,UAAU,MAAM,aAAqC;CACvF,MAAM,CAAC,eAAe,oBAAoB,SAA+B,KAAK;CAC9E,MAAM,UAAU,OAAyB,KAAK;CAC9C,MAAM,kBAAkB,eAAe,oBAAoB,IAAI;CAE/D,MAAM,wBAAwB,aAC3B,QAA+C,OAAe,UAAkB;AAC/E,MAAI,CAAC,QACH;AAEF,UAAQ,UAAU;GAAE;GAAO,YAAY;GAAO,cAAc;GAAO;AACnE,mBAAiB;GAAE;GAAO,OAAO;GAAO,KAAK;GAAO,CAAC;IAEvD,CAAC,QAAQ,CACV;CAED,MAAM,aAAa,kBAAkB;AAErC,iBAAgB;AACd,MAAI,CAAC,WACH;EAGF,MAAM,kBAAkB,SAAS,KAAK,MAAM;AAC5C,WAAS,KAAK,MAAM,aAAa;EAEjC,MAAM,qBAAqB,MAAoB;AAC7C,OAAI,CAAC,QAAQ,QACX;GAGF,MAAM,WAAW,SAAS,kBAAkB,EAAE,SAAS,EAAE,QAAQ;AACjE,QAAK,MAAM,MAAM,UAAU;IACzB,MAAM,YAAa,GAAmB,eAAe,uBAAuB;IAC5E,MAAM,YAAa,GAAmB,eAAe,uBAAuB;AAC5E,QAAI,aAAa,QAAQ,aAAa,MAAM;AAC1C,SAAI,cAAc,QAAQ,QAAQ,OAAO;MACvC,MAAM,WAAW,OAAO,UAAU;AAClC,UAAI,CAAC,MAAM,SAAS,IAAI,aAAa,QAAQ,QAAQ,cAAc;AACjE,eAAQ,QAAQ,eAAe;AAC/B,wBAAiB;QACf,OAAO;QACP,OAAO,KAAK,IAAI,QAAQ,QAAQ,YAAY,SAAS;QACrD,KAAK,KAAK,IAAI,QAAQ,QAAQ,YAAY,SAAS;QACpD,CAAC;;;AAGN;;;;EAKN,MAAM,wBAAwB;AAC5B,OAAI,QAAQ,SAAS;IACnB,MAAM,EAAE,YAAY,cAAc,UAAU,QAAQ;AACpD,QAAI,eAAe,aACjB,iBACE,KAAK,IAAI,YAAY,aAAa,EAClC,KAAK,IAAI,YAAY,aAAa,EAClC,MACD;;AAGL,WAAQ,UAAU;AAClB,oBAAiB,KAAK;;AAGxB,WAAS,iBAAiB,eAAe,kBAAkB;AAC3D,WAAS,iBAAiB,aAAa,gBAAgB;AAEvD,eAAa;AACX,YAAS,KAAK,MAAM,aAAa;AACjC,YAAS,oBAAoB,eAAe,kBAAkB;AAC9D,YAAS,oBAAoB,aAAa,gBAAgB;;IAE3D,CAAC,WAAW,CAAC;AAYhB,QAAO;EACL;EACA,gBAZqB,aACpB,OAAe,UAA2B;AACzC,OAAI,CAAC,iBAAiB,cAAc,UAAU,MAC5C,QAAO;AAET,UAAO,SAAS,cAAc,SAAS,SAAS,cAAc;KAEhE,CAAC,cAAc,CAChB;EAKC;EACD"}

package/lib/components/DayView/DayView.d.ts

@@ -135,3 +135,9 @@ export declare const DayView: import("@mantine/core").MantineComponent<{
     stylesNames: DayViewStylesNames;
     vars: DayViewCssVariables;
 }>;
+export declare namespace DayView {
+    type Props = DayViewProps;
+    type Factory = DayViewFactory;
+    type StylesNames = DayViewStylesNames;
+    type CssVariables = DayViewCssVariables;
+}

package/lib/components/DayView/index.d.ts

@@ -1,9 +1,3 @@
 import type { DayViewCssVariables, DayViewFactory, DayViewProps, DayViewStylesNames } from './DayView';
 export { DayView } from './DayView';
 export type { DayViewProps, DayViewFactory, DayViewStylesNames, DayViewCssVariables };
-export declare namespace DayView {
-    type Props = DayViewProps;
-    type Factory = DayViewFactory;
-    type StylesNames = DayViewStylesNames;
-    type CssVariables = DayViewCssVariables;
-}

package/lib/components/MonthView/MonthView.d.ts

@@ -112,3 +112,9 @@ export declare const MonthView: import("@mantine/core").MantineComponent<{
     stylesNames: MonthViewStylesNames;
     vars: MonthViewCssVariables;
 }>;
+export declare namespace MonthView {
+    type Props = MonthViewProps;
+    type Factory = MonthViewFactory;
+    type StylesNames = MonthViewStylesNames;
+    type CssVariables = MonthViewCssVariables;
+}

package/lib/components/MonthView/index.d.ts

@@ -1,9 +1,3 @@
 import type { MonthViewCssVariables, MonthViewFactory, MonthViewProps, MonthViewStylesNames } from './MonthView';
 export { MonthView } from './MonthView';
 export type { MonthViewProps, MonthViewFactory, MonthViewStylesNames, MonthViewCssVariables };
-export declare namespace MonthView {
-    type Props = MonthViewProps;
-    type Factory = MonthViewFactory;
-    type StylesNames = MonthViewStylesNames;
-    type CssVariables = MonthViewCssVariables;
-}

package/lib/components/WeekView/WeekView.d.ts

@@ -148,3 +148,9 @@ export declare const WeekView: import("@mantine/core").MantineComponent<{
     stylesNames: WeekViewStylesNames;
     vars: WeekViewCssVariables;
 }>;
+export declare namespace WeekView {
+    type Props = WeekViewProps;
+    type Factory = WeekViewFactory;
+    type StylesNames = WeekViewStylesNames;
+    type CssVariables = WeekViewCssVariables;
+}

package/lib/components/WeekView/index.d.ts

@@ -1,9 +1,3 @@
 import type { WeekViewCssVariables, WeekViewFactory, WeekViewProps, WeekViewStylesNames } from './WeekView';
 export { WeekView } from './WeekView';
 export type { WeekViewProps, WeekViewFactory, WeekViewStylesNames, WeekViewCssVariables };
-export declare namespace WeekView {
-    type Props = WeekViewProps;
-    type Factory = WeekViewFactory;
-    type StylesNames = WeekViewStylesNames;
-    type CssVariables = WeekViewCssVariables;
-}

package/lib/components/YearView/YearView.d.ts

@@ -51,3 +51,9 @@ export declare const YearView: import("@mantine/core").MantineComponent<{
     stylesNames: YearViewStylesNames;
     vars: YearViewCssVariables;
 }>;
+export declare namespace YearView {
+    type Props = YearViewProps;
+    type Factory = YearViewFactory;
+    type StylesNames = YearViewStylesNames;
+    type CssVariables = YearViewCssVariables;
+}

package/lib/components/YearView/index.d.ts

@@ -1,9 +1,3 @@
 import type { YearViewCssVariables, YearViewFactory, YearViewProps, YearViewStylesNames } from './YearView';
 export { YearView } from './YearView';
 export type { YearViewProps, YearViewFactory, YearViewStylesNames, YearViewCssVariables };
-export declare namespace YearView {
-    type Props = YearViewProps;
-    type Factory = YearViewFactory;
-    type StylesNames = YearViewStylesNames;
-    type CssVariables = YearViewCssVariables;
-}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mantine/schedule",
-  "version": "9.0.0-alpha.7",
+  "version": "9.0.1",
   "description": "Schedule Mantine component",
   "homepage": "https://mantine.dev/",
   "license": "MIT",
@@ -35,9 +35,9 @@
     "directory": "packages/@mantine/schedule"
   },
   "peerDependencies": {
-    "@mantine/core": "9.0.0-alpha.7",
-    "@mantine/dates": "9.0.0-alpha.7",
-    "@mantine/hooks": "9.0.0-alpha.7",
+    "@mantine/core": "9.0.1",
+    "@mantine/dates": "9.0.1",
+    "@mantine/hooks": "9.0.1",
     "react": "^19.2.0",
     "react-dom": "^19.2.0"
   },

package/styles.css

@@ -804,6 +804,8 @@
 
 .m_7b47db0e {
   user-select: none;
+  font-weight: var(--mantine-font-weight-semibold);
+  text-transform: capitalize;
 }
 
 .m_a20935f7 {
@@ -1007,6 +1009,8 @@
 
 .m_9a1cef3f {
   margin-bottom: var(--mantine-spacing-sm);
+  font-weight: var(--mantine-font-weight-semibold);
+  text-transform: capitalize;
 }
 
 .m_16b7da81 {
@@ -1054,6 +1058,14 @@
 
 .m_ea7c78ee {
   margin-top: calc(0.125rem * var(--mantine-scale));
+  font-size: var(--mantine-font-size-xs);
+  color: var(--mantine-color-dimmed);
+}
+
+.m_bbac00f3 {
+  color: var(--mantine-color-dimmed);
+  text-align: center;
+  padding-block: var(--mantine-spacing-xl);
 }
 
 .m_8eceba9d {

package/styles.layer.css

@@ -804,6 +804,8 @@
 
 .m_7b47db0e {
   user-select: none;
+  font-weight: var(--mantine-font-weight-semibold);
+  text-transform: capitalize;
 }
 
 .m_a20935f7 {
@@ -1007,6 +1009,8 @@
 
 .m_9a1cef3f {
   margin-bottom: var(--mantine-spacing-sm);
+  font-weight: var(--mantine-font-weight-semibold);
+  text-transform: capitalize;
 }
 
 .m_16b7da81 {
@@ -1054,6 +1058,14 @@
 
 .m_ea7c78ee {
   margin-top: calc(0.125rem * var(--mantine-scale));
+  font-size: var(--mantine-font-size-xs);
+  color: var(--mantine-color-dimmed);
+}
+
+.m_bbac00f3 {
+  color: var(--mantine-color-dimmed);
+  text-align: center;
+  padding-block: var(--mantine-spacing-xl);
 }
 
 .m_8eceba9d {