@ohhwells/bridge 0.1.52-next.137 → 0.1.53
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -30
- package/dist/index.cjs +431 -1160
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +407 -1136
- package/dist/index.js.map +1 -1
- package/dist/styles.css +0 -4
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -69,7 +69,7 @@ __export(index_exports, {
|
|
|
69
69
|
module.exports = __toCommonJS(index_exports);
|
|
70
70
|
|
|
71
71
|
// src/OhhwellsBridge.tsx
|
|
72
|
-
var
|
|
72
|
+
var import_react13 = __toESM(require("react"), 1);
|
|
73
73
|
var import_client = require("react-dom/client");
|
|
74
74
|
var import_react_dom2 = require("react-dom");
|
|
75
75
|
|
|
@@ -5341,342 +5341,6 @@ function CarouselOverlay({
|
|
|
5341
5341
|
);
|
|
5342
5342
|
}
|
|
5343
5343
|
|
|
5344
|
-
// src/ui/ai-section/AiSectionOverlay.tsx
|
|
5345
|
-
var import_react7 = require("react");
|
|
5346
|
-
var import_lucide_react5 = require("lucide-react");
|
|
5347
|
-
|
|
5348
|
-
// src/lib/sections.ts
|
|
5349
|
-
var LINK_PICKER_EXCLUDED_IDS = /* @__PURE__ */ new Set(["navbar", "footer"]);
|
|
5350
|
-
function titleCaseSectionId(id) {
|
|
5351
|
-
return id.split("-").filter(Boolean).map((w) => w.charAt(0).toUpperCase() + w.slice(1)).join(" ");
|
|
5352
|
-
}
|
|
5353
|
-
function parseSectionsFromRoot(root) {
|
|
5354
|
-
const seen = /* @__PURE__ */ new Set();
|
|
5355
|
-
const sections = [];
|
|
5356
|
-
for (const el of root.querySelectorAll("[data-ohw-section]")) {
|
|
5357
|
-
const id = el.getAttribute("data-ohw-section") ?? "";
|
|
5358
|
-
if (!id || seen.has(id) || LINK_PICKER_EXCLUDED_IDS.has(id)) continue;
|
|
5359
|
-
if (el.parentElement?.closest("[data-ohw-section]")) continue;
|
|
5360
|
-
seen.add(id);
|
|
5361
|
-
const label = el.getAttribute("data-ohw-section-label") ?? titleCaseSectionId(id);
|
|
5362
|
-
sections.push({ id, label });
|
|
5363
|
-
}
|
|
5364
|
-
return sections;
|
|
5365
|
-
}
|
|
5366
|
-
function collectSectionsFromDom() {
|
|
5367
|
-
if (typeof document === "undefined") return [];
|
|
5368
|
-
return parseSectionsFromRoot(document);
|
|
5369
|
-
}
|
|
5370
|
-
function parseSectionsFromHtml(html) {
|
|
5371
|
-
const doc = new DOMParser().parseFromString(html, "text/html");
|
|
5372
|
-
return parseSectionsFromRoot(doc);
|
|
5373
|
-
}
|
|
5374
|
-
|
|
5375
|
-
// src/ui/ai-section/AiSectionOverlay.tsx
|
|
5376
|
-
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
5377
|
-
function readRect(sectionId) {
|
|
5378
|
-
const el = document.querySelector(`[data-ohw-section="${CSS.escape(sectionId)}"]`);
|
|
5379
|
-
if (!el) return null;
|
|
5380
|
-
const r2 = el.getBoundingClientRect();
|
|
5381
|
-
if (r2.width <= 0 || r2.height <= 0) return null;
|
|
5382
|
-
return { top: r2.top, left: r2.left, width: r2.width, height: r2.height };
|
|
5383
|
-
}
|
|
5384
|
-
function useLiveSectionRect(sectionId) {
|
|
5385
|
-
const [rect, setRect] = (0, import_react7.useState)(null);
|
|
5386
|
-
(0, import_react7.useEffect)(() => {
|
|
5387
|
-
if (!sectionId) {
|
|
5388
|
-
setRect(null);
|
|
5389
|
-
return;
|
|
5390
|
-
}
|
|
5391
|
-
const update = () => {
|
|
5392
|
-
const next = readRect(sectionId);
|
|
5393
|
-
setRect(
|
|
5394
|
-
(prev) => prev && next && prev.top === next.top && prev.left === next.left && prev.width === next.width && prev.height === next.height ? prev : next
|
|
5395
|
-
);
|
|
5396
|
-
};
|
|
5397
|
-
update();
|
|
5398
|
-
const opts = { capture: true, passive: true };
|
|
5399
|
-
window.addEventListener("scroll", update, opts);
|
|
5400
|
-
window.addEventListener("resize", update);
|
|
5401
|
-
const el = document.querySelector(`[data-ohw-section="${CSS.escape(sectionId)}"]`);
|
|
5402
|
-
const ro = el ? new ResizeObserver(update) : null;
|
|
5403
|
-
if (el && ro) ro.observe(el);
|
|
5404
|
-
const interval = setInterval(update, 500);
|
|
5405
|
-
return () => {
|
|
5406
|
-
window.removeEventListener("scroll", update, opts);
|
|
5407
|
-
window.removeEventListener("resize", update);
|
|
5408
|
-
ro?.disconnect();
|
|
5409
|
-
clearInterval(interval);
|
|
5410
|
-
};
|
|
5411
|
-
}, [sectionId]);
|
|
5412
|
-
return rect;
|
|
5413
|
-
}
|
|
5414
|
-
var PRIMARY2 = "#0885FE";
|
|
5415
|
-
function edgeAwareRadius(rect) {
|
|
5416
|
-
const container = window.innerWidth <= 480 ? 16 : 24;
|
|
5417
|
-
const docHeight = document.documentElement.scrollHeight;
|
|
5418
|
-
const atTop = rect.top + window.scrollY <= 4;
|
|
5419
|
-
const atBottom = rect.top + rect.height + window.scrollY >= docHeight - 4;
|
|
5420
|
-
const top = atTop ? container : 4;
|
|
5421
|
-
const bottom = atBottom ? container : 4;
|
|
5422
|
-
return `${top}px ${top}px ${bottom}px ${bottom}px`;
|
|
5423
|
-
}
|
|
5424
|
-
function ReviewButton({
|
|
5425
|
-
label,
|
|
5426
|
-
onClick,
|
|
5427
|
-
children,
|
|
5428
|
-
background,
|
|
5429
|
-
color
|
|
5430
|
-
}) {
|
|
5431
|
-
const [hover, setHover] = (0, import_react7.useState)(false);
|
|
5432
|
-
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { style: { position: "relative" }, children: [
|
|
5433
|
-
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5434
|
-
"button",
|
|
5435
|
-
{
|
|
5436
|
-
type: "button",
|
|
5437
|
-
"aria-label": label,
|
|
5438
|
-
onClick,
|
|
5439
|
-
onMouseEnter: () => setHover(true),
|
|
5440
|
-
onMouseLeave: () => setHover(false),
|
|
5441
|
-
style: {
|
|
5442
|
-
width: 32,
|
|
5443
|
-
height: 32,
|
|
5444
|
-
display: "flex",
|
|
5445
|
-
alignItems: "center",
|
|
5446
|
-
justifyContent: "center",
|
|
5447
|
-
borderRadius: 8,
|
|
5448
|
-
border: "none",
|
|
5449
|
-
cursor: "pointer",
|
|
5450
|
-
background,
|
|
5451
|
-
color,
|
|
5452
|
-
boxShadow: "0 2px 6px rgba(0,0,0,0.15)"
|
|
5453
|
-
},
|
|
5454
|
-
children
|
|
5455
|
-
}
|
|
5456
|
-
),
|
|
5457
|
-
hover && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5458
|
-
"div",
|
|
5459
|
-
{
|
|
5460
|
-
style: {
|
|
5461
|
-
position: "absolute",
|
|
5462
|
-
top: "100%",
|
|
5463
|
-
left: "50%",
|
|
5464
|
-
transform: "translateX(-50%)",
|
|
5465
|
-
marginTop: 6,
|
|
5466
|
-
background: "#0c0a09",
|
|
5467
|
-
color: "#ffffff",
|
|
5468
|
-
fontSize: 12,
|
|
5469
|
-
lineHeight: "16px",
|
|
5470
|
-
padding: "4px 8px",
|
|
5471
|
-
borderRadius: 8,
|
|
5472
|
-
whiteSpace: "nowrap",
|
|
5473
|
-
fontFamily: "Figtree, ui-sans-serif, system-ui, sans-serif",
|
|
5474
|
-
pointerEvents: "none"
|
|
5475
|
-
},
|
|
5476
|
-
children: label
|
|
5477
|
-
}
|
|
5478
|
-
)
|
|
5479
|
-
] });
|
|
5480
|
-
}
|
|
5481
|
-
function AiSectionOverlay({
|
|
5482
|
-
postToParent: postToParent2,
|
|
5483
|
-
apiRef
|
|
5484
|
-
}) {
|
|
5485
|
-
const [selectedId, setSelectedId] = (0, import_react7.useState)(null);
|
|
5486
|
-
const [reviewId, setReviewId] = (0, import_react7.useState)(null);
|
|
5487
|
-
const reviewIdRef = (0, import_react7.useRef)(null);
|
|
5488
|
-
reviewIdRef.current = reviewId;
|
|
5489
|
-
const selectedIdRef = (0, import_react7.useRef)(null);
|
|
5490
|
-
selectedIdRef.current = selectedId;
|
|
5491
|
-
const report = (0, import_react7.useCallback)(
|
|
5492
|
-
(el) => {
|
|
5493
|
-
postToParent2({
|
|
5494
|
-
type: "ow:section-selected",
|
|
5495
|
-
sectionId: el?.dataset.ohwSection ?? null,
|
|
5496
|
-
sectionLabel: el ? el.dataset.ohwSectionLabel ?? titleCaseSectionId(el.dataset.ohwSection ?? "") : null
|
|
5497
|
-
});
|
|
5498
|
-
},
|
|
5499
|
-
[postToParent2]
|
|
5500
|
-
);
|
|
5501
|
-
const selectFromElement = (0, import_react7.useCallback)(
|
|
5502
|
-
(el, options) => {
|
|
5503
|
-
const sectionEl = el?.closest("[data-ohw-section]") ?? null;
|
|
5504
|
-
const id = sectionEl?.dataset.ohwSection ?? null;
|
|
5505
|
-
if (id === selectedIdRef.current) return;
|
|
5506
|
-
setSelectedId(id);
|
|
5507
|
-
if (options?.report !== false) report(sectionEl);
|
|
5508
|
-
},
|
|
5509
|
-
[report]
|
|
5510
|
-
);
|
|
5511
|
-
(0, import_react7.useEffect)(() => {
|
|
5512
|
-
apiRef.current = {
|
|
5513
|
-
selectFromElement,
|
|
5514
|
-
handleBackgroundClick: (target, clientX, clientY) => {
|
|
5515
|
-
let sectionEl = target?.closest("[data-ohw-section]") ?? null;
|
|
5516
|
-
if (!sectionEl && clientX !== void 0 && clientY !== void 0) {
|
|
5517
|
-
const beneath = document.elementsFromPoint(clientX, clientY).find(
|
|
5518
|
-
(el) => el instanceof HTMLElement && !el.closest("[data-ohw-bridge-root]") && el.closest("[data-ohw-section]") != null
|
|
5519
|
-
);
|
|
5520
|
-
sectionEl = beneath?.closest("[data-ohw-section]") ?? null;
|
|
5521
|
-
}
|
|
5522
|
-
selectFromElement(sectionEl);
|
|
5523
|
-
return sectionEl != null;
|
|
5524
|
-
},
|
|
5525
|
-
clear: () => setSelectedId(null)
|
|
5526
|
-
};
|
|
5527
|
-
return () => {
|
|
5528
|
-
apiRef.current = null;
|
|
5529
|
-
};
|
|
5530
|
-
}, [apiRef, selectFromElement]);
|
|
5531
|
-
(0, import_react7.useEffect)(() => {
|
|
5532
|
-
const onMessage = (e) => {
|
|
5533
|
-
if (e.data?.type === "ow:ai-select" && e.data.sectionId === null) {
|
|
5534
|
-
setSelectedId(null);
|
|
5535
|
-
return;
|
|
5536
|
-
}
|
|
5537
|
-
if (e.data?.type === "ow:ai-review") {
|
|
5538
|
-
const sectionId = e.data.sectionId;
|
|
5539
|
-
if (sectionId === null) {
|
|
5540
|
-
setReviewId(null);
|
|
5541
|
-
return;
|
|
5542
|
-
}
|
|
5543
|
-
const found = readRect(sectionId) != null;
|
|
5544
|
-
setReviewId(found ? sectionId : null);
|
|
5545
|
-
postToParent2({ type: "ow:ai-review-started", sectionId, found });
|
|
5546
|
-
if (found) {
|
|
5547
|
-
document.querySelector(`[data-ohw-section="${CSS.escape(sectionId)}"]`)?.scrollIntoView({ behavior: "smooth", block: "nearest" });
|
|
5548
|
-
}
|
|
5549
|
-
}
|
|
5550
|
-
};
|
|
5551
|
-
window.addEventListener("message", onMessage);
|
|
5552
|
-
return () => window.removeEventListener("message", onMessage);
|
|
5553
|
-
}, [postToParent2]);
|
|
5554
|
-
const [hoveredId, setHoveredId] = (0, import_react7.useState)(null);
|
|
5555
|
-
(0, import_react7.useEffect)(() => {
|
|
5556
|
-
const onMove = (e) => {
|
|
5557
|
-
const t = e.target;
|
|
5558
|
-
if (!(t instanceof HTMLElement)) return;
|
|
5559
|
-
if (t.closest(
|
|
5560
|
-
"[data-ohw-toolbar], [data-ohw-edit-chrome], [data-ohw-item-interaction], [data-ohw-link-modal-root], [data-ohw-section-picker], [data-ohw-ai-review]"
|
|
5561
|
-
)) {
|
|
5562
|
-
setHoveredId(null);
|
|
5563
|
-
return;
|
|
5564
|
-
}
|
|
5565
|
-
const sec = t.closest("[data-ohw-section]");
|
|
5566
|
-
setHoveredId(sec?.dataset.ohwSection ?? null);
|
|
5567
|
-
};
|
|
5568
|
-
const onLeave = () => setHoveredId(null);
|
|
5569
|
-
document.addEventListener("mousemove", onMove, { passive: true });
|
|
5570
|
-
document.documentElement.addEventListener("mouseleave", onLeave);
|
|
5571
|
-
return () => {
|
|
5572
|
-
document.removeEventListener("mousemove", onMove);
|
|
5573
|
-
document.documentElement.removeEventListener("mouseleave", onLeave);
|
|
5574
|
-
};
|
|
5575
|
-
}, []);
|
|
5576
|
-
(0, import_react7.useEffect)(() => {
|
|
5577
|
-
const onKeyDown = (e) => {
|
|
5578
|
-
if (e.key !== "Escape") return;
|
|
5579
|
-
if (reviewIdRef.current) return;
|
|
5580
|
-
if (document.querySelector("[data-ohw-editing]")) return;
|
|
5581
|
-
if (selectedIdRef.current) {
|
|
5582
|
-
setSelectedId(null);
|
|
5583
|
-
report(null);
|
|
5584
|
-
}
|
|
5585
|
-
};
|
|
5586
|
-
document.addEventListener("keydown", onKeyDown);
|
|
5587
|
-
return () => document.removeEventListener("keydown", onKeyDown);
|
|
5588
|
-
}, [report]);
|
|
5589
|
-
const decide = (0, import_react7.useCallback)(
|
|
5590
|
-
(decision) => {
|
|
5591
|
-
const sectionId = reviewIdRef.current;
|
|
5592
|
-
if (!sectionId) return;
|
|
5593
|
-
setReviewId(null);
|
|
5594
|
-
postToParent2({ type: "ow:ai-review-decision", sectionId, decision });
|
|
5595
|
-
},
|
|
5596
|
-
[postToParent2]
|
|
5597
|
-
);
|
|
5598
|
-
const selectionRect = useLiveSectionRect(reviewId ? null : selectedId);
|
|
5599
|
-
const reviewRect = useLiveSectionRect(reviewId);
|
|
5600
|
-
const hoverRect = useLiveSectionRect(reviewId || hoveredId === selectedId ? null : hoveredId);
|
|
5601
|
-
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
|
|
5602
|
-
hoverRect && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5603
|
-
"div",
|
|
5604
|
-
{
|
|
5605
|
-
"data-ohw-ai-section-hover": "",
|
|
5606
|
-
"aria-hidden": true,
|
|
5607
|
-
style: {
|
|
5608
|
-
position: "fixed",
|
|
5609
|
-
top: hoverRect.top,
|
|
5610
|
-
left: hoverRect.left,
|
|
5611
|
-
width: hoverRect.width,
|
|
5612
|
-
height: hoverRect.height,
|
|
5613
|
-
border: `2px solid rgba(8, 133, 254, 0.45)`,
|
|
5614
|
-
borderRadius: edgeAwareRadius(hoverRect),
|
|
5615
|
-
pointerEvents: "none",
|
|
5616
|
-
zIndex: 2147482900
|
|
5617
|
-
}
|
|
5618
|
-
}
|
|
5619
|
-
),
|
|
5620
|
-
selectionRect && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5621
|
-
"div",
|
|
5622
|
-
{
|
|
5623
|
-
"data-ohw-ai-section-selected": "",
|
|
5624
|
-
"aria-hidden": true,
|
|
5625
|
-
style: {
|
|
5626
|
-
position: "fixed",
|
|
5627
|
-
top: selectionRect.top,
|
|
5628
|
-
left: selectionRect.left,
|
|
5629
|
-
width: selectionRect.width,
|
|
5630
|
-
height: selectionRect.height,
|
|
5631
|
-
border: `2px solid ${PRIMARY2}`,
|
|
5632
|
-
borderRadius: edgeAwareRadius(selectionRect),
|
|
5633
|
-
pointerEvents: "none",
|
|
5634
|
-
zIndex: 2147483e3
|
|
5635
|
-
}
|
|
5636
|
-
}
|
|
5637
|
-
),
|
|
5638
|
-
reviewRect && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5639
|
-
"div",
|
|
5640
|
-
{
|
|
5641
|
-
"data-ohw-ai-review": "",
|
|
5642
|
-
style: {
|
|
5643
|
-
position: "fixed",
|
|
5644
|
-
top: reviewRect.top,
|
|
5645
|
-
left: reviewRect.left,
|
|
5646
|
-
width: reviewRect.width,
|
|
5647
|
-
height: reviewRect.height,
|
|
5648
|
-
border: `2px solid ${PRIMARY2}`,
|
|
5649
|
-
borderRadius: edgeAwareRadius(reviewRect),
|
|
5650
|
-
zIndex: 2147483200,
|
|
5651
|
-
// The veil itself: swallows clicks so the section stays locked until decided.
|
|
5652
|
-
background: "rgba(8, 133, 254, 0.04)",
|
|
5653
|
-
pointerEvents: "auto",
|
|
5654
|
-
cursor: "default"
|
|
5655
|
-
},
|
|
5656
|
-
onClick: (e) => e.stopPropagation(),
|
|
5657
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
|
|
5658
|
-
"div",
|
|
5659
|
-
{
|
|
5660
|
-
style: {
|
|
5661
|
-
position: "sticky",
|
|
5662
|
-
top: 12,
|
|
5663
|
-
display: "flex",
|
|
5664
|
-
gap: 8,
|
|
5665
|
-
justifyContent: "flex-end",
|
|
5666
|
-
paddingRight: 12,
|
|
5667
|
-
paddingTop: 12
|
|
5668
|
-
},
|
|
5669
|
-
children: [
|
|
5670
|
-
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ReviewButton, { label: "Accept", onClick: () => decide("accept"), background: PRIMARY2, color: "#ffffff", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react5.Check, { size: 16, strokeWidth: 2.5, "aria-hidden": true }) }),
|
|
5671
|
-
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ReviewButton, { label: "Discard", onClick: () => decide("discard"), background: "#EFF6FF", color: "#0c0a09", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react5.X, { size: 16, strokeWidth: 2, "aria-hidden": true }) })
|
|
5672
|
-
]
|
|
5673
|
-
}
|
|
5674
|
-
)
|
|
5675
|
-
}
|
|
5676
|
-
)
|
|
5677
|
-
] });
|
|
5678
|
-
}
|
|
5679
|
-
|
|
5680
5344
|
// src/OhhwellsBridge.tsx
|
|
5681
5345
|
var import_react_dom3 = require("react-dom");
|
|
5682
5346
|
var import_navigation3 = require("next/navigation");
|
|
@@ -5735,6 +5399,32 @@ function isEditSessionActive() {
|
|
|
5735
5399
|
return new URLSearchParams(q).get("mode") === "edit";
|
|
5736
5400
|
}
|
|
5737
5401
|
|
|
5402
|
+
// src/lib/sections.ts
|
|
5403
|
+
function titleCaseSectionId(id) {
|
|
5404
|
+
return id.split("-").filter(Boolean).map((w) => w.charAt(0).toUpperCase() + w.slice(1)).join(" ");
|
|
5405
|
+
}
|
|
5406
|
+
function parseSectionsFromRoot(root) {
|
|
5407
|
+
const seen = /* @__PURE__ */ new Set();
|
|
5408
|
+
const sections = [];
|
|
5409
|
+
for (const el of root.querySelectorAll("[data-ohw-section]")) {
|
|
5410
|
+
const id = el.getAttribute("data-ohw-section") ?? "";
|
|
5411
|
+
if (!id || seen.has(id)) continue;
|
|
5412
|
+
if (el.parentElement?.closest("[data-ohw-section]")) continue;
|
|
5413
|
+
seen.add(id);
|
|
5414
|
+
const label = el.getAttribute("data-ohw-section-label") ?? titleCaseSectionId(id);
|
|
5415
|
+
sections.push({ id, label });
|
|
5416
|
+
}
|
|
5417
|
+
return sections;
|
|
5418
|
+
}
|
|
5419
|
+
function collectSectionsFromDom() {
|
|
5420
|
+
if (typeof document === "undefined") return [];
|
|
5421
|
+
return parseSectionsFromRoot(document);
|
|
5422
|
+
}
|
|
5423
|
+
function parseSectionsFromHtml(html) {
|
|
5424
|
+
const doc = new DOMParser().parseFromString(html, "text/html");
|
|
5425
|
+
return parseSectionsFromRoot(doc);
|
|
5426
|
+
}
|
|
5427
|
+
|
|
5738
5428
|
// src/ui/link-modal/linkModal.utils.ts
|
|
5739
5429
|
function parseTarget(target) {
|
|
5740
5430
|
if (!target) return { pageRoute: "", sectionId: null };
|
|
@@ -5967,28 +5657,28 @@ function scrollToHashSectionWhenReady(behavior = "smooth") {
|
|
|
5967
5657
|
}
|
|
5968
5658
|
|
|
5969
5659
|
// src/ui/link-modal/LinkPopover.tsx
|
|
5970
|
-
var
|
|
5660
|
+
var import_react10 = require("react");
|
|
5971
5661
|
|
|
5972
5662
|
// src/ui/dialog.tsx
|
|
5973
5663
|
var React7 = __toESM(require("react"), 1);
|
|
5974
5664
|
var import_radix_ui6 = require("radix-ui");
|
|
5975
|
-
var
|
|
5976
|
-
var
|
|
5665
|
+
var import_lucide_react5 = require("lucide-react");
|
|
5666
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
5977
5667
|
function Dialog2({
|
|
5978
5668
|
...props
|
|
5979
5669
|
}) {
|
|
5980
|
-
return /* @__PURE__ */ (0,
|
|
5670
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_radix_ui6.Dialog.Root, { "data-slot": "dialog", ...props });
|
|
5981
5671
|
}
|
|
5982
5672
|
function DialogPortal({
|
|
5983
5673
|
...props
|
|
5984
5674
|
}) {
|
|
5985
|
-
return /* @__PURE__ */ (0,
|
|
5675
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_radix_ui6.Dialog.Portal, { ...props });
|
|
5986
5676
|
}
|
|
5987
5677
|
function DialogOverlay({
|
|
5988
5678
|
className,
|
|
5989
5679
|
...props
|
|
5990
5680
|
}) {
|
|
5991
|
-
return /* @__PURE__ */ (0,
|
|
5681
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5992
5682
|
import_radix_ui6.Dialog.Overlay,
|
|
5993
5683
|
{
|
|
5994
5684
|
"data-slot": "dialog-overlay",
|
|
@@ -6001,9 +5691,9 @@ function DialogOverlay({
|
|
|
6001
5691
|
var DialogContent = React7.forwardRef(
|
|
6002
5692
|
({ className, children, showCloseButton = true, container, ...props }, ref) => {
|
|
6003
5693
|
const positionMode = container ? "absolute" : "fixed";
|
|
6004
|
-
return /* @__PURE__ */ (0,
|
|
6005
|
-
/* @__PURE__ */ (0,
|
|
6006
|
-
/* @__PURE__ */ (0,
|
|
5694
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(DialogPortal, { container: container ?? void 0, children: [
|
|
5695
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DialogOverlay, { className: cn(positionMode, "inset-0") }),
|
|
5696
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
|
|
6007
5697
|
import_radix_ui6.Dialog.Content,
|
|
6008
5698
|
{
|
|
6009
5699
|
ref,
|
|
@@ -6019,13 +5709,13 @@ var DialogContent = React7.forwardRef(
|
|
|
6019
5709
|
...props,
|
|
6020
5710
|
children: [
|
|
6021
5711
|
children,
|
|
6022
|
-
showCloseButton ? /* @__PURE__ */ (0,
|
|
5712
|
+
showCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
6023
5713
|
import_radix_ui6.Dialog.Close,
|
|
6024
5714
|
{
|
|
6025
5715
|
type: "button",
|
|
6026
5716
|
className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50",
|
|
6027
5717
|
"aria-label": "Close",
|
|
6028
|
-
children: /* @__PURE__ */ (0,
|
|
5718
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react5.X, { size: 16, "aria-hidden": true })
|
|
6029
5719
|
}
|
|
6030
5720
|
) : null
|
|
6031
5721
|
]
|
|
@@ -6039,13 +5729,13 @@ function DialogHeader({
|
|
|
6039
5729
|
className,
|
|
6040
5730
|
...props
|
|
6041
5731
|
}) {
|
|
6042
|
-
return /* @__PURE__ */ (0,
|
|
5732
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: cn("flex flex-col gap-1.5", className), ...props });
|
|
6043
5733
|
}
|
|
6044
5734
|
function DialogFooter({
|
|
6045
5735
|
className,
|
|
6046
5736
|
...props
|
|
6047
5737
|
}) {
|
|
6048
|
-
return /* @__PURE__ */ (0,
|
|
5738
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
6049
5739
|
"div",
|
|
6050
5740
|
{
|
|
6051
5741
|
className: cn("flex items-center justify-end gap-2", className),
|
|
@@ -6053,7 +5743,7 @@ function DialogFooter({
|
|
|
6053
5743
|
}
|
|
6054
5744
|
);
|
|
6055
5745
|
}
|
|
6056
|
-
var DialogTitle = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
5746
|
+
var DialogTitle = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
6057
5747
|
import_radix_ui6.Dialog.Title,
|
|
6058
5748
|
{
|
|
6059
5749
|
ref,
|
|
@@ -6065,7 +5755,7 @@ var DialogTitle = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE
|
|
|
6065
5755
|
}
|
|
6066
5756
|
));
|
|
6067
5757
|
DialogTitle.displayName = import_radix_ui6.Dialog.Title.displayName;
|
|
6068
|
-
var DialogDescription = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
5758
|
+
var DialogDescription = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
6069
5759
|
import_radix_ui6.Dialog.Description,
|
|
6070
5760
|
{
|
|
6071
5761
|
ref,
|
|
@@ -6077,63 +5767,63 @@ DialogDescription.displayName = import_radix_ui6.Dialog.Description.displayName;
|
|
|
6077
5767
|
var DialogClose = import_radix_ui6.Dialog.Close;
|
|
6078
5768
|
|
|
6079
5769
|
// src/ui/link-modal/LinkEditorPanel.tsx
|
|
6080
|
-
var
|
|
5770
|
+
var import_lucide_react9 = require("lucide-react");
|
|
6081
5771
|
|
|
6082
5772
|
// src/ui/link-modal/DestinationBreadcrumb.tsx
|
|
6083
|
-
var
|
|
6084
|
-
var
|
|
5773
|
+
var import_lucide_react6 = require("lucide-react");
|
|
5774
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
6085
5775
|
function DestinationBreadcrumb({
|
|
6086
5776
|
pageTitle,
|
|
6087
5777
|
sectionLabel
|
|
6088
5778
|
}) {
|
|
6089
|
-
return /* @__PURE__ */ (0,
|
|
6090
|
-
/* @__PURE__ */ (0,
|
|
6091
|
-
/* @__PURE__ */ (0,
|
|
6092
|
-
/* @__PURE__ */ (0,
|
|
6093
|
-
/* @__PURE__ */ (0,
|
|
6094
|
-
/* @__PURE__ */ (0,
|
|
5779
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex w-full flex-col gap-2", children: [
|
|
5780
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { className: "text-sm font-medium! text-foreground m-0", children: "Destination" }),
|
|
5781
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex items-center gap-3", children: [
|
|
5782
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
5783
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_lucide_react6.File, { size: 16, className: "shrink-0 text-foreground", "aria-hidden": true }),
|
|
5784
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "text-sm font-medium leading-none text-foreground!", children: pageTitle })
|
|
6095
5785
|
] }),
|
|
6096
|
-
/* @__PURE__ */ (0,
|
|
6097
|
-
|
|
5786
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
5787
|
+
import_lucide_react6.ArrowRight,
|
|
6098
5788
|
{
|
|
6099
5789
|
size: 16,
|
|
6100
5790
|
className: "shrink-0 text-muted-foreground",
|
|
6101
5791
|
"aria-hidden": true
|
|
6102
5792
|
}
|
|
6103
5793
|
),
|
|
6104
|
-
/* @__PURE__ */ (0,
|
|
6105
|
-
/* @__PURE__ */ (0,
|
|
6106
|
-
|
|
5794
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
|
|
5795
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
5796
|
+
import_lucide_react6.GalleryVertical,
|
|
6107
5797
|
{
|
|
6108
5798
|
size: 16,
|
|
6109
5799
|
className: "shrink-0 text-foreground",
|
|
6110
5800
|
"aria-hidden": true
|
|
6111
5801
|
}
|
|
6112
5802
|
),
|
|
6113
|
-
/* @__PURE__ */ (0,
|
|
5803
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "truncate text-sm font-medium leading-none text-foreground", children: sectionLabel })
|
|
6114
5804
|
] })
|
|
6115
5805
|
] })
|
|
6116
5806
|
] });
|
|
6117
5807
|
}
|
|
6118
5808
|
|
|
6119
5809
|
// src/ui/link-modal/SectionTreeItem.tsx
|
|
6120
|
-
var
|
|
6121
|
-
var
|
|
5810
|
+
var import_lucide_react7 = require("lucide-react");
|
|
5811
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
6122
5812
|
function SectionTreeItem({
|
|
6123
5813
|
section,
|
|
6124
5814
|
onSelect,
|
|
6125
5815
|
selected
|
|
6126
5816
|
}) {
|
|
6127
5817
|
const interactive = Boolean(onSelect);
|
|
6128
|
-
return /* @__PURE__ */ (0,
|
|
6129
|
-
/* @__PURE__ */ (0,
|
|
5818
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex h-9 w-full items-end pl-3", children: [
|
|
5819
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
6130
5820
|
"div",
|
|
6131
5821
|
{
|
|
6132
5822
|
className: "mr-[-1px] h-9 w-2 shrink-0 rounded-bl-sm border-b border-l border-border mb-4",
|
|
6133
5823
|
"aria-hidden": true
|
|
6134
5824
|
}
|
|
6135
5825
|
),
|
|
6136
|
-
/* @__PURE__ */ (0,
|
|
5826
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
|
|
6137
5827
|
"div",
|
|
6138
5828
|
{
|
|
6139
5829
|
role: interactive ? "button" : void 0,
|
|
@@ -6151,15 +5841,15 @@ function SectionTreeItem({
|
|
|
6151
5841
|
interactive && selected && "border-primary"
|
|
6152
5842
|
),
|
|
6153
5843
|
children: [
|
|
6154
|
-
/* @__PURE__ */ (0,
|
|
6155
|
-
|
|
5844
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
5845
|
+
import_lucide_react7.GalleryVertical,
|
|
6156
5846
|
{
|
|
6157
5847
|
size: 16,
|
|
6158
5848
|
className: "shrink-0 text-foreground",
|
|
6159
5849
|
"aria-hidden": true
|
|
6160
5850
|
}
|
|
6161
5851
|
),
|
|
6162
|
-
/* @__PURE__ */ (0,
|
|
5852
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "truncate text-sm font-normal leading-5 text-foreground", children: section.label })
|
|
6163
5853
|
]
|
|
6164
5854
|
}
|
|
6165
5855
|
)
|
|
@@ -6167,14 +5857,14 @@ function SectionTreeItem({
|
|
|
6167
5857
|
}
|
|
6168
5858
|
|
|
6169
5859
|
// src/ui/link-modal/UrlOrPageInput.tsx
|
|
6170
|
-
var
|
|
5860
|
+
var import_react7 = require("react");
|
|
6171
5861
|
|
|
6172
5862
|
// src/ui/input.tsx
|
|
6173
5863
|
var React8 = __toESM(require("react"), 1);
|
|
6174
|
-
var
|
|
5864
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
6175
5865
|
var Input = React8.forwardRef(
|
|
6176
5866
|
({ className, type, ...props }, ref) => {
|
|
6177
|
-
return /* @__PURE__ */ (0,
|
|
5867
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
6178
5868
|
"input",
|
|
6179
5869
|
{
|
|
6180
5870
|
type,
|
|
@@ -6193,9 +5883,9 @@ Input.displayName = "Input";
|
|
|
6193
5883
|
|
|
6194
5884
|
// src/ui/label.tsx
|
|
6195
5885
|
var import_radix_ui7 = require("radix-ui");
|
|
6196
|
-
var
|
|
5886
|
+
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
6197
5887
|
function Label({ className, ...props }) {
|
|
6198
|
-
return /* @__PURE__ */ (0,
|
|
5888
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
6199
5889
|
import_radix_ui7.Label.Root,
|
|
6200
5890
|
{
|
|
6201
5891
|
"data-slot": "label",
|
|
@@ -6206,12 +5896,12 @@ function Label({ className, ...props }) {
|
|
|
6206
5896
|
}
|
|
6207
5897
|
|
|
6208
5898
|
// src/ui/link-modal/UrlOrPageInput.tsx
|
|
6209
|
-
var
|
|
6210
|
-
var
|
|
5899
|
+
var import_lucide_react8 = require("lucide-react");
|
|
5900
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
6211
5901
|
function FieldChevron({
|
|
6212
5902
|
onClick
|
|
6213
5903
|
}) {
|
|
6214
|
-
return /* @__PURE__ */ (0,
|
|
5904
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
6215
5905
|
"button",
|
|
6216
5906
|
{
|
|
6217
5907
|
type: "button",
|
|
@@ -6219,7 +5909,7 @@ function FieldChevron({
|
|
|
6219
5909
|
onClick,
|
|
6220
5910
|
"aria-label": "Open page list",
|
|
6221
5911
|
tabIndex: -1,
|
|
6222
|
-
children: /* @__PURE__ */ (0,
|
|
5912
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_lucide_react8.ChevronDown, { size: 16 })
|
|
6223
5913
|
}
|
|
6224
5914
|
);
|
|
6225
5915
|
}
|
|
@@ -6235,11 +5925,11 @@ function UrlOrPageInput({
|
|
|
6235
5925
|
readOnly = false,
|
|
6236
5926
|
urlError
|
|
6237
5927
|
}) {
|
|
6238
|
-
const inputId = (0,
|
|
6239
|
-
const inputRef = (0,
|
|
6240
|
-
const rootRef = (0,
|
|
6241
|
-
const [isFocused, setIsFocused] = (0,
|
|
6242
|
-
(0,
|
|
5928
|
+
const inputId = (0, import_react7.useId)();
|
|
5929
|
+
const inputRef = (0, import_react7.useRef)(null);
|
|
5930
|
+
const rootRef = (0, import_react7.useRef)(null);
|
|
5931
|
+
const [isFocused, setIsFocused] = (0, import_react7.useState)(false);
|
|
5932
|
+
(0, import_react7.useEffect)(() => {
|
|
6243
5933
|
if (!dropdownOpen) return;
|
|
6244
5934
|
const isOutside = (e) => {
|
|
6245
5935
|
const root = rootRef.current;
|
|
@@ -6280,19 +5970,19 @@ function UrlOrPageInput({
|
|
|
6280
5970
|
"data-ohw-link-field flex h-[36px] w-full items-center overflow-hidden rounded-md border bg-background pl-3 pr-3 py-2 outline-none transition-[border-color,box-shadow]",
|
|
6281
5971
|
urlError ? "border-destructive shadow-[0_0_0_1px_var(--ohw-destructive)]" : isFocused ? "border-primary shadow-[0_0_0_1px_var(--ohw-primary)]" : "border-input"
|
|
6282
5972
|
);
|
|
6283
|
-
return /* @__PURE__ */ (0,
|
|
6284
|
-
/* @__PURE__ */ (0,
|
|
6285
|
-
/* @__PURE__ */ (0,
|
|
6286
|
-
/* @__PURE__ */ (0,
|
|
6287
|
-
selectedPage ? /* @__PURE__ */ (0,
|
|
6288
|
-
|
|
5973
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex w-full flex-col gap-2 p-0", children: [
|
|
5974
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Label, { htmlFor: inputId, className: cn(urlError && "text-destructive"), children: "Destination" }),
|
|
5975
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { ref: rootRef, className: "relative w-full", children: [
|
|
5976
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { "data-ohw-link-field": true, className: fieldClassName, children: [
|
|
5977
|
+
selectedPage ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "flex shrink-0 items-center pr-2", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
5978
|
+
import_lucide_react8.File,
|
|
6289
5979
|
{
|
|
6290
5980
|
size: 16,
|
|
6291
5981
|
className: "shrink-0 text-foreground",
|
|
6292
5982
|
"aria-hidden": true
|
|
6293
5983
|
}
|
|
6294
5984
|
) }) : null,
|
|
6295
|
-
readOnly ? /* @__PURE__ */ (0,
|
|
5985
|
+
readOnly ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "min-w-0 flex-1 truncate text-sm leading-5 text-foreground", children: selectedPage?.title ?? value }) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
6296
5986
|
Input,
|
|
6297
5987
|
{
|
|
6298
5988
|
ref: inputRef,
|
|
@@ -6318,7 +6008,7 @@ function UrlOrPageInput({
|
|
|
6318
6008
|
)
|
|
6319
6009
|
}
|
|
6320
6010
|
),
|
|
6321
|
-
selectedPage && !readOnly ? /* @__PURE__ */ (0,
|
|
6011
|
+
selectedPage && !readOnly ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
6322
6012
|
"button",
|
|
6323
6013
|
{
|
|
6324
6014
|
type: "button",
|
|
@@ -6326,26 +6016,26 @@ function UrlOrPageInput({
|
|
|
6326
6016
|
onMouseDown: clearSelection,
|
|
6327
6017
|
"aria-label": "Clear selected page",
|
|
6328
6018
|
tabIndex: -1,
|
|
6329
|
-
children: /* @__PURE__ */ (0,
|
|
6019
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_lucide_react8.X, { size: 16, "aria-hidden": true })
|
|
6330
6020
|
}
|
|
6331
6021
|
) : null,
|
|
6332
|
-
!readOnly ? /* @__PURE__ */ (0,
|
|
6022
|
+
!readOnly ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(FieldChevron, { onClick: toggleDropdown }) : null
|
|
6333
6023
|
] }),
|
|
6334
|
-
dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */ (0,
|
|
6024
|
+
dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
6335
6025
|
"div",
|
|
6336
6026
|
{
|
|
6337
6027
|
"data-ohw-link-page-dropdown": "",
|
|
6338
6028
|
className: "absolute left-0 right-0 top-[calc(100%+4px)] z-50 max-h-48 overflow-auto rounded-lg border border-border bg-popover py-1 shadow-lg",
|
|
6339
6029
|
onMouseDown: (e) => e.preventDefault(),
|
|
6340
|
-
children: filteredPages.map((page) => /* @__PURE__ */ (0,
|
|
6030
|
+
children: filteredPages.map((page) => /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
|
|
6341
6031
|
"button",
|
|
6342
6032
|
{
|
|
6343
6033
|
type: "button",
|
|
6344
6034
|
className: "flex h-9 w-full items-center gap-2 border-0 bg-transparent px-3 text-left text-sm leading-5 text-foreground outline-none hover:bg-muted",
|
|
6345
6035
|
onClick: () => onPageSelect(page),
|
|
6346
6036
|
children: [
|
|
6347
|
-
/* @__PURE__ */ (0,
|
|
6348
|
-
/* @__PURE__ */ (0,
|
|
6037
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_lucide_react8.File, { size: 16, className: "shrink-0", "aria-hidden": true }),
|
|
6038
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "truncate", children: page.title })
|
|
6349
6039
|
]
|
|
6350
6040
|
},
|
|
6351
6041
|
page.path
|
|
@@ -6353,34 +6043,34 @@ function UrlOrPageInput({
|
|
|
6353
6043
|
}
|
|
6354
6044
|
) : null
|
|
6355
6045
|
] }),
|
|
6356
|
-
urlError ? /* @__PURE__ */ (0,
|
|
6046
|
+
urlError ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "text-sm font-medium text-destructive", children: urlError }) : null
|
|
6357
6047
|
] });
|
|
6358
6048
|
}
|
|
6359
6049
|
|
|
6360
6050
|
// src/ui/link-modal/LinkEditorPanel.tsx
|
|
6361
|
-
var
|
|
6051
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
6362
6052
|
function LinkEditorPanel({ state, onClose }) {
|
|
6363
6053
|
const isCancel = state.secondaryLabel === "Cancel" || state.secondaryLabel === "Back to sections";
|
|
6364
|
-
return /* @__PURE__ */ (0,
|
|
6365
|
-
/* @__PURE__ */ (0,
|
|
6054
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
|
|
6055
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(DialogClose, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
6366
6056
|
"button",
|
|
6367
6057
|
{
|
|
6368
6058
|
type: "button",
|
|
6369
6059
|
className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50 h-7",
|
|
6370
6060
|
"aria-label": "Close",
|
|
6371
6061
|
onClick: onClose,
|
|
6372
|
-
children: /* @__PURE__ */ (0,
|
|
6062
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react9.X, { size: 16, "aria-hidden": true })
|
|
6373
6063
|
}
|
|
6374
6064
|
) }),
|
|
6375
|
-
/* @__PURE__ */ (0,
|
|
6376
|
-
/* @__PURE__ */ (0,
|
|
6377
|
-
state.showBreadcrumb && state.selectedPage && state.selectedSection ? /* @__PURE__ */ (0,
|
|
6065
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(DialogHeader, { className: "w-full gap-1.5 p-6 pr-12", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(DialogTitle, { className: "m-0 w-full break-words", children: state.title }) }),
|
|
6066
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex w-full flex-col gap-3 px-6 pb-8 pt-1", children: [
|
|
6067
|
+
state.showBreadcrumb && state.selectedPage && state.selectedSection ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
6378
6068
|
DestinationBreadcrumb,
|
|
6379
6069
|
{
|
|
6380
6070
|
pageTitle: state.selectedPage.title,
|
|
6381
6071
|
sectionLabel: state.selectedSection.label
|
|
6382
6072
|
}
|
|
6383
|
-
) : /* @__PURE__ */ (0,
|
|
6073
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
6384
6074
|
UrlOrPageInput,
|
|
6385
6075
|
{
|
|
6386
6076
|
value: state.searchValue,
|
|
@@ -6393,8 +6083,8 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
6393
6083
|
urlError: state.urlError
|
|
6394
6084
|
}
|
|
6395
6085
|
),
|
|
6396
|
-
state.showChooseSection ? /* @__PURE__ */ (0,
|
|
6397
|
-
/* @__PURE__ */ (0,
|
|
6086
|
+
state.showChooseSection ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex flex-col justify-center gap-2", children: [
|
|
6087
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
6398
6088
|
Button,
|
|
6399
6089
|
{
|
|
6400
6090
|
type: "button",
|
|
@@ -6405,15 +6095,15 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
6405
6095
|
children: "Choose a section"
|
|
6406
6096
|
}
|
|
6407
6097
|
),
|
|
6408
|
-
/* @__PURE__ */ (0,
|
|
6409
|
-
/* @__PURE__ */ (0,
|
|
6410
|
-
/* @__PURE__ */ (0,
|
|
6098
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex items-center gap-1 text-sm text-muted-foreground", children: [
|
|
6099
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react9.Info, { size: 16, className: "shrink-0", "aria-hidden": true }),
|
|
6100
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { children: "Pick a section this link should scroll to." })
|
|
6411
6101
|
] })
|
|
6412
6102
|
] }) : null,
|
|
6413
|
-
state.showSectionRow && state.selectedSection ? /* @__PURE__ */ (0,
|
|
6103
|
+
state.showSectionRow && state.selectedSection ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SectionTreeItem, { section: state.selectedSection, selected: true }) : null
|
|
6414
6104
|
] }),
|
|
6415
|
-
/* @__PURE__ */ (0,
|
|
6416
|
-
/* @__PURE__ */ (0,
|
|
6105
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(DialogFooter, { className: "w-full px-6 pb-6", children: [
|
|
6106
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
6417
6107
|
Button,
|
|
6418
6108
|
{
|
|
6419
6109
|
type: "button",
|
|
@@ -6428,7 +6118,7 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
6428
6118
|
children: state.secondaryLabel
|
|
6429
6119
|
}
|
|
6430
6120
|
),
|
|
6431
|
-
/* @__PURE__ */ (0,
|
|
6121
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
6432
6122
|
Button,
|
|
6433
6123
|
{
|
|
6434
6124
|
type: "button",
|
|
@@ -6447,11 +6137,11 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
6447
6137
|
}
|
|
6448
6138
|
|
|
6449
6139
|
// src/ui/link-modal/SectionPickerOverlay.tsx
|
|
6450
|
-
var
|
|
6140
|
+
var import_react8 = require("react");
|
|
6451
6141
|
var import_react_dom = require("react-dom");
|
|
6452
|
-
var
|
|
6142
|
+
var import_lucide_react10 = require("lucide-react");
|
|
6453
6143
|
var import_navigation2 = require("next/navigation");
|
|
6454
|
-
var
|
|
6144
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
6455
6145
|
var DIM_OVERLAY = "rgba(0, 0, 0, 0.45)";
|
|
6456
6146
|
function rectsEqual(a, b) {
|
|
6457
6147
|
if (a.size !== b.size) return false;
|
|
@@ -6484,12 +6174,12 @@ function hitTestSectionId(x, y, sectionIds, rects) {
|
|
|
6484
6174
|
return null;
|
|
6485
6175
|
}
|
|
6486
6176
|
function useSectionRects(sectionIdsKey, enabled) {
|
|
6487
|
-
const [rects, setRects] = (0,
|
|
6488
|
-
const sectionIds = (0,
|
|
6177
|
+
const [rects, setRects] = (0, import_react8.useState)(/* @__PURE__ */ new Map());
|
|
6178
|
+
const sectionIds = (0, import_react8.useMemo)(
|
|
6489
6179
|
() => sectionIdsKey ? sectionIdsKey.split("\0") : [],
|
|
6490
6180
|
[sectionIdsKey]
|
|
6491
6181
|
);
|
|
6492
|
-
(0,
|
|
6182
|
+
(0, import_react8.useEffect)(() => {
|
|
6493
6183
|
if (!enabled || sectionIds.length === 0) {
|
|
6494
6184
|
setRects((prev) => prev.size === 0 ? prev : /* @__PURE__ */ new Map());
|
|
6495
6185
|
return;
|
|
@@ -6530,13 +6220,13 @@ function SectionPickerOverlay({
|
|
|
6530
6220
|
}) {
|
|
6531
6221
|
const router = (0, import_navigation2.useRouter)();
|
|
6532
6222
|
const pathname = (0, import_navigation2.usePathname)();
|
|
6533
|
-
const [selectedId, setSelectedId] = (0,
|
|
6534
|
-
const [hoveredId, setHoveredId] = (0,
|
|
6535
|
-
const pointerRef = (0,
|
|
6536
|
-
const pointerScreenRef = (0,
|
|
6537
|
-
const iframeOffsetTopRef = (0,
|
|
6538
|
-
const sectionIdsRef = (0,
|
|
6539
|
-
const [chromeClip, setChromeClip] = (0,
|
|
6223
|
+
const [selectedId, setSelectedId] = (0, import_react8.useState)(null);
|
|
6224
|
+
const [hoveredId, setHoveredId] = (0, import_react8.useState)(null);
|
|
6225
|
+
const pointerRef = (0, import_react8.useRef)(null);
|
|
6226
|
+
const pointerScreenRef = (0, import_react8.useRef)(null);
|
|
6227
|
+
const iframeOffsetTopRef = (0, import_react8.useRef)(null);
|
|
6228
|
+
const sectionIdsRef = (0, import_react8.useRef)([]);
|
|
6229
|
+
const [chromeClip, setChromeClip] = (0, import_react8.useState)(
|
|
6540
6230
|
() => ({
|
|
6541
6231
|
top: 0,
|
|
6542
6232
|
bottom: typeof window !== "undefined" ? window.innerHeight : 0
|
|
@@ -6544,12 +6234,12 @@ function SectionPickerOverlay({
|
|
|
6544
6234
|
);
|
|
6545
6235
|
const normalizedTarget = normalizePath(pagePath);
|
|
6546
6236
|
const isOnTargetPage = normalizePath(pathname) === normalizedTarget;
|
|
6547
|
-
(0,
|
|
6237
|
+
(0, import_react8.useEffect)(() => {
|
|
6548
6238
|
if (isOnTargetPage) return;
|
|
6549
6239
|
const search = readPreservedSearch();
|
|
6550
6240
|
router.push(`${normalizedTarget}${search}`);
|
|
6551
6241
|
}, [isOnTargetPage, normalizedTarget, router]);
|
|
6552
|
-
(0,
|
|
6242
|
+
(0, import_react8.useEffect)(() => {
|
|
6553
6243
|
document.documentElement.setAttribute("data-ohw-section-picking", "");
|
|
6554
6244
|
document.querySelectorAll("[data-ohw-hovered]").forEach((el) => {
|
|
6555
6245
|
el.removeAttribute("data-ohw-hovered");
|
|
@@ -6561,24 +6251,24 @@ function SectionPickerOverlay({
|
|
|
6561
6251
|
document.documentElement.removeAttribute("data-ohw-section-picking");
|
|
6562
6252
|
};
|
|
6563
6253
|
}, []);
|
|
6564
|
-
const liveSections = (0,
|
|
6254
|
+
const liveSections = (0, import_react8.useMemo)(() => {
|
|
6565
6255
|
if (!isOnTargetPage) return sections;
|
|
6566
6256
|
const live = collectSectionsFromDom();
|
|
6567
6257
|
if (live.length === 0) return sections;
|
|
6568
6258
|
const labels = new Map(sections.map((s) => [s.id, s.label]));
|
|
6569
6259
|
return live.map((s) => ({ id: s.id, label: labels.get(s.id) ?? s.label }));
|
|
6570
6260
|
}, [isOnTargetPage, sections, pathname]);
|
|
6571
|
-
const sectionIdsKey = (0,
|
|
6261
|
+
const sectionIdsKey = (0, import_react8.useMemo)(
|
|
6572
6262
|
() => liveSections.map((s) => s.id).join("\0"),
|
|
6573
6263
|
[liveSections]
|
|
6574
6264
|
);
|
|
6575
|
-
const sectionIds = (0,
|
|
6265
|
+
const sectionIds = (0, import_react8.useMemo)(
|
|
6576
6266
|
() => liveSections.map((s) => s.id),
|
|
6577
6267
|
[liveSections]
|
|
6578
6268
|
);
|
|
6579
6269
|
sectionIdsRef.current = sectionIds;
|
|
6580
6270
|
const rects = useSectionRects(sectionIdsKey, isOnTargetPage);
|
|
6581
|
-
const applyHoverAt = (0,
|
|
6271
|
+
const applyHoverAt = (0, import_react8.useCallback)(
|
|
6582
6272
|
(x, y, liveRects) => {
|
|
6583
6273
|
const ids = sectionIdsRef.current;
|
|
6584
6274
|
const map = liveRects ?? readSectionRects(ids);
|
|
@@ -6587,7 +6277,7 @@ function SectionPickerOverlay({
|
|
|
6587
6277
|
},
|
|
6588
6278
|
[]
|
|
6589
6279
|
);
|
|
6590
|
-
(0,
|
|
6280
|
+
(0, import_react8.useEffect)(() => {
|
|
6591
6281
|
const applyClip = (iframeOffsetTop, visibleCanvasTop, canvasH) => {
|
|
6592
6282
|
const top = Math.max(0, visibleCanvasTop - iframeOffsetTop);
|
|
6593
6283
|
const bottom = Math.min(
|
|
@@ -6629,12 +6319,12 @@ function SectionPickerOverlay({
|
|
|
6629
6319
|
window.removeEventListener("resize", onResize);
|
|
6630
6320
|
};
|
|
6631
6321
|
}, [applyHoverAt]);
|
|
6632
|
-
(0,
|
|
6322
|
+
(0, import_react8.useEffect)(() => {
|
|
6633
6323
|
const ptr = pointerRef.current;
|
|
6634
6324
|
if (!ptr) return;
|
|
6635
6325
|
applyHoverAt(ptr.x, ptr.y, rects);
|
|
6636
6326
|
}, [rects, applyHoverAt]);
|
|
6637
|
-
(0,
|
|
6327
|
+
(0, import_react8.useEffect)(() => {
|
|
6638
6328
|
const rememberPointer = (clientX, clientY) => {
|
|
6639
6329
|
pointerRef.current = { x: clientX, y: clientY };
|
|
6640
6330
|
const top = iframeOffsetTopRef.current;
|
|
@@ -6658,7 +6348,7 @@ function SectionPickerOverlay({
|
|
|
6658
6348
|
window.removeEventListener("message", onPointerSync);
|
|
6659
6349
|
};
|
|
6660
6350
|
}, [rects, applyHoverAt]);
|
|
6661
|
-
const handleSelect = (0,
|
|
6351
|
+
const handleSelect = (0, import_react8.useCallback)(
|
|
6662
6352
|
(section) => {
|
|
6663
6353
|
if (selectedId) return;
|
|
6664
6354
|
setSelectedId(section.id);
|
|
@@ -6666,7 +6356,7 @@ function SectionPickerOverlay({
|
|
|
6666
6356
|
},
|
|
6667
6357
|
[selectedId, onSelect]
|
|
6668
6358
|
);
|
|
6669
|
-
(0,
|
|
6359
|
+
(0, import_react8.useEffect)(() => {
|
|
6670
6360
|
const onKeyDown = (e) => {
|
|
6671
6361
|
if (e.key === "Escape") {
|
|
6672
6362
|
e.preventDefault();
|
|
@@ -6680,7 +6370,7 @@ function SectionPickerOverlay({
|
|
|
6680
6370
|
const portalRoot = typeof document !== "undefined" ? document.querySelector("[data-ohw-bridge-root]") ?? document.body : null;
|
|
6681
6371
|
if (!portalRoot) return null;
|
|
6682
6372
|
return (0, import_react_dom.createPortal)(
|
|
6683
|
-
/* @__PURE__ */ (0,
|
|
6373
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
|
|
6684
6374
|
"div",
|
|
6685
6375
|
{
|
|
6686
6376
|
"data-ohw-section-picker": "",
|
|
@@ -6690,12 +6380,12 @@ function SectionPickerOverlay({
|
|
|
6690
6380
|
role: "dialog",
|
|
6691
6381
|
"aria-label": "Choose a section",
|
|
6692
6382
|
children: [
|
|
6693
|
-
/* @__PURE__ */ (0,
|
|
6383
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
6694
6384
|
"div",
|
|
6695
6385
|
{
|
|
6696
6386
|
className: "pointer-events-auto fixed left-5 z-[2]",
|
|
6697
6387
|
style: { top: chromeClip.top + 20 },
|
|
6698
|
-
children: /* @__PURE__ */ (0,
|
|
6388
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
|
|
6699
6389
|
Button,
|
|
6700
6390
|
{
|
|
6701
6391
|
type: "button",
|
|
@@ -6704,14 +6394,14 @@ function SectionPickerOverlay({
|
|
|
6704
6394
|
className: "h-8 min-w-0 gap-1 border-border bg-background px-2 py-1.5 shadow-sm hover:bg-muted cursor-pointer",
|
|
6705
6395
|
onClick: onBack,
|
|
6706
6396
|
children: [
|
|
6707
|
-
/* @__PURE__ */ (0,
|
|
6397
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react10.ArrowLeft, { className: "size-4 shrink-0", "aria-hidden": true }),
|
|
6708
6398
|
"Back"
|
|
6709
6399
|
]
|
|
6710
6400
|
}
|
|
6711
6401
|
)
|
|
6712
6402
|
}
|
|
6713
6403
|
),
|
|
6714
|
-
/* @__PURE__ */ (0,
|
|
6404
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
6715
6405
|
"div",
|
|
6716
6406
|
{
|
|
6717
6407
|
className: "pointer-events-none fixed left-1/2 z-[2] rounded-lg px-4 py-3 text-xs leading-4 tracking-[0.18px] text-white shadow-md",
|
|
@@ -6724,7 +6414,7 @@ function SectionPickerOverlay({
|
|
|
6724
6414
|
children: "Click on section to select"
|
|
6725
6415
|
}
|
|
6726
6416
|
),
|
|
6727
|
-
!isOnTargetPage ? /* @__PURE__ */ (0,
|
|
6417
|
+
!isOnTargetPage ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
6728
6418
|
"div",
|
|
6729
6419
|
{
|
|
6730
6420
|
className: "pointer-events-none fixed left-1/2 z-[1] -translate-x-1/2 rounded-md px-3 py-2 text-sm text-muted-foreground shadow-sm",
|
|
@@ -6732,14 +6422,14 @@ function SectionPickerOverlay({
|
|
|
6732
6422
|
children: "Loading page preview\u2026"
|
|
6733
6423
|
}
|
|
6734
6424
|
) : null,
|
|
6735
|
-
isOnTargetPage && liveSections.length === 0 ? /* @__PURE__ */ (0,
|
|
6425
|
+
isOnTargetPage && liveSections.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "pointer-events-auto fixed inset-0 z-[1] flex items-center justify-center bg-muted/40", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-sm text-muted-foreground", children: "No sections found on this page." }) }) : null,
|
|
6736
6426
|
isOnTargetPage ? liveSections.map((section) => {
|
|
6737
6427
|
const rect = rects.get(section.id);
|
|
6738
6428
|
if (!rect || rect.width <= 0 || rect.height <= 0) return null;
|
|
6739
6429
|
const isSelected = selectedId === section.id;
|
|
6740
6430
|
const isHovered = hoveredId === section.id;
|
|
6741
6431
|
const isLit = isSelected || isHovered;
|
|
6742
|
-
return /* @__PURE__ */ (0,
|
|
6432
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
|
|
6743
6433
|
"button",
|
|
6744
6434
|
{
|
|
6745
6435
|
type: "button",
|
|
@@ -6754,7 +6444,7 @@ function SectionPickerOverlay({
|
|
|
6754
6444
|
"aria-label": `Select section ${section.label}`,
|
|
6755
6445
|
onClick: () => handleSelect(section),
|
|
6756
6446
|
children: [
|
|
6757
|
-
isLit ? /* @__PURE__ */ (0,
|
|
6447
|
+
isLit ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
6758
6448
|
"span",
|
|
6759
6449
|
{
|
|
6760
6450
|
className: "pointer-events-none absolute",
|
|
@@ -6767,13 +6457,13 @@ function SectionPickerOverlay({
|
|
|
6767
6457
|
"aria-hidden": true
|
|
6768
6458
|
}
|
|
6769
6459
|
) : null,
|
|
6770
|
-
isSelected ? /* @__PURE__ */ (0,
|
|
6460
|
+
isSelected ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
6771
6461
|
"span",
|
|
6772
6462
|
{
|
|
6773
6463
|
className: "absolute right-3 top-3 flex size-8 items-center justify-center rounded-full text-white",
|
|
6774
6464
|
style: { backgroundColor: "var(--ohw-primary, #0885fe)" },
|
|
6775
6465
|
"aria-hidden": true,
|
|
6776
|
-
children: /* @__PURE__ */ (0,
|
|
6466
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react10.Check, { className: "size-5" })
|
|
6777
6467
|
}
|
|
6778
6468
|
) : null
|
|
6779
6469
|
]
|
|
@@ -6789,7 +6479,7 @@ function SectionPickerOverlay({
|
|
|
6789
6479
|
}
|
|
6790
6480
|
|
|
6791
6481
|
// src/ui/link-modal/useLinkModalState.ts
|
|
6792
|
-
var
|
|
6482
|
+
var import_react9 = require("react");
|
|
6793
6483
|
function useLinkModalState({
|
|
6794
6484
|
open,
|
|
6795
6485
|
mode,
|
|
@@ -6801,14 +6491,14 @@ function useLinkModalState({
|
|
|
6801
6491
|
onClose,
|
|
6802
6492
|
onSubmit
|
|
6803
6493
|
}) {
|
|
6804
|
-
const availablePages = (0,
|
|
6805
|
-
const [searchValue, setSearchValue] = (0,
|
|
6806
|
-
const [selectedPage, setSelectedPage] = (0,
|
|
6807
|
-
const [selectedSection, setSelectedSection] = (0,
|
|
6808
|
-
const [step, setStep] = (0,
|
|
6809
|
-
const [dropdownOpen, setDropdownOpen] = (0,
|
|
6810
|
-
const [urlError, setUrlError] = (0,
|
|
6811
|
-
const reset = (0,
|
|
6494
|
+
const availablePages = (0, import_react9.useMemo)(() => pages, [pages]);
|
|
6495
|
+
const [searchValue, setSearchValue] = (0, import_react9.useState)("");
|
|
6496
|
+
const [selectedPage, setSelectedPage] = (0, import_react9.useState)(null);
|
|
6497
|
+
const [selectedSection, setSelectedSection] = (0, import_react9.useState)(null);
|
|
6498
|
+
const [step, setStep] = (0, import_react9.useState)("input");
|
|
6499
|
+
const [dropdownOpen, setDropdownOpen] = (0, import_react9.useState)(false);
|
|
6500
|
+
const [urlError, setUrlError] = (0, import_react9.useState)("");
|
|
6501
|
+
const reset = (0, import_react9.useCallback)(() => {
|
|
6812
6502
|
setSearchValue("");
|
|
6813
6503
|
setSelectedPage(null);
|
|
6814
6504
|
setSelectedSection(null);
|
|
@@ -6816,7 +6506,7 @@ function useLinkModalState({
|
|
|
6816
6506
|
setDropdownOpen(false);
|
|
6817
6507
|
setUrlError("");
|
|
6818
6508
|
}, []);
|
|
6819
|
-
(0,
|
|
6509
|
+
(0, import_react9.useEffect)(() => {
|
|
6820
6510
|
if (!open) return;
|
|
6821
6511
|
if (mode === "edit" && initialTarget) {
|
|
6822
6512
|
const { pageRoute } = parseTarget(initialTarget);
|
|
@@ -6832,11 +6522,11 @@ function useLinkModalState({
|
|
|
6832
6522
|
setDropdownOpen(false);
|
|
6833
6523
|
setUrlError("");
|
|
6834
6524
|
}, [open, mode, initialTarget, reset]);
|
|
6835
|
-
const filteredPages = (0,
|
|
6525
|
+
const filteredPages = (0, import_react9.useMemo)(() => {
|
|
6836
6526
|
if (!searchValue.trim()) return availablePages;
|
|
6837
6527
|
return availablePages.filter((p) => p.title.toLowerCase().startsWith(searchValue.toLowerCase()));
|
|
6838
6528
|
}, [availablePages, searchValue]);
|
|
6839
|
-
const activeSections = (0,
|
|
6529
|
+
const activeSections = (0, import_react9.useMemo)(() => {
|
|
6840
6530
|
if (!selectedPage) return [];
|
|
6841
6531
|
return getSectionsForPath(sectionsByPath, selectedPage.path);
|
|
6842
6532
|
}, [selectedPage, sectionsByPath]);
|
|
@@ -6885,7 +6575,7 @@ function useLinkModalState({
|
|
|
6885
6575
|
reset();
|
|
6886
6576
|
onClose();
|
|
6887
6577
|
};
|
|
6888
|
-
const isValid = (0,
|
|
6578
|
+
const isValid = (0, import_react9.useMemo)(() => {
|
|
6889
6579
|
if (urlError) return false;
|
|
6890
6580
|
if (showBreadcrumb) return true;
|
|
6891
6581
|
if (selectedPage) return true;
|
|
@@ -6953,7 +6643,7 @@ function useLinkModalState({
|
|
|
6953
6643
|
}
|
|
6954
6644
|
|
|
6955
6645
|
// src/ui/link-modal/LinkPopover.tsx
|
|
6956
|
-
var
|
|
6646
|
+
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
6957
6647
|
function postToParent(data) {
|
|
6958
6648
|
window.parent?.postMessage(data, "*");
|
|
6959
6649
|
}
|
|
@@ -6982,7 +6672,7 @@ function LinkPopover({
|
|
|
6982
6672
|
onSubmit
|
|
6983
6673
|
});
|
|
6984
6674
|
const sectionPickerActive = state.showSectionPicker && Boolean(state.selectedPage);
|
|
6985
|
-
(0,
|
|
6675
|
+
(0, import_react10.useEffect)(() => {
|
|
6986
6676
|
if (!open) return;
|
|
6987
6677
|
if (sectionPickerActive) {
|
|
6988
6678
|
postToParent({ type: "ui:unlock" });
|
|
@@ -7049,15 +6739,15 @@ function LinkPopover({
|
|
|
7049
6739
|
);
|
|
7050
6740
|
};
|
|
7051
6741
|
}, [open, sectionPickerActive]);
|
|
7052
|
-
return /* @__PURE__ */ (0,
|
|
7053
|
-
/* @__PURE__ */ (0,
|
|
6742
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
|
|
6743
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
7054
6744
|
Dialog2,
|
|
7055
6745
|
{
|
|
7056
6746
|
open: open && !sectionPickerActive,
|
|
7057
6747
|
onOpenChange: (next) => {
|
|
7058
6748
|
if (!next) onClose?.();
|
|
7059
6749
|
},
|
|
7060
|
-
children: /* @__PURE__ */ (0,
|
|
6750
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
7061
6751
|
DialogContent,
|
|
7062
6752
|
{
|
|
7063
6753
|
ref: panelRef,
|
|
@@ -7067,12 +6757,12 @@ function LinkPopover({
|
|
|
7067
6757
|
"data-ohw-bridge": "",
|
|
7068
6758
|
showCloseButton: false,
|
|
7069
6759
|
className: "gap-0 p-0 w-full max-w-[448px] pointer-events-auto z-[2147483646] overflow-visible",
|
|
7070
|
-
children: /* @__PURE__ */ (0,
|
|
6760
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(LinkEditorPanel, { state, onClose })
|
|
7071
6761
|
}
|
|
7072
6762
|
)
|
|
7073
6763
|
}
|
|
7074
6764
|
),
|
|
7075
|
-
sectionPickerActive && state.selectedPage ? /* @__PURE__ */ (0,
|
|
6765
|
+
sectionPickerActive && state.selectedPage ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
7076
6766
|
SectionPickerOverlay,
|
|
7077
6767
|
{
|
|
7078
6768
|
pagePath: state.selectedPage.path,
|
|
@@ -9044,186 +8734,6 @@ function deleteFooterColumn(column) {
|
|
|
9044
8734
|
};
|
|
9045
8735
|
}
|
|
9046
8736
|
|
|
9047
|
-
// src/lib/logo-identity.ts
|
|
9048
|
-
var LOGO_TEXT_KEYS = ["nav-logo-text", "footer-logo-text", "logo-text"];
|
|
9049
|
-
var LOGO_IMAGE_KEYS = ["nav-logo-image", "footer-logo", "footer-logo-image"];
|
|
9050
|
-
var LOGO_HREF_KEYS = ["nav-logo-href", "footer-logo-href", "logo-href"];
|
|
9051
|
-
var LOGO_PLACEHOLDER_KEY = "logo-is-placeholder";
|
|
9052
|
-
var LOGO_ALT_KEY = "logo-alt";
|
|
9053
|
-
var LOGO_IMAGE_URL_KEY = "nav-logo-image";
|
|
9054
|
-
var PLACEHOLDER_BUSINESS_NAME = "Business name";
|
|
9055
|
-
function resolveLogoDisplayText(text) {
|
|
9056
|
-
const trimmed = (text ?? "").trim();
|
|
9057
|
-
return trimmed || PLACEHOLDER_BUSINESS_NAME;
|
|
9058
|
-
}
|
|
9059
|
-
function isFooterLogoRoot(root) {
|
|
9060
|
-
return Boolean(root.closest("footer") || root.closest('[data-ohw-section="footer"]'));
|
|
9061
|
-
}
|
|
9062
|
-
function imageKeyForRoot(root) {
|
|
9063
|
-
return isFooterLogoRoot(root) ? "footer-logo" : "nav-logo-image";
|
|
9064
|
-
}
|
|
9065
|
-
function textKeyForRoot(root) {
|
|
9066
|
-
return isFooterLogoRoot(root) ? "footer-logo-text" : "nav-logo-text";
|
|
9067
|
-
}
|
|
9068
|
-
function ensureLogoHrefKey(root) {
|
|
9069
|
-
if (!(root instanceof HTMLAnchorElement)) return;
|
|
9070
|
-
if (root.hasAttribute("data-ohw-href-key")) return;
|
|
9071
|
-
root.setAttribute("data-ohw-href-key", isFooterLogoRoot(root) ? "footer-logo-href" : "nav-logo-href");
|
|
9072
|
-
}
|
|
9073
|
-
function applyLogoIdentity(text, isPlaceholder) {
|
|
9074
|
-
const display = resolveLogoDisplayText(text);
|
|
9075
|
-
const placeholder = isPlaceholder || !text.trim() || display === PLACEHOLDER_BUSINESS_NAME;
|
|
9076
|
-
for (const key of LOGO_TEXT_KEYS) {
|
|
9077
|
-
document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
|
|
9078
|
-
if (el.textContent !== display) el.textContent = display;
|
|
9079
|
-
});
|
|
9080
|
-
}
|
|
9081
|
-
for (const key of LOGO_IMAGE_KEYS) {
|
|
9082
|
-
document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
|
|
9083
|
-
const img = el instanceof HTMLImageElement ? el : el.querySelector("img");
|
|
9084
|
-
if (img) img.alt = display;
|
|
9085
|
-
});
|
|
9086
|
-
}
|
|
9087
|
-
document.querySelectorAll('[data-ohw-role="logo"], [data-ohw-logo]').forEach((el) => {
|
|
9088
|
-
if (placeholder) el.setAttribute("data-ohw-placeholder", "");
|
|
9089
|
-
else el.removeAttribute("data-ohw-placeholder");
|
|
9090
|
-
});
|
|
9091
|
-
return display;
|
|
9092
|
-
}
|
|
9093
|
-
function applyLogoImage(url, alt) {
|
|
9094
|
-
const displayAlt = resolveLogoDisplayText(alt);
|
|
9095
|
-
document.querySelectorAll('[data-ohw-role="logo"], [data-ohw-logo]').forEach((root) => {
|
|
9096
|
-
ensureLogoHrefKey(root);
|
|
9097
|
-
const imageKey = imageKeyForRoot(root);
|
|
9098
|
-
const textKey = textKeyForRoot(root);
|
|
9099
|
-
let img = root.querySelector(`img[data-ohw-key="${imageKey}"]`) ?? (root.querySelector(`[data-ohw-key="${imageKey}"]`) instanceof HTMLImageElement ? root.querySelector(`[data-ohw-key="${imageKey}"]`) : null) ?? root.querySelector("img");
|
|
9100
|
-
let textEl = root.querySelector(`[data-ohw-key="${textKey}"]`) ?? root.querySelector('[data-ohw-key="logo-text"]');
|
|
9101
|
-
if (url) {
|
|
9102
|
-
if (!img) {
|
|
9103
|
-
img = document.createElement("img");
|
|
9104
|
-
img.setAttribute("data-ohw-editable", "image");
|
|
9105
|
-
img.setAttribute("data-ohw-key", imageKey);
|
|
9106
|
-
img.alt = displayAlt;
|
|
9107
|
-
img.style.maxHeight = "40px";
|
|
9108
|
-
img.style.width = "auto";
|
|
9109
|
-
img.style.display = "block";
|
|
9110
|
-
img.style.objectFit = "contain";
|
|
9111
|
-
root.insertBefore(img, root.firstChild);
|
|
9112
|
-
} else {
|
|
9113
|
-
img.setAttribute("data-ohw-editable", "image");
|
|
9114
|
-
img.setAttribute("data-ohw-key", imageKey);
|
|
9115
|
-
}
|
|
9116
|
-
img.removeAttribute("srcset");
|
|
9117
|
-
img.removeAttribute("sizes");
|
|
9118
|
-
img.src = url;
|
|
9119
|
-
img.alt = displayAlt;
|
|
9120
|
-
img.style.display = "";
|
|
9121
|
-
if (textEl) textEl.style.display = "none";
|
|
9122
|
-
root.removeAttribute("data-ohw-placeholder");
|
|
9123
|
-
return;
|
|
9124
|
-
}
|
|
9125
|
-
if (img) {
|
|
9126
|
-
img.remove();
|
|
9127
|
-
}
|
|
9128
|
-
if (!textEl) {
|
|
9129
|
-
textEl = document.createElement("span");
|
|
9130
|
-
textEl.setAttribute("data-ohw-editable", "plain");
|
|
9131
|
-
textEl.setAttribute("data-ohw-key", textKey);
|
|
9132
|
-
root.appendChild(textEl);
|
|
9133
|
-
}
|
|
9134
|
-
textEl.style.display = "";
|
|
9135
|
-
if (textEl.textContent !== displayAlt) textEl.textContent = displayAlt;
|
|
9136
|
-
if (!displayAlt.trim() || displayAlt === PLACEHOLDER_BUSINESS_NAME) {
|
|
9137
|
-
root.setAttribute("data-ohw-placeholder", "");
|
|
9138
|
-
} else {
|
|
9139
|
-
root.removeAttribute("data-ohw-placeholder");
|
|
9140
|
-
}
|
|
9141
|
-
});
|
|
9142
|
-
}
|
|
9143
|
-
function applyLogoHref(href) {
|
|
9144
|
-
const target = href.trim() || "/";
|
|
9145
|
-
document.querySelectorAll('[data-ohw-role="logo"], [data-ohw-logo]').forEach((root) => {
|
|
9146
|
-
ensureLogoHrefKey(root);
|
|
9147
|
-
if (root instanceof HTMLAnchorElement) {
|
|
9148
|
-
root.setAttribute("href", target);
|
|
9149
|
-
}
|
|
9150
|
-
});
|
|
9151
|
-
}
|
|
9152
|
-
function readLogoIdentityFromDom() {
|
|
9153
|
-
let imageUrl = null;
|
|
9154
|
-
for (const key of LOGO_IMAGE_KEYS) {
|
|
9155
|
-
const el = document.querySelector(`[data-ohw-key="${key}"]`);
|
|
9156
|
-
const img = el instanceof HTMLImageElement ? el : el?.querySelector("img");
|
|
9157
|
-
if (img?.src && !img.src.startsWith("data:") && img.style.display !== "none") {
|
|
9158
|
-
imageUrl = img.currentSrc || img.src;
|
|
9159
|
-
break;
|
|
9160
|
-
}
|
|
9161
|
-
}
|
|
9162
|
-
let text = PLACEHOLDER_BUSINESS_NAME;
|
|
9163
|
-
let isPlaceholder = true;
|
|
9164
|
-
for (const key of LOGO_TEXT_KEYS) {
|
|
9165
|
-
const el = document.querySelector(`[data-ohw-key="${key}"]`);
|
|
9166
|
-
if (el?.textContent?.trim()) {
|
|
9167
|
-
text = el.textContent.trim();
|
|
9168
|
-
const logoRoot2 = el.closest('[data-ohw-role="logo"], [data-ohw-logo]');
|
|
9169
|
-
isPlaceholder = logoRoot2?.hasAttribute("data-ohw-placeholder") === true || text === PLACEHOLDER_BUSINESS_NAME;
|
|
9170
|
-
break;
|
|
9171
|
-
}
|
|
9172
|
-
}
|
|
9173
|
-
if (imageUrl) {
|
|
9174
|
-
const logoImg = document.querySelector(
|
|
9175
|
-
'[data-ohw-key="nav-logo-image"], [data-ohw-key="footer-logo"]'
|
|
9176
|
-
);
|
|
9177
|
-
const alt = logoImg?.alt?.trim() || text;
|
|
9178
|
-
isPlaceholder = false;
|
|
9179
|
-
const hrefEl = document.querySelector(
|
|
9180
|
-
'a[data-ohw-role="logo"], a[data-ohw-logo], [data-ohw-role="logo"]'
|
|
9181
|
-
);
|
|
9182
|
-
const href2 = (hrefEl instanceof HTMLAnchorElement ? hrefEl.getAttribute("href") : null) || hrefEl?.closest("a")?.getAttribute("href") || "/";
|
|
9183
|
-
return { text, isPlaceholder, imageUrl, href: href2, alt };
|
|
9184
|
-
}
|
|
9185
|
-
const logoRoot = document.querySelector('[data-ohw-role="logo"], [data-ohw-logo]');
|
|
9186
|
-
const href = (logoRoot instanceof HTMLAnchorElement ? logoRoot.getAttribute("href") : null) || logoRoot?.closest("a")?.getAttribute("href") || "/";
|
|
9187
|
-
return { text, isPlaceholder, imageUrl: null, href, alt: text };
|
|
9188
|
-
}
|
|
9189
|
-
|
|
9190
|
-
// src/lib/site-wide-scope.ts
|
|
9191
|
-
function getLogoElement(el) {
|
|
9192
|
-
const marked = el.closest('[data-ohw-role="logo"], [data-ohw-logo]');
|
|
9193
|
-
if (marked) return marked;
|
|
9194
|
-
const root = el.closest("nav, [data-ohw-nav-root], footer");
|
|
9195
|
-
if (!root) return null;
|
|
9196
|
-
const anchor = el.closest("a");
|
|
9197
|
-
if (anchor && root.contains(anchor) && !anchor.hasAttribute("data-ohw-href-key") && !anchor.closest("[data-ohw-nav-container]") && Boolean(anchor.querySelector("img") || anchor.matches("img"))) {
|
|
9198
|
-
return anchor;
|
|
9199
|
-
}
|
|
9200
|
-
const img = el.matches("img") ? el : null;
|
|
9201
|
-
if (img && !img.closest("[data-ohw-href-key]") && !img.closest("[data-ohw-nav-container]") && (img.closest("footer") || img.closest("nav, [data-ohw-nav-root]"))) {
|
|
9202
|
-
return img;
|
|
9203
|
-
}
|
|
9204
|
-
return null;
|
|
9205
|
-
}
|
|
9206
|
-
function isInFooter(el) {
|
|
9207
|
-
if (!el) return false;
|
|
9208
|
-
return Boolean(el.closest("footer") || el.closest('[data-ohw-section="footer"]'));
|
|
9209
|
-
}
|
|
9210
|
-
function isSiteWideElement(el) {
|
|
9211
|
-
if (!el) return false;
|
|
9212
|
-
if (getLogoElement(el)) return true;
|
|
9213
|
-
if (isInFooter(el)) return true;
|
|
9214
|
-
if (el.hasAttribute("data-ohw-nav-container") || el.hasAttribute("data-ohw-nav-root")) {
|
|
9215
|
-
return true;
|
|
9216
|
-
}
|
|
9217
|
-
if (el.hasAttribute("data-ohw-href-key") && el.closest("nav, [data-ohw-nav-root], [data-ohw-nav-drawer], aside")) {
|
|
9218
|
-
return true;
|
|
9219
|
-
}
|
|
9220
|
-
if (el.closest('[data-ohw-role="navbar-button"]')) return true;
|
|
9221
|
-
return false;
|
|
9222
|
-
}
|
|
9223
|
-
function isSiteWideScopeActive(args) {
|
|
9224
|
-
return isSiteWideElement(args.selected) || isSiteWideElement(args.hoveredItem) || isSiteWideElement(args.hoveredNavContainer) || isSiteWideElement(args.active);
|
|
9225
|
-
}
|
|
9226
|
-
|
|
9227
8737
|
// src/lib/add-footer-column.ts
|
|
9228
8738
|
function buildFooterColumnEditContentPatch(result) {
|
|
9229
8739
|
return {
|
|
@@ -9454,7 +8964,7 @@ function hitTestNavDropSlot(clientX, clientY, draggedHrefKey) {
|
|
|
9454
8964
|
}
|
|
9455
8965
|
|
|
9456
8966
|
// src/useNavItemDrag.ts
|
|
9457
|
-
var
|
|
8967
|
+
var import_react11 = require("react");
|
|
9458
8968
|
function useNavItemDrag({
|
|
9459
8969
|
isEditMode,
|
|
9460
8970
|
editContentRef,
|
|
@@ -9478,11 +8988,11 @@ function useNavItemDrag({
|
|
|
9478
8988
|
getNavigationItemAnchor: getNavigationItemAnchor2,
|
|
9479
8989
|
isDragHandleDisabled: isDragHandleDisabled2
|
|
9480
8990
|
}) {
|
|
9481
|
-
const navDragRef = (0,
|
|
9482
|
-
const [navDropSlots, setNavDropSlots] = (0,
|
|
9483
|
-
const [activeNavDropIndex, setActiveNavDropIndex] = (0,
|
|
9484
|
-
const navPointerDragRef = (0,
|
|
9485
|
-
const clearNavDragVisuals = (0,
|
|
8991
|
+
const navDragRef = (0, import_react11.useRef)(null);
|
|
8992
|
+
const [navDropSlots, setNavDropSlots] = (0, import_react11.useState)([]);
|
|
8993
|
+
const [activeNavDropIndex, setActiveNavDropIndex] = (0, import_react11.useState)(null);
|
|
8994
|
+
const navPointerDragRef = (0, import_react11.useRef)(null);
|
|
8995
|
+
const clearNavDragVisuals = (0, import_react11.useCallback)(() => {
|
|
9486
8996
|
const session = navDragRef.current;
|
|
9487
8997
|
const keepOpenEl = session?.draggedEl?.closest("[data-ohw-nav-children]") != null ? session.draggedEl : null;
|
|
9488
8998
|
navDragRef.current = null;
|
|
@@ -9499,7 +9009,7 @@ function useNavItemDrag({
|
|
|
9499
9009
|
document.documentElement.removeAttribute("data-ohw-nav-dragging-root");
|
|
9500
9010
|
unlockItemDragInteraction();
|
|
9501
9011
|
}, [setDraggedItemRect, setIsItemDragging, setSiblingHintRects]);
|
|
9502
|
-
const refreshNavDragVisuals = (0,
|
|
9012
|
+
const refreshNavDragVisuals = (0, import_react11.useCallback)(
|
|
9503
9013
|
(session, activeSlot, clientX, clientY) => {
|
|
9504
9014
|
setDraggedItemRect(session.draggedEl.getBoundingClientRect());
|
|
9505
9015
|
if (typeof clientX === "number" && typeof clientY === "number") {
|
|
@@ -9517,13 +9027,13 @@ function useNavItemDrag({
|
|
|
9517
9027
|
},
|
|
9518
9028
|
[setDraggedItemRect, setSiblingHintRects]
|
|
9519
9029
|
);
|
|
9520
|
-
const refreshNavDragVisualsRef = (0,
|
|
9030
|
+
const refreshNavDragVisualsRef = (0, import_react11.useRef)(refreshNavDragVisuals);
|
|
9521
9031
|
refreshNavDragVisualsRef.current = refreshNavDragVisuals;
|
|
9522
|
-
const commitNavDragRef = (0,
|
|
9032
|
+
const commitNavDragRef = (0, import_react11.useRef)(() => {
|
|
9523
9033
|
});
|
|
9524
|
-
const beginNavDragRef = (0,
|
|
9034
|
+
const beginNavDragRef = (0, import_react11.useRef)(() => {
|
|
9525
9035
|
});
|
|
9526
|
-
const beginNavDrag = (0,
|
|
9036
|
+
const beginNavDrag = (0, import_react11.useCallback)(
|
|
9527
9037
|
(session) => {
|
|
9528
9038
|
const rect = session.draggedEl.getBoundingClientRect();
|
|
9529
9039
|
session.lastClientX = session.lastClientX || rect.left + rect.width / 2;
|
|
@@ -9557,7 +9067,7 @@ function useNavItemDrag({
|
|
|
9557
9067
|
]
|
|
9558
9068
|
);
|
|
9559
9069
|
beginNavDragRef.current = beginNavDrag;
|
|
9560
|
-
const commitNavDrag = (0,
|
|
9070
|
+
const commitNavDrag = (0, import_react11.useCallback)(
|
|
9561
9071
|
(clientX, clientY) => {
|
|
9562
9072
|
const session = navDragRef.current;
|
|
9563
9073
|
if (!session) {
|
|
@@ -9618,7 +9128,7 @@ function useNavItemDrag({
|
|
|
9618
9128
|
[clearNavDragVisuals, deselectRef, editContentRef, postToParentRef, selectRef]
|
|
9619
9129
|
);
|
|
9620
9130
|
commitNavDragRef.current = commitNavDrag;
|
|
9621
|
-
const startNavLinkDrag = (0,
|
|
9131
|
+
const startNavLinkDrag = (0, import_react11.useCallback)(
|
|
9622
9132
|
(anchor, clientX, clientY, wasSelected) => {
|
|
9623
9133
|
if (footerDragRef.current) return false;
|
|
9624
9134
|
const hrefKey = anchor.getAttribute("data-ohw-href-key");
|
|
@@ -9636,7 +9146,7 @@ function useNavItemDrag({
|
|
|
9636
9146
|
},
|
|
9637
9147
|
[beginNavDrag, footerDragRef, isDragHandleDisabled2, isCtaButton]
|
|
9638
9148
|
);
|
|
9639
|
-
const onNavDragOver = (0,
|
|
9149
|
+
const onNavDragOver = (0, import_react11.useCallback)(
|
|
9640
9150
|
(e) => {
|
|
9641
9151
|
const session = navDragRef.current;
|
|
9642
9152
|
if (!session) return false;
|
|
@@ -9648,7 +9158,7 @@ function useNavItemDrag({
|
|
|
9648
9158
|
},
|
|
9649
9159
|
[]
|
|
9650
9160
|
);
|
|
9651
|
-
(0,
|
|
9161
|
+
(0, import_react11.useEffect)(() => {
|
|
9652
9162
|
if (!isEditMode) return;
|
|
9653
9163
|
const THRESHOLD = 10;
|
|
9654
9164
|
const resolveWasSelected = (el) => {
|
|
@@ -9773,7 +9283,7 @@ function useNavItemDrag({
|
|
|
9773
9283
|
setLinkPopover,
|
|
9774
9284
|
suppressNextClickRef
|
|
9775
9285
|
]);
|
|
9776
|
-
const armNavPressFromChrome = (0,
|
|
9286
|
+
const armNavPressFromChrome = (0, import_react11.useCallback)(
|
|
9777
9287
|
(selected, clientX, clientY, pointerId) => {
|
|
9778
9288
|
const hrefKey = selected.getAttribute("data-ohw-href-key");
|
|
9779
9289
|
if (!hrefKey || !isNavbarHrefKey(hrefKey)) return false;
|
|
@@ -9804,8 +9314,8 @@ function useNavItemDrag({
|
|
|
9804
9314
|
}
|
|
9805
9315
|
|
|
9806
9316
|
// src/ui/footer-container-chrome.tsx
|
|
9807
|
-
var
|
|
9808
|
-
var
|
|
9317
|
+
var import_lucide_react11 = require("lucide-react");
|
|
9318
|
+
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
9809
9319
|
function FooterContainerChrome({
|
|
9810
9320
|
rect,
|
|
9811
9321
|
onAdd,
|
|
@@ -9813,7 +9323,7 @@ function FooterContainerChrome({
|
|
|
9813
9323
|
}) {
|
|
9814
9324
|
const chromeGap = 6;
|
|
9815
9325
|
const buttonMargin = 7;
|
|
9816
|
-
return /* @__PURE__ */ (0,
|
|
9326
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
9817
9327
|
"div",
|
|
9818
9328
|
{
|
|
9819
9329
|
"data-ohw-footer-container-chrome": "",
|
|
@@ -9825,8 +9335,8 @@ function FooterContainerChrome({
|
|
|
9825
9335
|
width: rect.width + chromeGap * 2,
|
|
9826
9336
|
height: rect.height + chromeGap * 2
|
|
9827
9337
|
},
|
|
9828
|
-
children: /* @__PURE__ */ (0,
|
|
9829
|
-
/* @__PURE__ */ (0,
|
|
9338
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(Tooltip, { children: [
|
|
9339
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
9830
9340
|
"button",
|
|
9831
9341
|
{
|
|
9832
9342
|
type: "button",
|
|
@@ -9845,17 +9355,17 @@ function FooterContainerChrome({
|
|
|
9845
9355
|
if (addDisabled) return;
|
|
9846
9356
|
onAdd();
|
|
9847
9357
|
},
|
|
9848
|
-
children: /* @__PURE__ */ (0,
|
|
9358
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react11.Plus, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
|
|
9849
9359
|
}
|
|
9850
9360
|
) }),
|
|
9851
|
-
/* @__PURE__ */ (0,
|
|
9361
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TooltipContent, { side: "bottom", sideOffset: 9, children: addDisabled ? "Maximum columns reached" : "Add item" })
|
|
9852
9362
|
] })
|
|
9853
9363
|
}
|
|
9854
9364
|
) });
|
|
9855
9365
|
}
|
|
9856
9366
|
|
|
9857
9367
|
// src/lib/carousel.ts
|
|
9858
|
-
var
|
|
9368
|
+
var import_react12 = require("react");
|
|
9859
9369
|
var CAROUSEL_ATTR = "data-ohw-carousel";
|
|
9860
9370
|
var CAROUSEL_VALUE_ATTR = "data-ohw-carousel-value";
|
|
9861
9371
|
var CAROUSEL_SLIDE_ATTR = "data-ohw-carousel-slide";
|
|
@@ -9917,8 +9427,8 @@ function applyCarouselNode(key, val) {
|
|
|
9917
9427
|
return true;
|
|
9918
9428
|
}
|
|
9919
9429
|
function useOhwCarousel(key, initial) {
|
|
9920
|
-
const [images, setImages] = (0,
|
|
9921
|
-
(0,
|
|
9430
|
+
const [images, setImages] = (0, import_react12.useState)(initial);
|
|
9431
|
+
(0, import_react12.useEffect)(() => {
|
|
9922
9432
|
const el = document.querySelector(
|
|
9923
9433
|
`[${CAROUSEL_ATTR}][data-ohw-key="${CSS.escape(key)}"]`
|
|
9924
9434
|
);
|
|
@@ -9953,13 +9463,10 @@ function getLinkHref3(el) {
|
|
|
9953
9463
|
const anchor = el instanceof HTMLAnchorElement ? el : el.querySelector("a");
|
|
9954
9464
|
return anchor?.getAttribute("href") ?? "";
|
|
9955
9465
|
}
|
|
9956
|
-
function collectEditableNodes(extraContent
|
|
9957
|
-
const
|
|
9958
|
-
|
|
9959
|
-
|
|
9960
|
-
editableEls.unshift(root);
|
|
9961
|
-
}
|
|
9962
|
-
const nodes = editableEls.map((el) => {
|
|
9466
|
+
function collectEditableNodes(extraContent) {
|
|
9467
|
+
const nodes = Array.from(
|
|
9468
|
+
document.querySelectorAll("[data-ohw-editable]")
|
|
9469
|
+
).map((el) => {
|
|
9963
9470
|
if (el.dataset.ohwEditable === "image") {
|
|
9964
9471
|
const img = el instanceof HTMLImageElement ? el : el.querySelector("img");
|
|
9965
9472
|
return { key: el.dataset.ohwKey ?? "", type: "image", text: img?.src ?? "" };
|
|
@@ -9981,11 +9488,7 @@ function collectEditableNodes(extraContent, root = document) {
|
|
|
9981
9488
|
text: el.dataset.ohwEditable === "plain" ? el.innerText ?? "" : el.innerHTML
|
|
9982
9489
|
};
|
|
9983
9490
|
});
|
|
9984
|
-
|
|
9985
|
-
if (isScoped && root instanceof HTMLElement && root.matches("[data-ohw-href-key]")) {
|
|
9986
|
-
hrefEls.unshift(root);
|
|
9987
|
-
}
|
|
9988
|
-
hrefEls.forEach((el) => {
|
|
9491
|
+
document.querySelectorAll("[data-ohw-href-key]").forEach((el) => {
|
|
9989
9492
|
const key = el.getAttribute("data-ohw-href-key") ?? "";
|
|
9990
9493
|
if (!key) return;
|
|
9991
9494
|
nodes.push({ key, type: "link", text: getLinkHref3(el) });
|
|
@@ -10001,32 +9504,30 @@ function collectEditableNodes(extraContent, root = document) {
|
|
|
10001
9504
|
}
|
|
10002
9505
|
}
|
|
10003
9506
|
}
|
|
10004
|
-
|
|
10005
|
-
|
|
10006
|
-
|
|
10007
|
-
|
|
10008
|
-
|
|
10009
|
-
|
|
10010
|
-
|
|
10011
|
-
|
|
10012
|
-
text: String(video.autoplay)
|
|
10013
|
-
});
|
|
10014
|
-
nodes.push({
|
|
10015
|
-
key: `${key}${VIDEO_MUTED_SUFFIX}`,
|
|
10016
|
-
type: "video-setting",
|
|
10017
|
-
text: String(video.muted)
|
|
10018
|
-
});
|
|
9507
|
+
document.querySelectorAll('[data-ohw-editable="video"]').forEach((el) => {
|
|
9508
|
+
const key = el.dataset.ohwKey ?? "";
|
|
9509
|
+
const video = getVideoEl(el);
|
|
9510
|
+
if (!key || !video) return;
|
|
9511
|
+
nodes.push({
|
|
9512
|
+
key: `${key}${VIDEO_AUTOPLAY_SUFFIX}`,
|
|
9513
|
+
type: "video-setting",
|
|
9514
|
+
text: String(video.autoplay)
|
|
10019
9515
|
});
|
|
10020
|
-
|
|
10021
|
-
|
|
10022
|
-
|
|
9516
|
+
nodes.push({
|
|
9517
|
+
key: `${key}${VIDEO_MUTED_SUFFIX}`,
|
|
9518
|
+
type: "video-setting",
|
|
9519
|
+
text: String(video.muted)
|
|
9520
|
+
});
|
|
9521
|
+
});
|
|
9522
|
+
for (const key of listCarouselKeys()) {
|
|
9523
|
+
nodes.push({ key, type: "carousel", text: JSON.stringify(readCarouselValue(key)) });
|
|
10023
9524
|
}
|
|
10024
9525
|
const byKey = /* @__PURE__ */ new Map();
|
|
10025
9526
|
for (const node of nodes) {
|
|
10026
9527
|
if (!node.key) continue;
|
|
10027
9528
|
if (!byKey.has(node.key)) byKey.set(node.key, node);
|
|
10028
9529
|
}
|
|
10029
|
-
if (extraContent
|
|
9530
|
+
if (extraContent) {
|
|
10030
9531
|
applyNavFooterDeleteOverrides(byKey, extraContent);
|
|
10031
9532
|
}
|
|
10032
9533
|
return Array.from(byKey.values());
|
|
@@ -10276,14 +9777,14 @@ function deleteSelectedNavFooterItem(deps) {
|
|
|
10276
9777
|
}
|
|
10277
9778
|
|
|
10278
9779
|
// src/ui/navbar-container-chrome.tsx
|
|
10279
|
-
var
|
|
10280
|
-
var
|
|
9780
|
+
var import_lucide_react12 = require("lucide-react");
|
|
9781
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
10281
9782
|
function NavbarContainerChrome({
|
|
10282
9783
|
rect,
|
|
10283
9784
|
onAdd
|
|
10284
9785
|
}) {
|
|
10285
9786
|
const chromeGap = 6;
|
|
10286
|
-
return /* @__PURE__ */ (0,
|
|
9787
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
10287
9788
|
"div",
|
|
10288
9789
|
{
|
|
10289
9790
|
"data-ohw-navbar-container-chrome": "",
|
|
@@ -10295,7 +9796,7 @@ function NavbarContainerChrome({
|
|
|
10295
9796
|
width: rect.width + chromeGap * 2,
|
|
10296
9797
|
height: rect.height + chromeGap * 2
|
|
10297
9798
|
},
|
|
10298
|
-
children: /* @__PURE__ */ (0,
|
|
9799
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
10299
9800
|
"button",
|
|
10300
9801
|
{
|
|
10301
9802
|
type: "button",
|
|
@@ -10312,7 +9813,7 @@ function NavbarContainerChrome({
|
|
|
10312
9813
|
e.stopPropagation();
|
|
10313
9814
|
onAdd();
|
|
10314
9815
|
},
|
|
10315
|
-
children: /* @__PURE__ */ (0,
|
|
9816
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react12.Plus, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
|
|
10316
9817
|
}
|
|
10317
9818
|
)
|
|
10318
9819
|
}
|
|
@@ -10321,7 +9822,7 @@ function NavbarContainerChrome({
|
|
|
10321
9822
|
|
|
10322
9823
|
// src/ui/drop-indicator.tsx
|
|
10323
9824
|
var React9 = __toESM(require("react"), 1);
|
|
10324
|
-
var
|
|
9825
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
10325
9826
|
var dropIndicatorVariants = cva(
|
|
10326
9827
|
"ov-gap-line pointer-events-none shrink-0 transition-opacity duration-150",
|
|
10327
9828
|
{
|
|
@@ -10345,7 +9846,7 @@ var dropIndicatorVariants = cva(
|
|
|
10345
9846
|
);
|
|
10346
9847
|
var DropIndicator = React9.forwardRef(
|
|
10347
9848
|
({ className, direction, state, ...props }, ref) => {
|
|
10348
|
-
return /* @__PURE__ */ (0,
|
|
9849
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
10349
9850
|
"div",
|
|
10350
9851
|
{
|
|
10351
9852
|
ref,
|
|
@@ -10362,7 +9863,7 @@ var DropIndicator = React9.forwardRef(
|
|
|
10362
9863
|
DropIndicator.displayName = "DropIndicator";
|
|
10363
9864
|
|
|
10364
9865
|
// src/ui/badge.tsx
|
|
10365
|
-
var
|
|
9866
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
10366
9867
|
var badgeVariants = cva(
|
|
10367
9868
|
"inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
|
|
10368
9869
|
{
|
|
@@ -10380,13 +9881,13 @@ var badgeVariants = cva(
|
|
|
10380
9881
|
}
|
|
10381
9882
|
);
|
|
10382
9883
|
function Badge({ className, variant, ...props }) {
|
|
10383
|
-
return /* @__PURE__ */ (0,
|
|
9884
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: cn(badgeVariants({ variant }), className), ...props });
|
|
10384
9885
|
}
|
|
10385
9886
|
|
|
10386
9887
|
// src/OhhwellsBridge.tsx
|
|
10387
|
-
var
|
|
10388
|
-
var
|
|
10389
|
-
var
|
|
9888
|
+
var import_lucide_react13 = require("lucide-react");
|
|
9889
|
+
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
9890
|
+
var PRIMARY2 = "#0885FE";
|
|
10390
9891
|
var IMAGE_FADE_MS = 300;
|
|
10391
9892
|
function runOpacityFade(el, onDone) {
|
|
10392
9893
|
const anim = el.animate([{ opacity: 0 }, { opacity: 1 }], {
|
|
@@ -10564,7 +10065,7 @@ function mountSchedulingWidget(insertAfter, notifyOnConnect = false, scheduleId,
|
|
|
10564
10065
|
const root = (0, import_client.createRoot)(container);
|
|
10565
10066
|
(0, import_react_dom2.flushSync)(() => {
|
|
10566
10067
|
root.render(
|
|
10567
|
-
/* @__PURE__ */ (0,
|
|
10068
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
10568
10069
|
SchedulingWidget,
|
|
10569
10070
|
{
|
|
10570
10071
|
notifyOnConnect,
|
|
@@ -10639,10 +10140,6 @@ function syncNavigationDragCursorAttrs() {
|
|
|
10639
10140
|
el.setAttribute("data-ohw-can-drag", "");
|
|
10640
10141
|
});
|
|
10641
10142
|
}
|
|
10642
|
-
var AI_NODE_TYPES = /* @__PURE__ */ new Set(["image", "bg-image", "video", "link", "plain", "text/rich", "text"]);
|
|
10643
|
-
function normalizeAiNodeType(type) {
|
|
10644
|
-
return AI_NODE_TYPES.has(type) ? type : "text";
|
|
10645
|
-
}
|
|
10646
10143
|
function isMediaEditable(el) {
|
|
10647
10144
|
const t = el.dataset.ohwEditable;
|
|
10648
10145
|
return t === "image" || t === "bg-image" || t === "video";
|
|
@@ -10932,7 +10429,7 @@ function getNavigationSelectionParent(el) {
|
|
|
10932
10429
|
if (!isFooterLinksContainer(el) && (el.hasAttribute("data-ohw-footer-col") || el.hasAttribute("data-ohw-footer-column") || isInferredFooterGroup2(el))) {
|
|
10933
10430
|
return getFooterLinksContainer();
|
|
10934
10431
|
}
|
|
10935
|
-
if (el.hasAttribute("data-ohw-nav-container") || el.hasAttribute("data-ohw-nav-drawer") ||
|
|
10432
|
+
if (el.hasAttribute("data-ohw-nav-container") || el.hasAttribute("data-ohw-nav-drawer") || isFooterLinksContainer(el)) {
|
|
10936
10433
|
return getNavigationRoot(el);
|
|
10937
10434
|
}
|
|
10938
10435
|
return null;
|
|
@@ -11171,7 +10668,7 @@ function EditGlowChrome({
|
|
|
11171
10668
|
hideHandle = false
|
|
11172
10669
|
}) {
|
|
11173
10670
|
const GAP = SELECTION_CHROME_GAP2;
|
|
11174
|
-
return /* @__PURE__ */ (0,
|
|
10671
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
|
|
11175
10672
|
"div",
|
|
11176
10673
|
{
|
|
11177
10674
|
ref: elRef,
|
|
@@ -11186,7 +10683,7 @@ function EditGlowChrome({
|
|
|
11186
10683
|
zIndex: 2147483646
|
|
11187
10684
|
},
|
|
11188
10685
|
children: [
|
|
11189
|
-
/* @__PURE__ */ (0,
|
|
10686
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
11190
10687
|
"div",
|
|
11191
10688
|
{
|
|
11192
10689
|
style: {
|
|
@@ -11199,7 +10696,7 @@ function EditGlowChrome({
|
|
|
11199
10696
|
}
|
|
11200
10697
|
}
|
|
11201
10698
|
),
|
|
11202
|
-
reorderHrefKey && !hideHandle && /* @__PURE__ */ (0,
|
|
10699
|
+
reorderHrefKey && !hideHandle && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
11203
10700
|
"div",
|
|
11204
10701
|
{
|
|
11205
10702
|
"data-ohw-drag-handle-container": "",
|
|
@@ -11211,7 +10708,7 @@ function EditGlowChrome({
|
|
|
11211
10708
|
transform: "translate(calc(-100% - 7px), -50%)",
|
|
11212
10709
|
pointerEvents: dragDisabled ? "none" : "auto"
|
|
11213
10710
|
},
|
|
11214
|
-
children: /* @__PURE__ */ (0,
|
|
10711
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
11215
10712
|
DragHandle,
|
|
11216
10713
|
{
|
|
11217
10714
|
"aria-label": `Reorder ${reorderHrefKey}`,
|
|
@@ -11394,9 +10891,9 @@ function FloatingToolbar({
|
|
|
11394
10891
|
showEditLink,
|
|
11395
10892
|
onEditLink
|
|
11396
10893
|
}) {
|
|
11397
|
-
const localRef =
|
|
11398
|
-
const [measuredW, setMeasuredW] =
|
|
11399
|
-
const setRefs =
|
|
10894
|
+
const localRef = import_react13.default.useRef(null);
|
|
10895
|
+
const [measuredW, setMeasuredW] = import_react13.default.useState(330);
|
|
10896
|
+
const setRefs = import_react13.default.useCallback(
|
|
11400
10897
|
(node) => {
|
|
11401
10898
|
localRef.current = node;
|
|
11402
10899
|
if (typeof elRef === "function") elRef(node);
|
|
@@ -11408,7 +10905,7 @@ function FloatingToolbar({
|
|
|
11408
10905
|
},
|
|
11409
10906
|
[elRef]
|
|
11410
10907
|
);
|
|
11411
|
-
|
|
10908
|
+
import_react13.default.useLayoutEffect(() => {
|
|
11412
10909
|
const node = localRef.current;
|
|
11413
10910
|
if (!node) return;
|
|
11414
10911
|
const update = () => {
|
|
@@ -11421,7 +10918,7 @@ function FloatingToolbar({
|
|
|
11421
10918
|
return () => ro.disconnect();
|
|
11422
10919
|
}, [showEditLink, activeCommands]);
|
|
11423
10920
|
const { top, left, transform } = calcToolbarPos(rect, parentScroll, measuredW);
|
|
11424
|
-
return /* @__PURE__ */ (0,
|
|
10921
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
11425
10922
|
"div",
|
|
11426
10923
|
{
|
|
11427
10924
|
ref: setRefs,
|
|
@@ -11433,12 +10930,12 @@ function FloatingToolbar({
|
|
|
11433
10930
|
zIndex: 2147483647,
|
|
11434
10931
|
pointerEvents: "auto"
|
|
11435
10932
|
},
|
|
11436
|
-
children: /* @__PURE__ */ (0,
|
|
11437
|
-
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ (0,
|
|
11438
|
-
gi > 0 && /* @__PURE__ */ (0,
|
|
10933
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(CustomToolbar, { children: [
|
|
10934
|
+
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react13.default.Fragment, { children: [
|
|
10935
|
+
gi > 0 && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(CustomToolbarDivider, {}),
|
|
11439
10936
|
btns.map((btn) => {
|
|
11440
10937
|
const isActive = activeCommands.has(btn.cmd);
|
|
11441
|
-
return /* @__PURE__ */ (0,
|
|
10938
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
11442
10939
|
CustomToolbarButton,
|
|
11443
10940
|
{
|
|
11444
10941
|
title: btn.title,
|
|
@@ -11447,7 +10944,7 @@ function FloatingToolbar({
|
|
|
11447
10944
|
e.preventDefault();
|
|
11448
10945
|
onCommand(btn.cmd);
|
|
11449
10946
|
},
|
|
11450
|
-
children: /* @__PURE__ */ (0,
|
|
10947
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
11451
10948
|
"svg",
|
|
11452
10949
|
{
|
|
11453
10950
|
width: "16",
|
|
@@ -11468,7 +10965,7 @@ function FloatingToolbar({
|
|
|
11468
10965
|
);
|
|
11469
10966
|
})
|
|
11470
10967
|
] }, gi)),
|
|
11471
|
-
showEditLink ? /* @__PURE__ */ (0,
|
|
10968
|
+
showEditLink ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
11472
10969
|
CustomToolbarButton,
|
|
11473
10970
|
{
|
|
11474
10971
|
type: "button",
|
|
@@ -11482,7 +10979,7 @@ function FloatingToolbar({
|
|
|
11482
10979
|
e.preventDefault();
|
|
11483
10980
|
e.stopPropagation();
|
|
11484
10981
|
},
|
|
11485
|
-
children: /* @__PURE__ */ (0,
|
|
10982
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_lucide_react13.Link, { className: "size-4 shrink-0", "aria-hidden": true })
|
|
11486
10983
|
}
|
|
11487
10984
|
) : null
|
|
11488
10985
|
] })
|
|
@@ -11499,7 +10996,7 @@ function StateToggle({
|
|
|
11499
10996
|
states,
|
|
11500
10997
|
onStateChange
|
|
11501
10998
|
}) {
|
|
11502
|
-
return /* @__PURE__ */ (0,
|
|
10999
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
11503
11000
|
ToggleGroup,
|
|
11504
11001
|
{
|
|
11505
11002
|
"data-ohw-state-toggle": "",
|
|
@@ -11513,7 +11010,7 @@ function StateToggle({
|
|
|
11513
11010
|
left: rect.right - 8,
|
|
11514
11011
|
transform: "translateX(-100%)"
|
|
11515
11012
|
},
|
|
11516
|
-
children: states.map((state) => /* @__PURE__ */ (0,
|
|
11013
|
+
children: states.map((state) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ToggleGroupItem, { value: state, size: "sm", children: state }, state))
|
|
11517
11014
|
}
|
|
11518
11015
|
);
|
|
11519
11016
|
}
|
|
@@ -11540,8 +11037,8 @@ function OhhwellsBridge() {
|
|
|
11540
11037
|
const router = (0, import_navigation3.useRouter)();
|
|
11541
11038
|
const searchParams = (0, import_navigation3.useSearchParams)();
|
|
11542
11039
|
const isEditMode = isEditSessionActive();
|
|
11543
|
-
const [bridgeRoot, setBridgeRoot] = (0,
|
|
11544
|
-
(0,
|
|
11040
|
+
const [bridgeRoot, setBridgeRoot] = (0, import_react13.useState)(null);
|
|
11041
|
+
(0, import_react13.useEffect)(() => {
|
|
11545
11042
|
const figtreeFontId = "ohw-figtree-font";
|
|
11546
11043
|
if (!document.getElementById(figtreeFontId)) {
|
|
11547
11044
|
const preconnect1 = Object.assign(document.createElement("link"), { rel: "preconnect", href: "https://fonts.googleapis.com" });
|
|
@@ -11570,107 +11067,106 @@ function OhhwellsBridge() {
|
|
|
11570
11067
|
const subdomain = resolveSubdomain(subdomainFromQuery);
|
|
11571
11068
|
useLinkHrefGuardian(pathname, subdomain, isEditMode);
|
|
11572
11069
|
useSavedLinkNavigation(isEditMode);
|
|
11573
|
-
const postToParent2 = (0,
|
|
11070
|
+
const postToParent2 = (0, import_react13.useCallback)((data) => {
|
|
11574
11071
|
if (typeof window !== "undefined" && window.parent !== window) {
|
|
11575
11072
|
window.parent.postMessage(data, "*");
|
|
11576
11073
|
}
|
|
11577
11074
|
}, []);
|
|
11578
|
-
const [fetchState, setFetchState] = (0,
|
|
11579
|
-
const autoSaveTimers = (0,
|
|
11580
|
-
const activeElRef = (0,
|
|
11581
|
-
const pointerHeldRef = (0,
|
|
11582
|
-
const selectedElRef = (0,
|
|
11583
|
-
const selectedHrefKeyRef = (0,
|
|
11584
|
-
const selectedFooterColAttrRef = (0,
|
|
11585
|
-
const originalContentRef = (0,
|
|
11586
|
-
const activeStateElRef = (0,
|
|
11587
|
-
const parentScrollRef = (0,
|
|
11588
|
-
const visibleViewportRef = (0,
|
|
11589
|
-
const [dialogPortalContainer, setDialogPortalContainer] = (0,
|
|
11590
|
-
const attachVisibleViewport = (0,
|
|
11075
|
+
const [fetchState, setFetchState] = (0, import_react13.useState)("idle");
|
|
11076
|
+
const autoSaveTimers = (0, import_react13.useRef)(/* @__PURE__ */ new Map());
|
|
11077
|
+
const activeElRef = (0, import_react13.useRef)(null);
|
|
11078
|
+
const pointerHeldRef = (0, import_react13.useRef)(false);
|
|
11079
|
+
const selectedElRef = (0, import_react13.useRef)(null);
|
|
11080
|
+
const selectedHrefKeyRef = (0, import_react13.useRef)(null);
|
|
11081
|
+
const selectedFooterColAttrRef = (0, import_react13.useRef)(null);
|
|
11082
|
+
const originalContentRef = (0, import_react13.useRef)(null);
|
|
11083
|
+
const activeStateElRef = (0, import_react13.useRef)(null);
|
|
11084
|
+
const parentScrollRef = (0, import_react13.useRef)(null);
|
|
11085
|
+
const visibleViewportRef = (0, import_react13.useRef)(null);
|
|
11086
|
+
const [dialogPortalContainer, setDialogPortalContainer] = (0, import_react13.useState)(null);
|
|
11087
|
+
const attachVisibleViewport = (0, import_react13.useCallback)((node) => {
|
|
11591
11088
|
visibleViewportRef.current = node;
|
|
11592
11089
|
setDialogPortalContainer(node);
|
|
11593
11090
|
if (node) applyVisibleViewport(node, parentScrollRef.current);
|
|
11594
11091
|
}, []);
|
|
11595
|
-
const toolbarElRef = (0,
|
|
11596
|
-
const glowElRef = (0,
|
|
11597
|
-
const hoveredImageRef = (0,
|
|
11598
|
-
const hoveredImageHasTextOverlapRef = (0,
|
|
11599
|
-
const dragOverElRef = (0,
|
|
11600
|
-
const [mediaHover, setMediaHover] = (0,
|
|
11601
|
-
const [carouselHover, setCarouselHover] = (0,
|
|
11602
|
-
const [uploadingRects, setUploadingRects] = (0,
|
|
11603
|
-
const hoveredGapRef = (0,
|
|
11604
|
-
const imageUnhoverTimerRef = (0,
|
|
11605
|
-
const imageShowTimerRef = (0,
|
|
11606
|
-
const editStylesRef = (0,
|
|
11607
|
-
const activateRef = (0,
|
|
11092
|
+
const toolbarElRef = (0, import_react13.useRef)(null);
|
|
11093
|
+
const glowElRef = (0, import_react13.useRef)(null);
|
|
11094
|
+
const hoveredImageRef = (0, import_react13.useRef)(null);
|
|
11095
|
+
const hoveredImageHasTextOverlapRef = (0, import_react13.useRef)(false);
|
|
11096
|
+
const dragOverElRef = (0, import_react13.useRef)(null);
|
|
11097
|
+
const [mediaHover, setMediaHover] = (0, import_react13.useState)(null);
|
|
11098
|
+
const [carouselHover, setCarouselHover] = (0, import_react13.useState)(null);
|
|
11099
|
+
const [uploadingRects, setUploadingRects] = (0, import_react13.useState)({});
|
|
11100
|
+
const hoveredGapRef = (0, import_react13.useRef)(null);
|
|
11101
|
+
const imageUnhoverTimerRef = (0, import_react13.useRef)(null);
|
|
11102
|
+
const imageShowTimerRef = (0, import_react13.useRef)(null);
|
|
11103
|
+
const editStylesRef = (0, import_react13.useRef)(null);
|
|
11104
|
+
const activateRef = (0, import_react13.useRef)(() => {
|
|
11608
11105
|
});
|
|
11609
|
-
const deactivateRef = (0,
|
|
11106
|
+
const deactivateRef = (0, import_react13.useRef)(() => {
|
|
11610
11107
|
});
|
|
11611
|
-
const selectRef = (0,
|
|
11108
|
+
const selectRef = (0, import_react13.useRef)(() => {
|
|
11612
11109
|
});
|
|
11613
|
-
const selectFrameRef = (0,
|
|
11110
|
+
const selectFrameRef = (0, import_react13.useRef)(() => {
|
|
11614
11111
|
});
|
|
11615
|
-
const deselectRef = (0,
|
|
11112
|
+
const deselectRef = (0, import_react13.useRef)(() => {
|
|
11616
11113
|
});
|
|
11617
|
-
const reselectNavigationItemRef = (0,
|
|
11114
|
+
const reselectNavigationItemRef = (0, import_react13.useRef)(() => {
|
|
11618
11115
|
});
|
|
11619
|
-
const commitNavigationTextEditRef = (0,
|
|
11116
|
+
const commitNavigationTextEditRef = (0, import_react13.useRef)(() => {
|
|
11620
11117
|
});
|
|
11621
|
-
const handleDeleteSelectedRef = (0,
|
|
11622
|
-
const runPendingDeleteUndoRef = (0,
|
|
11623
|
-
const isFooterFrameSelectionRef = (0,
|
|
11624
|
-
const refreshActiveCommandsRef = (0,
|
|
11118
|
+
const handleDeleteSelectedRef = (0, import_react13.useRef)(() => false);
|
|
11119
|
+
const runPendingDeleteUndoRef = (0, import_react13.useRef)(() => false);
|
|
11120
|
+
const isFooterFrameSelectionRef = (0, import_react13.useRef)(false);
|
|
11121
|
+
const refreshActiveCommandsRef = (0, import_react13.useRef)(() => {
|
|
11625
11122
|
});
|
|
11626
|
-
const postToParentRef = (0,
|
|
11123
|
+
const postToParentRef = (0, import_react13.useRef)(postToParent2);
|
|
11627
11124
|
postToParentRef.current = postToParent2;
|
|
11628
|
-
const
|
|
11629
|
-
const
|
|
11630
|
-
const
|
|
11631
|
-
const [
|
|
11632
|
-
const
|
|
11633
|
-
const toolbarVariantRef = (0, import_react14.useRef)("none");
|
|
11125
|
+
const sectionsLoadedRef = (0, import_react13.useRef)(false);
|
|
11126
|
+
const pendingScheduleConfigRequests = (0, import_react13.useRef)([]);
|
|
11127
|
+
const [toolbarRect, setToolbarRect] = (0, import_react13.useState)(null);
|
|
11128
|
+
const [toolbarVariant, setToolbarVariant] = (0, import_react13.useState)("none");
|
|
11129
|
+
const toolbarVariantRef = (0, import_react13.useRef)("none");
|
|
11634
11130
|
toolbarVariantRef.current = toolbarVariant;
|
|
11635
|
-
const [selectedIsCta, setSelectedIsCta] = (0,
|
|
11636
|
-
const [reorderHrefKey, setReorderHrefKey] = (0,
|
|
11637
|
-
const [reorderDragDisabled, setReorderDragDisabled] = (0,
|
|
11638
|
-
const [toggleState, setToggleState] = (0,
|
|
11639
|
-
const [maxBadge, setMaxBadge] = (0,
|
|
11640
|
-
const [activeCommands, setActiveCommands] = (0,
|
|
11641
|
-
const [sectionGap, setSectionGap] = (0,
|
|
11642
|
-
const [toolbarShowEditLink, setToolbarShowEditLink] = (0,
|
|
11643
|
-
const hoveredNavContainerRef = (0,
|
|
11644
|
-
const [hoveredNavContainerRect, setHoveredNavContainerRect] = (0,
|
|
11645
|
-
const hoveredItemElRef = (0,
|
|
11646
|
-
const [hoveredItemRect, setHoveredItemRect] = (0,
|
|
11647
|
-
const siblingHintElRef = (0,
|
|
11648
|
-
const [siblingHintRect, setSiblingHintRect] = (0,
|
|
11649
|
-
const [siblingHintRects, setSiblingHintRects] = (0,
|
|
11650
|
-
const [isItemDragging, setIsItemDragging] = (0,
|
|
11651
|
-
const [isFooterFrameSelection, setIsFooterFrameSelection] = (0,
|
|
11131
|
+
const [selectedIsCta, setSelectedIsCta] = (0, import_react13.useState)(false);
|
|
11132
|
+
const [reorderHrefKey, setReorderHrefKey] = (0, import_react13.useState)(null);
|
|
11133
|
+
const [reorderDragDisabled, setReorderDragDisabled] = (0, import_react13.useState)(false);
|
|
11134
|
+
const [toggleState, setToggleState] = (0, import_react13.useState)(null);
|
|
11135
|
+
const [maxBadge, setMaxBadge] = (0, import_react13.useState)(null);
|
|
11136
|
+
const [activeCommands, setActiveCommands] = (0, import_react13.useState)(/* @__PURE__ */ new Set());
|
|
11137
|
+
const [sectionGap, setSectionGap] = (0, import_react13.useState)(null);
|
|
11138
|
+
const [toolbarShowEditLink, setToolbarShowEditLink] = (0, import_react13.useState)(false);
|
|
11139
|
+
const hoveredNavContainerRef = (0, import_react13.useRef)(null);
|
|
11140
|
+
const [hoveredNavContainerRect, setHoveredNavContainerRect] = (0, import_react13.useState)(null);
|
|
11141
|
+
const hoveredItemElRef = (0, import_react13.useRef)(null);
|
|
11142
|
+
const [hoveredItemRect, setHoveredItemRect] = (0, import_react13.useState)(null);
|
|
11143
|
+
const siblingHintElRef = (0, import_react13.useRef)(null);
|
|
11144
|
+
const [siblingHintRect, setSiblingHintRect] = (0, import_react13.useState)(null);
|
|
11145
|
+
const [siblingHintRects, setSiblingHintRects] = (0, import_react13.useState)([]);
|
|
11146
|
+
const [isItemDragging, setIsItemDragging] = (0, import_react13.useState)(false);
|
|
11147
|
+
const [isFooterFrameSelection, setIsFooterFrameSelection] = (0, import_react13.useState)(false);
|
|
11652
11148
|
isFooterFrameSelectionRef.current = isFooterFrameSelection;
|
|
11653
|
-
const [navDropdownPreviewOpen, setNavDropdownPreviewOpen] = (0,
|
|
11654
|
-
const [footerHeadingVisible, setFooterHeadingVisible] = (0,
|
|
11655
|
-
const footerDragRef = (0,
|
|
11656
|
-
const [footerDropSlots, setFooterDropSlots] = (0,
|
|
11657
|
-
const [activeFooterDropIndex, setActiveFooterDropIndex] = (0,
|
|
11658
|
-
const [draggedItemRect, setDraggedItemRect] = (0,
|
|
11659
|
-
const footerPointerDragRef = (0,
|
|
11660
|
-
const suppressNextClickRef = (0,
|
|
11661
|
-
const suppressClickUntilRef = (0,
|
|
11662
|
-
const [linkPopover, setLinkPopover] = (0,
|
|
11663
|
-
const linkPopoverSessionRef = (0,
|
|
11664
|
-
const addNavAfterAnchorRef = (0,
|
|
11665
|
-
const editContentRef = (0,
|
|
11666
|
-
const pendingDeleteUndoRef = (0,
|
|
11667
|
-
const [sitePages, setSitePages] = (0,
|
|
11668
|
-
const [sectionsByPath, setSectionsByPath] = (0,
|
|
11669
|
-
const sectionsPrefetchGenRef = (0,
|
|
11670
|
-
const setLinkPopoverRef = (0,
|
|
11671
|
-
const linkPopoverPanelRef = (0,
|
|
11672
|
-
const linkPopoverOpenRef = (0,
|
|
11673
|
-
const linkPopoverGraceUntilRef = (0,
|
|
11149
|
+
const [navDropdownPreviewOpen, setNavDropdownPreviewOpen] = (0, import_react13.useState)(null);
|
|
11150
|
+
const [footerHeadingVisible, setFooterHeadingVisible] = (0, import_react13.useState)(null);
|
|
11151
|
+
const footerDragRef = (0, import_react13.useRef)(null);
|
|
11152
|
+
const [footerDropSlots, setFooterDropSlots] = (0, import_react13.useState)([]);
|
|
11153
|
+
const [activeFooterDropIndex, setActiveFooterDropIndex] = (0, import_react13.useState)(null);
|
|
11154
|
+
const [draggedItemRect, setDraggedItemRect] = (0, import_react13.useState)(null);
|
|
11155
|
+
const footerPointerDragRef = (0, import_react13.useRef)(null);
|
|
11156
|
+
const suppressNextClickRef = (0, import_react13.useRef)(false);
|
|
11157
|
+
const suppressClickUntilRef = (0, import_react13.useRef)(0);
|
|
11158
|
+
const [linkPopover, setLinkPopover] = (0, import_react13.useState)(null);
|
|
11159
|
+
const linkPopoverSessionRef = (0, import_react13.useRef)(null);
|
|
11160
|
+
const addNavAfterAnchorRef = (0, import_react13.useRef)(null);
|
|
11161
|
+
const editContentRef = (0, import_react13.useRef)({});
|
|
11162
|
+
const pendingDeleteUndoRef = (0, import_react13.useRef)(null);
|
|
11163
|
+
const [sitePages, setSitePages] = (0, import_react13.useState)([]);
|
|
11164
|
+
const [sectionsByPath, setSectionsByPath] = (0, import_react13.useState)({});
|
|
11165
|
+
const sectionsPrefetchGenRef = (0, import_react13.useRef)(0);
|
|
11166
|
+
const setLinkPopoverRef = (0, import_react13.useRef)(setLinkPopover);
|
|
11167
|
+
const linkPopoverPanelRef = (0, import_react13.useRef)(null);
|
|
11168
|
+
const linkPopoverOpenRef = (0, import_react13.useRef)(false);
|
|
11169
|
+
const linkPopoverGraceUntilRef = (0, import_react13.useRef)(0);
|
|
11674
11170
|
setLinkPopoverRef.current = setLinkPopover;
|
|
11675
11171
|
linkPopoverSessionRef.current = linkPopover;
|
|
11676
11172
|
const {
|
|
@@ -11708,7 +11204,7 @@ function OhhwellsBridge() {
|
|
|
11708
11204
|
const bumpLinkPopoverGrace = () => {
|
|
11709
11205
|
linkPopoverGraceUntilRef.current = Date.now() + 350;
|
|
11710
11206
|
};
|
|
11711
|
-
const runSectionsPrefetch = (0,
|
|
11207
|
+
const runSectionsPrefetch = (0, import_react13.useCallback)((pages) => {
|
|
11712
11208
|
if (!isEditMode || shouldUseDevFixtures() || pages.length === 0) return;
|
|
11713
11209
|
const gen = ++sectionsPrefetchGenRef.current;
|
|
11714
11210
|
const paths = pages.map((p) => p.path);
|
|
@@ -11727,9 +11223,9 @@ function OhhwellsBridge() {
|
|
|
11727
11223
|
);
|
|
11728
11224
|
});
|
|
11729
11225
|
}, [isEditMode, pathname]);
|
|
11730
|
-
const runSectionsPrefetchRef = (0,
|
|
11226
|
+
const runSectionsPrefetchRef = (0, import_react13.useRef)(runSectionsPrefetch);
|
|
11731
11227
|
runSectionsPrefetchRef.current = runSectionsPrefetch;
|
|
11732
|
-
(0,
|
|
11228
|
+
(0, import_react13.useEffect)(() => {
|
|
11733
11229
|
if (!linkPopover) {
|
|
11734
11230
|
document.documentElement.removeAttribute("data-ohw-link-popover-open");
|
|
11735
11231
|
return;
|
|
@@ -11757,7 +11253,7 @@ function OhhwellsBridge() {
|
|
|
11757
11253
|
document.documentElement.removeAttribute("data-ohw-link-popover-open");
|
|
11758
11254
|
};
|
|
11759
11255
|
}, [linkPopover, postToParent2]);
|
|
11760
|
-
(0,
|
|
11256
|
+
(0, import_react13.useEffect)(() => {
|
|
11761
11257
|
if (!isEditMode) return;
|
|
11762
11258
|
const useFixtures = shouldUseDevFixtures();
|
|
11763
11259
|
if (useFixtures) {
|
|
@@ -11781,14 +11277,14 @@ function OhhwellsBridge() {
|
|
|
11781
11277
|
if (!useFixtures) postToParent2({ type: "ow:request-site-pages" });
|
|
11782
11278
|
return () => window.removeEventListener("message", onSitePages);
|
|
11783
11279
|
}, [isEditMode, postToParent2]);
|
|
11784
|
-
(0,
|
|
11280
|
+
(0, import_react13.useEffect)(() => {
|
|
11785
11281
|
if (!isEditMode || shouldUseDevFixtures()) return;
|
|
11786
11282
|
void loadAllSectionsManifest().then((manifest) => {
|
|
11787
11283
|
if (Object.keys(manifest).length === 0) return;
|
|
11788
11284
|
setSectionsByPath((prev) => ({ ...manifest, ...prev }));
|
|
11789
11285
|
});
|
|
11790
11286
|
}, [isEditMode]);
|
|
11791
|
-
(0,
|
|
11287
|
+
(0, import_react13.useEffect)(() => {
|
|
11792
11288
|
const update = () => {
|
|
11793
11289
|
const el = activeElRef.current ?? selectedElRef.current;
|
|
11794
11290
|
if (el) setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
@@ -11812,10 +11308,10 @@ function OhhwellsBridge() {
|
|
|
11812
11308
|
vvp.removeEventListener("resize", update);
|
|
11813
11309
|
};
|
|
11814
11310
|
}, []);
|
|
11815
|
-
const refreshStateRules = (0,
|
|
11311
|
+
const refreshStateRules = (0, import_react13.useCallback)(() => {
|
|
11816
11312
|
editStylesRef.current?.forceHover && (editStylesRef.current.forceHover.textContent = collectStateRules());
|
|
11817
11313
|
}, []);
|
|
11818
|
-
const processConfigRequest = (0,
|
|
11314
|
+
const processConfigRequest = (0, import_react13.useCallback)((insertAfterVal) => {
|
|
11819
11315
|
const tracker = getSectionsTracker();
|
|
11820
11316
|
let entries = [];
|
|
11821
11317
|
try {
|
|
@@ -11838,7 +11334,7 @@ function OhhwellsBridge() {
|
|
|
11838
11334
|
}
|
|
11839
11335
|
window.postMessage({ type: "ow:schedule-config", insertAfter: insertAfterVal, scheduleId: null }, "*");
|
|
11840
11336
|
}, [isEditMode]);
|
|
11841
|
-
const deactivate = (0,
|
|
11337
|
+
const deactivate = (0, import_react13.useCallback)(() => {
|
|
11842
11338
|
const el = activeElRef.current;
|
|
11843
11339
|
if (!el) return;
|
|
11844
11340
|
const key = el.dataset.ohwKey;
|
|
@@ -11871,12 +11367,12 @@ function OhhwellsBridge() {
|
|
|
11871
11367
|
setToolbarShowEditLink(false);
|
|
11872
11368
|
postToParent2({ type: "ow:exit-edit" });
|
|
11873
11369
|
}, [postToParent2]);
|
|
11874
|
-
const clearSelectedAttr = (0,
|
|
11370
|
+
const clearSelectedAttr = (0, import_react13.useCallback)(() => {
|
|
11875
11371
|
document.querySelectorAll("[data-ohw-selected]").forEach((el) => {
|
|
11876
11372
|
el.removeAttribute("data-ohw-selected");
|
|
11877
11373
|
});
|
|
11878
11374
|
}, []);
|
|
11879
|
-
const deselect = (0,
|
|
11375
|
+
const deselect = (0, import_react13.useCallback)(() => {
|
|
11880
11376
|
clearSelectedAttr();
|
|
11881
11377
|
selectedElRef.current = null;
|
|
11882
11378
|
selectedHrefKeyRef.current = null;
|
|
@@ -11893,19 +11389,17 @@ function OhhwellsBridge() {
|
|
|
11893
11389
|
setIsItemDragging(false);
|
|
11894
11390
|
hoveredNavContainerRef.current = null;
|
|
11895
11391
|
setHoveredNavContainerRect(null);
|
|
11896
|
-
hoveredItemElRef.current = null;
|
|
11897
|
-
setHoveredItemRect(null);
|
|
11898
11392
|
if (!activeElRef.current) {
|
|
11899
11393
|
setNavGroupForceOpen(null, false);
|
|
11900
11394
|
setToolbarRect(null);
|
|
11901
11395
|
setToolbarVariant("none");
|
|
11902
11396
|
}
|
|
11903
11397
|
}, [clearSelectedAttr]);
|
|
11904
|
-
const markSelected = (0,
|
|
11398
|
+
const markSelected = (0, import_react13.useCallback)((el) => {
|
|
11905
11399
|
clearSelectedAttr();
|
|
11906
11400
|
el.setAttribute("data-ohw-selected", "");
|
|
11907
11401
|
}, [clearSelectedAttr]);
|
|
11908
|
-
const resolveHrefKeyElement = (0,
|
|
11402
|
+
const resolveHrefKeyElement = (0, import_react13.useCallback)((hrefKey) => {
|
|
11909
11403
|
if (isFooterHrefKey(hrefKey)) {
|
|
11910
11404
|
return document.querySelector(
|
|
11911
11405
|
`footer [data-ohw-href-key="${CSS.escape(hrefKey)}"]`
|
|
@@ -11920,7 +11414,7 @@ function OhhwellsBridge() {
|
|
|
11920
11414
|
`[data-ohw-href-key="${CSS.escape(hrefKey)}"]`
|
|
11921
11415
|
);
|
|
11922
11416
|
}, []);
|
|
11923
|
-
const resyncSelectedNavigationItem = (0,
|
|
11417
|
+
const resyncSelectedNavigationItem = (0, import_react13.useCallback)(() => {
|
|
11924
11418
|
const hrefKey = selectedHrefKeyRef.current;
|
|
11925
11419
|
if (hrefKey) {
|
|
11926
11420
|
const link = resolveHrefKeyElement(hrefKey);
|
|
@@ -11958,7 +11452,7 @@ function OhhwellsBridge() {
|
|
|
11958
11452
|
);
|
|
11959
11453
|
}
|
|
11960
11454
|
}, [resolveHrefKeyElement]);
|
|
11961
|
-
const reselectNavigationItem = (0,
|
|
11455
|
+
const reselectNavigationItem = (0, import_react13.useCallback)((navAnchor) => {
|
|
11962
11456
|
selectedElRef.current = navAnchor;
|
|
11963
11457
|
selectedHrefKeyRef.current = navAnchor.getAttribute("data-ohw-href-key");
|
|
11964
11458
|
selectedFooterColAttrRef.current = null;
|
|
@@ -11987,7 +11481,7 @@ function OhhwellsBridge() {
|
|
|
11987
11481
|
setToolbarShowEditLink(false);
|
|
11988
11482
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
11989
11483
|
}, [markSelected]);
|
|
11990
|
-
const commitNavigationTextEdit = (0,
|
|
11484
|
+
const commitNavigationTextEdit = (0, import_react13.useCallback)((navAnchor) => {
|
|
11991
11485
|
const el = activeElRef.current;
|
|
11992
11486
|
if (!el) return;
|
|
11993
11487
|
const key = el.dataset.ohwKey;
|
|
@@ -12014,7 +11508,7 @@ function OhhwellsBridge() {
|
|
|
12014
11508
|
postToParent2({ type: "ow:exit-edit" });
|
|
12015
11509
|
reselectNavigationItem(navAnchor);
|
|
12016
11510
|
}, [postToParent2, reselectNavigationItem]);
|
|
12017
|
-
const handleAddTopLevelNavItem = (0,
|
|
11511
|
+
const handleAddTopLevelNavItem = (0, import_react13.useCallback)(() => {
|
|
12018
11512
|
const items = listNavbarRootItems();
|
|
12019
11513
|
addNavAfterAnchorRef.current = items[items.length - 1] ?? null;
|
|
12020
11514
|
deselectRef.current();
|
|
@@ -12026,7 +11520,7 @@ function OhhwellsBridge() {
|
|
|
12026
11520
|
intent: "add-nav"
|
|
12027
11521
|
});
|
|
12028
11522
|
}, []);
|
|
12029
|
-
const maybeWarnNavLinkDropdownConflict = (0,
|
|
11523
|
+
const maybeWarnNavLinkDropdownConflict = (0, import_react13.useCallback)(
|
|
12030
11524
|
(anchor) => {
|
|
12031
11525
|
if (!isNavbarHrefKey(anchor.getAttribute("data-ohw-href-key"))) return;
|
|
12032
11526
|
if (!navDropdownsOpenOnClick()) return;
|
|
@@ -12039,7 +11533,7 @@ function OhhwellsBridge() {
|
|
|
12039
11533
|
},
|
|
12040
11534
|
[postToParent2]
|
|
12041
11535
|
);
|
|
12042
|
-
const handleNavDropdownOpenChange = (0,
|
|
11536
|
+
const handleNavDropdownOpenChange = (0, import_react13.useCallback)((open) => {
|
|
12043
11537
|
const selected = selectedElRef.current;
|
|
12044
11538
|
if (!selected || !isNavigationItem2(selected)) return;
|
|
12045
11539
|
setNavGroupForceOpen(selected, open);
|
|
@@ -12051,7 +11545,7 @@ function OhhwellsBridge() {
|
|
|
12051
11545
|
}
|
|
12052
11546
|
});
|
|
12053
11547
|
}, []);
|
|
12054
|
-
const handleFooterHeadingVisibleChange = (0,
|
|
11548
|
+
const handleFooterHeadingVisibleChange = (0, import_react13.useCallback)(
|
|
12055
11549
|
(visible) => {
|
|
12056
11550
|
const selected = selectedElRef.current;
|
|
12057
11551
|
if (!selected || !isFooterFrameSelectionRef.current) return;
|
|
@@ -12075,7 +11569,7 @@ function OhhwellsBridge() {
|
|
|
12075
11569
|
},
|
|
12076
11570
|
[postToParent2]
|
|
12077
11571
|
);
|
|
12078
|
-
const enterEditOnNewItem = (0,
|
|
11572
|
+
const enterEditOnNewItem = (0, import_react13.useCallback)((anchor) => {
|
|
12079
11573
|
const label = anchor.querySelector('[data-ohw-editable="text"]');
|
|
12080
11574
|
if (!label) {
|
|
12081
11575
|
selectRef.current(anchor);
|
|
@@ -12084,7 +11578,7 @@ function OhhwellsBridge() {
|
|
|
12084
11578
|
setNavGroupForceOpen(anchor, true);
|
|
12085
11579
|
activateRef.current(label);
|
|
12086
11580
|
}, []);
|
|
12087
|
-
const handleAddChildItem = (0,
|
|
11581
|
+
const handleAddChildItem = (0, import_react13.useCallback)(() => {
|
|
12088
11582
|
const selected = selectedElRef.current;
|
|
12089
11583
|
if (!selected) return;
|
|
12090
11584
|
if (toolbarVariantRef.current === "select-frame" && isFooterFrameSelection) {
|
|
@@ -12160,7 +11654,7 @@ function OhhwellsBridge() {
|
|
|
12160
11654
|
enterEditOnNewItem(result.anchor);
|
|
12161
11655
|
});
|
|
12162
11656
|
}, [enterEditOnNewItem, isFooterFrameSelection, maybeWarnNavLinkDropdownConflict, postToParent2]);
|
|
12163
|
-
const handleAddFooterColumn = (0,
|
|
11657
|
+
const handleAddFooterColumn = (0, import_react13.useCallback)(() => {
|
|
12164
11658
|
if (!canAddFooterColumn()) {
|
|
12165
11659
|
postToParent2({
|
|
12166
11660
|
type: "ow:toast",
|
|
@@ -12181,7 +11675,7 @@ function OhhwellsBridge() {
|
|
|
12181
11675
|
selectRef.current(result.firstLink);
|
|
12182
11676
|
});
|
|
12183
11677
|
}, [postToParent2]);
|
|
12184
|
-
const clearFooterDragVisuals = (0,
|
|
11678
|
+
const clearFooterDragVisuals = (0, import_react13.useCallback)(() => {
|
|
12185
11679
|
footerDragRef.current = null;
|
|
12186
11680
|
setSiblingHintRects([]);
|
|
12187
11681
|
setFooterDropSlots([]);
|
|
@@ -12190,7 +11684,7 @@ function OhhwellsBridge() {
|
|
|
12190
11684
|
setIsItemDragging(false);
|
|
12191
11685
|
unlockFooterDragInteraction();
|
|
12192
11686
|
}, []);
|
|
12193
|
-
const refreshFooterDragVisuals = (0,
|
|
11687
|
+
const refreshFooterDragVisuals = (0, import_react13.useCallback)((session, activeSlot, clientX, clientY) => {
|
|
12194
11688
|
const dragged = session.draggedEl;
|
|
12195
11689
|
setDraggedItemRect(dragged.getBoundingClientRect());
|
|
12196
11690
|
if (typeof clientX === "number" && typeof clientY === "number") {
|
|
@@ -12215,13 +11709,13 @@ function OhhwellsBridge() {
|
|
|
12215
11709
|
const activeIdx = activeSlot ? slots.findIndex((s) => s.insertIndex === activeSlot.insertIndex) : -1;
|
|
12216
11710
|
setActiveFooterDropIndex(activeIdx >= 0 ? activeIdx : null);
|
|
12217
11711
|
}, []);
|
|
12218
|
-
const refreshFooterDragVisualsRef = (0,
|
|
11712
|
+
const refreshFooterDragVisualsRef = (0, import_react13.useRef)(refreshFooterDragVisuals);
|
|
12219
11713
|
refreshFooterDragVisualsRef.current = refreshFooterDragVisuals;
|
|
12220
|
-
const commitFooterDragRef = (0,
|
|
11714
|
+
const commitFooterDragRef = (0, import_react13.useRef)(() => {
|
|
12221
11715
|
});
|
|
12222
|
-
const beginFooterDragRef = (0,
|
|
11716
|
+
const beginFooterDragRef = (0, import_react13.useRef)(() => {
|
|
12223
11717
|
});
|
|
12224
|
-
const beginFooterDrag = (0,
|
|
11718
|
+
const beginFooterDrag = (0, import_react13.useCallback)(
|
|
12225
11719
|
(session) => {
|
|
12226
11720
|
const rect = session.draggedEl.getBoundingClientRect();
|
|
12227
11721
|
session.lastClientX = session.lastClientX || rect.left + rect.width / 2;
|
|
@@ -12241,7 +11735,7 @@ function OhhwellsBridge() {
|
|
|
12241
11735
|
[refreshFooterDragVisuals]
|
|
12242
11736
|
);
|
|
12243
11737
|
beginFooterDragRef.current = beginFooterDrag;
|
|
12244
|
-
const commitFooterDrag = (0,
|
|
11738
|
+
const commitFooterDrag = (0, import_react13.useCallback)(
|
|
12245
11739
|
(clientX, clientY) => {
|
|
12246
11740
|
const session = footerDragRef.current;
|
|
12247
11741
|
if (!session) {
|
|
@@ -12345,7 +11839,7 @@ function OhhwellsBridge() {
|
|
|
12345
11839
|
[clearFooterDragVisuals, resolveHrefKeyElement, resyncSelectedNavigationItem]
|
|
12346
11840
|
);
|
|
12347
11841
|
commitFooterDragRef.current = commitFooterDrag;
|
|
12348
|
-
const startFooterLinkDrag = (0,
|
|
11842
|
+
const startFooterLinkDrag = (0, import_react13.useCallback)(
|
|
12349
11843
|
(anchor, clientX, clientY, wasSelected) => {
|
|
12350
11844
|
const hrefKey = anchor.getAttribute("data-ohw-href-key");
|
|
12351
11845
|
if (!hrefKey || !isFooterHrefKey(hrefKey)) return false;
|
|
@@ -12366,7 +11860,7 @@ function OhhwellsBridge() {
|
|
|
12366
11860
|
},
|
|
12367
11861
|
[beginFooterDrag]
|
|
12368
11862
|
);
|
|
12369
|
-
const startFooterColumnDrag = (0,
|
|
11863
|
+
const startFooterColumnDrag = (0, import_react13.useCallback)(
|
|
12370
11864
|
(columnEl, clientX, clientY, wasSelected) => {
|
|
12371
11865
|
const columns = listFooterColumns();
|
|
12372
11866
|
const idx = columns.indexOf(columnEl);
|
|
@@ -12386,7 +11880,7 @@ function OhhwellsBridge() {
|
|
|
12386
11880
|
},
|
|
12387
11881
|
[beginFooterDrag]
|
|
12388
11882
|
);
|
|
12389
|
-
const handleItemDragStart = (0,
|
|
11883
|
+
const handleItemDragStart = (0, import_react13.useCallback)(
|
|
12390
11884
|
(e) => {
|
|
12391
11885
|
const selected = selectedElRef.current;
|
|
12392
11886
|
if (!selected) {
|
|
@@ -12406,7 +11900,7 @@ function OhhwellsBridge() {
|
|
|
12406
11900
|
},
|
|
12407
11901
|
[startFooterColumnDrag, startFooterLinkDrag, startNavLinkDrag]
|
|
12408
11902
|
);
|
|
12409
|
-
const handleItemDragEnd = (0,
|
|
11903
|
+
const handleItemDragEnd = (0, import_react13.useCallback)(
|
|
12410
11904
|
(e) => {
|
|
12411
11905
|
if (footerDragRef.current) {
|
|
12412
11906
|
const x = e?.clientX;
|
|
@@ -12432,7 +11926,7 @@ function OhhwellsBridge() {
|
|
|
12432
11926
|
},
|
|
12433
11927
|
[commitFooterDrag, commitNavDrag, navDragRef]
|
|
12434
11928
|
);
|
|
12435
|
-
const handleItemChromePointerDown = (0,
|
|
11929
|
+
const handleItemChromePointerDown = (0, import_react13.useCallback)((e) => {
|
|
12436
11930
|
if (e.button !== 0) return;
|
|
12437
11931
|
const selected = selectedElRef.current;
|
|
12438
11932
|
if (!selected) return;
|
|
@@ -12463,7 +11957,7 @@ function OhhwellsBridge() {
|
|
|
12463
11957
|
}
|
|
12464
11958
|
if (armNavPressFromChrome(selected, e.clientX, e.clientY, e.pointerId)) return;
|
|
12465
11959
|
}, [armNavPressFromChrome]);
|
|
12466
|
-
const handleItemChromeClick = (0,
|
|
11960
|
+
const handleItemChromeClick = (0, import_react13.useCallback)((clientX, clientY) => {
|
|
12467
11961
|
if (suppressNextClickRef.current || Date.now() < suppressClickUntilRef.current) {
|
|
12468
11962
|
suppressNextClickRef.current = false;
|
|
12469
11963
|
return;
|
|
@@ -12476,10 +11970,9 @@ function OhhwellsBridge() {
|
|
|
12476
11970
|
}, []);
|
|
12477
11971
|
reselectNavigationItemRef.current = reselectNavigationItem;
|
|
12478
11972
|
commitNavigationTextEditRef.current = commitNavigationTextEdit;
|
|
12479
|
-
const select = (0,
|
|
11973
|
+
const select = (0, import_react13.useCallback)((anchor) => {
|
|
12480
11974
|
if (!isNavigationItem2(anchor)) return;
|
|
12481
11975
|
if (activeElRef.current) deactivate();
|
|
12482
|
-
aiSectionApiRef.current?.selectFromElement(anchor);
|
|
12483
11976
|
selectedElRef.current = anchor;
|
|
12484
11977
|
selectedHrefKeyRef.current = anchor.getAttribute("data-ohw-href-key");
|
|
12485
11978
|
selectedFooterColAttrRef.current = null;
|
|
@@ -12515,10 +12008,9 @@ function OhhwellsBridge() {
|
|
|
12515
12008
|
setToolbarShowEditLink(false);
|
|
12516
12009
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
12517
12010
|
}, [deactivate, markSelected]);
|
|
12518
|
-
const selectFrame = (0,
|
|
12011
|
+
const selectFrame = (0, import_react13.useCallback)((el) => {
|
|
12519
12012
|
if (!isNavigationContainer(el)) return;
|
|
12520
12013
|
if (activeElRef.current) deactivate();
|
|
12521
|
-
aiSectionApiRef.current?.selectFromElement(el);
|
|
12522
12014
|
const isFooterColumn = !isFooterLinksContainer(el) && (el.hasAttribute("data-ohw-footer-col") || Boolean(el.closest("footer") && isInferredFooterGroup2(el)));
|
|
12523
12015
|
selectedElRef.current = el;
|
|
12524
12016
|
selectedHrefKeyRef.current = null;
|
|
@@ -12562,7 +12054,7 @@ function OhhwellsBridge() {
|
|
|
12562
12054
|
setToolbarShowEditLink(false);
|
|
12563
12055
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
12564
12056
|
}, [deactivate, markSelected, postToParent2]);
|
|
12565
|
-
const activate = (0,
|
|
12057
|
+
const activate = (0, import_react13.useCallback)((el, options) => {
|
|
12566
12058
|
if (activeElRef.current === el) return;
|
|
12567
12059
|
clearSelectedAttr();
|
|
12568
12060
|
selectedElRef.current = null;
|
|
@@ -12623,15 +12115,7 @@ function OhhwellsBridge() {
|
|
|
12623
12115
|
setReorderDragDisabled(reorderDisabled);
|
|
12624
12116
|
}
|
|
12625
12117
|
setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
12626
|
-
|
|
12627
|
-
postToParent2({
|
|
12628
|
-
type: "ow:enter-edit",
|
|
12629
|
-
key: el.dataset.ohwKey,
|
|
12630
|
-
// Section the edited element belongs to, so the editor can scope AI prompts to it.
|
|
12631
|
-
sectionId: sectionEl?.dataset.ohwSection ?? null,
|
|
12632
|
-
sectionLabel: sectionEl?.dataset.ohwSectionLabel ?? null
|
|
12633
|
-
});
|
|
12634
|
-
aiSectionApiRef.current?.selectFromElement(el, { report: false });
|
|
12118
|
+
postToParent2({ type: "ow:enter-edit", key: el.dataset.ohwKey });
|
|
12635
12119
|
requestAnimationFrame(() => refreshActiveCommandsRef.current());
|
|
12636
12120
|
}, [clearSelectedAttr, deactivate, postToParent2]);
|
|
12637
12121
|
activateRef.current = activate;
|
|
@@ -12639,34 +12123,7 @@ function OhhwellsBridge() {
|
|
|
12639
12123
|
selectRef.current = select;
|
|
12640
12124
|
selectFrameRef.current = selectFrame;
|
|
12641
12125
|
deselectRef.current = deselect;
|
|
12642
|
-
|
|
12643
|
-
(0, import_react14.useEffect)(() => {
|
|
12644
|
-
if (!isEditMode) {
|
|
12645
|
-
if (lastSiteWideScopeRef.current !== false) {
|
|
12646
|
-
lastSiteWideScopeRef.current = false;
|
|
12647
|
-
postToParent2({ type: "ow:site-wide-scope", active: false });
|
|
12648
|
-
}
|
|
12649
|
-
return;
|
|
12650
|
-
}
|
|
12651
|
-
const active = isSiteWideScopeActive({
|
|
12652
|
-
selected: selectedElRef.current,
|
|
12653
|
-
hoveredItem: hoveredItemElRef.current,
|
|
12654
|
-
hoveredNavContainer: hoveredNavContainerRef.current,
|
|
12655
|
-
active: activeElRef.current
|
|
12656
|
-
});
|
|
12657
|
-
if (lastSiteWideScopeRef.current === active) return;
|
|
12658
|
-
lastSiteWideScopeRef.current = active;
|
|
12659
|
-
postToParent2({ type: "ow:site-wide-scope", active });
|
|
12660
|
-
}, [
|
|
12661
|
-
isEditMode,
|
|
12662
|
-
hoveredItemRect,
|
|
12663
|
-
hoveredNavContainerRect,
|
|
12664
|
-
toolbarVariant,
|
|
12665
|
-
toolbarRect,
|
|
12666
|
-
isFooterFrameSelection,
|
|
12667
|
-
postToParent2
|
|
12668
|
-
]);
|
|
12669
|
-
(0, import_react14.useLayoutEffect)(() => {
|
|
12126
|
+
(0, import_react13.useLayoutEffect)(() => {
|
|
12670
12127
|
if (!subdomain || isEditMode) {
|
|
12671
12128
|
setFetchState("done");
|
|
12672
12129
|
return;
|
|
@@ -12737,7 +12194,7 @@ function OhhwellsBridge() {
|
|
|
12737
12194
|
cancelled = true;
|
|
12738
12195
|
};
|
|
12739
12196
|
}, [subdomain, isEditMode]);
|
|
12740
|
-
(0,
|
|
12197
|
+
(0, import_react13.useEffect)(() => {
|
|
12741
12198
|
if (!subdomain || isEditMode) return;
|
|
12742
12199
|
let debounceTimer = null;
|
|
12743
12200
|
let observer = null;
|
|
@@ -12788,16 +12245,16 @@ function OhhwellsBridge() {
|
|
|
12788
12245
|
if (debounceTimer) clearTimeout(debounceTimer);
|
|
12789
12246
|
};
|
|
12790
12247
|
}, [subdomain, isEditMode, pathname]);
|
|
12791
|
-
(0,
|
|
12248
|
+
(0, import_react13.useLayoutEffect)(() => {
|
|
12792
12249
|
const el = document.getElementById("ohw-loader");
|
|
12793
12250
|
if (!el) return;
|
|
12794
12251
|
const visible = Boolean(subdomain) && fetchState !== "done";
|
|
12795
12252
|
el.style.display = visible ? "flex" : "none";
|
|
12796
12253
|
}, [subdomain, fetchState]);
|
|
12797
|
-
(0,
|
|
12254
|
+
(0, import_react13.useEffect)(() => {
|
|
12798
12255
|
postToParent2({ type: "ow:navigation", path: pathname });
|
|
12799
12256
|
}, [pathname, postToParent2]);
|
|
12800
|
-
(0,
|
|
12257
|
+
(0, import_react13.useEffect)(() => {
|
|
12801
12258
|
if (!isEditMode) return;
|
|
12802
12259
|
if (linkPopoverSessionRef.current?.intent === "add-nav") return;
|
|
12803
12260
|
if (document.querySelector("[data-ohw-section-picker]")) return;
|
|
@@ -12805,7 +12262,7 @@ function OhhwellsBridge() {
|
|
|
12805
12262
|
deselectRef.current();
|
|
12806
12263
|
deactivateRef.current();
|
|
12807
12264
|
}, [pathname, isEditMode]);
|
|
12808
|
-
(0,
|
|
12265
|
+
(0, import_react13.useEffect)(() => {
|
|
12809
12266
|
const contentForNav = () => {
|
|
12810
12267
|
if (isEditMode) return editContentRef.current;
|
|
12811
12268
|
if (!subdomain) return {};
|
|
@@ -12870,7 +12327,7 @@ function OhhwellsBridge() {
|
|
|
12870
12327
|
observer?.disconnect();
|
|
12871
12328
|
};
|
|
12872
12329
|
}, [isEditMode, pathname, subdomain, fetchState, resyncSelectedNavigationItem]);
|
|
12873
|
-
(0,
|
|
12330
|
+
(0, import_react13.useEffect)(() => {
|
|
12874
12331
|
if (!isEditMode) return;
|
|
12875
12332
|
const measure = () => {
|
|
12876
12333
|
const h = document.body.scrollHeight;
|
|
@@ -12894,7 +12351,7 @@ function OhhwellsBridge() {
|
|
|
12894
12351
|
window.removeEventListener("resize", handleResize);
|
|
12895
12352
|
};
|
|
12896
12353
|
}, [pathname, isEditMode, postToParent2]);
|
|
12897
|
-
(0,
|
|
12354
|
+
(0, import_react13.useEffect)(() => {
|
|
12898
12355
|
if (!subdomainFromQuery || isEditMode) return;
|
|
12899
12356
|
const handleClick = (e) => {
|
|
12900
12357
|
const anchor = e.target.closest("a");
|
|
@@ -12910,7 +12367,7 @@ function OhhwellsBridge() {
|
|
|
12910
12367
|
document.addEventListener("click", handleClick, true);
|
|
12911
12368
|
return () => document.removeEventListener("click", handleClick, true);
|
|
12912
12369
|
}, [subdomainFromQuery, isEditMode, router]);
|
|
12913
|
-
(0,
|
|
12370
|
+
(0, import_react13.useEffect)(() => {
|
|
12914
12371
|
if (!isEditMode) {
|
|
12915
12372
|
editStylesRef.current?.base.remove();
|
|
12916
12373
|
editStylesRef.current?.forceHover.remove();
|
|
@@ -12962,7 +12419,7 @@ function OhhwellsBridge() {
|
|
|
12962
12419
|
[data-ohw-editable="bg-image"], [data-ohw-editable="bg-image"] * { cursor: pointer !important; }
|
|
12963
12420
|
[data-ohw-editable="link"], [data-ohw-editable="link"] * { cursor: pointer !important; }
|
|
12964
12421
|
[data-ohw-hovered]:not([contenteditable]):not([data-ohw-href-key]) {
|
|
12965
|
-
outline: 2px dashed ${
|
|
12422
|
+
outline: 2px dashed ${PRIMARY2} !important;
|
|
12966
12423
|
outline-offset: 4px;
|
|
12967
12424
|
}
|
|
12968
12425
|
[data-ohw-href-key] [data-ohw-hovered],
|
|
@@ -12997,11 +12454,11 @@ function OhhwellsBridge() {
|
|
|
12997
12454
|
footer [data-ohw-href-key] [data-ohw-editable][contenteditable],
|
|
12998
12455
|
footer [data-ohw-href-key] [data-ohw-editable][contenteditable] * {
|
|
12999
12456
|
outline: none !important;
|
|
13000
|
-
caret-color: ${
|
|
12457
|
+
caret-color: ${PRIMARY2} !important;
|
|
13001
12458
|
cursor: text !important;
|
|
13002
12459
|
}
|
|
13003
12460
|
[data-ohw-editable][contenteditable]::selection,
|
|
13004
|
-
[data-ohw-editable][contenteditable] *::selection { background: ${
|
|
12461
|
+
[data-ohw-editable][contenteditable] *::selection { background: ${PRIMARY2}59 !important; }
|
|
13005
12462
|
[data-ohw-editable-state], [data-ohw-editable-state] * { pointer-events: none !important; }
|
|
13006
12463
|
[data-ohw-editable-state][data-ohw-active-state] [data-ohw-editable] { pointer-events: auto !important; }
|
|
13007
12464
|
[data-ohw-editable-state][data-ohw-active-state][data-ohw-editable] { pointer-events: auto !important; }
|
|
@@ -13016,7 +12473,7 @@ function OhhwellsBridge() {
|
|
|
13016
12473
|
stateViews.textContent = `
|
|
13017
12474
|
[data-ohw-state-view]:not([data-ohw-state-view="default"]) { display: none; }
|
|
13018
12475
|
[data-ohw-state-view="default"] [data-ohw-editable] { pointer-events: auto !important; }
|
|
13019
|
-
[data-ohw-state-hovered] { outline: 2px dashed ${
|
|
12476
|
+
[data-ohw-state-hovered] { outline: 2px dashed ${PRIMARY2} !important; outline-offset: 4px; }
|
|
13020
12477
|
[data-ohw-state-hovered]:has([data-ohw-hovered]) { outline: none !important; }
|
|
13021
12478
|
`;
|
|
13022
12479
|
document.head.appendChild(base);
|
|
@@ -13040,10 +12497,6 @@ function OhhwellsBridge() {
|
|
|
13040
12497
|
if (target.closest("[data-ohw-max-badge]")) return;
|
|
13041
12498
|
if (isInsideLinkEditor(target)) return;
|
|
13042
12499
|
if (target.closest('[data-ohw-edit-chrome], [data-ohw-item-interaction], [data-ohw-drag-handle-container], [data-slot="drag-handle"]')) {
|
|
13043
|
-
const beneath = document.elementsFromPoint(e.clientX, e.clientY).find(
|
|
13044
|
-
(el) => el instanceof HTMLElement && !el.closest("[data-ohw-bridge-root]") && el.closest("[data-ohw-section]") != null
|
|
13045
|
-
);
|
|
13046
|
-
if (beneath) aiSectionApiRef.current?.selectFromElement(beneath);
|
|
13047
12500
|
if (target.closest("[data-ohw-item-drag-surface]")) {
|
|
13048
12501
|
e.preventDefault();
|
|
13049
12502
|
e.stopPropagation();
|
|
@@ -13102,22 +12555,11 @@ function OhhwellsBridge() {
|
|
|
13102
12555
|
return;
|
|
13103
12556
|
}
|
|
13104
12557
|
}
|
|
13105
|
-
const logoEl = getLogoElement(target);
|
|
13106
|
-
if (logoEl) {
|
|
13107
|
-
e.preventDefault();
|
|
13108
|
-
e.stopPropagation();
|
|
13109
|
-
deselectRef.current();
|
|
13110
|
-
deactivateRef.current();
|
|
13111
|
-
const identity = readLogoIdentityFromDom();
|
|
13112
|
-
postToParentRef.current({ type: "ow:open-logo-settings", ...identity });
|
|
13113
|
-
return;
|
|
13114
|
-
}
|
|
13115
12558
|
const editable = target.closest("[data-ohw-editable]");
|
|
13116
12559
|
if (editable) {
|
|
13117
12560
|
if (editable.dataset.ohwEditable === "link") {
|
|
13118
12561
|
e.preventDefault();
|
|
13119
12562
|
e.stopPropagation();
|
|
13120
|
-
aiSectionApiRef.current?.selectFromElement(editable);
|
|
13121
12563
|
deselectRef.current();
|
|
13122
12564
|
deactivateRef.current();
|
|
13123
12565
|
bumpLinkPopoverGrace();
|
|
@@ -13131,7 +12573,6 @@ function OhhwellsBridge() {
|
|
|
13131
12573
|
if (isMediaEditable(editable)) {
|
|
13132
12574
|
e.preventDefault();
|
|
13133
12575
|
e.stopPropagation();
|
|
13134
|
-
aiSectionApiRef.current?.selectFromElement(editable);
|
|
13135
12576
|
postToParentRef.current({ type: "ow:image-pick", key: editable.dataset.ohwKey ?? "", elementType: editable.dataset.ohwEditable ?? "image" });
|
|
13136
12577
|
return;
|
|
13137
12578
|
}
|
|
@@ -13234,7 +12675,6 @@ function OhhwellsBridge() {
|
|
|
13234
12675
|
closeLinkPopoverRef.current();
|
|
13235
12676
|
return;
|
|
13236
12677
|
}
|
|
13237
|
-
aiSectionApiRef.current?.handleBackgroundClick(target, e.clientX, e.clientY);
|
|
13238
12678
|
deselectRef.current();
|
|
13239
12679
|
deactivateRef.current();
|
|
13240
12680
|
};
|
|
@@ -13277,7 +12717,7 @@ function OhhwellsBridge() {
|
|
|
13277
12717
|
const allowFooterLinksHover = toolbarVariantRef.current !== "select-frame" || selectedIsFooterColumn;
|
|
13278
12718
|
if (allowNavContainerHover) {
|
|
13279
12719
|
const navContainer = target.closest("[data-ohw-nav-container]");
|
|
13280
|
-
if (navContainer && !getNavigationItemAnchor(target)
|
|
12720
|
+
if (navContainer && !getNavigationItemAnchor(target)) {
|
|
13281
12721
|
hoveredNavContainerRef.current = navContainer;
|
|
13282
12722
|
setHoveredNavContainerRect(navContainer.getBoundingClientRect());
|
|
13283
12723
|
hoveredItemElRef.current = null;
|
|
@@ -13306,15 +12746,6 @@ function OhhwellsBridge() {
|
|
|
13306
12746
|
setHoveredNavContainerRect(null);
|
|
13307
12747
|
}
|
|
13308
12748
|
}
|
|
13309
|
-
const logoEl = getLogoElement(target);
|
|
13310
|
-
if (logoEl) {
|
|
13311
|
-
hoveredNavContainerRef.current = null;
|
|
13312
|
-
setHoveredNavContainerRect(null);
|
|
13313
|
-
if (selectedElRef.current === logoEl) return;
|
|
13314
|
-
hoveredItemElRef.current = logoEl;
|
|
13315
|
-
setHoveredItemRect(logoEl.getBoundingClientRect());
|
|
13316
|
-
return;
|
|
13317
|
-
}
|
|
13318
12749
|
const navAnchor = getNavigationItemAnchor(target);
|
|
13319
12750
|
if (navAnchor) {
|
|
13320
12751
|
hoveredNavContainerRef.current = null;
|
|
@@ -13347,12 +12778,6 @@ function OhhwellsBridge() {
|
|
|
13347
12778
|
setHoveredItemRect(hoverTarget.getBoundingClientRect());
|
|
13348
12779
|
} else if (!isInsideNavigationItem(editable)) {
|
|
13349
12780
|
hoverTarget.setAttribute("data-ohw-hovered", "");
|
|
13350
|
-
if (editable.closest("footer") || editable.closest('[data-ohw-section="footer"]')) {
|
|
13351
|
-
hoveredNavContainerRef.current = null;
|
|
13352
|
-
setHoveredNavContainerRect(null);
|
|
13353
|
-
hoveredItemElRef.current = editable;
|
|
13354
|
-
setHoveredItemRect(editable.getBoundingClientRect());
|
|
13355
|
-
}
|
|
13356
12781
|
}
|
|
13357
12782
|
}
|
|
13358
12783
|
};
|
|
@@ -13388,18 +12813,6 @@ function OhhwellsBridge() {
|
|
|
13388
12813
|
}
|
|
13389
12814
|
return;
|
|
13390
12815
|
}
|
|
13391
|
-
const logoEl = getLogoElement(target);
|
|
13392
|
-
if (logoEl) {
|
|
13393
|
-
const related2 = e.relatedTarget instanceof Element ? e.relatedTarget : null;
|
|
13394
|
-
if (related2 && (logoEl === related2 || logoEl.contains(related2) || related2.closest?.('[data-ohw-role="logo"], [data-ohw-logo]'))) {
|
|
13395
|
-
return;
|
|
13396
|
-
}
|
|
13397
|
-
if (hoveredItemElRef.current === logoEl) {
|
|
13398
|
-
hoveredItemElRef.current = null;
|
|
13399
|
-
setHoveredItemRect(null);
|
|
13400
|
-
}
|
|
13401
|
-
return;
|
|
13402
|
-
}
|
|
13403
12816
|
const editable = target.closest("[data-ohw-editable]");
|
|
13404
12817
|
if (!editable) return;
|
|
13405
12818
|
const related = e.relatedTarget instanceof Element ? e.relatedTarget : null;
|
|
@@ -13413,13 +12826,6 @@ function OhhwellsBridge() {
|
|
|
13413
12826
|
}
|
|
13414
12827
|
} else {
|
|
13415
12828
|
hoverTarget.removeAttribute("data-ohw-hovered");
|
|
13416
|
-
if (hoveredItemElRef.current === editable) {
|
|
13417
|
-
const stillOnEditable = related instanceof Element && related.closest("[data-ohw-editable]") === editable;
|
|
13418
|
-
if (!stillOnEditable) {
|
|
13419
|
-
hoveredItemElRef.current = null;
|
|
13420
|
-
setHoveredItemRect(null);
|
|
13421
|
-
}
|
|
13422
|
-
}
|
|
13423
12829
|
}
|
|
13424
12830
|
}
|
|
13425
12831
|
};
|
|
@@ -13536,26 +12942,6 @@ function OhhwellsBridge() {
|
|
|
13536
12942
|
hoveredNavContainerRef.current = null;
|
|
13537
12943
|
setHoveredNavContainerRect(null);
|
|
13538
12944
|
}
|
|
13539
|
-
const logoCandidates = [
|
|
13540
|
-
...document.querySelectorAll('[data-ohw-role="logo"], [data-ohw-logo]'),
|
|
13541
|
-
...document.querySelectorAll("nav a:not([data-ohw-href-key]), [data-ohw-nav-root] a:not([data-ohw-href-key])"),
|
|
13542
|
-
...document.querySelectorAll("footer img")
|
|
13543
|
-
];
|
|
13544
|
-
const seenLogos = /* @__PURE__ */ new Set();
|
|
13545
|
-
for (const candidate of logoCandidates) {
|
|
13546
|
-
const logo = getLogoElement(candidate);
|
|
13547
|
-
if (!logo || seenLogos.has(logo)) continue;
|
|
13548
|
-
seenLogos.add(logo);
|
|
13549
|
-
const r2 = logo.getBoundingClientRect();
|
|
13550
|
-
if (x < r2.left || x > r2.right || y < r2.top || y > r2.bottom) continue;
|
|
13551
|
-
hoveredNavContainerRef.current = null;
|
|
13552
|
-
setHoveredNavContainerRect(null);
|
|
13553
|
-
if (selectedElRef.current !== logo) {
|
|
13554
|
-
hoveredItemElRef.current = logo;
|
|
13555
|
-
setHoveredItemRect(logo.getBoundingClientRect());
|
|
13556
|
-
}
|
|
13557
|
-
return;
|
|
13558
|
-
}
|
|
13559
12945
|
const navContainers = Array.from(
|
|
13560
12946
|
document.querySelectorAll("[data-ohw-nav-container]")
|
|
13561
12947
|
);
|
|
@@ -14166,8 +13552,6 @@ function OhhwellsBridge() {
|
|
|
14166
13552
|
sectionsJson = val;
|
|
14167
13553
|
continue;
|
|
14168
13554
|
}
|
|
14169
|
-
if (key === LOGO_PLACEHOLDER_KEY) continue;
|
|
14170
|
-
if (LOGO_IMAGE_KEYS.includes(key) && !String(val ?? "").trim()) continue;
|
|
14171
13555
|
if (applyVideoSettingNode(key, val)) continue;
|
|
14172
13556
|
if (applyCarouselNode(key, val)) continue;
|
|
14173
13557
|
document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
|
|
@@ -14187,28 +13571,6 @@ function OhhwellsBridge() {
|
|
|
14187
13571
|
});
|
|
14188
13572
|
applyLinkByKey(key, val);
|
|
14189
13573
|
}
|
|
14190
|
-
const hasLogoIdentity = LOGO_PLACEHOLDER_KEY in content || LOGO_TEXT_KEYS.some((key) => key in content) || LOGO_IMAGE_KEYS.some((key) => key in content) || LOGO_ALT_KEY in content || LOGO_HREF_KEYS.some((key) => key in content);
|
|
14191
|
-
if (hasLogoIdentity) {
|
|
14192
|
-
const logoText = content[LOGO_TEXT_KEYS[0]] ?? content[LOGO_TEXT_KEYS[1]] ?? readLogoIdentityFromDom().text;
|
|
14193
|
-
const logoAlt = content[LOGO_ALT_KEY] ?? logoText;
|
|
14194
|
-
const rawLogoImage = content[LOGO_IMAGE_URL_KEY] ?? content["footer-logo"] ?? content["footer-logo-image"] ?? null;
|
|
14195
|
-
const logoImageUrl = typeof rawLogoImage === "string" && rawLogoImage.trim() ? rawLogoImage.trim() : null;
|
|
14196
|
-
const imageExplicitlyCleared = LOGO_IMAGE_KEYS.some((key) => key in content) && !logoImageUrl;
|
|
14197
|
-
const logoIsPlaceholder = LOGO_PLACEHOLDER_KEY in content ? content[LOGO_PLACEHOLDER_KEY] !== "false" : !logoImageUrl && (!logoText.trim() || logoText === PLACEHOLDER_BUSINESS_NAME);
|
|
14198
|
-
if (logoImageUrl) {
|
|
14199
|
-
applyLogoImage(logoImageUrl, logoAlt);
|
|
14200
|
-
} else {
|
|
14201
|
-
if (imageExplicitlyCleared) applyLogoImage(null, logoAlt);
|
|
14202
|
-
applyLogoIdentity(logoText, logoIsPlaceholder);
|
|
14203
|
-
}
|
|
14204
|
-
const logoHref = content["nav-logo-href"] ?? content["footer-logo-href"] ?? content["logo-href"];
|
|
14205
|
-
if (typeof logoHref === "string" && logoHref.trim()) {
|
|
14206
|
-
applyLogoHref(logoHref);
|
|
14207
|
-
applyLinkByKey("nav-logo-href", logoHref);
|
|
14208
|
-
applyLinkByKey("footer-logo-href", logoHref);
|
|
14209
|
-
applyLinkByKey("logo-href", logoHref);
|
|
14210
|
-
}
|
|
14211
|
-
}
|
|
14212
13574
|
if (sectionsJson) {
|
|
14213
13575
|
initSectionsFromContent({ __ohw_sections: sectionsJson }, true);
|
|
14214
13576
|
sectionsLoadedRef.current = true;
|
|
@@ -14221,57 +13583,6 @@ function OhhwellsBridge() {
|
|
|
14221
13583
|
enforceLinkHrefs();
|
|
14222
13584
|
postToParentRef.current({ type: "ow:hydrate-done" });
|
|
14223
13585
|
};
|
|
14224
|
-
const handleUpdateLogoIdentity = (e) => {
|
|
14225
|
-
if (e.data?.type !== "ow:update-logo-identity") return;
|
|
14226
|
-
const rawText = typeof e.data.text === "string" ? e.data.text : "";
|
|
14227
|
-
const alt = typeof e.data.alt === "string" ? e.data.alt : rawText;
|
|
14228
|
-
const href = typeof e.data.href === "string" ? e.data.href : void 0;
|
|
14229
|
-
const imageProvided = "image" in e.data;
|
|
14230
|
-
const imageUrl = imageProvided && typeof e.data.image === "string" && e.data.image.trim() ? e.data.image.trim() : imageProvided ? null : void 0;
|
|
14231
|
-
let isPlaceholder = e.data.isPlaceholder !== false;
|
|
14232
|
-
if (imageUrl) isPlaceholder = false;
|
|
14233
|
-
else if (imageProvided && imageUrl === null) {
|
|
14234
|
-
isPlaceholder = e.data.isPlaceholder === true || !rawText.trim() || resolveLogoDisplayText(rawText) === PLACEHOLDER_BUSINESS_NAME;
|
|
14235
|
-
}
|
|
14236
|
-
const display = applyLogoIdentity(rawText, isPlaceholder);
|
|
14237
|
-
const displayAlt = resolveLogoDisplayText(alt || display);
|
|
14238
|
-
if (imageUrl !== void 0) {
|
|
14239
|
-
applyLogoImage(imageUrl, displayAlt);
|
|
14240
|
-
} else {
|
|
14241
|
-
for (const key of LOGO_IMAGE_KEYS) {
|
|
14242
|
-
document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
|
|
14243
|
-
const img = el instanceof HTMLImageElement ? el : el.querySelector("img");
|
|
14244
|
-
if (img) img.alt = displayAlt;
|
|
14245
|
-
});
|
|
14246
|
-
}
|
|
14247
|
-
}
|
|
14248
|
-
if (href !== void 0) {
|
|
14249
|
-
applyLogoHref(href);
|
|
14250
|
-
applyLinkByKey("nav-logo-href", href);
|
|
14251
|
-
applyLinkByKey("footer-logo-href", href);
|
|
14252
|
-
applyLinkByKey("logo-href", href);
|
|
14253
|
-
}
|
|
14254
|
-
const nodes = [
|
|
14255
|
-
...LOGO_TEXT_KEYS.map((key) => ({ key, text: display })),
|
|
14256
|
-
{ key: LOGO_PLACEHOLDER_KEY, text: isPlaceholder ? "true" : "false" },
|
|
14257
|
-
{ key: LOGO_ALT_KEY, text: displayAlt }
|
|
14258
|
-
];
|
|
14259
|
-
if (imageUrl !== void 0) {
|
|
14260
|
-
if (imageUrl) {
|
|
14261
|
-
for (const key of LOGO_IMAGE_KEYS) nodes.push({ key, text: imageUrl });
|
|
14262
|
-
} else {
|
|
14263
|
-
for (const key of LOGO_IMAGE_KEYS) nodes.push({ key, text: "" });
|
|
14264
|
-
}
|
|
14265
|
-
}
|
|
14266
|
-
if (href !== void 0) {
|
|
14267
|
-
for (const key of LOGO_HREF_KEYS) nodes.push({ key, text: href.trim() || "/" });
|
|
14268
|
-
}
|
|
14269
|
-
editContentRef.current = {
|
|
14270
|
-
...editContentRef.current,
|
|
14271
|
-
...Object.fromEntries(nodes.map(({ key, text }) => [key, text]))
|
|
14272
|
-
};
|
|
14273
|
-
postToParentRef.current({ type: "ow:change", nodes });
|
|
14274
|
-
};
|
|
14275
13586
|
window.addEventListener("message", handleHydrate);
|
|
14276
13587
|
const handleDeactivate = (e) => {
|
|
14277
13588
|
if (e.data?.type !== "ow:deactivate") return;
|
|
@@ -14547,25 +13858,6 @@ function OhhwellsBridge() {
|
|
|
14547
13858
|
const h = document.documentElement.scrollHeight;
|
|
14548
13859
|
if (h > 50) postToParentRef.current({ type: "ow:height", height: h });
|
|
14549
13860
|
};
|
|
14550
|
-
const handleCollectSection = (e) => {
|
|
14551
|
-
if (e.data?.type !== "ow:collect-section") return;
|
|
14552
|
-
const sectionId = e.data.sectionId;
|
|
14553
|
-
if (typeof sectionId !== "string" || !sectionId) return;
|
|
14554
|
-
const sectionEl = document.querySelector(
|
|
14555
|
-
`[data-ohw-section="${CSS.escape(sectionId)}"]`
|
|
14556
|
-
);
|
|
14557
|
-
const nodes = sectionEl ? collectEditableNodes(void 0, sectionEl).filter(
|
|
14558
|
-
(n) => n.key && !n.key.startsWith("__ohw_") && !["meta", "sections", "carousel", "video-setting"].includes(n.type)
|
|
14559
|
-
).map((n) => ({ ...n, text: n.text ?? "", type: normalizeAiNodeType(n.type) })) : [];
|
|
14560
|
-
const box = sectionEl?.getBoundingClientRect();
|
|
14561
|
-
const rect = box ? {
|
|
14562
|
-
top: box.top + window.scrollY,
|
|
14563
|
-
left: box.left + window.scrollX,
|
|
14564
|
-
width: box.width,
|
|
14565
|
-
height: box.height
|
|
14566
|
-
} : null;
|
|
14567
|
-
postToParentRef.current({ type: "ow:section-nodes", sectionId, found: !!sectionEl, nodes, rect });
|
|
14568
|
-
};
|
|
14569
13861
|
let selectionChangeRaf = null;
|
|
14570
13862
|
const runSelectionChange = () => {
|
|
14571
13863
|
selectionChangeRaf = null;
|
|
@@ -14727,20 +14019,6 @@ function OhhwellsBridge() {
|
|
|
14727
14019
|
postToParentRef.current({ type: "ow:image-pick", key: stateCardImage.dataset.ohwKey ?? "", elementType: stateCardImage.dataset.ohwEditable ?? "image" });
|
|
14728
14020
|
return;
|
|
14729
14021
|
}
|
|
14730
|
-
const logoAtPoint = Array.from(
|
|
14731
|
-
document.querySelectorAll('[data-ohw-role="logo"], [data-ohw-logo]')
|
|
14732
|
-
).map((el) => getLogoElement(el)).find((logo) => {
|
|
14733
|
-
if (!logo) return false;
|
|
14734
|
-
const r2 = logo.getBoundingClientRect();
|
|
14735
|
-
return clientX >= r2.left && clientX <= r2.right && clientY >= r2.top && clientY <= r2.bottom;
|
|
14736
|
-
});
|
|
14737
|
-
if (logoAtPoint) {
|
|
14738
|
-
deselectRef.current();
|
|
14739
|
-
deactivateRef.current();
|
|
14740
|
-
const identity = readLogoIdentityFromDom();
|
|
14741
|
-
postToParentRef.current({ type: "ow:open-logo-settings", ...identity });
|
|
14742
|
-
return;
|
|
14743
|
-
}
|
|
14744
14022
|
const textEditable = Array.from(
|
|
14745
14023
|
document.querySelectorAll(NON_MEDIA_SELECTOR)
|
|
14746
14024
|
).find((el) => {
|
|
@@ -14792,7 +14070,6 @@ function OhhwellsBridge() {
|
|
|
14792
14070
|
selectFrameRef.current(footerColumn);
|
|
14793
14071
|
return;
|
|
14794
14072
|
}
|
|
14795
|
-
aiSectionApiRef.current?.handleBackgroundClick(e.target, clientX, clientY);
|
|
14796
14073
|
deactivateRef.current();
|
|
14797
14074
|
};
|
|
14798
14075
|
window.addEventListener("message", handleSave);
|
|
@@ -14801,7 +14078,6 @@ function OhhwellsBridge() {
|
|
|
14801
14078
|
window.addEventListener("message", handleScheduleLinked);
|
|
14802
14079
|
window.addEventListener("message", handleClearSchedulingWidget);
|
|
14803
14080
|
window.addEventListener("message", handleRemoveSchedulingSection);
|
|
14804
|
-
window.addEventListener("message", handleCollectSection);
|
|
14805
14081
|
window.addEventListener("message", handleImageUrl);
|
|
14806
14082
|
window.addEventListener("message", handleImageUploading);
|
|
14807
14083
|
window.addEventListener("message", handleCarouselChange);
|
|
@@ -14809,7 +14085,6 @@ function OhhwellsBridge() {
|
|
|
14809
14085
|
window.addEventListener("message", handleParentScroll);
|
|
14810
14086
|
window.addEventListener("message", handlePointerSync);
|
|
14811
14087
|
window.addEventListener("message", handleClickAt);
|
|
14812
|
-
window.addEventListener("message", handleUpdateLogoIdentity);
|
|
14813
14088
|
const handleViewportResize = () => {
|
|
14814
14089
|
if (visibleViewportRef.current) {
|
|
14815
14090
|
applyVisibleViewport(visibleViewportRef.current, parentScrollRef.current);
|
|
@@ -14853,7 +14128,6 @@ function OhhwellsBridge() {
|
|
|
14853
14128
|
window.removeEventListener("message", handleScheduleLinked);
|
|
14854
14129
|
window.removeEventListener("message", handleClearSchedulingWidget);
|
|
14855
14130
|
window.removeEventListener("message", handleRemoveSchedulingSection);
|
|
14856
|
-
window.removeEventListener("message", handleCollectSection);
|
|
14857
14131
|
window.removeEventListener("message", handleImageUrl);
|
|
14858
14132
|
window.removeEventListener("message", handleImageUploading);
|
|
14859
14133
|
window.removeEventListener("message", handleCarouselChange);
|
|
@@ -14862,7 +14136,6 @@ function OhhwellsBridge() {
|
|
|
14862
14136
|
window.removeEventListener("resize", handleViewportResize);
|
|
14863
14137
|
window.removeEventListener("message", handlePointerSync);
|
|
14864
14138
|
window.removeEventListener("message", handleClickAt);
|
|
14865
|
-
window.removeEventListener("message", handleUpdateLogoIdentity);
|
|
14866
14139
|
window.removeEventListener("message", handleHydrate);
|
|
14867
14140
|
window.removeEventListener("message", handleDeactivate);
|
|
14868
14141
|
window.removeEventListener("message", handleToastAction);
|
|
@@ -14873,7 +14146,7 @@ function OhhwellsBridge() {
|
|
|
14873
14146
|
if (imageShowTimerRef.current) clearTimeout(imageShowTimerRef.current);
|
|
14874
14147
|
};
|
|
14875
14148
|
}, [isEditMode, refreshStateRules]);
|
|
14876
|
-
(0,
|
|
14149
|
+
(0, import_react13.useEffect)(() => {
|
|
14877
14150
|
if (!isEditMode) return;
|
|
14878
14151
|
const THRESHOLD = 10;
|
|
14879
14152
|
const resolveWasSelected = (el) => {
|
|
@@ -15027,7 +14300,7 @@ function OhhwellsBridge() {
|
|
|
15027
14300
|
unlockFooterDragInteraction();
|
|
15028
14301
|
};
|
|
15029
14302
|
}, [isEditMode]);
|
|
15030
|
-
(0,
|
|
14303
|
+
(0, import_react13.useEffect)(() => {
|
|
15031
14304
|
const handler = (e) => {
|
|
15032
14305
|
if (e.data?.type !== "ow:request-schedule-config") return;
|
|
15033
14306
|
const insertAfterVal = e.data.insertAfter;
|
|
@@ -15043,7 +14316,7 @@ function OhhwellsBridge() {
|
|
|
15043
14316
|
window.addEventListener("message", handler);
|
|
15044
14317
|
return () => window.removeEventListener("message", handler);
|
|
15045
14318
|
}, [processConfigRequest]);
|
|
15046
|
-
(0,
|
|
14319
|
+
(0, import_react13.useEffect)(() => {
|
|
15047
14320
|
if (!isEditMode) return;
|
|
15048
14321
|
document.querySelectorAll("[data-ohw-active-state]").forEach((el) => {
|
|
15049
14322
|
el.removeAttribute("data-ohw-active-state");
|
|
@@ -15067,7 +14340,6 @@ function OhhwellsBridge() {
|
|
|
15067
14340
|
postToParent2({
|
|
15068
14341
|
type: "ow:ready",
|
|
15069
14342
|
version: "1",
|
|
15070
|
-
bridgeVersion: "0.1.52",
|
|
15071
14343
|
path: pathname,
|
|
15072
14344
|
nodes: collectEditableNodes(editContentRef.current),
|
|
15073
14345
|
sections
|
|
@@ -15079,13 +14351,13 @@ function OhhwellsBridge() {
|
|
|
15079
14351
|
clearTimeout(timer);
|
|
15080
14352
|
};
|
|
15081
14353
|
}, [pathname, isEditMode, refreshStateRules, postToParent2]);
|
|
15082
|
-
(0,
|
|
14354
|
+
(0, import_react13.useEffect)(() => {
|
|
15083
14355
|
scrollToHashSectionWhenReady();
|
|
15084
14356
|
const onHashChange = () => scrollToHashSectionWhenReady();
|
|
15085
14357
|
window.addEventListener("hashchange", onHashChange);
|
|
15086
14358
|
return () => window.removeEventListener("hashchange", onHashChange);
|
|
15087
14359
|
}, [pathname]);
|
|
15088
|
-
const handleCommand = (0,
|
|
14360
|
+
const handleCommand = (0, import_react13.useCallback)((cmd) => {
|
|
15089
14361
|
const el = activeElRef.current;
|
|
15090
14362
|
const selBefore = window.getSelection();
|
|
15091
14363
|
let savedOffsets = null;
|
|
@@ -15121,7 +14393,7 @@ function OhhwellsBridge() {
|
|
|
15121
14393
|
if (el) setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
15122
14394
|
refreshActiveCommandsRef.current();
|
|
15123
14395
|
}, []);
|
|
15124
|
-
const handleStateChange = (0,
|
|
14396
|
+
const handleStateChange = (0, import_react13.useCallback)((state) => {
|
|
15125
14397
|
if (!activeStateElRef.current) return;
|
|
15126
14398
|
const el = activeStateElRef.current;
|
|
15127
14399
|
if (state === "Default") {
|
|
@@ -15134,7 +14406,7 @@ function OhhwellsBridge() {
|
|
|
15134
14406
|
}
|
|
15135
14407
|
setToggleState((prev) => prev ? { ...prev, activeState: state } : null);
|
|
15136
14408
|
}, [deactivate]);
|
|
15137
|
-
const reselectAfterLinkPopover = (0,
|
|
14409
|
+
const reselectAfterLinkPopover = (0, import_react13.useCallback)(
|
|
15138
14410
|
(hrefKey) => {
|
|
15139
14411
|
requestAnimationFrame(() => {
|
|
15140
14412
|
const el = resolveHrefKeyElement(hrefKey);
|
|
@@ -15143,7 +14415,7 @@ function OhhwellsBridge() {
|
|
|
15143
14415
|
},
|
|
15144
14416
|
[resolveHrefKeyElement]
|
|
15145
14417
|
);
|
|
15146
|
-
const closeLinkPopover = (0,
|
|
14418
|
+
const closeLinkPopover = (0, import_react13.useCallback)(() => {
|
|
15147
14419
|
const session = linkPopoverSessionRef.current;
|
|
15148
14420
|
addNavAfterAnchorRef.current = null;
|
|
15149
14421
|
setLinkPopover(null);
|
|
@@ -15151,9 +14423,9 @@ function OhhwellsBridge() {
|
|
|
15151
14423
|
reselectAfterLinkPopover(session.key);
|
|
15152
14424
|
}
|
|
15153
14425
|
}, [reselectAfterLinkPopover]);
|
|
15154
|
-
const closeLinkPopoverRef = (0,
|
|
14426
|
+
const closeLinkPopoverRef = (0, import_react13.useRef)(closeLinkPopover);
|
|
15155
14427
|
closeLinkPopoverRef.current = closeLinkPopover;
|
|
15156
|
-
const openLinkPopoverForActive = (0,
|
|
14428
|
+
const openLinkPopoverForActive = (0, import_react13.useCallback)(() => {
|
|
15157
14429
|
const hrefCtx = getHrefKeyFromElement(activeElRef.current);
|
|
15158
14430
|
if (!hrefCtx) return;
|
|
15159
14431
|
bumpLinkPopoverGrace();
|
|
@@ -15164,7 +14436,7 @@ function OhhwellsBridge() {
|
|
|
15164
14436
|
});
|
|
15165
14437
|
deactivate();
|
|
15166
14438
|
}, [deactivate]);
|
|
15167
|
-
const openLinkPopoverForSelected = (0,
|
|
14439
|
+
const openLinkPopoverForSelected = (0, import_react13.useCallback)(() => {
|
|
15168
14440
|
const anchor = selectedElRef.current;
|
|
15169
14441
|
if (!anchor) return;
|
|
15170
14442
|
const key = anchor.getAttribute("data-ohw-href-key");
|
|
@@ -15177,7 +14449,7 @@ function OhhwellsBridge() {
|
|
|
15177
14449
|
});
|
|
15178
14450
|
deselect();
|
|
15179
14451
|
}, [deselect]);
|
|
15180
|
-
const handleSelectParent = (0,
|
|
14452
|
+
const handleSelectParent = (0, import_react13.useCallback)(() => {
|
|
15181
14453
|
const selected = selectedElRef.current;
|
|
15182
14454
|
if (!selected) return;
|
|
15183
14455
|
if (toolbarVariantRef.current === "select-frame") {
|
|
@@ -15204,7 +14476,7 @@ function OhhwellsBridge() {
|
|
|
15204
14476
|
}
|
|
15205
14477
|
deselectRef.current();
|
|
15206
14478
|
}, []);
|
|
15207
|
-
const handleDuplicateSelected = (0,
|
|
14479
|
+
const handleDuplicateSelected = (0, import_react13.useCallback)(() => {
|
|
15208
14480
|
const selected = selectedElRef.current;
|
|
15209
14481
|
if (!selected || !isNavigationItem2(selected)) return;
|
|
15210
14482
|
const hrefKey = selected.getAttribute("data-ohw-href-key");
|
|
@@ -15294,7 +14566,7 @@ function OhhwellsBridge() {
|
|
|
15294
14566
|
});
|
|
15295
14567
|
}
|
|
15296
14568
|
}, [postToParent2]);
|
|
15297
|
-
const runPendingDeleteUndo = (0,
|
|
14569
|
+
const runPendingDeleteUndo = (0, import_react13.useCallback)(() => {
|
|
15298
14570
|
const pending = pendingDeleteUndoRef.current;
|
|
15299
14571
|
if (!pending) return false;
|
|
15300
14572
|
pendingDeleteUndoRef.current = null;
|
|
@@ -15302,7 +14574,7 @@ function OhhwellsBridge() {
|
|
|
15302
14574
|
enforceLinkHrefs();
|
|
15303
14575
|
return true;
|
|
15304
14576
|
}, []);
|
|
15305
|
-
const handleDeleteSelected = (0,
|
|
14577
|
+
const handleDeleteSelected = (0, import_react13.useCallback)(() => {
|
|
15306
14578
|
const selected = selectedElRef.current;
|
|
15307
14579
|
if (!selected) return false;
|
|
15308
14580
|
return deleteSelectedNavFooterItem({
|
|
@@ -15323,7 +14595,7 @@ function OhhwellsBridge() {
|
|
|
15323
14595
|
}, [postToParent2]);
|
|
15324
14596
|
handleDeleteSelectedRef.current = handleDeleteSelected;
|
|
15325
14597
|
runPendingDeleteUndoRef.current = runPendingDeleteUndo;
|
|
15326
|
-
const handleLinkPopoverSubmit = (0,
|
|
14598
|
+
const handleLinkPopoverSubmit = (0, import_react13.useCallback)(
|
|
15327
14599
|
(target) => {
|
|
15328
14600
|
const session = linkPopoverSessionRef.current;
|
|
15329
14601
|
if (!session) return;
|
|
@@ -15389,19 +14661,19 @@ function OhhwellsBridge() {
|
|
|
15389
14661
|
const showEditLink = toolbarShowEditLink;
|
|
15390
14662
|
const currentSections = sectionsByPath[pathname] ?? [];
|
|
15391
14663
|
linkPopoverOpenRef.current = linkPopover !== null;
|
|
15392
|
-
const handleMediaReplace = (0,
|
|
14664
|
+
const handleMediaReplace = (0, import_react13.useCallback)(
|
|
15393
14665
|
(key) => {
|
|
15394
14666
|
postToParent2({ type: "ow:image-pick", key, elementType: mediaHover?.elementType ?? "image" });
|
|
15395
14667
|
},
|
|
15396
14668
|
[postToParent2, mediaHover?.elementType]
|
|
15397
14669
|
);
|
|
15398
|
-
const handleEditCarousel = (0,
|
|
14670
|
+
const handleEditCarousel = (0, import_react13.useCallback)(
|
|
15399
14671
|
(key) => {
|
|
15400
14672
|
postToParent2({ type: "ow:carousel-open", key, images: readCarouselValue(key) });
|
|
15401
14673
|
},
|
|
15402
14674
|
[postToParent2]
|
|
15403
14675
|
);
|
|
15404
|
-
const handleMediaFadeOutComplete = (0,
|
|
14676
|
+
const handleMediaFadeOutComplete = (0, import_react13.useCallback)((key) => {
|
|
15405
14677
|
setUploadingRects((prev) => {
|
|
15406
14678
|
if (!(key in prev)) return prev;
|
|
15407
14679
|
const next = { ...prev };
|
|
@@ -15409,7 +14681,7 @@ function OhhwellsBridge() {
|
|
|
15409
14681
|
return next;
|
|
15410
14682
|
});
|
|
15411
14683
|
}, []);
|
|
15412
|
-
const handleVideoSettingsChange = (0,
|
|
14684
|
+
const handleVideoSettingsChange = (0, import_react13.useCallback)(
|
|
15413
14685
|
(key, settings) => {
|
|
15414
14686
|
document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
|
|
15415
14687
|
const video = getVideoEl2(el);
|
|
@@ -15432,10 +14704,9 @@ function OhhwellsBridge() {
|
|
|
15432
14704
|
[postToParent2]
|
|
15433
14705
|
);
|
|
15434
14706
|
return bridgeRoot ? (0, import_react_dom3.createPortal)(
|
|
15435
|
-
/* @__PURE__ */ (0,
|
|
15436
|
-
/* @__PURE__ */ (0,
|
|
15437
|
-
|
|
15438
|
-
Object.entries(uploadingRects).map(([key, { rect, fadingOut }]) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
14707
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
|
|
14708
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { ref: attachVisibleViewport, "data-ohw-visible-viewport": "", "aria-hidden": true }),
|
|
14709
|
+
Object.entries(uploadingRects).map(([key, { rect, fadingOut }]) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15439
14710
|
MediaOverlay,
|
|
15440
14711
|
{
|
|
15441
14712
|
hover: { key, rect, elementType: "image", isDragOver: false, hasTextOverlap: false },
|
|
@@ -15446,7 +14717,7 @@ function OhhwellsBridge() {
|
|
|
15446
14717
|
},
|
|
15447
14718
|
`uploading-${key}`
|
|
15448
14719
|
)),
|
|
15449
|
-
mediaHover && !(mediaHover.key in uploadingRects) && /* @__PURE__ */ (0,
|
|
14720
|
+
mediaHover && !(mediaHover.key in uploadingRects) && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15450
14721
|
MediaOverlay,
|
|
15451
14722
|
{
|
|
15452
14723
|
hover: mediaHover,
|
|
@@ -15455,11 +14726,11 @@ function OhhwellsBridge() {
|
|
|
15455
14726
|
onVideoSettingsChange: handleVideoSettingsChange
|
|
15456
14727
|
}
|
|
15457
14728
|
),
|
|
15458
|
-
carouselHover && !linkPopover && !isItemDragging && /* @__PURE__ */ (0,
|
|
15459
|
-
siblingHintRect && !linkPopover && !isItemDragging && siblingHintRects.length === 0 && /* @__PURE__ */ (0,
|
|
15460
|
-
siblingHintRects.length > 0 && !linkPopover && !isItemDragging && siblingHintRects.map((rect, i) => /* @__PURE__ */ (0,
|
|
15461
|
-
isItemDragging && draggedItemRect && selectedElRef.current !== footerDragRef.current?.draggedEl && selectedElRef.current !== navDragRef.current?.draggedEl && /* @__PURE__ */ (0,
|
|
15462
|
-
isItemDragging && footerDropSlots.map((slot, i) => /* @__PURE__ */ (0,
|
|
14729
|
+
carouselHover && !linkPopover && !isItemDragging && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(CarouselOverlay, { hover: carouselHover, onEdit: handleEditCarousel }),
|
|
14730
|
+
siblingHintRect && !linkPopover && !isItemDragging && siblingHintRects.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ItemInteractionLayer, { rect: siblingHintRect, state: "sibling-hint" }),
|
|
14731
|
+
siblingHintRects.length > 0 && !linkPopover && !isItemDragging && siblingHintRects.map((rect, i) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ItemInteractionLayer, { rect, state: "sibling-hint" }, `sibling-hint-${i}`)),
|
|
14732
|
+
isItemDragging && draggedItemRect && selectedElRef.current !== footerDragRef.current?.draggedEl && selectedElRef.current !== navDragRef.current?.draggedEl && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ItemInteractionLayer, { rect: draggedItemRect, state: "dragging" }),
|
|
14733
|
+
isItemDragging && footerDropSlots.map((slot, i) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15463
14734
|
"div",
|
|
15464
14735
|
{
|
|
15465
14736
|
className: "pointer-events-none fixed z-2147483646",
|
|
@@ -15469,7 +14740,7 @@ function OhhwellsBridge() {
|
|
|
15469
14740
|
width: slot.width,
|
|
15470
14741
|
height: slot.height
|
|
15471
14742
|
},
|
|
15472
|
-
children: /* @__PURE__ */ (0,
|
|
14743
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15473
14744
|
DropIndicator,
|
|
15474
14745
|
{
|
|
15475
14746
|
direction: slot.direction,
|
|
@@ -15480,7 +14751,7 @@ function OhhwellsBridge() {
|
|
|
15480
14751
|
},
|
|
15481
14752
|
`footer-drop-${slot.direction}-${slot.columnIndex}-${slot.insertIndex}-${i}`
|
|
15482
14753
|
)),
|
|
15483
|
-
isItemDragging && navDropSlots.map((slot, i) => /* @__PURE__ */ (0,
|
|
14754
|
+
isItemDragging && navDropSlots.map((slot, i) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15484
14755
|
"div",
|
|
15485
14756
|
{
|
|
15486
14757
|
className: "pointer-events-none fixed z-2147483646",
|
|
@@ -15490,7 +14761,7 @@ function OhhwellsBridge() {
|
|
|
15490
14761
|
width: slot.width,
|
|
15491
14762
|
height: slot.height
|
|
15492
14763
|
},
|
|
15493
|
-
children: /* @__PURE__ */ (0,
|
|
14764
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15494
14765
|
DropIndicator,
|
|
15495
14766
|
{
|
|
15496
14767
|
direction: slot.direction,
|
|
@@ -15501,10 +14772,10 @@ function OhhwellsBridge() {
|
|
|
15501
14772
|
},
|
|
15502
14773
|
`nav-drop-${slot.direction}-${slot.parentId ?? "root"}-${slot.insertIndex}-${i}`
|
|
15503
14774
|
)),
|
|
15504
|
-
hoveredNavContainerRect && (toolbarVariant !== "select-frame" || isFooterFrameSelection) && !linkPopover && !isItemDragging && /* @__PURE__ */ (0,
|
|
15505
|
-
hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */ (0,
|
|
15506
|
-
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isNavbarLinksContainer2(selectedElRef.current) && /* @__PURE__ */ (0,
|
|
15507
|
-
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isFooterLinksContainer(selectedElRef.current) && /* @__PURE__ */ (0,
|
|
14775
|
+
hoveredNavContainerRect && (toolbarVariant !== "select-frame" || isFooterFrameSelection) && !linkPopover && !isItemDragging && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ItemInteractionLayer, { rect: hoveredNavContainerRect, state: "hover" }),
|
|
14776
|
+
hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ItemInteractionLayer, { rect: hoveredItemRect, state: "hover" }),
|
|
14777
|
+
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isNavbarLinksContainer2(selectedElRef.current) && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(NavbarContainerChrome, { rect: toolbarRect, onAdd: handleAddTopLevelNavItem }),
|
|
14778
|
+
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isFooterLinksContainer(selectedElRef.current) && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15508
14779
|
FooterContainerChrome,
|
|
15509
14780
|
{
|
|
15510
14781
|
rect: toolbarRect,
|
|
@@ -15512,7 +14783,7 @@ function OhhwellsBridge() {
|
|
|
15512
14783
|
addDisabled: !canAddFooterColumn()
|
|
15513
14784
|
}
|
|
15514
14785
|
),
|
|
15515
|
-
toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame") && /* @__PURE__ */ (0,
|
|
14786
|
+
toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame") && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15516
14787
|
ItemInteractionLayer,
|
|
15517
14788
|
{
|
|
15518
14789
|
rect: isItemDragging && draggedItemRect && (footerDragRef.current?.wasSelected || navDragRef.current?.wasSelected) ? draggedItemRect : toolbarRect,
|
|
@@ -15527,7 +14798,7 @@ function OhhwellsBridge() {
|
|
|
15527
14798
|
onItemPointerDown: handleItemChromePointerDown,
|
|
15528
14799
|
onItemClick: handleItemChromeClick,
|
|
15529
14800
|
itemDragSurface: !isFooterFrameSelection,
|
|
15530
|
-
toolbar: toolbarVariant === "link-action" && !isItemDragging || toolbarVariant === "select-frame" && isFooterFrameSelection && !isItemDragging ? /* @__PURE__ */ (0,
|
|
14801
|
+
toolbar: toolbarVariant === "link-action" && !isItemDragging || toolbarVariant === "select-frame" && isFooterFrameSelection && !isItemDragging ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15531
14802
|
ItemActionToolbar,
|
|
15532
14803
|
{
|
|
15533
14804
|
onEditLink: openLinkPopoverForSelected,
|
|
@@ -15552,8 +14823,8 @@ function OhhwellsBridge() {
|
|
|
15552
14823
|
) : void 0
|
|
15553
14824
|
}
|
|
15554
14825
|
),
|
|
15555
|
-
toolbarRect && toolbarVariant === "rich-text" && !linkPopover && /* @__PURE__ */ (0,
|
|
15556
|
-
/* @__PURE__ */ (0,
|
|
14826
|
+
toolbarRect && toolbarVariant === "rich-text" && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
|
|
14827
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15557
14828
|
EditGlowChrome,
|
|
15558
14829
|
{
|
|
15559
14830
|
rect: toolbarRect,
|
|
@@ -15563,7 +14834,7 @@ function OhhwellsBridge() {
|
|
|
15563
14834
|
hideHandle: isItemDragging
|
|
15564
14835
|
}
|
|
15565
14836
|
),
|
|
15566
|
-
/* @__PURE__ */ (0,
|
|
14837
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15567
14838
|
FloatingToolbar,
|
|
15568
14839
|
{
|
|
15569
14840
|
rect: toolbarRect,
|
|
@@ -15576,7 +14847,7 @@ function OhhwellsBridge() {
|
|
|
15576
14847
|
}
|
|
15577
14848
|
)
|
|
15578
14849
|
] }),
|
|
15579
|
-
maxBadge && /* @__PURE__ */ (0,
|
|
14850
|
+
maxBadge && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
|
|
15580
14851
|
"div",
|
|
15581
14852
|
{
|
|
15582
14853
|
"data-ohw-max-badge": "",
|
|
@@ -15602,7 +14873,7 @@ function OhhwellsBridge() {
|
|
|
15602
14873
|
]
|
|
15603
14874
|
}
|
|
15604
14875
|
),
|
|
15605
|
-
toggleState && !linkPopover && /* @__PURE__ */ (0,
|
|
14876
|
+
toggleState && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15606
14877
|
StateToggle,
|
|
15607
14878
|
{
|
|
15608
14879
|
rect: toggleState.rect,
|
|
@@ -15611,15 +14882,15 @@ function OhhwellsBridge() {
|
|
|
15611
14882
|
onStateChange: handleStateChange
|
|
15612
14883
|
}
|
|
15613
14884
|
),
|
|
15614
|
-
sectionGap && !linkPopover && /* @__PURE__ */ (0,
|
|
14885
|
+
sectionGap && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
|
|
15615
14886
|
"div",
|
|
15616
14887
|
{
|
|
15617
14888
|
"data-ohw-section-insert-line": "",
|
|
15618
14889
|
className: "fixed left-0 w-full z-2147483646 flex items-center pointer-events-none",
|
|
15619
14890
|
style: { top: sectionGap.y, transform: "translateY(-50%)" },
|
|
15620
14891
|
children: [
|
|
15621
|
-
/* @__PURE__ */ (0,
|
|
15622
|
-
/* @__PURE__ */ (0,
|
|
14892
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } }),
|
|
14893
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15623
14894
|
Badge,
|
|
15624
14895
|
{
|
|
15625
14896
|
className: "px-8 py-1 bg-primary hover:bg-primary text-primary-foreground text-xs font-medium shrink-0 rounded-full cursor-pointer pointer-events-auto",
|
|
@@ -15636,11 +14907,11 @@ function OhhwellsBridge() {
|
|
|
15636
14907
|
children: "Add Section"
|
|
15637
14908
|
}
|
|
15638
14909
|
),
|
|
15639
|
-
/* @__PURE__ */ (0,
|
|
14910
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } })
|
|
15640
14911
|
]
|
|
15641
14912
|
}
|
|
15642
14913
|
),
|
|
15643
|
-
linkPopover && dialogPortalContainer ? /* @__PURE__ */ (0,
|
|
14914
|
+
linkPopover && dialogPortalContainer ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15644
14915
|
LinkPopover,
|
|
15645
14916
|
{
|
|
15646
14917
|
panelRef: linkPopoverPanelRef,
|