ext/hyperframes
2
0
Fork 0
mirror of https://github.com/heygen-com/hyperframes.git synced 2026-09-03 12:54:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(registry): clear flowchart selection after click-away (#3262)

Browse Source
This commit is contained in:
Akshar Patel
2026-09-01 23:07:03 -04:00
committed by GitHub
parent aceaaebd68
commit aab3bfcd10
6 changed files with 10 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/catalog/blocks/flowchart-vertical.mdx
+2 -10
View File
@@ -144,6 +144,7 @@ That writes one file: `compositions/flowchart-vertical.html`.
/>
</svg>
</div>
<div class="selection-border"></div>
</div>
<div id="node-nocode" class="node blue" style="left: 600px; top: 960px">
Try no-code first
@@ -335,7 +336,6 @@ That writes one file: `compositions/flowchart-vertical.html`.
(function () {
const tl = gsap.timeline({ paused: true });
const S = "#flowchart-vertical";
const nodePython = document.querySelector(S + " #node-python");
const pythonText = document.querySelector(S + " #python-text");
// 1. Root node scales in
@@ -406,15 +406,7 @@ That writes one file: `compositions/flowchart-vertical.html`.
tl.to(S + " #cursor", { x: -1110, y: -1560, duration: 1, ease: "power1.inOut" }, "hold3");
// 10. Cursor clicks — selection border
tl.add(() => {
if (!nodePython) return;
if (!nodePython.querySelector(".selection-border")) {
const border = document.createElement("div");
border.className = "selection-border";
nodePython.appendChild(border);
}
gsap.set(S + " .selection-border", { opacity: 1 });
}, "hold3+=1");
tl.set(S + " .selection-border", { opacity: 1 }, "hold3+=1");
tl.to(
S + " #cursor",
docs/catalog/blocks/flowchart.mdx
+2 -10
View File
@@ -144,6 +144,7 @@ That writes one file: `compositions/flowchart.html`.
/>
</svg>
</div>
<div class="selection-border"></div>
</div>
<div id="node-nocode" class="node blue" style="left: 800px; top: 500px">
Try no-code first
@@ -335,7 +336,6 @@ That writes one file: `compositions/flowchart.html`.
(function () {
const tl = gsap.timeline({ paused: true });
const S = '[data-composition-id="flowchart"]';
const nodePython = document.querySelector(S + " #node-python");
const pythonText = document.querySelector(S + " #python-text");
// 1. Root node scales in
@@ -406,15 +406,7 @@ That writes one file: `compositions/flowchart.html`.
tl.to(S + " #cursor", { x: -1470, y: -540, duration: 1, ease: "power1.inOut" }, "hold3");
// 10. Cursor clicks — selection border
tl.add(() => {
if (!nodePython) return;
if (!nodePython.querySelector(".selection-border")) {
const border = document.createElement("div");
border.className = "selection-border";
nodePython.appendChild(border);
}
gsap.set(S + " .selection-border", { opacity: 1 });
}, "hold3+=1");
tl.set(S + " .selection-border", { opacity: 1 }, "hold3+=1");
tl.to(
S + " #cursor",
docs/public/catalog/blocks/flowchart-vertical.json
+1 -1
View File
File diff suppressed because one or more lines are too long
docs/public/catalog/blocks/flowchart.json
+1 -1
View File
File diff suppressed because one or more lines are too long
registry/blocks/flowchart-vertical/flowchart-vertical.html
Vendored
+2 -10
View File
@@ -119,6 +119,7 @@
/>
</svg>
</div>
<div class="selection-border"></div>
</div>
<div id="node-nocode" class="node blue" style="left: 600px; top: 960px">
Try no-code first
@@ -310,7 +311,6 @@
(function () {
const tl = gsap.timeline({ paused: true });
const S = "#flowchart-vertical";
const nodePython = document.querySelector(S + " #node-python");
const pythonText = document.querySelector(S + " #python-text");
// 1. Root node scales in
@@ -381,15 +381,7 @@
tl.to(S + " #cursor", { x: -1110, y: -1560, duration: 1, ease: "power1.inOut" }, "hold3");
// 10. Cursor clicks — selection border
tl.add(() => {
if (!nodePython) return;
if (!nodePython.querySelector(".selection-border")) {
const border = document.createElement("div");
border.className = "selection-border";
nodePython.appendChild(border);
}
gsap.set(S + " .selection-border", { opacity: 1 });
}, "hold3+=1");
tl.set(S + " .selection-border", { opacity: 1 }, "hold3+=1");
tl.to(
S + " #cursor",
registry/blocks/flowchart/flowchart.html
Vendored
+2 -10
View File
@@ -119,6 +119,7 @@
/>
</svg>
</div>
<div class="selection-border"></div>
</div>
<div id="node-nocode" class="node blue" style="left: 800px; top: 500px">
Try no-code first
@@ -310,7 +311,6 @@
(function () {
const tl = gsap.timeline({ paused: true });
const S = '[data-composition-id="flowchart"]';
const nodePython = document.querySelector(S + " #node-python");
const pythonText = document.querySelector(S + " #python-text");
// 1. Root node scales in
@@ -381,15 +381,7 @@
tl.to(S + " #cursor", { x: -1470, y: -540, duration: 1, ease: "power1.inOut" }, "hold3");
// 10. Cursor clicks — selection border
tl.add(() => {
if (!nodePython) return;
if (!nodePython.querySelector(".selection-border")) {
const border = document.createElement("div");
border.className = "selection-border";
nodePython.appendChild(border);
}
gsap.set(S + " .selection-border", { opacity: 1 });
}, "hold3+=1");
tl.set(S + " .selection-border", { opacity: 1 }, "hold3+=1");
tl.to(
S + " #cursor",