diff --git a/src/commands/view/SelectComponent.ts b/src/commands/view/SelectComponent.ts index eb0c6a36a..fe5b52408 100644 --- a/src/commands/view/SelectComponent.ts +++ b/src/commands/view/SelectComponent.ts @@ -4,7 +4,7 @@ import Component from '../../dom_components/model/Component'; import Toolbar from '../../dom_components/model/Toolbar'; import ToolbarView from '../../dom_components/view/ToolbarView'; import { isDoc, isTaggableNode, isVisible, off, on } from '../../utils/dom'; -import { getComponentView, getUnitFromValue, getViewEl, hasWin } from '../../utils/mixins'; +import { getComponentModel, getComponentView, getUnitFromValue, getViewEl, hasWin } from '../../utils/mixins'; import { CommandObject } from './CommandAbstract'; let showOffsets: boolean; @@ -110,25 +110,24 @@ export default { * @param {Object} e * @private */ - onHover(e: any) { - e.stopPropagation(); + onHover(ev: Event) { + ev.stopPropagation(); const { em } = this; - const trg = e.target; - const view = getComponentView(trg); + const el = ev.target as HTMLElement; + const view = getComponentView(el); const frameView = view?.frameView; - const $el = $(trg); - let model = $el.data('model'); + let model = view?.model; // Get first valid model if (!model) { - let parent = $el.parent(); - while (!model && parent.length && !isDoc(parent[0])) { - model = parent.data('model'); - parent = parent.parent(); + let parentEl = el.parentNode; + while (!model && parentEl && !isDoc(parentEl)) { + model = getComponentModel(parentEl); + parentEl = parentEl.parentNode; } } - this.currentDoc = trg.ownerDocument; + this.currentDoc = el.ownerDocument; em.setHovered(model, { useValid: true }); frameView && em.setCurrentFrame(frameView); }, diff --git a/src/utils/dom.ts b/src/utils/dom.ts index 15f3ac6e0..a5136ecec 100644 --- a/src/utils/dom.ts +++ b/src/utils/dom.ts @@ -19,7 +19,7 @@ const KEY_CHILD = 'children'; export const motionsEv = 'transitionend oTransitionEnd transitionend webkitTransitionEnd'; -export const isDoc = (el?: HTMLElement) => el && el.nodeType === 9; +export const isDoc = (el?: Node): el is Document => el?.nodeType === Node.DOCUMENT_NODE; export const removeEl = (el?: HTMLElement) => { const parent = el && el.parentNode; diff --git a/src/utils/mixins.ts b/src/utils/mixins.ts index 10d840b5a..d12d5611a 100644 --- a/src/utils/mixins.ts +++ b/src/utils/mixins.ts @@ -195,7 +195,11 @@ const isComponent = (obj: any) => obj && obj.toHTML; const isRule = (obj: any) => obj && obj.toCSS; const getViewEl = (el: any): T | undefined => el.__gjsv; -export const getComponentView = (el: HTMLElement) => getViewEl(el); + +export const getComponentView = (el: Node) => getViewEl(el); + +export const getComponentModel = (el: Node) => getComponentView(el)?.model; + const setViewEl = (el: any, view: any) => { el.__gjsv = view; };