MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Type hover and selection indicators

This commit is contained in:
Andrew Kingston 2025-02-06 09:57:04 +00:00
parent f3555429df
commit a541603267
No known key found for this signature in database
2 changed files with 11 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
packages/client/src/components/preview/HoverIndicator.svelte
View File

@ -1,4 +1,4 @@
<script>
<script lang="ts">
import { onMount, onDestroy } from "svelte"
import IndicatorSet from "./IndicatorSet.svelte"
import { dndIsDragging, hoverStore, builderStore } from "stores"
@ -7,20 +7,24 @@
$: selectedComponentId = $builderStore.selectedComponentId
$: selected = componentId === selectedComponentId
const onMouseOver = e => {
const onMouseOver = (e: MouseEvent) => {
const target = e.target as HTMLElement
// Ignore if dragging
if (e.buttons > 0) {
return
}
let newId
if (e.target.classList.contains("anchor")) {
if (target.classList.contains("anchor")) {
// Handle resize anchors
newId = e.target.dataset.id
newId = target.dataset.id
} else {
// Handle normal components
const element = e.target.closest(".interactive.component:not(.root)")
newId = element?.dataset?.id
const element = target.closest(".interactive.component:not(.root)")
if (element instanceof HTMLElement) {
newId = element.dataset?.id
}
}
if (newId !== componentId) {

2
packages/client/src/components/preview/SelectionIndicator.svelte
View File

@ -1,4 +1,4 @@
<script>
<script lang="ts">
import { dndIsDragging, builderStore } from "@/stores"
import IndicatorSet from "./IndicatorSet.svelte"