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