interactions cant use the el prop on a seg anymore

packages/core/src/component/DateComponent.ts

@@ -18,8 +18,9 @@ export interface Seg {
   isStart: boolean
   isEnd: boolean
   eventRange?: EventRenderRange
-  el?: HTMLElement
   [otherProp: string]: any // TODO: remove this. extending Seg will handle this
+  el?: never
+  // NOTE: can sometimes have start/end, which are important values :(
 }
 
 export interface EventSegUiInteractionState {

packages/interaction/src/interactions/EventDragging.ts

@@ -29,6 +29,7 @@ export default class EventDragging extends Interaction { // TODO: rename to Even
   hitDragging: HitDragging
 
   // internal state
+  subjectEl: HTMLElement | null = null
   subjectSeg: Seg | null = null // the seg being selected/dragged
   isDragging: boolean = false
   eventRange: EventRenderRange | null = null
@@ -66,6 +67,7 @@ export default class EventDragging extends Interaction { // TODO: rename to Even
     let { mirror } = dragging
     let { options } = component.context
     let initialCalendar = component.context.calendar
+    this.subjectEl = ev.subjectEl as HTMLElement
     let subjectSeg = this.subjectSeg = getElSeg(ev.subjectEl as HTMLElement)!
     let eventRange = this.eventRange = subjectSeg.eventRange!
     let eventInstanceId = eventRange.instance!.instanceId
@@ -117,7 +119,7 @@ export default class EventDragging extends Interaction { // TODO: rename to Even
       initialCalendar.unselect(ev) // unselect *date* selection
       initialCalendar.publiclyTrigger('eventDragStart', [
         {
-          el: this.subjectSeg.el,
+          el: this.subjectEl,
           event: new EventApi(initialCalendar, eventRange.def, eventRange.instance),
           jsEvent: ev.origEvent as MouseEvent, // Is this always a mouse event? See #4655
           view: context.view
@@ -231,7 +233,7 @@ export default class EventDragging extends Interaction { // TODO: rename to Even
 
       initialCalendar.publiclyTrigger('eventDragStop', [
         {
-          el: this.subjectSeg.el,
+          el: this.subjectEl,
           event: eventApi,
           jsEvent: ev.origEvent as MouseEvent, // Is this always a mouse event? See #4655
           view: initialView

packages/interaction/src/interactions/EventResizing.ts

@@ -24,6 +24,7 @@ export default class EventDragging extends Interaction {
   hitDragging: HitDragging
 
   // internal state
+  draggingSegEl: HTMLElement | null = null
   draggingSeg: Seg | null = null // TODO: rename to resizingSeg? subjectSeg?
   eventRange: EventRenderRange | null = null
   relevantEvents: EventStore | null = null
@@ -52,7 +53,8 @@ export default class EventDragging extends Interaction {
 
   handlePointerDown = (ev: PointerDragEvent) => {
     let { component } = this
-    let seg = this.querySeg(ev)!
+    let segEl = this.querySegEl(ev)
+    let seg = getElSeg(segEl)
     let eventRange = this.eventRange = seg.eventRange!
 
     this.dragging.minDistance = component.context.options.eventDragMinDistance
@@ -73,12 +75,14 @@ export default class EventDragging extends Interaction {
       this.eventRange.instance!.instanceId
     )
 
-    this.draggingSeg = this.querySeg(ev)
+    let segEl = this.querySegEl(ev)
+    this.draggingSegEl = segEl
+    this.draggingSeg = getElSeg(segEl)
 
     calendar.unselect()
     calendar.publiclyTrigger('eventResizeStart', [
       {
-        el: this.draggingSeg.el,
+        el: segEl,
         event: new EventApi(calendar, eventRange.def, eventRange.instance),
         jsEvent: ev.origEvent as MouseEvent, // Is this always a mouse event? See #4655
         view
@@ -159,7 +163,7 @@ export default class EventDragging extends Interaction {
 
     calendar.publiclyTrigger('eventResizeStop', [
       {
-        el: this.draggingSeg.el,
+        el: this.draggingSegEl,
         event: eventApi,
         jsEvent: ev.origEvent as MouseEvent, // Is this always a mouse event? See #4655
         view
@@ -174,7 +178,7 @@ export default class EventDragging extends Interaction {
 
       calendar.publiclyTrigger('eventResize', [
         {
-          el: this.draggingSeg.el,
+          el: this.draggingSegEl,
           startDelta: this.validMutation.startDelta || createDuration(0),
           endDelta: this.validMutation.endDelta || createDuration(0),
           prevEvent: eventApi,
@@ -206,8 +210,8 @@ export default class EventDragging extends Interaction {
     // okay to keep eventInstance around. useful to set it in handlePointerDown
   }
 
-  querySeg(ev: PointerDragEvent): Seg | null {
-    return getElSeg(elementClosest(ev.subjectEl as HTMLElement, this.component.fgSegSelector))
+  querySegEl(ev: PointerDragEvent) {
+    return elementClosest(ev.subjectEl as HTMLElement, '.fc-event')
   }
 
 }