fix: resize object opacity, context menu visibility
This commit is contained in:
1 parent
c02b26e8ae
commit
fbfa3aa54c
1 file changed
+9
-3
@@ -350,7 +350,10 @@
|
|||||||
onpointerdown={beginMarquee}
|
onpointerdown={beginMarquee}
|
||||||
oncontextmenu={(event) => {
|
oncontextmenu={(event) => {
|
||||||
if (!interactive || event.target !== event.currentTarget) return;
|
if (!interactive || event.target !== event.currentTarget) return;
|
||||||
event.preventDefault();
|
// The surrounding bits-ui ContextMenu.Trigger opens on the bubbling
|
||||||
|
// contextmenu event and prevents the native menu itself. Calling
|
||||||
|
// preventDefault() here makes the trigger treat the event as handled
|
||||||
|
// (it bails when defaultPrevented is set), leaving no menu at all.
|
||||||
oncontext?.(undefined, event);
|
oncontext?.(undefined, event);
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
@@ -363,7 +366,7 @@
|
|||||||
class:cursor-move={interactive && !element.locked}
|
class:cursor-move={interactive && !element.locked}
|
||||||
class:cursor-default={interactive && element.locked}
|
class:cursor-default={interactive && element.locked}
|
||||||
style="left:{element.x}px;top:{element.y}px;width:{element.width}px;height:{element.height}px;transform:rotate({element.rotation ??
|
style="left:{element.x}px;top:{element.y}px;width:{element.width}px;height:{element.height}px;transform:rotate({element.rotation ??
|
||||||
0}deg);opacity:{element.opacity ?? 1};touch-action:none;outline:{selected
|
0}deg);touch-action:none;outline:{selected
|
||||||
? `${selectedIds.length > 1 ? 1 : 2}px solid #ff006e`
|
? `${selectedIds.length > 1 ? 1 : 2}px solid #ff006e`
|
||||||
: 'none'};outline-offset:2px;"
|
: 'none'};outline-offset:2px;"
|
||||||
role={interactive ? 'button' : undefined}
|
role={interactive ? 'button' : undefined}
|
||||||
@@ -372,7 +375,7 @@
|
|||||||
onpointerdown={(event) => beginDrag(event, element)}
|
onpointerdown={(event) => beginDrag(event, element)}
|
||||||
oncontextmenu={(event) => {
|
oncontextmenu={(event) => {
|
||||||
if (!interactive) return;
|
if (!interactive) return;
|
||||||
event.preventDefault();
|
// Let the event bubble so the editor's ContextMenu.Trigger can open.
|
||||||
oncontext?.(element.id, event);
|
oncontext?.(element.id, event);
|
||||||
}}
|
}}
|
||||||
onkeydown={(event) => {
|
onkeydown={(event) => {
|
||||||
@@ -382,6 +385,8 @@
|
|||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
|
<!-- Opacity lives on the content wrapper so selection chrome stays fully opaque. -->
|
||||||
|
<div class="h-full w-full" style="opacity:{element.opacity ?? 1};">
|
||||||
{#if element.type === 'text'}
|
{#if element.type === 'text'}
|
||||||
<div
|
<div
|
||||||
class="h-full w-full overflow-hidden"
|
class="h-full w-full overflow-hidden"
|
||||||
@@ -437,6 +442,7 @@
|
|||||||
: 'none'};"
|
: 'none'};"
|
||||||
></div>
|
></div>
|
||||||
{/if}
|
{/if}
|
||||||
|
</div>
|
||||||
|
|
||||||
{#if singleSelected && !element.locked}
|
{#if singleSelected && !element.locked}
|
||||||
{#each resizeDirections as direction (direction)}
|
{#each resizeDirections as direction (direction)}
|
||||||
|
|||||||
Reference in new issue
Block a user