flatten mirrorInfo

packages-premium

@@ -1 +1 @@
-Subproject commit bc50563f0597a9899f75507e9250497c4dabee08
+Subproject commit f1633c109a59826107958899f2f539e7400d0345

packages/core/src/common/slicing-utils.ts

@@ -146,7 +146,7 @@ export default abstract class Slicer<SegType extends Seg, ExtraArgs extends any[
       segs: this.sliceEventRanges(rangeRes.fg, extraArgs),
       affectedInstances: interaction.affectedEvents.instances,
       isEvent: interaction.isEvent,
-      sourceSeg: interaction.origSeg
+      interactingSeg: interaction.interactingSeg
     }
   }
 

packages/core/src/component/DateComponent.ts

@@ -26,7 +26,7 @@ export interface EventSegUiInteractionState {
   affectedInstances: EventInstanceHash
   segs: Seg[]
   isEvent: boolean
-  sourceSeg: any
+  interactingSeg: any
 }
 
 /*

packages/core/src/component/event-splitting.ts

@@ -154,7 +154,7 @@ export default abstract class Splitter<PropsType extends SplittableProps = Split
             affectedEvents: affectedStores[key] || EMPTY_EVENT_STORE,
             mutatedEvents: mutatedStores[key] || EMPTY_EVENT_STORE,
             isEvent: interaction.isEvent,
-            origSeg: interaction.origSeg
+            interactingSeg: interaction.interactingSeg
           }
         }
       }

packages/core/src/component/renderers/FgEventRenderer.ts

@@ -12,9 +12,12 @@ import { subrenderer, SubRenderer } from '../../vdom-util'
 
 export interface BaseFgEventRendererProps {
   segs: Seg[]
-  mirrorInfo?: any
   selectedInstanceId?: string
   hiddenInstances?: { [instanceId: string]: any }
+  isDragging: boolean
+  isResizing: boolean
+  isSelecting: boolean
+  interactingSeg?: any
 }
 
 export default abstract class FgEventRenderer<
@@ -41,7 +44,9 @@ export default abstract class FgEventRenderer<
 
     let { segs } = this.renderSegsPlain({
       segs: props.segs,
-      mirrorInfo: props.mirrorInfo
+      isDragging: props.isDragging,
+      isResizing: props.isResizing,
+      isSelecting: props.isSelecting
     })
 
     this.renderSelectedInstance({
@@ -84,11 +89,14 @@ export default abstract class FgEventRenderer<
 
 
   // doesn't worry about selection/hidden state
-  _renderSegsPlain({ segs, mirrorInfo } : { segs: Seg[], mirrorInfo: any }, context: ComponentContext) {
-    let isMirror = Boolean(mirrorInfo)
-    segs = this.renderSegEls(segs, mirrorInfo) // returns a subset!
+  _renderSegsPlain(
+    { segs, isDragging, isResizing, isSelecting } : { segs: Seg[], isDragging: boolean, isResizing: boolean, isSelecting: boolean },
+    context: ComponentContext
+  ) {
+    let isMirror = isDragging || isResizing || isSelecting
+    segs = this.renderSegEls(segs, isDragging, isResizing) // returns a subset!
 
-    triggerPositionedSegs(context, segs, false) // isMirror=false
+    triggerPositionedSegs(context, segs, isMirror)
 
     return { segs, isMirror }
   }
@@ -101,7 +109,7 @@ export default abstract class FgEventRenderer<
 
   // Renders and assigns an `el` property for each foreground event segment.
   // Only returns segments that successfully rendered.
-  renderSegEls(segs: Seg[], mirrorInfo) {
+  renderSegEls(segs: Seg[], isDragging: boolean, isResizing: boolean) {
     let html = ''
     let i
 
@@ -109,7 +117,7 @@ export default abstract class FgEventRenderer<
 
       // build a large concatenation of event segment HTML
       for (i = 0; i < segs.length; i++) {
-        html += this.renderSegHtml(segs[i], mirrorInfo)
+        html += this.renderSegHtml(segs[i], isDragging, isResizing)
       }
 
       // Grab individual elements from the combined HTML string. Use each as the default rendering.
@@ -122,19 +130,19 @@ export default abstract class FgEventRenderer<
         }
       })
 
-      segs = filterSegsViaEls(this.context, segs, Boolean(mirrorInfo))
+      segs = filterSegsViaEls(this.context, segs, isDragging || isResizing)
     }
 
     return segs
   }
 
 
-  abstract renderSegHtml(seg: Seg, mirrorInfo): string
+  abstract renderSegHtml(seg: Seg, isDragging: boolean, isResizing: boolean): string
 
 
   // Generic utility for generating the HTML classNames for an event segment's element
   // TODO: move to outside func
-  getSegClasses(seg: Seg, isDraggable, isResizable, mirrorInfo) {
+  getSegClasses(seg: Seg, isDraggable, isResizable, isDragging: boolean, isResizing: boolean) {
     let classes = [
       'fc-event',
       seg.isStart ? 'fc-start' : 'fc-not-start',
@@ -149,14 +157,14 @@ export default abstract class FgEventRenderer<
       classes.push('fc-resizable')
     }
 
-    if (mirrorInfo) {
+    if (isDragging || isResizing) {
       classes.push('fc-mirror')
 
-      if (mirrorInfo.isDragging) {
+      if (isDragging) {
         classes.push('fc-dragging')
       }
 
-      if (mirrorInfo.isResizing) {
+      if (isResizing) {
         classes.push('fc-resizing')
       }
     }

packages/core/src/interactions/event-interaction-state.ts

@@ -5,5 +5,5 @@ export interface EventInteractionState { // is this ever used alone?
   affectedEvents: EventStore
   mutatedEvents: EventStore
   isEvent: boolean
-  origSeg: Seg | null
+  interactingSeg: Seg | null
 }

packages/core/src/reducers/main.ts

@@ -161,7 +161,7 @@ function reduceEventDrag(currentDrag: EventInteractionState | null, action: Acti
         affectedEvents: newDrag.affectedEvents,
         mutatedEvents: newDrag.mutatedEvents,
         isEvent: newDrag.isEvent,
-        origSeg: newDrag.origSeg
+        interactingSeg: newDrag.interactingSeg
       }
 
     case 'UNSET_EVENT_DRAG':
@@ -182,7 +182,7 @@ function reduceEventResize(currentResize: EventInteractionState | null, action:
         affectedEvents: newResize.affectedEvents,
         mutatedEvents: newResize.mutatedEvents,
         isEvent: newResize.isEvent,
-        origSeg: newResize.origSeg
+        interactingSeg: newResize.interactingSeg
       }
 
     case 'UNSET_EVENT_RESIZE':

packages/daygrid/src/CellEvents.ts

@@ -13,7 +13,7 @@ export default abstract class CellEvents<Props extends BaseFgEventRendererProps>
 
 
   // Builds the HTML to be used for the default element for an individual segment
-  renderSegHtml(seg: Seg, mirrorInfo) {
+  renderSegHtml(seg: Seg, isDragging: boolean, isResizing: boolean) {
     let { context } = this
     let eventRange = seg.eventRange
     let eventDef = eventRange.def
@@ -22,7 +22,7 @@ export default abstract class CellEvents<Props extends BaseFgEventRendererProps>
     let isDraggable = computeEventDraggable(context, eventDef, eventUi)
     let isResizableFromStart = allDay && seg.isStart && computeEventStartResizable(context, eventDef, eventUi)
     let isResizableFromEnd = allDay && seg.isEnd && computeEventEndResizable(context, eventDef, eventUi)
-    let classes = this.getSegClasses(seg, isDraggable, isResizableFromStart || isResizableFromEnd, mirrorInfo)
+    let classes = this.getSegClasses(seg, isDraggable, isResizableFromStart || isResizableFromEnd, isDragging, isResizing)
     let skinCss = cssToStr(this.getSkinCss(eventUi))
     let timeHtml = ''
     let timeText

packages/daygrid/src/DayTile.tsx

@@ -65,7 +65,10 @@ export default class DayTile extends DateComponent<DayTileProps> {
       segs: props.fgSegs,
       segContainerEl: rootEl,
       selectedInstanceId: props.selectedInstanceId,
-      hiddenInstances: props.hiddenInstances
+      hiddenInstances: props.hiddenInstances,
+      isDragging: false,
+      isResizing: false,
+      isSelecting: false
     })
 
     this.context.calendar.releaseAfterSizingTriggers() // hack for eventPositioned

packages/daygrid/src/DayTileEvents.ts

@@ -20,9 +20,12 @@ export default class DayTileEvents extends CellEvents<DayTileEventsProps> {
   render(props: DayTileEventsProps, context: ComponentContext) {
     let segs = this.renderSegs({
       segs: props.segs,
-      mirrorInfo: props.mirrorInfo,
       selectedInstanceId: props.selectedInstanceId,
-      hiddenInstances: props.hiddenInstances
+      hiddenInstances: props.hiddenInstances,
+      isDragging: props.isDragging,
+      isResizing: props.isResizing,
+      isSelecting: props.isSelecting,
+      interactingSeg: props.interactingSeg
     })
 
     this.attachSegs({

packages/daygrid/src/Table.tsx

@@ -211,7 +211,10 @@ export default class Table extends BaseComponent<TableProps, TableState> {
       selectedInstanceId: props.eventSelection,
       hiddenInstances: // TODO: more convenient
         (props.eventDrag ? props.eventDrag.affectedInstances : null) ||
-        (props.eventResize ? props.eventResize.affectedInstances : null)
+        (props.eventResize ? props.eventResize.affectedInstances : null),
+      isDragging: false,
+      isResizing: false,
+      isSelecting: false
     })
 
     this.rowStructs = eventsRenderer.rowStructs
@@ -222,7 +225,10 @@ export default class Table extends BaseComponent<TableProps, TableState> {
         segs: props.eventResize.segs,
         rowEls,
         colCnt,
-        mirrorInfo: { isResizing: true, sourceSeg: props.eventResize.sourceSeg }
+        isDragging: false,
+        isResizing: true,
+        isSelecting: false,
+        interactingSeg: props.eventResize.interactingSeg
       })
     } else {
       this.renderMirrorEvents(false)

packages/daygrid/src/TableEvents.ts

@@ -32,16 +32,22 @@ export default class TableEvents extends CellEvents<TableEventsProps> {
   render(props: TableEventsProps, context: ComponentContext) {
     let segs = this.renderSegs({
       segs: props.segs,
-      mirrorInfo: props.mirrorInfo,
       selectedInstanceId: props.selectedInstanceId,
-      hiddenInstances: props.hiddenInstances
-    })
+      hiddenInstances: props.hiddenInstances,
+      isDragging: props.isDragging,
+      isResizing: props.isResizing,
+      isSelecting: props.isSelecting
+    }) // doesn't need interactingSeg
 
     this.rowStructs = this.attachSegs({
       segs,
       rowEls: props.rowEls,
       colCnt: props.colCnt,
-      renderIntro: props.renderIntro
+      renderIntro: props.renderIntro,
+      isDragging: props.isDragging,
+      isResizing: props.isResizing,
+      isSelecting: props.isSelecting,
+      interactingSeg: props.interactingSeg
     })
   }
 

packages/daygrid/src/TableMirrorEvents.ts

@@ -12,8 +12,7 @@ export default class TableMirrorEvents extends TableEvents {
 
 
 // Renders the given foreground event segments onto the grid
-function attachSegs({ segs, rowEls, colCnt, renderIntro, mirrorInfo }: TableEventsProps, context: ComponentContext) {
-  let sourceSeg = mirrorInfo && mirrorInfo.sourceSeg
+function attachSegs({ segs, rowEls, colCnt, renderIntro, interactingSeg }: TableEventsProps, context: ComponentContext) {
 
   let rowStructs = renderSegRows(segs, rowEls.length, colCnt, renderIntro, context)
 
@@ -24,8 +23,8 @@ function attachSegs({ segs, rowEls, colCnt, renderIntro, mirrorInfo }: TableEven
     let skeletonTop
 
     // If there is an original segment, match the top position. Otherwise, put it at the row's top level
-    if (sourceSeg && sourceSeg.row === row) {
-      skeletonTopEl = sourceSeg.el
+    if (interactingSeg && interactingSeg.row === row) {
+      skeletonTopEl = interactingSeg.el
     } else {
       skeletonTopEl = rowNode.querySelector('.fc-content-skeleton tbody')
 

packages/interaction/src/interactions-external/ExternalElementDragging.ts

@@ -75,7 +75,7 @@ export default class ExternalElementDragging {
       affectedEvents: createEmptyEventStore(),
       mutatedEvents: createEmptyEventStore(),
       isEvent: this.dragMeta!.create,
-      origSeg: null
+      interactingSeg: null
     }
 
     if (hit) {

packages/interaction/src/interactions/EventDragging.ts

@@ -143,7 +143,7 @@ export default class EventDragging extends Interaction { // TODO: rename to Even
       affectedEvents: relevantEvents,
       mutatedEvents: createEmptyEventStore(),
       isEvent: true,
-      origSeg: this.subjectSeg
+      interactingSeg: this.subjectSeg
     }
 
     if (hit) {
@@ -349,7 +349,7 @@ export default class EventDragging extends Interaction { // TODO: rename to Even
             affectedEvents: state.affectedEvents,
             mutatedEvents: createEmptyEventStore(),
             isEvent: true,
-            origSeg: state.origSeg
+            interactingSeg: state.interactingSeg
           }
         })
 

packages/interaction/src/interactions/EventResizing.ts

@@ -98,7 +98,7 @@ export default class EventDragging extends Interaction {
       affectedEvents: relevantEvents,
       mutatedEvents: createEmptyEventStore(),
       isEvent: true,
-      origSeg: this.draggingSeg
+      interactingSeg: this.draggingSeg
     }
 
     if (hit) {

packages/list/src/ListView.tsx

@@ -86,7 +86,10 @@ export default class ListView extends View {
       selectedInstanceId: props.eventSelection, // TODO: rename
       hiddenInstances: // TODO: more convenient
         (props.eventDrag ? props.eventDrag.affectedEvents.instances : null) ||
-        (props.eventResize ? props.eventResize.affectedEvents.instances : null)
+        (props.eventResize ? props.eventResize.affectedEvents.instances : null),
+      isDragging: false,
+      isResizing: false,
+      isSelecting: false
     })
   }
 

packages/list/src/ListViewEvents.tsx

@@ -29,9 +29,12 @@ export default class ListViewEvents extends FgEventRenderer<ListViewEventsProps>
   render(props: ListViewEventsProps, context: ComponentContext) {
     let segs = this.renderSegs({
       segs: props.segs,
-      mirrorInfo: props.mirrorInfo,
       selectedInstanceId: props.selectedInstanceId,
-      hiddenInstances: props.hiddenInstances
+      hiddenInstances: props.hiddenInstances,
+      isDragging: props.isDragging,
+      isResizing: props.isResizing,
+      isSelecting: props.isSelecting,
+      interactingSeg: props.interactingSeg
     })
 
     this.attachSegs({

packages/timegrid/src/TimeCols.tsx

@@ -220,7 +220,10 @@ export default class TimeCols extends BaseComponent<TimeColsProps> {
         selectedInstanceId: props.eventSelection,
         hiddenInstances: // TODO: more convenient
           (props.eventDrag ? props.eventDrag.affectedInstances : null) ||
-          (props.eventResize ? props.eventResize.affectedInstances : null)
+          (props.eventResize ? props.eventResize.affectedInstances : null),
+        isDragging: false,
+        isResizing: false,
+        isSelecting: false
       }),
       this.subrenderMirror(props, this.mirrorContainerEls, options)
     ]
@@ -232,21 +235,29 @@ export default class TimeCols extends BaseComponent<TimeColsProps> {
       return this.renderMirrorEvents({
         containerEls: mirrorContainerEls,
         segs: props.eventDrag.segs,
-        mirrorInfo: { isDragging: true, sourceSeg: props.eventDrag.sourceSeg }
+        isDragging: true,
+        isResizing: false,
+        isSelecting: false,
+        interactingSeg: props.eventDrag.interactingSeg
       })
 
     } else if (props.eventResize) {
       return this.renderMirrorEvents({
         containerEls: mirrorContainerEls,
         segs: props.eventResize.segs,
-        mirrorInfo: { isDragging: true, sourceSeg: props.eventResize.sourceSeg }
+        isDragging: true,
+        isResizing: false,
+        isSelecting: false,
+        interactingSeg: props.eventResize.interactingSeg
       })
 
     } else if (options.selectMirror) {
       return this.renderMirrorEvents({
         containerEls: mirrorContainerEls,
         segs: props.dateSelectionSegs,
-        mirrorInfo: { isSelecting: true }
+        isDragging: false,
+        isResizing: false,
+        isSelecting: true
       })
 
     } else {

packages/timegrid/src/TimeColsEvents.ts

@@ -30,9 +30,12 @@ export default class TimeColsEvents extends FgEventRenderer<TimeColsEventsProps>
 
     let segs = this.renderSegs({
       segs: props.segs,
-      mirrorInfo: props.mirrorInfo,
       selectedInstanceId: props.selectedInstanceId,
-      hiddenInstances: props.hiddenInstances
+      hiddenInstances: props.hiddenInstances,
+      isDragging: props.isDragging,
+      isResizing: props.isResizing,
+      isSelecting: props.isSelecting,
+      interactingSeg: props.interactingSeg
     })
 
     this.segsByCol = this.attachSegs({
@@ -149,7 +152,7 @@ export default class TimeColsEvents extends FgEventRenderer<TimeColsEventsProps>
 
 
   // Renders the HTML for a single event segment's default rendering
-  renderSegHtml(seg: Seg, mirrorInfo) {
+  renderSegHtml(seg: Seg, isDragging: boolean, isResizing: boolean) {
     let eventRange = seg.eventRange
     let eventDef = eventRange.def
     let eventUi = eventRange.ui
@@ -157,7 +160,7 @@ export default class TimeColsEvents extends FgEventRenderer<TimeColsEventsProps>
     let isDraggable = computeEventDraggable(this.context, eventDef, eventUi)
     let isResizableFromStart = seg.isStart && computeEventStartResizable(this.context, eventDef, eventUi)
     let isResizableFromEnd = seg.isEnd && computeEventEndResizable(this.context, eventDef, eventUi)
-    let classes = this.getSegClasses(seg, isDraggable, isResizableFromStart || isResizableFromEnd, mirrorInfo)
+    let classes = this.getSegClasses(seg, isDraggable, isResizableFromStart || isResizableFromEnd, isDragging, isResizing)
     let skinCss = cssToStr(this.getSkinCss(eventUi))
     let timeText
     let fullTimeText // more verbose time text. for the print stylesheet

packages/timegrid/src/TimeColsMirrorEvents.ts

@@ -8,10 +8,10 @@ export default class TimeColsMirrorEvents extends TimeColsEvents {
 
   generateSegCss(seg: Seg, timeGrid: TimeCols) {
     let cssProps = super.generateSegCss(seg, timeGrid)
-    let { sourceSeg } = this.props.mirrorInfo
+    let { interactingSeg } = this.props
 
-    if (sourceSeg && sourceSeg.col === seg.col) {
-      let sourceSegProps = super.generateSegCss(sourceSeg, timeGrid)
+    if (interactingSeg && interactingSeg.col === seg.col) {
+      let sourceSegProps = super.generateSegCss(interactingSeg, timeGrid)
 
       cssProps.left = sourceSegProps.left
       cssProps.right = sourceSegProps.right