@mantine/schedule 9.6.0 → 9.6.2

package/styles.layer.css

@@ -215,6 +215,37 @@
     cursor: default;
   }
 
+  .m_1ac94670:where([data-cascade]) {
+    z-index: var(--event-z-index, 3);
+    transition: z-index 0s;
+  }
+
+  .m_1ac94670:where([data-cascade]) .m_71699dc6 {
+      box-shadow: 0 0 0 1px var(--mantine-color-body);
+    }
+
+  @media (hover: hover) {
+
+  .m_1ac94670:where([data-cascade]):where(:not([data-resizing], [data-dragging])):hover {
+        z-index: var(--event-z-index-raised, 9);
+        transition-delay: var(--event-raise-delay, 600ms);
+  }
+}
+
+  @media (hover: none) {
+
+  .m_1ac94670:where([data-cascade]):where(:not([data-resizing], [data-dragging])):active {
+        z-index: var(--event-z-index-raised, 9);
+        transition-delay: var(--event-raise-delay, 600ms);
+  }
+}
+
+  /* Keyboard focus reveals a covered event immediately, hover waits for the dwell delay */
+
+  .m_1ac94670:where([data-cascade]):where(:not([data-resizing], [data-dragging])):where(:focus-visible) {
+        z-index: var(--event-z-index-raised, 9);
+      }
+
   .m_1ac94670:where([data-resizing]) {
     z-index: 10;
   }
@@ -233,6 +264,10 @@
   }
 }
 
+  .m_1ac94670:where([data-cascade][data-resizing]) {
+    z-index: var(--event-cascade-interaction-z-index, 999);
+  }
+
   .m_1ac94670:where([data-hanging='start'], [data-hanging='both'])::before {
       content: '';
       position: absolute;
@@ -751,6 +786,19 @@
   position: relative;
 }
 
+/* Cascade events stack with an unbounded z-index, keep them out of the sticky header's layer */
+
+.m_9389813:where(:has([data-cascade])) {
+    isolation: isolate;
+
+    /* Drag and resize feedback must stay above every cascade column */
+    --event-cascade-interaction-z-index: 999;
+  }
+
+.m_9389813:where(:has([data-cascade])) .m_2d4819df {
+      z-index: var(--event-cascade-interaction-z-index);
+    }
+
 .m_9389813:where(:first-of-type) .m_cd179e73:where([data-first]) {
     border-top-color: transparent;
   }
@@ -936,9 +984,82 @@
   }
 }
 
-.m_3c5fb2d5:where([data-event-interaction], [data-slot-dragging]) .m_c5cd9a77 {
+/* The resized edge repeatedly crosses the pointer, so hover feedback would flicker */
+
+@media (hover: hover) {
+
+  .m_c5cd9a77:where([data-resizing]):hover {
+      background-color: var(--bg-event-bg);
+  }
+}
+
+@media (hover: none) {
+
+  .m_c5cd9a77:where([data-resizing]):active {
+      background-color: var(--bg-event-bg);
+  }
+}
+
+.m_cddb9413 {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 40%;
+  max-width: calc(2.5rem * var(--mantine-scale));
+  height: calc(0.25rem * var(--mantine-scale));
+  border-radius: calc(0.125rem * var(--mantine-scale));
+  cursor: ns-resize;
+  pointer-events: all;
+  z-index: 4;
+  touch-action: none;
+  background-color: var(--bg-event-color);
+  opacity: 0;
+  transition: opacity 100ms ease;
+}
+
+.m_cddb9413::before {
+    content: '';
+    position: absolute;
+    inset: calc(-0.25rem * var(--mantine-scale)) calc(-0.375rem * var(--mantine-scale));
+  }
+
+.m_cddb9413:where([data-edge='top']) {
+    top: 0;
+  }
+
+.m_cddb9413:where([data-edge='bottom']) {
+    bottom: 0;
+  }
+
+.m_c5cd9a77:where(:hover, [data-resizing]) .m_cddb9413 {
+    opacity: 0.5;
+  }
+
+@media (hover: hover) {
+
+  .m_cddb9413:hover {
+    opacity: 0.8;
+  }
+}
+
+@media (hover: none) {
+
+  .m_cddb9413:active {
+    opacity: 0.8;
+  }
+}
+
+/* The resizing background event is the one that set `data-event-interaction`, so it must
+   keep capturing pointer events. */
+.m_3c5fb2d5:where([data-event-interaction], [data-slot-dragging])
+  .m_c5cd9a77:not([data-resizing]) {
   pointer-events: none;
 }
+.m_3c5fb2d5:where([data-event-interaction], [data-slot-dragging])
+  .m_c5cd9a77:not([data-resizing]) .m_cddb9413 {
+    pointer-events: none;
+    opacity: 0;
+  }
 
 .m_c6f08d70 {
   position: relative;
@@ -1816,16 +1937,100 @@
   }
 }
 
-.m_42b9032d:where([data-slot-dragging]) .m_41ce8f1f,
-.m_6b2099af:where([data-event-interaction]) .m_41ce8f1f,
-.m_6b2099af:where([data-all-day-dragging]) .m_41ce8f1f {
+/* The resized edge repeatedly crosses the pointer, so hover feedback would flicker */
+
+@media (hover: hover) {
+
+  .m_41ce8f1f:where([data-resizing]):hover {
+      background-color: var(--bg-event-bg);
+  }
+}
+
+@media (hover: none) {
+
+  .m_41ce8f1f:where([data-resizing]):active {
+      background-color: var(--bg-event-bg);
+  }
+}
+
+.m_b20accbb {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 40%;
+  max-width: calc(2.5rem * var(--mantine-scale));
+  height: calc(0.25rem * var(--mantine-scale));
+  border-radius: calc(0.125rem * var(--mantine-scale));
+  cursor: ns-resize;
+  pointer-events: all;
+  z-index: 4;
+  touch-action: none;
+  background-color: var(--bg-event-color);
+  opacity: 0;
+  transition: opacity 100ms ease;
+}
+
+.m_b20accbb::before {
+    content: '';
+    position: absolute;
+    inset: calc(-0.25rem * var(--mantine-scale)) calc(-0.375rem * var(--mantine-scale));
+  }
+
+.m_b20accbb:where([data-edge='top']) {
+    top: 0;
+  }
+
+.m_b20accbb:where([data-edge='bottom']) {
+    bottom: 0;
+  }
+
+.m_41ce8f1f:where(:hover, [data-resizing]) .m_b20accbb {
+    opacity: 0.5;
+  }
+
+@media (hover: hover) {
+
+  .m_b20accbb:hover {
+    opacity: 0.8;
+  }
+}
+
+@media (hover: none) {
+
+  .m_b20accbb:active {
+    opacity: 0.8;
+  }
+}
+
+/* The resizing background event is the one that set `data-event-interaction`, so it must
+   keep capturing pointer events. */
+.m_42b9032d:where([data-slot-dragging]) .m_41ce8f1f:not([data-resizing]),
+.m_6b2099af:where([data-event-interaction]) .m_41ce8f1f:not([data-resizing]),
+.m_6b2099af:where([data-all-day-dragging]) .m_41ce8f1f:not([data-resizing]) {
   pointer-events: none;
 }
+.m_42b9032d:where([data-slot-dragging]) .m_41ce8f1f:not([data-resizing]) .m_b20accbb, .m_6b2099af:where([data-event-interaction]) .m_41ce8f1f:not([data-resizing]) .m_b20accbb, .m_6b2099af:where([data-all-day-dragging]) .m_41ce8f1f:not([data-resizing]) .m_b20accbb {
+    pointer-events: none;
+    opacity: 0;
+  }
 
 .m_cd58ae46 {
   position: relative;
 }
 
+/* Cascade events stack with an unbounded z-index, keep them out of the sticky header's layer */
+
+.m_cd58ae46:where(:has([data-cascade])) {
+    isolation: isolate;
+
+    /* Drag and resize feedback must stay above every cascade column */
+    --event-cascade-interaction-z-index: 999;
+  }
+
+.m_cd58ae46:where(:has([data-cascade])) .m_e0da287 {
+      z-index: var(--event-cascade-interaction-z-index);
+    }
+
 .m_8ac0cbcd {
   display: block;
   width: 100%;
@@ -2749,6 +2954,22 @@
   }
 }
 
+/* The resized edge repeatedly crosses the pointer, so hover feedback would flicker */
+
+@media (hover: hover) {
+
+  .m_9cc838bf:where([data-resizing]):hover {
+      background-color: var(--bg-event-bg);
+  }
+}
+
+@media (hover: none) {
+
+  .m_9cc838bf:where([data-resizing]):active {
+      background-color: var(--bg-event-bg);
+  }
+}
+
 .m_d6d6dd52 {
   position: absolute;
   inset-inline: calc(0.0625rem * var(--mantine-scale));
@@ -2810,10 +3031,46 @@
   pointer-events: none;
 }
 
+/* The resizing background event is the one that set `data-event-interaction`, so it must
+   keep capturing pointer events. */
 .m_25154d8d:where([data-event-interaction], [data-slot-dragging])
-  .m_9cc838bf {
+  .m_9cc838bf:not([data-resizing]) {
   pointer-events: none;
 }
+.m_25154d8d:where([data-event-interaction], [data-slot-dragging])
+  .m_9cc838bf:not([data-resizing]) .m_97715629 {
+    pointer-events: none;
+    opacity: 0;
+  }
+
+.m_9cc838bf .m_97715629 {
+    background-color: var(--bg-event-color);
+  }
+
+.m_9cc838bf .m_97715629:where([data-edge='start']) {
+      left: 0;
+    }
+
+.m_9cc838bf .m_97715629:where([data-edge='end']) {
+      right: 0;
+    }
+
+.m_9cc838bf:hover .m_97715629 {
+    opacity: 0.5;
+  }
+
+.m_9cc838bf .m_97715629:hover {
+    opacity: 0.8;
+  }
+
+.m_9cc838bf:where([data-resizing]) .m_97715629:where([data-active]) {
+    opacity: 0.8;
+  }
+
+.m_9cc838bf:where([data-resizing]) .m_97715629:not([data-active]) {
+    opacity: 0;
+    pointer-events: none;
+  }
 
 .m_25154d8d:where([data-resizing]) * {
     cursor: ew-resize !important;
@@ -3190,6 +3447,22 @@
   }
 }
 
+/* The resized edge repeatedly crosses the pointer, so hover feedback would flicker */
+
+@media (hover: hover) {
+
+  .m_3c19323d:where([data-resizing]):hover {
+      background-color: var(--bg-event-bg);
+  }
+}
+
+@media (hover: none) {
+
+  .m_3c19323d:where([data-resizing]):active {
+      background-color: var(--bg-event-bg);
+  }
+}
+
 .m_682c45d0 {
   position: absolute;
   height: var(--resources-week-view-all-day-height);
@@ -3250,10 +3523,46 @@
   pointer-events: none;
 }
 
+/* The resizing background event is the one that set `data-event-interaction`, so it must
+   keep capturing pointer events. */
 .m_ed4c47cf:where([data-event-interaction], [data-slot-dragging])
-  .m_3c19323d {
+  .m_3c19323d:not([data-resizing]) {
   pointer-events: none;
 }
+.m_ed4c47cf:where([data-event-interaction], [data-slot-dragging])
+  .m_3c19323d:not([data-resizing]) .m_30c8fd6b {
+    pointer-events: none;
+    opacity: 0;
+  }
+
+.m_3c19323d .m_30c8fd6b {
+    background-color: var(--bg-event-color);
+  }
+
+.m_3c19323d .m_30c8fd6b:where([data-edge='start']) {
+      left: 0;
+    }
+
+.m_3c19323d .m_30c8fd6b:where([data-edge='end']) {
+      right: 0;
+    }
+
+.m_3c19323d:hover .m_30c8fd6b {
+    opacity: 0.5;
+  }
+
+.m_3c19323d .m_30c8fd6b:hover {
+    opacity: 0.8;
+  }
+
+.m_3c19323d:where([data-resizing]) .m_30c8fd6b:where([data-active]) {
+    opacity: 0.8;
+  }
+
+.m_3c19323d:where([data-resizing]) .m_30c8fd6b:not([data-active]) {
+    opacity: 0;
+    pointer-events: none;
+  }
 
 .m_ed4c47cf:where([data-resizing]) * {
     cursor: ew-resize !important;

package/cjs/components/ResourcesDayView/get-overlap-clusters/get-overlap-clusters.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"get-overlap-clusters.cjs","names":["isEventsOverlap"],"sources":["../../../../src/components/ResourcesDayView/get-overlap-clusters/get-overlap-clusters.ts"],"sourcesContent":["import { DayPositionedEventData } from '../../../types';\nimport { isEventsOverlap } from '../../../utils';\n\nexport function getOverlapClusters(events: DayPositionedEventData[]): DayPositionedEventData[][] {\n  const clusters: DayPositionedEventData[][] = [];\n  const assigned = new Set<number>();\n\n  for (let i = 0; i < events.length; i++) {\n    if (assigned.has(i)) {\n      continue;\n    }\n\n    const cluster: DayPositionedEventData[] = [events[i]];\n    assigned.add(i);\n\n    let j = 0;\n    while (j < cluster.length) {\n      for (let k = 0; k < events.length; k++) {\n        if (!assigned.has(k) && isEventsOverlap(cluster[j], events[k])) {\n          cluster.push(events[k]);\n          assigned.add(k);\n        }\n      }\n      j++;\n    }\n\n    clusters.push(cluster);\n  }\n\n  return clusters;\n}\n"],"mappings":";;;AAGA,SAAgB,mBAAmB,QAA8D;CAC/F,MAAM,WAAuC,CAAC;CAC9C,MAAM,2BAAW,IAAI,IAAY;CAEjC,KAAK,IAAI,IAAI,GAAG,IAAI,OAAO,QAAQ,KAAK;EACtC,IAAI,SAAS,IAAI,CAAC,GAChB;EAGF,MAAM,UAAoC,CAAC,OAAO,EAAE;EACpD,SAAS,IAAI,CAAC;EAEd,IAAI,IAAI;EACR,OAAO,IAAI,QAAQ,QAAQ;GACzB,KAAK,IAAI,IAAI,GAAG,IAAI,OAAO,QAAQ,KACjC,IAAI,CAAC,SAAS,IAAI,CAAC,KAAKA,0BAAAA,gBAAgB,QAAQ,IAAI,OAAO,EAAE,GAAG;IAC9D,QAAQ,KAAK,OAAO,EAAE;IACtB,SAAS,IAAI,CAAC;GAChB;GAEF;EACF;EAEA,SAAS,KAAK,OAAO;CACvB;CAEA,OAAO;AACT"}

package/esm/components/ResourcesDayView/get-overlap-clusters/get-overlap-clusters.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"get-overlap-clusters.mjs","names":[],"sources":["../../../../src/components/ResourcesDayView/get-overlap-clusters/get-overlap-clusters.ts"],"sourcesContent":["import { DayPositionedEventData } from '../../../types';\nimport { isEventsOverlap } from '../../../utils';\n\nexport function getOverlapClusters(events: DayPositionedEventData[]): DayPositionedEventData[][] {\n  const clusters: DayPositionedEventData[][] = [];\n  const assigned = new Set<number>();\n\n  for (let i = 0; i < events.length; i++) {\n    if (assigned.has(i)) {\n      continue;\n    }\n\n    const cluster: DayPositionedEventData[] = [events[i]];\n    assigned.add(i);\n\n    let j = 0;\n    while (j < cluster.length) {\n      for (let k = 0; k < events.length; k++) {\n        if (!assigned.has(k) && isEventsOverlap(cluster[j], events[k])) {\n          cluster.push(events[k]);\n          assigned.add(k);\n        }\n      }\n      j++;\n    }\n\n    clusters.push(cluster);\n  }\n\n  return clusters;\n}\n"],"mappings":";;;AAGA,SAAgB,mBAAmB,QAA8D;CAC/F,MAAM,WAAuC,CAAC;CAC9C,MAAM,2BAAW,IAAI,IAAY;CAEjC,KAAK,IAAI,IAAI,GAAG,IAAI,OAAO,QAAQ,KAAK;EACtC,IAAI,SAAS,IAAI,CAAC,GAChB;EAGF,MAAM,UAAoC,CAAC,OAAO,EAAE;EACpD,SAAS,IAAI,CAAC;EAEd,IAAI,IAAI;EACR,OAAO,IAAI,QAAQ,QAAQ;GACzB,KAAK,IAAI,IAAI,GAAG,IAAI,OAAO,QAAQ,KACjC,IAAI,CAAC,SAAS,IAAI,CAAC,KAAK,gBAAgB,QAAQ,IAAI,OAAO,EAAE,GAAG;IAC9D,QAAQ,KAAK,OAAO,EAAE;IACtB,SAAS,IAAI,CAAC;GAChB;GAEF;EACF;EAEA,SAAS,KAAK,OAAO;CACvB;CAEA,OAAO;AACT"}

package/lib/components/ResourcesDayView/get-overlap-clusters/get-overlap-clusters.d.ts

@@ -1,2 +0,0 @@
-import { DayPositionedEventData } from '../../../types';
-export declare function getOverlapClusters(events: DayPositionedEventData[]): DayPositionedEventData[][];