hongluan-business-ui
Version:
Hongluan Business Component Library for Vue 3
1 lines • 6.48 kB
Source Map (JSON)
{"version":3,"file":"dragger.mjs","sources":["../../../../../../packages/components/modeless-dialog/src/dragger.ts"],"sourcesContent":["import { useZIndex } from 'hongluan-ui'\nimport type { Nullable } from '@hongluan-business-ui/utils/types'\n\nimport type { Directive, DirectiveBinding } from 'vue'\n\nexport interface DialogElement extends HTMLDivElement {\n __dragger__: {\n offsetX: number\n offsetY: number\n cursor: string // init value\n zIndex: string // init value\n boundings: Nullable<[number, number, number, number]>\n rect: DOMRect\n moveHandler: (e: MouseEvent) => void\n upHandler: (e: MouseEvent) => void\n downHandler: (e: MouseEvent) => void\n }\n}\n\nconst initModelessDialogDragger = (dlg: DialogElement) => {\n const dragger = dlg.__dragger__\n const header = dlg.querySelector('.panel-header') as HTMLDivElement\n header.addEventListener('mousedown', dragger.downHandler)\n header.style.cursor = 'move'\n\n dragger.offsetX = 0\n dragger.offsetY = 0\n}\n\nconst resetModelessDialogDragger = (dlg: DialogElement) => {\n const dragger = dlg.__dragger__\n const header = dlg.querySelector('.panel-header') as HTMLDivElement\n header.removeEventListener('mousedown', dragger.downHandler)\n header.style.cursor = dragger.cursor\n}\n\nconst ModelessDialogDragger: Directive = {\n beforeMount: (dlg: DialogElement, params: DirectiveBinding) => {\n const { nextZIndex } = useZIndex()\n const header = dlg.querySelector('.panel-header') as HTMLDivElement\n dlg.__dragger__ = Object.assign({\n cursor: header.style.cursor,\n boundings: params.value.boundings,\n moveHandler: (e: MouseEvent) => {\n const dragger = dlg.__dragger__\n const rect = dragger.rect\n const boundings = dragger.boundings\n const left = (e.pageX - dragger.offsetX)\n const top = (e.pageY - dragger.offsetY)\n if (boundings) {\n if (left - 0.5 * rect.width >= boundings[0] && left + rect.width <= boundings[2]) {\n dlg.style.left = left + 'px'\n }\n if (top >= boundings[1] && top + rect.height <= boundings[3]) {\n dlg.style.top = top + 'px'\n }\n } else {\n dlg.style.left = left + 'px'\n dlg.style.top = top + 'px'\n }\n },\n upHandler: () => {\n const dragger = dlg.__dragger__\n dlg.style.zIndex = dragger.zIndex\n removeEventListener('mousemove', dragger.moveHandler)\n removeEventListener('mouseup', dragger.upHandler)\n },\n downHandler: (e: MouseEvent) => {\n const dragger = dlg.__dragger__\n dragger.zIndex = dlg.style.zIndex\n dlg.style.zIndex = String(nextZIndex())\n dragger.offsetX = (e.pageX - dlg.offsetLeft)\n dragger.offsetY = (e.pageY - dlg.offsetTop)\n dragger.rect = dlg.getBoundingClientRect()\n\n addEventListener('mousemove', dragger.moveHandler)\n addEventListener('mouseup', dragger.upHandler)\n },\n })\n\n params.value.drag && initModelessDialogDragger(dlg)\n },\n updated(dlg: DialogElement, binding: DirectiveBinding) {\n dlg.__dragger__.boundings = binding.value.boundings\n },\n beforeUnmount(dlg: DialogElement, binding: DirectiveBinding) {\n binding.value.drag && resetModelessDialogDragger(dlg)\n dlg.__dragger__ = null\n },\n}\n\nexport { ModelessDialogDragger }\n"],"names":[],"mappings":"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"}