@ohhwells/bridge 0.1.51-next.129 → 0.1.52
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 +428 -935
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +404 -911
- 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_react12 = __toESM(require("react"), 1);
|
|
73
73
|
var import_client = require("react-dom/client");
|
|
74
74
|
var import_react_dom2 = require("react-dom");
|
|
75
75
|
|
|
@@ -5306,12 +5306,29 @@ function CarouselOverlay({
|
|
|
5306
5306
|
);
|
|
5307
5307
|
}
|
|
5308
5308
|
|
|
5309
|
-
// src/
|
|
5310
|
-
var
|
|
5311
|
-
var
|
|
5309
|
+
// src/OhhwellsBridge.tsx
|
|
5310
|
+
var import_react_dom3 = require("react-dom");
|
|
5311
|
+
var import_navigation2 = require("next/navigation");
|
|
5312
|
+
|
|
5313
|
+
// src/lib/session-search.ts
|
|
5314
|
+
var STORAGE_KEY = "ohw-preserved-search";
|
|
5315
|
+
function readPreservedSearch() {
|
|
5316
|
+
if (typeof window === "undefined") return "";
|
|
5317
|
+
const fromUrl = window.location.search;
|
|
5318
|
+
if (fromUrl && fromUrl !== "?") {
|
|
5319
|
+
sessionStorage.setItem(STORAGE_KEY, fromUrl);
|
|
5320
|
+
return fromUrl;
|
|
5321
|
+
}
|
|
5322
|
+
return sessionStorage.getItem(STORAGE_KEY) ?? "";
|
|
5323
|
+
}
|
|
5324
|
+
function isEditSessionActive() {
|
|
5325
|
+
const search = readPreservedSearch();
|
|
5326
|
+
if (!search || search === "?") return false;
|
|
5327
|
+
const q = search.startsWith("?") ? search.slice(1) : search;
|
|
5328
|
+
return new URLSearchParams(q).get("mode") === "edit";
|
|
5329
|
+
}
|
|
5312
5330
|
|
|
5313
5331
|
// src/lib/sections.ts
|
|
5314
|
-
var LINK_PICKER_EXCLUDED_IDS = /* @__PURE__ */ new Set(["navbar", "footer"]);
|
|
5315
5332
|
function titleCaseSectionId(id) {
|
|
5316
5333
|
return id.split("-").filter(Boolean).map((w) => w.charAt(0).toUpperCase() + w.slice(1)).join(" ");
|
|
5317
5334
|
}
|
|
@@ -5320,7 +5337,7 @@ function parseSectionsFromRoot(root) {
|
|
|
5320
5337
|
const sections = [];
|
|
5321
5338
|
for (const el of root.querySelectorAll("[data-ohw-section]")) {
|
|
5322
5339
|
const id = el.getAttribute("data-ohw-section") ?? "";
|
|
5323
|
-
if (!id || seen.has(id)
|
|
5340
|
+
if (!id || seen.has(id)) continue;
|
|
5324
5341
|
if (el.parentElement?.closest("[data-ohw-section]")) continue;
|
|
5325
5342
|
seen.add(id);
|
|
5326
5343
|
const label = el.getAttribute("data-ohw-section-label") ?? titleCaseSectionId(id);
|
|
@@ -5337,333 +5354,6 @@ function parseSectionsFromHtml(html) {
|
|
|
5337
5354
|
return parseSectionsFromRoot(doc);
|
|
5338
5355
|
}
|
|
5339
5356
|
|
|
5340
|
-
// src/ui/ai-section/AiSectionOverlay.tsx
|
|
5341
|
-
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
5342
|
-
function readRect(sectionId) {
|
|
5343
|
-
const el = document.querySelector(`[data-ohw-section="${CSS.escape(sectionId)}"]`);
|
|
5344
|
-
if (!el) return null;
|
|
5345
|
-
const r2 = el.getBoundingClientRect();
|
|
5346
|
-
if (r2.width <= 0 || r2.height <= 0) return null;
|
|
5347
|
-
return { top: r2.top, left: r2.left, width: r2.width, height: r2.height };
|
|
5348
|
-
}
|
|
5349
|
-
function useLiveSectionRect(sectionId) {
|
|
5350
|
-
const [rect, setRect] = (0, import_react6.useState)(null);
|
|
5351
|
-
(0, import_react6.useEffect)(() => {
|
|
5352
|
-
if (!sectionId) {
|
|
5353
|
-
setRect(null);
|
|
5354
|
-
return;
|
|
5355
|
-
}
|
|
5356
|
-
const update = () => {
|
|
5357
|
-
const next = readRect(sectionId);
|
|
5358
|
-
setRect(
|
|
5359
|
-
(prev) => prev && next && prev.top === next.top && prev.left === next.left && prev.width === next.width && prev.height === next.height ? prev : next
|
|
5360
|
-
);
|
|
5361
|
-
};
|
|
5362
|
-
update();
|
|
5363
|
-
const opts = { capture: true, passive: true };
|
|
5364
|
-
window.addEventListener("scroll", update, opts);
|
|
5365
|
-
window.addEventListener("resize", update);
|
|
5366
|
-
const el = document.querySelector(`[data-ohw-section="${CSS.escape(sectionId)}"]`);
|
|
5367
|
-
const ro = el ? new ResizeObserver(update) : null;
|
|
5368
|
-
if (el && ro) ro.observe(el);
|
|
5369
|
-
const interval = setInterval(update, 500);
|
|
5370
|
-
return () => {
|
|
5371
|
-
window.removeEventListener("scroll", update, opts);
|
|
5372
|
-
window.removeEventListener("resize", update);
|
|
5373
|
-
ro?.disconnect();
|
|
5374
|
-
clearInterval(interval);
|
|
5375
|
-
};
|
|
5376
|
-
}, [sectionId]);
|
|
5377
|
-
return rect;
|
|
5378
|
-
}
|
|
5379
|
-
var PRIMARY2 = "#0885FE";
|
|
5380
|
-
function edgeAwareRadius(rect) {
|
|
5381
|
-
const container = window.innerWidth <= 480 ? 16 : 24;
|
|
5382
|
-
const docHeight = document.documentElement.scrollHeight;
|
|
5383
|
-
const atTop = rect.top + window.scrollY <= 4;
|
|
5384
|
-
const atBottom = rect.top + rect.height + window.scrollY >= docHeight - 4;
|
|
5385
|
-
const top = atTop ? container : 4;
|
|
5386
|
-
const bottom = atBottom ? container : 4;
|
|
5387
|
-
return `${top}px ${top}px ${bottom}px ${bottom}px`;
|
|
5388
|
-
}
|
|
5389
|
-
function ReviewButton({
|
|
5390
|
-
label,
|
|
5391
|
-
onClick,
|
|
5392
|
-
children,
|
|
5393
|
-
background,
|
|
5394
|
-
color
|
|
5395
|
-
}) {
|
|
5396
|
-
const [hover, setHover] = (0, import_react6.useState)(false);
|
|
5397
|
-
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { style: { position: "relative" }, children: [
|
|
5398
|
-
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5399
|
-
"button",
|
|
5400
|
-
{
|
|
5401
|
-
type: "button",
|
|
5402
|
-
"aria-label": label,
|
|
5403
|
-
onClick,
|
|
5404
|
-
onMouseEnter: () => setHover(true),
|
|
5405
|
-
onMouseLeave: () => setHover(false),
|
|
5406
|
-
style: {
|
|
5407
|
-
width: 32,
|
|
5408
|
-
height: 32,
|
|
5409
|
-
display: "flex",
|
|
5410
|
-
alignItems: "center",
|
|
5411
|
-
justifyContent: "center",
|
|
5412
|
-
borderRadius: 8,
|
|
5413
|
-
border: "none",
|
|
5414
|
-
cursor: "pointer",
|
|
5415
|
-
background,
|
|
5416
|
-
color,
|
|
5417
|
-
boxShadow: "0 2px 6px rgba(0,0,0,0.15)"
|
|
5418
|
-
},
|
|
5419
|
-
children
|
|
5420
|
-
}
|
|
5421
|
-
),
|
|
5422
|
-
hover && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5423
|
-
"div",
|
|
5424
|
-
{
|
|
5425
|
-
style: {
|
|
5426
|
-
position: "absolute",
|
|
5427
|
-
top: "100%",
|
|
5428
|
-
left: "50%",
|
|
5429
|
-
transform: "translateX(-50%)",
|
|
5430
|
-
marginTop: 6,
|
|
5431
|
-
background: "#0c0a09",
|
|
5432
|
-
color: "#ffffff",
|
|
5433
|
-
fontSize: 12,
|
|
5434
|
-
lineHeight: "16px",
|
|
5435
|
-
padding: "4px 8px",
|
|
5436
|
-
borderRadius: 8,
|
|
5437
|
-
whiteSpace: "nowrap",
|
|
5438
|
-
fontFamily: "Figtree, ui-sans-serif, system-ui, sans-serif",
|
|
5439
|
-
pointerEvents: "none"
|
|
5440
|
-
},
|
|
5441
|
-
children: label
|
|
5442
|
-
}
|
|
5443
|
-
)
|
|
5444
|
-
] });
|
|
5445
|
-
}
|
|
5446
|
-
function AiSectionOverlay({
|
|
5447
|
-
postToParent: postToParent2,
|
|
5448
|
-
apiRef
|
|
5449
|
-
}) {
|
|
5450
|
-
const [selectedId, setSelectedId] = (0, import_react6.useState)(null);
|
|
5451
|
-
const [reviewId, setReviewId] = (0, import_react6.useState)(null);
|
|
5452
|
-
const reviewIdRef = (0, import_react6.useRef)(null);
|
|
5453
|
-
reviewIdRef.current = reviewId;
|
|
5454
|
-
const selectedIdRef = (0, import_react6.useRef)(null);
|
|
5455
|
-
selectedIdRef.current = selectedId;
|
|
5456
|
-
const report = (0, import_react6.useCallback)(
|
|
5457
|
-
(el) => {
|
|
5458
|
-
postToParent2({
|
|
5459
|
-
type: "ow:section-selected",
|
|
5460
|
-
sectionId: el?.dataset.ohwSection ?? null,
|
|
5461
|
-
sectionLabel: el ? el.dataset.ohwSectionLabel ?? titleCaseSectionId(el.dataset.ohwSection ?? "") : null
|
|
5462
|
-
});
|
|
5463
|
-
},
|
|
5464
|
-
[postToParent2]
|
|
5465
|
-
);
|
|
5466
|
-
const selectFromElement = (0, import_react6.useCallback)(
|
|
5467
|
-
(el, options) => {
|
|
5468
|
-
const sectionEl = el?.closest("[data-ohw-section]") ?? null;
|
|
5469
|
-
const id = sectionEl?.dataset.ohwSection ?? null;
|
|
5470
|
-
if (id === selectedIdRef.current) return;
|
|
5471
|
-
setSelectedId(id);
|
|
5472
|
-
if (options?.report !== false) report(sectionEl);
|
|
5473
|
-
},
|
|
5474
|
-
[report]
|
|
5475
|
-
);
|
|
5476
|
-
(0, import_react6.useEffect)(() => {
|
|
5477
|
-
apiRef.current = {
|
|
5478
|
-
selectFromElement,
|
|
5479
|
-
handleBackgroundClick: (target, clientX, clientY) => {
|
|
5480
|
-
let sectionEl = target?.closest("[data-ohw-section]") ?? null;
|
|
5481
|
-
if (!sectionEl && clientX !== void 0 && clientY !== void 0) {
|
|
5482
|
-
const beneath = document.elementsFromPoint(clientX, clientY).find(
|
|
5483
|
-
(el) => el instanceof HTMLElement && !el.closest("[data-ohw-bridge-root]") && el.closest("[data-ohw-section]") != null
|
|
5484
|
-
);
|
|
5485
|
-
sectionEl = beneath?.closest("[data-ohw-section]") ?? null;
|
|
5486
|
-
}
|
|
5487
|
-
selectFromElement(sectionEl);
|
|
5488
|
-
return sectionEl != null;
|
|
5489
|
-
},
|
|
5490
|
-
clear: () => setSelectedId(null)
|
|
5491
|
-
};
|
|
5492
|
-
return () => {
|
|
5493
|
-
apiRef.current = null;
|
|
5494
|
-
};
|
|
5495
|
-
}, [apiRef, selectFromElement]);
|
|
5496
|
-
(0, import_react6.useEffect)(() => {
|
|
5497
|
-
const onMessage = (e) => {
|
|
5498
|
-
if (e.data?.type === "ow:ai-select" && e.data.sectionId === null) {
|
|
5499
|
-
setSelectedId(null);
|
|
5500
|
-
return;
|
|
5501
|
-
}
|
|
5502
|
-
if (e.data?.type === "ow:ai-review") {
|
|
5503
|
-
const sectionId = e.data.sectionId;
|
|
5504
|
-
if (sectionId === null) {
|
|
5505
|
-
setReviewId(null);
|
|
5506
|
-
return;
|
|
5507
|
-
}
|
|
5508
|
-
const found = readRect(sectionId) != null;
|
|
5509
|
-
setReviewId(found ? sectionId : null);
|
|
5510
|
-
postToParent2({ type: "ow:ai-review-started", sectionId, found });
|
|
5511
|
-
if (found) {
|
|
5512
|
-
document.querySelector(`[data-ohw-section="${CSS.escape(sectionId)}"]`)?.scrollIntoView({ behavior: "smooth", block: "nearest" });
|
|
5513
|
-
}
|
|
5514
|
-
}
|
|
5515
|
-
};
|
|
5516
|
-
window.addEventListener("message", onMessage);
|
|
5517
|
-
return () => window.removeEventListener("message", onMessage);
|
|
5518
|
-
}, [postToParent2]);
|
|
5519
|
-
const [hoveredId, setHoveredId] = (0, import_react6.useState)(null);
|
|
5520
|
-
(0, import_react6.useEffect)(() => {
|
|
5521
|
-
const onMove = (e) => {
|
|
5522
|
-
const t = e.target;
|
|
5523
|
-
if (!(t instanceof HTMLElement)) return;
|
|
5524
|
-
if (t.closest(
|
|
5525
|
-
"[data-ohw-toolbar], [data-ohw-edit-chrome], [data-ohw-item-interaction], [data-ohw-link-modal-root], [data-ohw-section-picker], [data-ohw-ai-review]"
|
|
5526
|
-
)) {
|
|
5527
|
-
setHoveredId(null);
|
|
5528
|
-
return;
|
|
5529
|
-
}
|
|
5530
|
-
const sec = t.closest("[data-ohw-section]");
|
|
5531
|
-
setHoveredId(sec?.dataset.ohwSection ?? null);
|
|
5532
|
-
};
|
|
5533
|
-
const onLeave = () => setHoveredId(null);
|
|
5534
|
-
document.addEventListener("mousemove", onMove, { passive: true });
|
|
5535
|
-
document.documentElement.addEventListener("mouseleave", onLeave);
|
|
5536
|
-
return () => {
|
|
5537
|
-
document.removeEventListener("mousemove", onMove);
|
|
5538
|
-
document.documentElement.removeEventListener("mouseleave", onLeave);
|
|
5539
|
-
};
|
|
5540
|
-
}, []);
|
|
5541
|
-
(0, import_react6.useEffect)(() => {
|
|
5542
|
-
const onKeyDown = (e) => {
|
|
5543
|
-
if (e.key !== "Escape") return;
|
|
5544
|
-
if (reviewIdRef.current) return;
|
|
5545
|
-
if (document.querySelector("[data-ohw-editing]")) return;
|
|
5546
|
-
if (selectedIdRef.current) {
|
|
5547
|
-
setSelectedId(null);
|
|
5548
|
-
report(null);
|
|
5549
|
-
}
|
|
5550
|
-
};
|
|
5551
|
-
document.addEventListener("keydown", onKeyDown);
|
|
5552
|
-
return () => document.removeEventListener("keydown", onKeyDown);
|
|
5553
|
-
}, [report]);
|
|
5554
|
-
const decide = (0, import_react6.useCallback)(
|
|
5555
|
-
(decision) => {
|
|
5556
|
-
const sectionId = reviewIdRef.current;
|
|
5557
|
-
if (!sectionId) return;
|
|
5558
|
-
setReviewId(null);
|
|
5559
|
-
postToParent2({ type: "ow:ai-review-decision", sectionId, decision });
|
|
5560
|
-
},
|
|
5561
|
-
[postToParent2]
|
|
5562
|
-
);
|
|
5563
|
-
const selectionRect = useLiveSectionRect(reviewId ? null : selectedId);
|
|
5564
|
-
const reviewRect = useLiveSectionRect(reviewId);
|
|
5565
|
-
const hoverRect = useLiveSectionRect(reviewId || hoveredId === selectedId ? null : hoveredId);
|
|
5566
|
-
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
|
|
5567
|
-
hoverRect && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5568
|
-
"div",
|
|
5569
|
-
{
|
|
5570
|
-
"data-ohw-ai-section-hover": "",
|
|
5571
|
-
"aria-hidden": true,
|
|
5572
|
-
style: {
|
|
5573
|
-
position: "fixed",
|
|
5574
|
-
top: hoverRect.top,
|
|
5575
|
-
left: hoverRect.left,
|
|
5576
|
-
width: hoverRect.width,
|
|
5577
|
-
height: hoverRect.height,
|
|
5578
|
-
border: `2px solid rgba(8, 133, 254, 0.45)`,
|
|
5579
|
-
borderRadius: edgeAwareRadius(hoverRect),
|
|
5580
|
-
pointerEvents: "none",
|
|
5581
|
-
zIndex: 2147482900
|
|
5582
|
-
}
|
|
5583
|
-
}
|
|
5584
|
-
),
|
|
5585
|
-
selectionRect && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5586
|
-
"div",
|
|
5587
|
-
{
|
|
5588
|
-
"data-ohw-ai-section-selected": "",
|
|
5589
|
-
"aria-hidden": true,
|
|
5590
|
-
style: {
|
|
5591
|
-
position: "fixed",
|
|
5592
|
-
top: selectionRect.top,
|
|
5593
|
-
left: selectionRect.left,
|
|
5594
|
-
width: selectionRect.width,
|
|
5595
|
-
height: selectionRect.height,
|
|
5596
|
-
border: `2px solid ${PRIMARY2}`,
|
|
5597
|
-
borderRadius: edgeAwareRadius(selectionRect),
|
|
5598
|
-
pointerEvents: "none",
|
|
5599
|
-
zIndex: 2147483e3
|
|
5600
|
-
}
|
|
5601
|
-
}
|
|
5602
|
-
),
|
|
5603
|
-
reviewRect && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5604
|
-
"div",
|
|
5605
|
-
{
|
|
5606
|
-
"data-ohw-ai-review": "",
|
|
5607
|
-
style: {
|
|
5608
|
-
position: "fixed",
|
|
5609
|
-
top: reviewRect.top,
|
|
5610
|
-
left: reviewRect.left,
|
|
5611
|
-
width: reviewRect.width,
|
|
5612
|
-
height: reviewRect.height,
|
|
5613
|
-
border: `2px solid ${PRIMARY2}`,
|
|
5614
|
-
borderRadius: edgeAwareRadius(reviewRect),
|
|
5615
|
-
zIndex: 2147483200,
|
|
5616
|
-
// The veil itself: swallows clicks so the section stays locked until decided.
|
|
5617
|
-
background: "rgba(8, 133, 254, 0.04)",
|
|
5618
|
-
pointerEvents: "auto",
|
|
5619
|
-
cursor: "default"
|
|
5620
|
-
},
|
|
5621
|
-
onClick: (e) => e.stopPropagation(),
|
|
5622
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
|
|
5623
|
-
"div",
|
|
5624
|
-
{
|
|
5625
|
-
style: {
|
|
5626
|
-
position: "sticky",
|
|
5627
|
-
top: 12,
|
|
5628
|
-
display: "flex",
|
|
5629
|
-
gap: 8,
|
|
5630
|
-
justifyContent: "flex-end",
|
|
5631
|
-
paddingRight: 12,
|
|
5632
|
-
paddingTop: 12
|
|
5633
|
-
},
|
|
5634
|
-
children: [
|
|
5635
|
-
/* @__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 }) }),
|
|
5636
|
-
/* @__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 }) })
|
|
5637
|
-
]
|
|
5638
|
-
}
|
|
5639
|
-
)
|
|
5640
|
-
}
|
|
5641
|
-
)
|
|
5642
|
-
] });
|
|
5643
|
-
}
|
|
5644
|
-
|
|
5645
|
-
// src/OhhwellsBridge.tsx
|
|
5646
|
-
var import_react_dom3 = require("react-dom");
|
|
5647
|
-
var import_navigation2 = require("next/navigation");
|
|
5648
|
-
|
|
5649
|
-
// src/lib/session-search.ts
|
|
5650
|
-
var STORAGE_KEY = "ohw-preserved-search";
|
|
5651
|
-
function readPreservedSearch() {
|
|
5652
|
-
if (typeof window === "undefined") return "";
|
|
5653
|
-
const fromUrl = window.location.search;
|
|
5654
|
-
if (fromUrl && fromUrl !== "?") {
|
|
5655
|
-
sessionStorage.setItem(STORAGE_KEY, fromUrl);
|
|
5656
|
-
return fromUrl;
|
|
5657
|
-
}
|
|
5658
|
-
return sessionStorage.getItem(STORAGE_KEY) ?? "";
|
|
5659
|
-
}
|
|
5660
|
-
function isEditSessionActive() {
|
|
5661
|
-
const search = readPreservedSearch();
|
|
5662
|
-
if (!search || search === "?") return false;
|
|
5663
|
-
const q = search.startsWith("?") ? search.slice(1) : search;
|
|
5664
|
-
return new URLSearchParams(q).get("mode") === "edit";
|
|
5665
|
-
}
|
|
5666
|
-
|
|
5667
5357
|
// src/ui/link-modal/linkModal.utils.ts
|
|
5668
5358
|
function parseTarget(target) {
|
|
5669
5359
|
if (!target) return { pageRoute: "", sectionId: null };
|
|
@@ -5896,28 +5586,28 @@ function scrollToHashSectionWhenReady(behavior = "smooth") {
|
|
|
5896
5586
|
}
|
|
5897
5587
|
|
|
5898
5588
|
// src/ui/link-modal/LinkPopover.tsx
|
|
5899
|
-
var
|
|
5589
|
+
var import_react9 = require("react");
|
|
5900
5590
|
|
|
5901
5591
|
// src/ui/dialog.tsx
|
|
5902
5592
|
var React7 = __toESM(require("react"), 1);
|
|
5903
5593
|
var import_radix_ui6 = require("radix-ui");
|
|
5904
|
-
var
|
|
5905
|
-
var
|
|
5594
|
+
var import_lucide_react5 = require("lucide-react");
|
|
5595
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
5906
5596
|
function Dialog2({
|
|
5907
5597
|
...props
|
|
5908
5598
|
}) {
|
|
5909
|
-
return /* @__PURE__ */ (0,
|
|
5599
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_radix_ui6.Dialog.Root, { "data-slot": "dialog", ...props });
|
|
5910
5600
|
}
|
|
5911
5601
|
function DialogPortal({
|
|
5912
5602
|
...props
|
|
5913
5603
|
}) {
|
|
5914
|
-
return /* @__PURE__ */ (0,
|
|
5604
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_radix_ui6.Dialog.Portal, { ...props });
|
|
5915
5605
|
}
|
|
5916
5606
|
function DialogOverlay({
|
|
5917
5607
|
className,
|
|
5918
5608
|
...props
|
|
5919
5609
|
}) {
|
|
5920
|
-
return /* @__PURE__ */ (0,
|
|
5610
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5921
5611
|
import_radix_ui6.Dialog.Overlay,
|
|
5922
5612
|
{
|
|
5923
5613
|
"data-slot": "dialog-overlay",
|
|
@@ -5930,9 +5620,9 @@ function DialogOverlay({
|
|
|
5930
5620
|
var DialogContent = React7.forwardRef(
|
|
5931
5621
|
({ className, children, showCloseButton = true, container, ...props }, ref) => {
|
|
5932
5622
|
const positionMode = container ? "absolute" : "fixed";
|
|
5933
|
-
return /* @__PURE__ */ (0,
|
|
5934
|
-
/* @__PURE__ */ (0,
|
|
5935
|
-
/* @__PURE__ */ (0,
|
|
5623
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(DialogPortal, { container: container ?? void 0, children: [
|
|
5624
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DialogOverlay, { className: cn(positionMode, "inset-0") }),
|
|
5625
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
|
|
5936
5626
|
import_radix_ui6.Dialog.Content,
|
|
5937
5627
|
{
|
|
5938
5628
|
ref,
|
|
@@ -5948,13 +5638,13 @@ var DialogContent = React7.forwardRef(
|
|
|
5948
5638
|
...props,
|
|
5949
5639
|
children: [
|
|
5950
5640
|
children,
|
|
5951
|
-
showCloseButton ? /* @__PURE__ */ (0,
|
|
5641
|
+
showCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5952
5642
|
import_radix_ui6.Dialog.Close,
|
|
5953
5643
|
{
|
|
5954
5644
|
type: "button",
|
|
5955
5645
|
className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50",
|
|
5956
5646
|
"aria-label": "Close",
|
|
5957
|
-
children: /* @__PURE__ */ (0,
|
|
5647
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react5.X, { size: 16, "aria-hidden": true })
|
|
5958
5648
|
}
|
|
5959
5649
|
) : null
|
|
5960
5650
|
]
|
|
@@ -5968,13 +5658,13 @@ function DialogHeader({
|
|
|
5968
5658
|
className,
|
|
5969
5659
|
...props
|
|
5970
5660
|
}) {
|
|
5971
|
-
return /* @__PURE__ */ (0,
|
|
5661
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: cn("flex flex-col gap-1.5", className), ...props });
|
|
5972
5662
|
}
|
|
5973
5663
|
function DialogFooter({
|
|
5974
5664
|
className,
|
|
5975
5665
|
...props
|
|
5976
5666
|
}) {
|
|
5977
|
-
return /* @__PURE__ */ (0,
|
|
5667
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5978
5668
|
"div",
|
|
5979
5669
|
{
|
|
5980
5670
|
className: cn("flex items-center justify-end gap-2", className),
|
|
@@ -5982,7 +5672,7 @@ function DialogFooter({
|
|
|
5982
5672
|
}
|
|
5983
5673
|
);
|
|
5984
5674
|
}
|
|
5985
|
-
var DialogTitle = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
5675
|
+
var DialogTitle = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5986
5676
|
import_radix_ui6.Dialog.Title,
|
|
5987
5677
|
{
|
|
5988
5678
|
ref,
|
|
@@ -5994,7 +5684,7 @@ var DialogTitle = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE
|
|
|
5994
5684
|
}
|
|
5995
5685
|
));
|
|
5996
5686
|
DialogTitle.displayName = import_radix_ui6.Dialog.Title.displayName;
|
|
5997
|
-
var DialogDescription = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
5687
|
+
var DialogDescription = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5998
5688
|
import_radix_ui6.Dialog.Description,
|
|
5999
5689
|
{
|
|
6000
5690
|
ref,
|
|
@@ -6006,63 +5696,63 @@ DialogDescription.displayName = import_radix_ui6.Dialog.Description.displayName;
|
|
|
6006
5696
|
var DialogClose = import_radix_ui6.Dialog.Close;
|
|
6007
5697
|
|
|
6008
5698
|
// src/ui/link-modal/LinkEditorPanel.tsx
|
|
6009
|
-
var
|
|
5699
|
+
var import_lucide_react9 = require("lucide-react");
|
|
6010
5700
|
|
|
6011
5701
|
// src/ui/link-modal/DestinationBreadcrumb.tsx
|
|
6012
|
-
var
|
|
6013
|
-
var
|
|
5702
|
+
var import_lucide_react6 = require("lucide-react");
|
|
5703
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
6014
5704
|
function DestinationBreadcrumb({
|
|
6015
5705
|
pageTitle,
|
|
6016
5706
|
sectionLabel
|
|
6017
5707
|
}) {
|
|
6018
|
-
return /* @__PURE__ */ (0,
|
|
6019
|
-
/* @__PURE__ */ (0,
|
|
6020
|
-
/* @__PURE__ */ (0,
|
|
6021
|
-
/* @__PURE__ */ (0,
|
|
6022
|
-
/* @__PURE__ */ (0,
|
|
6023
|
-
/* @__PURE__ */ (0,
|
|
5708
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex w-full flex-col gap-2", children: [
|
|
5709
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { className: "text-sm font-medium! text-foreground m-0", children: "Destination" }),
|
|
5710
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex items-center gap-3", children: [
|
|
5711
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
5712
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_lucide_react6.File, { size: 16, className: "shrink-0 text-foreground", "aria-hidden": true }),
|
|
5713
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "text-sm font-medium leading-none text-foreground!", children: pageTitle })
|
|
6024
5714
|
] }),
|
|
6025
|
-
/* @__PURE__ */ (0,
|
|
6026
|
-
|
|
5715
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
5716
|
+
import_lucide_react6.ArrowRight,
|
|
6027
5717
|
{
|
|
6028
5718
|
size: 16,
|
|
6029
5719
|
className: "shrink-0 text-muted-foreground",
|
|
6030
5720
|
"aria-hidden": true
|
|
6031
5721
|
}
|
|
6032
5722
|
),
|
|
6033
|
-
/* @__PURE__ */ (0,
|
|
6034
|
-
/* @__PURE__ */ (0,
|
|
6035
|
-
|
|
5723
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
|
|
5724
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
5725
|
+
import_lucide_react6.GalleryVertical,
|
|
6036
5726
|
{
|
|
6037
5727
|
size: 16,
|
|
6038
5728
|
className: "shrink-0 text-foreground",
|
|
6039
5729
|
"aria-hidden": true
|
|
6040
5730
|
}
|
|
6041
5731
|
),
|
|
6042
|
-
/* @__PURE__ */ (0,
|
|
5732
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "truncate text-sm font-medium leading-none text-foreground", children: sectionLabel })
|
|
6043
5733
|
] })
|
|
6044
5734
|
] })
|
|
6045
5735
|
] });
|
|
6046
5736
|
}
|
|
6047
5737
|
|
|
6048
5738
|
// src/ui/link-modal/SectionTreeItem.tsx
|
|
6049
|
-
var
|
|
6050
|
-
var
|
|
5739
|
+
var import_lucide_react7 = require("lucide-react");
|
|
5740
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
6051
5741
|
function SectionTreeItem({
|
|
6052
5742
|
section,
|
|
6053
5743
|
onSelect,
|
|
6054
5744
|
selected
|
|
6055
5745
|
}) {
|
|
6056
5746
|
const interactive = Boolean(onSelect);
|
|
6057
|
-
return /* @__PURE__ */ (0,
|
|
6058
|
-
/* @__PURE__ */ (0,
|
|
5747
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex h-9 w-full items-end pl-3", children: [
|
|
5748
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
6059
5749
|
"div",
|
|
6060
5750
|
{
|
|
6061
5751
|
className: "mr-[-1px] h-9 w-2 shrink-0 rounded-bl-sm border-b border-l border-border mb-4",
|
|
6062
5752
|
"aria-hidden": true
|
|
6063
5753
|
}
|
|
6064
5754
|
),
|
|
6065
|
-
/* @__PURE__ */ (0,
|
|
5755
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
|
|
6066
5756
|
"div",
|
|
6067
5757
|
{
|
|
6068
5758
|
role: interactive ? "button" : void 0,
|
|
@@ -6080,15 +5770,15 @@ function SectionTreeItem({
|
|
|
6080
5770
|
interactive && selected && "border-primary"
|
|
6081
5771
|
),
|
|
6082
5772
|
children: [
|
|
6083
|
-
/* @__PURE__ */ (0,
|
|
6084
|
-
|
|
5773
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
5774
|
+
import_lucide_react7.GalleryVertical,
|
|
6085
5775
|
{
|
|
6086
5776
|
size: 16,
|
|
6087
5777
|
className: "shrink-0 text-foreground",
|
|
6088
5778
|
"aria-hidden": true
|
|
6089
5779
|
}
|
|
6090
5780
|
),
|
|
6091
|
-
/* @__PURE__ */ (0,
|
|
5781
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "truncate text-sm font-normal leading-5 text-foreground", children: section.label })
|
|
6092
5782
|
]
|
|
6093
5783
|
}
|
|
6094
5784
|
)
|
|
@@ -6096,14 +5786,14 @@ function SectionTreeItem({
|
|
|
6096
5786
|
}
|
|
6097
5787
|
|
|
6098
5788
|
// src/ui/link-modal/UrlOrPageInput.tsx
|
|
6099
|
-
var
|
|
5789
|
+
var import_react6 = require("react");
|
|
6100
5790
|
|
|
6101
5791
|
// src/ui/input.tsx
|
|
6102
5792
|
var React8 = __toESM(require("react"), 1);
|
|
6103
|
-
var
|
|
5793
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
6104
5794
|
var Input = React8.forwardRef(
|
|
6105
5795
|
({ className, type, ...props }, ref) => {
|
|
6106
|
-
return /* @__PURE__ */ (0,
|
|
5796
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
6107
5797
|
"input",
|
|
6108
5798
|
{
|
|
6109
5799
|
type,
|
|
@@ -6122,9 +5812,9 @@ Input.displayName = "Input";
|
|
|
6122
5812
|
|
|
6123
5813
|
// src/ui/label.tsx
|
|
6124
5814
|
var import_radix_ui7 = require("radix-ui");
|
|
6125
|
-
var
|
|
5815
|
+
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
6126
5816
|
function Label({ className, ...props }) {
|
|
6127
|
-
return /* @__PURE__ */ (0,
|
|
5817
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
6128
5818
|
import_radix_ui7.Label.Root,
|
|
6129
5819
|
{
|
|
6130
5820
|
"data-slot": "label",
|
|
@@ -6135,12 +5825,12 @@ function Label({ className, ...props }) {
|
|
|
6135
5825
|
}
|
|
6136
5826
|
|
|
6137
5827
|
// src/ui/link-modal/UrlOrPageInput.tsx
|
|
6138
|
-
var
|
|
6139
|
-
var
|
|
5828
|
+
var import_lucide_react8 = require("lucide-react");
|
|
5829
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
6140
5830
|
function FieldChevron({
|
|
6141
5831
|
onClick
|
|
6142
5832
|
}) {
|
|
6143
|
-
return /* @__PURE__ */ (0,
|
|
5833
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
6144
5834
|
"button",
|
|
6145
5835
|
{
|
|
6146
5836
|
type: "button",
|
|
@@ -6148,7 +5838,7 @@ function FieldChevron({
|
|
|
6148
5838
|
onClick,
|
|
6149
5839
|
"aria-label": "Open page list",
|
|
6150
5840
|
tabIndex: -1,
|
|
6151
|
-
children: /* @__PURE__ */ (0,
|
|
5841
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_lucide_react8.ChevronDown, { size: 16 })
|
|
6152
5842
|
}
|
|
6153
5843
|
);
|
|
6154
5844
|
}
|
|
@@ -6164,11 +5854,11 @@ function UrlOrPageInput({
|
|
|
6164
5854
|
readOnly = false,
|
|
6165
5855
|
urlError
|
|
6166
5856
|
}) {
|
|
6167
|
-
const inputId = (0,
|
|
6168
|
-
const inputRef = (0,
|
|
6169
|
-
const rootRef = (0,
|
|
6170
|
-
const [isFocused, setIsFocused] = (0,
|
|
6171
|
-
(0,
|
|
5857
|
+
const inputId = (0, import_react6.useId)();
|
|
5858
|
+
const inputRef = (0, import_react6.useRef)(null);
|
|
5859
|
+
const rootRef = (0, import_react6.useRef)(null);
|
|
5860
|
+
const [isFocused, setIsFocused] = (0, import_react6.useState)(false);
|
|
5861
|
+
(0, import_react6.useEffect)(() => {
|
|
6172
5862
|
if (!dropdownOpen) return;
|
|
6173
5863
|
const isOutside = (e) => {
|
|
6174
5864
|
const root = rootRef.current;
|
|
@@ -6209,19 +5899,19 @@ function UrlOrPageInput({
|
|
|
6209
5899
|
"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]",
|
|
6210
5900
|
urlError ? "border-destructive shadow-[0_0_0_1px_var(--ohw-destructive)]" : isFocused ? "border-primary shadow-[0_0_0_1px_var(--ohw-primary)]" : "border-input"
|
|
6211
5901
|
);
|
|
6212
|
-
return /* @__PURE__ */ (0,
|
|
6213
|
-
/* @__PURE__ */ (0,
|
|
6214
|
-
/* @__PURE__ */ (0,
|
|
6215
|
-
/* @__PURE__ */ (0,
|
|
6216
|
-
selectedPage ? /* @__PURE__ */ (0,
|
|
6217
|
-
|
|
5902
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex w-full flex-col gap-2 p-0", children: [
|
|
5903
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Label, { htmlFor: inputId, className: cn(urlError && "text-destructive"), children: "Destination" }),
|
|
5904
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { ref: rootRef, className: "relative w-full", children: [
|
|
5905
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { "data-ohw-link-field": true, className: fieldClassName, children: [
|
|
5906
|
+
selectedPage ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "flex shrink-0 items-center pr-2", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
5907
|
+
import_lucide_react8.File,
|
|
6218
5908
|
{
|
|
6219
5909
|
size: 16,
|
|
6220
5910
|
className: "shrink-0 text-foreground",
|
|
6221
5911
|
"aria-hidden": true
|
|
6222
5912
|
}
|
|
6223
5913
|
) }) : null,
|
|
6224
|
-
readOnly ? /* @__PURE__ */ (0,
|
|
5914
|
+
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)(
|
|
6225
5915
|
Input,
|
|
6226
5916
|
{
|
|
6227
5917
|
ref: inputRef,
|
|
@@ -6247,7 +5937,7 @@ function UrlOrPageInput({
|
|
|
6247
5937
|
)
|
|
6248
5938
|
}
|
|
6249
5939
|
),
|
|
6250
|
-
selectedPage && !readOnly ? /* @__PURE__ */ (0,
|
|
5940
|
+
selectedPage && !readOnly ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
6251
5941
|
"button",
|
|
6252
5942
|
{
|
|
6253
5943
|
type: "button",
|
|
@@ -6255,26 +5945,26 @@ function UrlOrPageInput({
|
|
|
6255
5945
|
onMouseDown: clearSelection,
|
|
6256
5946
|
"aria-label": "Clear selected page",
|
|
6257
5947
|
tabIndex: -1,
|
|
6258
|
-
children: /* @__PURE__ */ (0,
|
|
5948
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_lucide_react8.X, { size: 16, "aria-hidden": true })
|
|
6259
5949
|
}
|
|
6260
5950
|
) : null,
|
|
6261
|
-
!readOnly ? /* @__PURE__ */ (0,
|
|
5951
|
+
!readOnly ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(FieldChevron, { onClick: toggleDropdown }) : null
|
|
6262
5952
|
] }),
|
|
6263
|
-
dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */ (0,
|
|
5953
|
+
dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
6264
5954
|
"div",
|
|
6265
5955
|
{
|
|
6266
5956
|
"data-ohw-link-page-dropdown": "",
|
|
6267
5957
|
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",
|
|
6268
5958
|
onMouseDown: (e) => e.preventDefault(),
|
|
6269
|
-
children: filteredPages.map((page) => /* @__PURE__ */ (0,
|
|
5959
|
+
children: filteredPages.map((page) => /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
|
|
6270
5960
|
"button",
|
|
6271
5961
|
{
|
|
6272
5962
|
type: "button",
|
|
6273
5963
|
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",
|
|
6274
5964
|
onClick: () => onPageSelect(page),
|
|
6275
5965
|
children: [
|
|
6276
|
-
/* @__PURE__ */ (0,
|
|
6277
|
-
/* @__PURE__ */ (0,
|
|
5966
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_lucide_react8.File, { size: 16, className: "shrink-0", "aria-hidden": true }),
|
|
5967
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "truncate", children: page.title })
|
|
6278
5968
|
]
|
|
6279
5969
|
},
|
|
6280
5970
|
page.path
|
|
@@ -6282,34 +5972,34 @@ function UrlOrPageInput({
|
|
|
6282
5972
|
}
|
|
6283
5973
|
) : null
|
|
6284
5974
|
] }),
|
|
6285
|
-
urlError ? /* @__PURE__ */ (0,
|
|
5975
|
+
urlError ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "text-sm font-medium text-destructive", children: urlError }) : null
|
|
6286
5976
|
] });
|
|
6287
5977
|
}
|
|
6288
5978
|
|
|
6289
5979
|
// src/ui/link-modal/LinkEditorPanel.tsx
|
|
6290
|
-
var
|
|
5980
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
6291
5981
|
function LinkEditorPanel({ state, onClose }) {
|
|
6292
5982
|
const isCancel = state.secondaryLabel === "Cancel" || state.secondaryLabel === "Back to sections";
|
|
6293
|
-
return /* @__PURE__ */ (0,
|
|
6294
|
-
/* @__PURE__ */ (0,
|
|
5983
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
|
|
5984
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(DialogClose, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
6295
5985
|
"button",
|
|
6296
5986
|
{
|
|
6297
5987
|
type: "button",
|
|
6298
5988
|
className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50 h-7",
|
|
6299
5989
|
"aria-label": "Close",
|
|
6300
5990
|
onClick: onClose,
|
|
6301
|
-
children: /* @__PURE__ */ (0,
|
|
5991
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react9.X, { size: 16, "aria-hidden": true })
|
|
6302
5992
|
}
|
|
6303
5993
|
) }),
|
|
6304
|
-
/* @__PURE__ */ (0,
|
|
6305
|
-
/* @__PURE__ */ (0,
|
|
6306
|
-
state.showBreadcrumb && state.selectedPage && state.selectedSection ? /* @__PURE__ */ (0,
|
|
5994
|
+
/* @__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 }) }),
|
|
5995
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex w-full flex-col gap-3 px-6 pb-8 pt-1", children: [
|
|
5996
|
+
state.showBreadcrumb && state.selectedPage && state.selectedSection ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
6307
5997
|
DestinationBreadcrumb,
|
|
6308
5998
|
{
|
|
6309
5999
|
pageTitle: state.selectedPage.title,
|
|
6310
6000
|
sectionLabel: state.selectedSection.label
|
|
6311
6001
|
}
|
|
6312
|
-
) : /* @__PURE__ */ (0,
|
|
6002
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
6313
6003
|
UrlOrPageInput,
|
|
6314
6004
|
{
|
|
6315
6005
|
value: state.searchValue,
|
|
@@ -6322,8 +6012,8 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
6322
6012
|
urlError: state.urlError
|
|
6323
6013
|
}
|
|
6324
6014
|
),
|
|
6325
|
-
state.showChooseSection ? /* @__PURE__ */ (0,
|
|
6326
|
-
/* @__PURE__ */ (0,
|
|
6015
|
+
state.showChooseSection ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex flex-col justify-center gap-2", children: [
|
|
6016
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
6327
6017
|
Button,
|
|
6328
6018
|
{
|
|
6329
6019
|
type: "button",
|
|
@@ -6334,15 +6024,15 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
6334
6024
|
children: "Choose a section"
|
|
6335
6025
|
}
|
|
6336
6026
|
),
|
|
6337
|
-
/* @__PURE__ */ (0,
|
|
6338
|
-
/* @__PURE__ */ (0,
|
|
6339
|
-
/* @__PURE__ */ (0,
|
|
6027
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex items-center gap-1 text-sm text-muted-foreground", children: [
|
|
6028
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react9.Info, { size: 16, className: "shrink-0", "aria-hidden": true }),
|
|
6029
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { children: "Pick a section this link should scroll to." })
|
|
6340
6030
|
] })
|
|
6341
6031
|
] }) : null,
|
|
6342
|
-
state.showSectionRow && state.selectedSection ? /* @__PURE__ */ (0,
|
|
6032
|
+
state.showSectionRow && state.selectedSection ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SectionTreeItem, { section: state.selectedSection, selected: true }) : null
|
|
6343
6033
|
] }),
|
|
6344
|
-
/* @__PURE__ */ (0,
|
|
6345
|
-
/* @__PURE__ */ (0,
|
|
6034
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(DialogFooter, { className: "w-full px-6 pb-6", children: [
|
|
6035
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
6346
6036
|
Button,
|
|
6347
6037
|
{
|
|
6348
6038
|
type: "button",
|
|
@@ -6357,7 +6047,7 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
6357
6047
|
children: state.secondaryLabel
|
|
6358
6048
|
}
|
|
6359
6049
|
),
|
|
6360
|
-
/* @__PURE__ */ (0,
|
|
6050
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
6361
6051
|
Button,
|
|
6362
6052
|
{
|
|
6363
6053
|
type: "button",
|
|
@@ -6376,11 +6066,11 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
6376
6066
|
}
|
|
6377
6067
|
|
|
6378
6068
|
// src/ui/link-modal/SectionPickerOverlay.tsx
|
|
6379
|
-
var
|
|
6069
|
+
var import_react7 = require("react");
|
|
6380
6070
|
var import_react_dom = require("react-dom");
|
|
6381
|
-
var
|
|
6071
|
+
var import_lucide_react10 = require("lucide-react");
|
|
6382
6072
|
var import_navigation = require("next/navigation");
|
|
6383
|
-
var
|
|
6073
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
6384
6074
|
var DIM_OVERLAY = "rgba(0, 0, 0, 0.45)";
|
|
6385
6075
|
function rectsEqual(a, b) {
|
|
6386
6076
|
if (a.size !== b.size) return false;
|
|
@@ -6413,12 +6103,12 @@ function hitTestSectionId(x, y, sectionIds, rects) {
|
|
|
6413
6103
|
return null;
|
|
6414
6104
|
}
|
|
6415
6105
|
function useSectionRects(sectionIdsKey, enabled) {
|
|
6416
|
-
const [rects, setRects] = (0,
|
|
6417
|
-
const sectionIds = (0,
|
|
6106
|
+
const [rects, setRects] = (0, import_react7.useState)(/* @__PURE__ */ new Map());
|
|
6107
|
+
const sectionIds = (0, import_react7.useMemo)(
|
|
6418
6108
|
() => sectionIdsKey ? sectionIdsKey.split("\0") : [],
|
|
6419
6109
|
[sectionIdsKey]
|
|
6420
6110
|
);
|
|
6421
|
-
(0,
|
|
6111
|
+
(0, import_react7.useEffect)(() => {
|
|
6422
6112
|
if (!enabled || sectionIds.length === 0) {
|
|
6423
6113
|
setRects((prev) => prev.size === 0 ? prev : /* @__PURE__ */ new Map());
|
|
6424
6114
|
return;
|
|
@@ -6459,13 +6149,13 @@ function SectionPickerOverlay({
|
|
|
6459
6149
|
}) {
|
|
6460
6150
|
const router = (0, import_navigation.useRouter)();
|
|
6461
6151
|
const pathname = (0, import_navigation.usePathname)();
|
|
6462
|
-
const [selectedId, setSelectedId] = (0,
|
|
6463
|
-
const [hoveredId, setHoveredId] = (0,
|
|
6464
|
-
const pointerRef = (0,
|
|
6465
|
-
const pointerScreenRef = (0,
|
|
6466
|
-
const iframeOffsetTopRef = (0,
|
|
6467
|
-
const sectionIdsRef = (0,
|
|
6468
|
-
const [chromeClip, setChromeClip] = (0,
|
|
6152
|
+
const [selectedId, setSelectedId] = (0, import_react7.useState)(null);
|
|
6153
|
+
const [hoveredId, setHoveredId] = (0, import_react7.useState)(null);
|
|
6154
|
+
const pointerRef = (0, import_react7.useRef)(null);
|
|
6155
|
+
const pointerScreenRef = (0, import_react7.useRef)(null);
|
|
6156
|
+
const iframeOffsetTopRef = (0, import_react7.useRef)(null);
|
|
6157
|
+
const sectionIdsRef = (0, import_react7.useRef)([]);
|
|
6158
|
+
const [chromeClip, setChromeClip] = (0, import_react7.useState)(
|
|
6469
6159
|
() => ({
|
|
6470
6160
|
top: 0,
|
|
6471
6161
|
bottom: typeof window !== "undefined" ? window.innerHeight : 0
|
|
@@ -6473,12 +6163,12 @@ function SectionPickerOverlay({
|
|
|
6473
6163
|
);
|
|
6474
6164
|
const normalizedTarget = normalizePath(pagePath);
|
|
6475
6165
|
const isOnTargetPage = normalizePath(pathname) === normalizedTarget;
|
|
6476
|
-
(0,
|
|
6166
|
+
(0, import_react7.useEffect)(() => {
|
|
6477
6167
|
if (isOnTargetPage) return;
|
|
6478
6168
|
const search = readPreservedSearch();
|
|
6479
6169
|
router.push(`${normalizedTarget}${search}`);
|
|
6480
6170
|
}, [isOnTargetPage, normalizedTarget, router]);
|
|
6481
|
-
(0,
|
|
6171
|
+
(0, import_react7.useEffect)(() => {
|
|
6482
6172
|
document.documentElement.setAttribute("data-ohw-section-picking", "");
|
|
6483
6173
|
document.querySelectorAll("[data-ohw-hovered]").forEach((el) => {
|
|
6484
6174
|
el.removeAttribute("data-ohw-hovered");
|
|
@@ -6490,24 +6180,24 @@ function SectionPickerOverlay({
|
|
|
6490
6180
|
document.documentElement.removeAttribute("data-ohw-section-picking");
|
|
6491
6181
|
};
|
|
6492
6182
|
}, []);
|
|
6493
|
-
const liveSections = (0,
|
|
6183
|
+
const liveSections = (0, import_react7.useMemo)(() => {
|
|
6494
6184
|
if (!isOnTargetPage) return sections;
|
|
6495
6185
|
const live = collectSectionsFromDom();
|
|
6496
6186
|
if (live.length === 0) return sections;
|
|
6497
6187
|
const labels = new Map(sections.map((s) => [s.id, s.label]));
|
|
6498
6188
|
return live.map((s) => ({ id: s.id, label: labels.get(s.id) ?? s.label }));
|
|
6499
6189
|
}, [isOnTargetPage, sections, pathname]);
|
|
6500
|
-
const sectionIdsKey = (0,
|
|
6190
|
+
const sectionIdsKey = (0, import_react7.useMemo)(
|
|
6501
6191
|
() => liveSections.map((s) => s.id).join("\0"),
|
|
6502
6192
|
[liveSections]
|
|
6503
6193
|
);
|
|
6504
|
-
const sectionIds = (0,
|
|
6194
|
+
const sectionIds = (0, import_react7.useMemo)(
|
|
6505
6195
|
() => liveSections.map((s) => s.id),
|
|
6506
6196
|
[liveSections]
|
|
6507
6197
|
);
|
|
6508
6198
|
sectionIdsRef.current = sectionIds;
|
|
6509
6199
|
const rects = useSectionRects(sectionIdsKey, isOnTargetPage);
|
|
6510
|
-
const applyHoverAt = (0,
|
|
6200
|
+
const applyHoverAt = (0, import_react7.useCallback)(
|
|
6511
6201
|
(x, y, liveRects) => {
|
|
6512
6202
|
const ids = sectionIdsRef.current;
|
|
6513
6203
|
const map = liveRects ?? readSectionRects(ids);
|
|
@@ -6516,7 +6206,7 @@ function SectionPickerOverlay({
|
|
|
6516
6206
|
},
|
|
6517
6207
|
[]
|
|
6518
6208
|
);
|
|
6519
|
-
(0,
|
|
6209
|
+
(0, import_react7.useEffect)(() => {
|
|
6520
6210
|
const applyClip = (iframeOffsetTop, visibleCanvasTop, canvasH) => {
|
|
6521
6211
|
const top = Math.max(0, visibleCanvasTop - iframeOffsetTop);
|
|
6522
6212
|
const bottom = Math.min(
|
|
@@ -6558,12 +6248,12 @@ function SectionPickerOverlay({
|
|
|
6558
6248
|
window.removeEventListener("resize", onResize);
|
|
6559
6249
|
};
|
|
6560
6250
|
}, [applyHoverAt]);
|
|
6561
|
-
(0,
|
|
6251
|
+
(0, import_react7.useEffect)(() => {
|
|
6562
6252
|
const ptr = pointerRef.current;
|
|
6563
6253
|
if (!ptr) return;
|
|
6564
6254
|
applyHoverAt(ptr.x, ptr.y, rects);
|
|
6565
6255
|
}, [rects, applyHoverAt]);
|
|
6566
|
-
(0,
|
|
6256
|
+
(0, import_react7.useEffect)(() => {
|
|
6567
6257
|
const rememberPointer = (clientX, clientY) => {
|
|
6568
6258
|
pointerRef.current = { x: clientX, y: clientY };
|
|
6569
6259
|
const top = iframeOffsetTopRef.current;
|
|
@@ -6587,7 +6277,7 @@ function SectionPickerOverlay({
|
|
|
6587
6277
|
window.removeEventListener("message", onPointerSync);
|
|
6588
6278
|
};
|
|
6589
6279
|
}, [rects, applyHoverAt]);
|
|
6590
|
-
const handleSelect = (0,
|
|
6280
|
+
const handleSelect = (0, import_react7.useCallback)(
|
|
6591
6281
|
(section) => {
|
|
6592
6282
|
if (selectedId) return;
|
|
6593
6283
|
setSelectedId(section.id);
|
|
@@ -6595,7 +6285,7 @@ function SectionPickerOverlay({
|
|
|
6595
6285
|
},
|
|
6596
6286
|
[selectedId, onSelect]
|
|
6597
6287
|
);
|
|
6598
|
-
(0,
|
|
6288
|
+
(0, import_react7.useEffect)(() => {
|
|
6599
6289
|
const onKeyDown = (e) => {
|
|
6600
6290
|
if (e.key === "Escape") {
|
|
6601
6291
|
e.preventDefault();
|
|
@@ -6609,7 +6299,7 @@ function SectionPickerOverlay({
|
|
|
6609
6299
|
const portalRoot = typeof document !== "undefined" ? document.querySelector("[data-ohw-bridge-root]") ?? document.body : null;
|
|
6610
6300
|
if (!portalRoot) return null;
|
|
6611
6301
|
return (0, import_react_dom.createPortal)(
|
|
6612
|
-
/* @__PURE__ */ (0,
|
|
6302
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
|
|
6613
6303
|
"div",
|
|
6614
6304
|
{
|
|
6615
6305
|
"data-ohw-section-picker": "",
|
|
@@ -6619,12 +6309,12 @@ function SectionPickerOverlay({
|
|
|
6619
6309
|
role: "dialog",
|
|
6620
6310
|
"aria-label": "Choose a section",
|
|
6621
6311
|
children: [
|
|
6622
|
-
/* @__PURE__ */ (0,
|
|
6312
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
6623
6313
|
"div",
|
|
6624
6314
|
{
|
|
6625
6315
|
className: "pointer-events-auto fixed left-5 z-[2]",
|
|
6626
6316
|
style: { top: chromeClip.top + 20 },
|
|
6627
|
-
children: /* @__PURE__ */ (0,
|
|
6317
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
|
|
6628
6318
|
Button,
|
|
6629
6319
|
{
|
|
6630
6320
|
type: "button",
|
|
@@ -6633,14 +6323,14 @@ function SectionPickerOverlay({
|
|
|
6633
6323
|
className: "h-8 min-w-0 gap-1 border-border bg-background px-2 py-1.5 shadow-sm hover:bg-muted cursor-pointer",
|
|
6634
6324
|
onClick: onBack,
|
|
6635
6325
|
children: [
|
|
6636
|
-
/* @__PURE__ */ (0,
|
|
6326
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react10.ArrowLeft, { className: "size-4 shrink-0", "aria-hidden": true }),
|
|
6637
6327
|
"Back"
|
|
6638
6328
|
]
|
|
6639
6329
|
}
|
|
6640
6330
|
)
|
|
6641
6331
|
}
|
|
6642
6332
|
),
|
|
6643
|
-
/* @__PURE__ */ (0,
|
|
6333
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
6644
6334
|
"div",
|
|
6645
6335
|
{
|
|
6646
6336
|
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",
|
|
@@ -6653,7 +6343,7 @@ function SectionPickerOverlay({
|
|
|
6653
6343
|
children: "Click on section to select"
|
|
6654
6344
|
}
|
|
6655
6345
|
),
|
|
6656
|
-
!isOnTargetPage ? /* @__PURE__ */ (0,
|
|
6346
|
+
!isOnTargetPage ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
6657
6347
|
"div",
|
|
6658
6348
|
{
|
|
6659
6349
|
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",
|
|
@@ -6661,14 +6351,14 @@ function SectionPickerOverlay({
|
|
|
6661
6351
|
children: "Loading page preview\u2026"
|
|
6662
6352
|
}
|
|
6663
6353
|
) : null,
|
|
6664
|
-
isOnTargetPage && liveSections.length === 0 ? /* @__PURE__ */ (0,
|
|
6354
|
+
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,
|
|
6665
6355
|
isOnTargetPage ? liveSections.map((section) => {
|
|
6666
6356
|
const rect = rects.get(section.id);
|
|
6667
6357
|
if (!rect || rect.width <= 0 || rect.height <= 0) return null;
|
|
6668
6358
|
const isSelected = selectedId === section.id;
|
|
6669
6359
|
const isHovered = hoveredId === section.id;
|
|
6670
6360
|
const isLit = isSelected || isHovered;
|
|
6671
|
-
return /* @__PURE__ */ (0,
|
|
6361
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
|
|
6672
6362
|
"button",
|
|
6673
6363
|
{
|
|
6674
6364
|
type: "button",
|
|
@@ -6683,7 +6373,7 @@ function SectionPickerOverlay({
|
|
|
6683
6373
|
"aria-label": `Select section ${section.label}`,
|
|
6684
6374
|
onClick: () => handleSelect(section),
|
|
6685
6375
|
children: [
|
|
6686
|
-
isLit ? /* @__PURE__ */ (0,
|
|
6376
|
+
isLit ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
6687
6377
|
"span",
|
|
6688
6378
|
{
|
|
6689
6379
|
className: "pointer-events-none absolute",
|
|
@@ -6696,13 +6386,13 @@ function SectionPickerOverlay({
|
|
|
6696
6386
|
"aria-hidden": true
|
|
6697
6387
|
}
|
|
6698
6388
|
) : null,
|
|
6699
|
-
isSelected ? /* @__PURE__ */ (0,
|
|
6389
|
+
isSelected ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
6700
6390
|
"span",
|
|
6701
6391
|
{
|
|
6702
6392
|
className: "absolute right-3 top-3 flex size-8 items-center justify-center rounded-full text-white",
|
|
6703
6393
|
style: { backgroundColor: "var(--ohw-primary, #0885fe)" },
|
|
6704
6394
|
"aria-hidden": true,
|
|
6705
|
-
children: /* @__PURE__ */ (0,
|
|
6395
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react10.Check, { className: "size-5" })
|
|
6706
6396
|
}
|
|
6707
6397
|
) : null
|
|
6708
6398
|
]
|
|
@@ -6718,7 +6408,7 @@ function SectionPickerOverlay({
|
|
|
6718
6408
|
}
|
|
6719
6409
|
|
|
6720
6410
|
// src/ui/link-modal/useLinkModalState.ts
|
|
6721
|
-
var
|
|
6411
|
+
var import_react8 = require("react");
|
|
6722
6412
|
function useLinkModalState({
|
|
6723
6413
|
open,
|
|
6724
6414
|
mode,
|
|
@@ -6730,14 +6420,14 @@ function useLinkModalState({
|
|
|
6730
6420
|
onClose,
|
|
6731
6421
|
onSubmit
|
|
6732
6422
|
}) {
|
|
6733
|
-
const availablePages = (0,
|
|
6734
|
-
const [searchValue, setSearchValue] = (0,
|
|
6735
|
-
const [selectedPage, setSelectedPage] = (0,
|
|
6736
|
-
const [selectedSection, setSelectedSection] = (0,
|
|
6737
|
-
const [step, setStep] = (0,
|
|
6738
|
-
const [dropdownOpen, setDropdownOpen] = (0,
|
|
6739
|
-
const [urlError, setUrlError] = (0,
|
|
6740
|
-
const reset = (0,
|
|
6423
|
+
const availablePages = (0, import_react8.useMemo)(() => pages, [pages]);
|
|
6424
|
+
const [searchValue, setSearchValue] = (0, import_react8.useState)("");
|
|
6425
|
+
const [selectedPage, setSelectedPage] = (0, import_react8.useState)(null);
|
|
6426
|
+
const [selectedSection, setSelectedSection] = (0, import_react8.useState)(null);
|
|
6427
|
+
const [step, setStep] = (0, import_react8.useState)("input");
|
|
6428
|
+
const [dropdownOpen, setDropdownOpen] = (0, import_react8.useState)(false);
|
|
6429
|
+
const [urlError, setUrlError] = (0, import_react8.useState)("");
|
|
6430
|
+
const reset = (0, import_react8.useCallback)(() => {
|
|
6741
6431
|
setSearchValue("");
|
|
6742
6432
|
setSelectedPage(null);
|
|
6743
6433
|
setSelectedSection(null);
|
|
@@ -6745,7 +6435,7 @@ function useLinkModalState({
|
|
|
6745
6435
|
setDropdownOpen(false);
|
|
6746
6436
|
setUrlError("");
|
|
6747
6437
|
}, []);
|
|
6748
|
-
(0,
|
|
6438
|
+
(0, import_react8.useEffect)(() => {
|
|
6749
6439
|
if (!open) return;
|
|
6750
6440
|
if (mode === "edit" && initialTarget) {
|
|
6751
6441
|
const { pageRoute } = parseTarget(initialTarget);
|
|
@@ -6761,11 +6451,11 @@ function useLinkModalState({
|
|
|
6761
6451
|
setDropdownOpen(false);
|
|
6762
6452
|
setUrlError("");
|
|
6763
6453
|
}, [open, mode, initialTarget, reset]);
|
|
6764
|
-
const filteredPages = (0,
|
|
6454
|
+
const filteredPages = (0, import_react8.useMemo)(() => {
|
|
6765
6455
|
if (!searchValue.trim()) return availablePages;
|
|
6766
6456
|
return availablePages.filter((p) => p.title.toLowerCase().startsWith(searchValue.toLowerCase()));
|
|
6767
6457
|
}, [availablePages, searchValue]);
|
|
6768
|
-
const activeSections = (0,
|
|
6458
|
+
const activeSections = (0, import_react8.useMemo)(() => {
|
|
6769
6459
|
if (!selectedPage) return [];
|
|
6770
6460
|
return getSectionsForPath(sectionsByPath, selectedPage.path);
|
|
6771
6461
|
}, [selectedPage, sectionsByPath]);
|
|
@@ -6814,7 +6504,7 @@ function useLinkModalState({
|
|
|
6814
6504
|
reset();
|
|
6815
6505
|
onClose();
|
|
6816
6506
|
};
|
|
6817
|
-
const isValid = (0,
|
|
6507
|
+
const isValid = (0, import_react8.useMemo)(() => {
|
|
6818
6508
|
if (urlError) return false;
|
|
6819
6509
|
if (showBreadcrumb) return true;
|
|
6820
6510
|
if (selectedPage) return true;
|
|
@@ -6882,7 +6572,7 @@ function useLinkModalState({
|
|
|
6882
6572
|
}
|
|
6883
6573
|
|
|
6884
6574
|
// src/ui/link-modal/LinkPopover.tsx
|
|
6885
|
-
var
|
|
6575
|
+
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
6886
6576
|
function postToParent(data) {
|
|
6887
6577
|
window.parent?.postMessage(data, "*");
|
|
6888
6578
|
}
|
|
@@ -6911,7 +6601,7 @@ function LinkPopover({
|
|
|
6911
6601
|
onSubmit
|
|
6912
6602
|
});
|
|
6913
6603
|
const sectionPickerActive = state.showSectionPicker && Boolean(state.selectedPage);
|
|
6914
|
-
(0,
|
|
6604
|
+
(0, import_react9.useEffect)(() => {
|
|
6915
6605
|
if (!open) return;
|
|
6916
6606
|
if (sectionPickerActive) {
|
|
6917
6607
|
postToParent({ type: "ui:unlock" });
|
|
@@ -6978,15 +6668,15 @@ function LinkPopover({
|
|
|
6978
6668
|
);
|
|
6979
6669
|
};
|
|
6980
6670
|
}, [open, sectionPickerActive]);
|
|
6981
|
-
return /* @__PURE__ */ (0,
|
|
6982
|
-
/* @__PURE__ */ (0,
|
|
6671
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
|
|
6672
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
6983
6673
|
Dialog2,
|
|
6984
6674
|
{
|
|
6985
6675
|
open: open && !sectionPickerActive,
|
|
6986
6676
|
onOpenChange: (next) => {
|
|
6987
6677
|
if (!next) onClose?.();
|
|
6988
6678
|
},
|
|
6989
|
-
children: /* @__PURE__ */ (0,
|
|
6679
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
6990
6680
|
DialogContent,
|
|
6991
6681
|
{
|
|
6992
6682
|
ref: panelRef,
|
|
@@ -6996,12 +6686,12 @@ function LinkPopover({
|
|
|
6996
6686
|
"data-ohw-bridge": "",
|
|
6997
6687
|
showCloseButton: false,
|
|
6998
6688
|
className: "gap-0 p-0 w-full max-w-[448px] pointer-events-auto z-[2147483646] overflow-visible",
|
|
6999
|
-
children: /* @__PURE__ */ (0,
|
|
6689
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(LinkEditorPanel, { state, onClose })
|
|
7000
6690
|
}
|
|
7001
6691
|
)
|
|
7002
6692
|
}
|
|
7003
6693
|
),
|
|
7004
|
-
sectionPickerActive && state.selectedPage ? /* @__PURE__ */ (0,
|
|
6694
|
+
sectionPickerActive && state.selectedPage ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
7005
6695
|
SectionPickerOverlay,
|
|
7006
6696
|
{
|
|
7007
6697
|
pagePath: state.selectedPage.path,
|
|
@@ -8976,43 +8666,6 @@ function deleteFooterColumn(column) {
|
|
|
8976
8666
|
};
|
|
8977
8667
|
}
|
|
8978
8668
|
|
|
8979
|
-
// src/lib/site-wide-scope.ts
|
|
8980
|
-
function getLogoElement(el) {
|
|
8981
|
-
const marked = el.closest('[data-ohw-role="logo"], [data-ohw-logo]');
|
|
8982
|
-
if (marked) return marked;
|
|
8983
|
-
const root = el.closest("nav, [data-ohw-nav-root], footer");
|
|
8984
|
-
if (!root) return null;
|
|
8985
|
-
const anchor = el.closest("a");
|
|
8986
|
-
if (anchor && root.contains(anchor) && !anchor.hasAttribute("data-ohw-href-key") && !anchor.closest("[data-ohw-nav-container]") && Boolean(anchor.querySelector("img") || anchor.matches("img"))) {
|
|
8987
|
-
return anchor;
|
|
8988
|
-
}
|
|
8989
|
-
const img = el.matches("img") ? el : null;
|
|
8990
|
-
if (img && !img.closest("[data-ohw-href-key]") && !img.closest("[data-ohw-nav-container]") && (img.closest("footer") || img.closest("nav, [data-ohw-nav-root]"))) {
|
|
8991
|
-
return img;
|
|
8992
|
-
}
|
|
8993
|
-
return null;
|
|
8994
|
-
}
|
|
8995
|
-
function isInFooter(el) {
|
|
8996
|
-
if (!el) return false;
|
|
8997
|
-
return Boolean(el.closest("footer") || el.closest('[data-ohw-section="footer"]'));
|
|
8998
|
-
}
|
|
8999
|
-
function isSiteWideElement(el) {
|
|
9000
|
-
if (!el) return false;
|
|
9001
|
-
if (getLogoElement(el)) return true;
|
|
9002
|
-
if (isInFooter(el)) return true;
|
|
9003
|
-
if (el.hasAttribute("data-ohw-nav-container") || el.hasAttribute("data-ohw-nav-root")) {
|
|
9004
|
-
return true;
|
|
9005
|
-
}
|
|
9006
|
-
if (el.hasAttribute("data-ohw-href-key") && el.closest("nav, [data-ohw-nav-root], [data-ohw-nav-drawer], aside")) {
|
|
9007
|
-
return true;
|
|
9008
|
-
}
|
|
9009
|
-
if (el.closest('[data-ohw-role="navbar-button"]')) return true;
|
|
9010
|
-
return false;
|
|
9011
|
-
}
|
|
9012
|
-
function isSiteWideScopeActive(args) {
|
|
9013
|
-
return isSiteWideElement(args.selected) || isSiteWideElement(args.hoveredItem) || isSiteWideElement(args.hoveredNavContainer) || isSiteWideElement(args.active);
|
|
9014
|
-
}
|
|
9015
|
-
|
|
9016
8669
|
// src/lib/add-footer-column.ts
|
|
9017
8670
|
function buildFooterColumnEditContentPatch(result) {
|
|
9018
8671
|
return {
|
|
@@ -9243,7 +8896,7 @@ function hitTestNavDropSlot(clientX, clientY, draggedHrefKey) {
|
|
|
9243
8896
|
}
|
|
9244
8897
|
|
|
9245
8898
|
// src/useNavItemDrag.ts
|
|
9246
|
-
var
|
|
8899
|
+
var import_react10 = require("react");
|
|
9247
8900
|
function useNavItemDrag({
|
|
9248
8901
|
isEditMode,
|
|
9249
8902
|
editContentRef,
|
|
@@ -9268,11 +8921,11 @@ function useNavItemDrag({
|
|
|
9268
8921
|
isDragHandleDisabled: isDragHandleDisabled2,
|
|
9269
8922
|
isNavbarButton: isNavbarButton3
|
|
9270
8923
|
}) {
|
|
9271
|
-
const navDragRef = (0,
|
|
9272
|
-
const [navDropSlots, setNavDropSlots] = (0,
|
|
9273
|
-
const [activeNavDropIndex, setActiveNavDropIndex] = (0,
|
|
9274
|
-
const navPointerDragRef = (0,
|
|
9275
|
-
const clearNavDragVisuals = (0,
|
|
8924
|
+
const navDragRef = (0, import_react10.useRef)(null);
|
|
8925
|
+
const [navDropSlots, setNavDropSlots] = (0, import_react10.useState)([]);
|
|
8926
|
+
const [activeNavDropIndex, setActiveNavDropIndex] = (0, import_react10.useState)(null);
|
|
8927
|
+
const navPointerDragRef = (0, import_react10.useRef)(null);
|
|
8928
|
+
const clearNavDragVisuals = (0, import_react10.useCallback)(() => {
|
|
9276
8929
|
const session = navDragRef.current;
|
|
9277
8930
|
const keepOpenEl = session?.draggedEl?.closest("[data-ohw-nav-children]") != null ? session.draggedEl : null;
|
|
9278
8931
|
navDragRef.current = null;
|
|
@@ -9289,7 +8942,7 @@ function useNavItemDrag({
|
|
|
9289
8942
|
document.documentElement.removeAttribute("data-ohw-nav-dragging-root");
|
|
9290
8943
|
unlockItemDragInteraction();
|
|
9291
8944
|
}, [setDraggedItemRect, setIsItemDragging, setSiblingHintRects]);
|
|
9292
|
-
const refreshNavDragVisuals = (0,
|
|
8945
|
+
const refreshNavDragVisuals = (0, import_react10.useCallback)(
|
|
9293
8946
|
(session, activeSlot, clientX, clientY) => {
|
|
9294
8947
|
setDraggedItemRect(session.draggedEl.getBoundingClientRect());
|
|
9295
8948
|
if (typeof clientX === "number" && typeof clientY === "number") {
|
|
@@ -9307,13 +8960,13 @@ function useNavItemDrag({
|
|
|
9307
8960
|
},
|
|
9308
8961
|
[setDraggedItemRect, setSiblingHintRects]
|
|
9309
8962
|
);
|
|
9310
|
-
const refreshNavDragVisualsRef = (0,
|
|
8963
|
+
const refreshNavDragVisualsRef = (0, import_react10.useRef)(refreshNavDragVisuals);
|
|
9311
8964
|
refreshNavDragVisualsRef.current = refreshNavDragVisuals;
|
|
9312
|
-
const commitNavDragRef = (0,
|
|
8965
|
+
const commitNavDragRef = (0, import_react10.useRef)(() => {
|
|
9313
8966
|
});
|
|
9314
|
-
const beginNavDragRef = (0,
|
|
8967
|
+
const beginNavDragRef = (0, import_react10.useRef)(() => {
|
|
9315
8968
|
});
|
|
9316
|
-
const beginNavDrag = (0,
|
|
8969
|
+
const beginNavDrag = (0, import_react10.useCallback)(
|
|
9317
8970
|
(session) => {
|
|
9318
8971
|
const rect = session.draggedEl.getBoundingClientRect();
|
|
9319
8972
|
session.lastClientX = session.lastClientX || rect.left + rect.width / 2;
|
|
@@ -9347,7 +9000,7 @@ function useNavItemDrag({
|
|
|
9347
9000
|
]
|
|
9348
9001
|
);
|
|
9349
9002
|
beginNavDragRef.current = beginNavDrag;
|
|
9350
|
-
const commitNavDrag = (0,
|
|
9003
|
+
const commitNavDrag = (0, import_react10.useCallback)(
|
|
9351
9004
|
(clientX, clientY) => {
|
|
9352
9005
|
const session = navDragRef.current;
|
|
9353
9006
|
if (!session) {
|
|
@@ -9408,7 +9061,7 @@ function useNavItemDrag({
|
|
|
9408
9061
|
[clearNavDragVisuals, deselectRef, editContentRef, postToParentRef, selectRef]
|
|
9409
9062
|
);
|
|
9410
9063
|
commitNavDragRef.current = commitNavDrag;
|
|
9411
|
-
const startNavLinkDrag = (0,
|
|
9064
|
+
const startNavLinkDrag = (0, import_react10.useCallback)(
|
|
9412
9065
|
(anchor, clientX, clientY, wasSelected) => {
|
|
9413
9066
|
if (footerDragRef.current) return false;
|
|
9414
9067
|
const hrefKey = anchor.getAttribute("data-ohw-href-key");
|
|
@@ -9426,7 +9079,7 @@ function useNavItemDrag({
|
|
|
9426
9079
|
},
|
|
9427
9080
|
[beginNavDrag, footerDragRef, isDragHandleDisabled2, isNavbarButton3]
|
|
9428
9081
|
);
|
|
9429
|
-
const onNavDragOver = (0,
|
|
9082
|
+
const onNavDragOver = (0, import_react10.useCallback)(
|
|
9430
9083
|
(e) => {
|
|
9431
9084
|
const session = navDragRef.current;
|
|
9432
9085
|
if (!session) return false;
|
|
@@ -9438,7 +9091,7 @@ function useNavItemDrag({
|
|
|
9438
9091
|
},
|
|
9439
9092
|
[]
|
|
9440
9093
|
);
|
|
9441
|
-
(0,
|
|
9094
|
+
(0, import_react10.useEffect)(() => {
|
|
9442
9095
|
if (!isEditMode) return;
|
|
9443
9096
|
const THRESHOLD = 10;
|
|
9444
9097
|
const resolveWasSelected = (el) => {
|
|
@@ -9563,7 +9216,7 @@ function useNavItemDrag({
|
|
|
9563
9216
|
setLinkPopover,
|
|
9564
9217
|
suppressNextClickRef
|
|
9565
9218
|
]);
|
|
9566
|
-
const armNavPressFromChrome = (0,
|
|
9219
|
+
const armNavPressFromChrome = (0, import_react10.useCallback)(
|
|
9567
9220
|
(selected, clientX, clientY, pointerId) => {
|
|
9568
9221
|
const hrefKey = selected.getAttribute("data-ohw-href-key");
|
|
9569
9222
|
if (!hrefKey || !isNavbarHrefKey(hrefKey)) return false;
|
|
@@ -9594,8 +9247,8 @@ function useNavItemDrag({
|
|
|
9594
9247
|
}
|
|
9595
9248
|
|
|
9596
9249
|
// src/ui/footer-container-chrome.tsx
|
|
9597
|
-
var
|
|
9598
|
-
var
|
|
9250
|
+
var import_lucide_react11 = require("lucide-react");
|
|
9251
|
+
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
9599
9252
|
function FooterContainerChrome({
|
|
9600
9253
|
rect,
|
|
9601
9254
|
onAdd,
|
|
@@ -9603,7 +9256,7 @@ function FooterContainerChrome({
|
|
|
9603
9256
|
}) {
|
|
9604
9257
|
const chromeGap = 6;
|
|
9605
9258
|
const buttonMargin = 7;
|
|
9606
|
-
return /* @__PURE__ */ (0,
|
|
9259
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
9607
9260
|
"div",
|
|
9608
9261
|
{
|
|
9609
9262
|
"data-ohw-footer-container-chrome": "",
|
|
@@ -9615,8 +9268,8 @@ function FooterContainerChrome({
|
|
|
9615
9268
|
width: rect.width + chromeGap * 2,
|
|
9616
9269
|
height: rect.height + chromeGap * 2
|
|
9617
9270
|
},
|
|
9618
|
-
children: /* @__PURE__ */ (0,
|
|
9619
|
-
/* @__PURE__ */ (0,
|
|
9271
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(Tooltip, { children: [
|
|
9272
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
9620
9273
|
"button",
|
|
9621
9274
|
{
|
|
9622
9275
|
type: "button",
|
|
@@ -9635,17 +9288,17 @@ function FooterContainerChrome({
|
|
|
9635
9288
|
if (addDisabled) return;
|
|
9636
9289
|
onAdd();
|
|
9637
9290
|
},
|
|
9638
|
-
children: /* @__PURE__ */ (0,
|
|
9291
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react11.Plus, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
|
|
9639
9292
|
}
|
|
9640
9293
|
) }),
|
|
9641
|
-
/* @__PURE__ */ (0,
|
|
9294
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TooltipContent, { side: "bottom", sideOffset: 9, children: addDisabled ? "Maximum columns reached" : "Add item" })
|
|
9642
9295
|
] })
|
|
9643
9296
|
}
|
|
9644
9297
|
) });
|
|
9645
9298
|
}
|
|
9646
9299
|
|
|
9647
9300
|
// src/lib/carousel.ts
|
|
9648
|
-
var
|
|
9301
|
+
var import_react11 = require("react");
|
|
9649
9302
|
var CAROUSEL_ATTR = "data-ohw-carousel";
|
|
9650
9303
|
var CAROUSEL_VALUE_ATTR = "data-ohw-carousel-value";
|
|
9651
9304
|
var CAROUSEL_SLIDE_ATTR = "data-ohw-carousel-slide";
|
|
@@ -9707,8 +9360,8 @@ function applyCarouselNode(key, val) {
|
|
|
9707
9360
|
return true;
|
|
9708
9361
|
}
|
|
9709
9362
|
function useOhwCarousel(key, initial) {
|
|
9710
|
-
const [images, setImages] = (0,
|
|
9711
|
-
(0,
|
|
9363
|
+
const [images, setImages] = (0, import_react11.useState)(initial);
|
|
9364
|
+
(0, import_react11.useEffect)(() => {
|
|
9712
9365
|
const el = document.querySelector(
|
|
9713
9366
|
`[${CAROUSEL_ATTR}][data-ohw-key="${CSS.escape(key)}"]`
|
|
9714
9367
|
);
|
|
@@ -9743,13 +9396,10 @@ function getLinkHref3(el) {
|
|
|
9743
9396
|
const anchor = el instanceof HTMLAnchorElement ? el : el.querySelector("a");
|
|
9744
9397
|
return anchor?.getAttribute("href") ?? "";
|
|
9745
9398
|
}
|
|
9746
|
-
function collectEditableNodes(extraContent
|
|
9747
|
-
const
|
|
9748
|
-
|
|
9749
|
-
|
|
9750
|
-
editableEls.unshift(root);
|
|
9751
|
-
}
|
|
9752
|
-
const nodes = editableEls.map((el) => {
|
|
9399
|
+
function collectEditableNodes(extraContent) {
|
|
9400
|
+
const nodes = Array.from(
|
|
9401
|
+
document.querySelectorAll("[data-ohw-editable]")
|
|
9402
|
+
).map((el) => {
|
|
9753
9403
|
if (el.dataset.ohwEditable === "image") {
|
|
9754
9404
|
const img = el instanceof HTMLImageElement ? el : el.querySelector("img");
|
|
9755
9405
|
return { key: el.dataset.ohwKey ?? "", type: "image", text: img?.src ?? "" };
|
|
@@ -9771,16 +9421,12 @@ function collectEditableNodes(extraContent, root = document) {
|
|
|
9771
9421
|
text: el.dataset.ohwEditable === "plain" ? el.innerText ?? "" : el.innerHTML
|
|
9772
9422
|
};
|
|
9773
9423
|
});
|
|
9774
|
-
|
|
9775
|
-
if (isScoped && root instanceof HTMLElement && root.matches("[data-ohw-href-key]")) {
|
|
9776
|
-
hrefEls.unshift(root);
|
|
9777
|
-
}
|
|
9778
|
-
hrefEls.forEach((el) => {
|
|
9424
|
+
document.querySelectorAll("[data-ohw-href-key]").forEach((el) => {
|
|
9779
9425
|
const key = el.getAttribute("data-ohw-href-key") ?? "";
|
|
9780
9426
|
if (!key) return;
|
|
9781
9427
|
nodes.push({ key, type: "link", text: getLinkHref3(el) });
|
|
9782
9428
|
});
|
|
9783
|
-
if (extraContent
|
|
9429
|
+
if (extraContent) {
|
|
9784
9430
|
for (const key of [NAV_ORDER_KEY, FOOTER_ORDER_KEY, NAV_COUNT_KEY]) {
|
|
9785
9431
|
const text = extraContent[key];
|
|
9786
9432
|
if (typeof text === "string" && text.length > 0) {
|
|
@@ -9788,32 +9434,30 @@ function collectEditableNodes(extraContent, root = document) {
|
|
|
9788
9434
|
}
|
|
9789
9435
|
}
|
|
9790
9436
|
}
|
|
9791
|
-
|
|
9792
|
-
|
|
9793
|
-
|
|
9794
|
-
|
|
9795
|
-
|
|
9796
|
-
|
|
9797
|
-
|
|
9798
|
-
|
|
9799
|
-
text: String(video.autoplay)
|
|
9800
|
-
});
|
|
9801
|
-
nodes.push({
|
|
9802
|
-
key: `${key}${VIDEO_MUTED_SUFFIX}`,
|
|
9803
|
-
type: "video-setting",
|
|
9804
|
-
text: String(video.muted)
|
|
9805
|
-
});
|
|
9437
|
+
document.querySelectorAll('[data-ohw-editable="video"]').forEach((el) => {
|
|
9438
|
+
const key = el.dataset.ohwKey ?? "";
|
|
9439
|
+
const video = getVideoEl(el);
|
|
9440
|
+
if (!key || !video) return;
|
|
9441
|
+
nodes.push({
|
|
9442
|
+
key: `${key}${VIDEO_AUTOPLAY_SUFFIX}`,
|
|
9443
|
+
type: "video-setting",
|
|
9444
|
+
text: String(video.autoplay)
|
|
9806
9445
|
});
|
|
9807
|
-
|
|
9808
|
-
|
|
9809
|
-
|
|
9446
|
+
nodes.push({
|
|
9447
|
+
key: `${key}${VIDEO_MUTED_SUFFIX}`,
|
|
9448
|
+
type: "video-setting",
|
|
9449
|
+
text: String(video.muted)
|
|
9450
|
+
});
|
|
9451
|
+
});
|
|
9452
|
+
for (const key of listCarouselKeys()) {
|
|
9453
|
+
nodes.push({ key, type: "carousel", text: JSON.stringify(readCarouselValue(key)) });
|
|
9810
9454
|
}
|
|
9811
9455
|
const byKey = /* @__PURE__ */ new Map();
|
|
9812
9456
|
for (const node of nodes) {
|
|
9813
9457
|
if (!node.key) continue;
|
|
9814
9458
|
if (!byKey.has(node.key)) byKey.set(node.key, node);
|
|
9815
9459
|
}
|
|
9816
|
-
if (extraContent
|
|
9460
|
+
if (extraContent) {
|
|
9817
9461
|
applyNavFooterDeleteOverrides(byKey, extraContent);
|
|
9818
9462
|
}
|
|
9819
9463
|
return Array.from(byKey.values());
|
|
@@ -10063,14 +9707,14 @@ function deleteSelectedNavFooterItem(deps) {
|
|
|
10063
9707
|
}
|
|
10064
9708
|
|
|
10065
9709
|
// src/ui/navbar-container-chrome.tsx
|
|
10066
|
-
var
|
|
10067
|
-
var
|
|
9710
|
+
var import_lucide_react12 = require("lucide-react");
|
|
9711
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
10068
9712
|
function NavbarContainerChrome({
|
|
10069
9713
|
rect,
|
|
10070
9714
|
onAdd
|
|
10071
9715
|
}) {
|
|
10072
9716
|
const chromeGap = 6;
|
|
10073
|
-
return /* @__PURE__ */ (0,
|
|
9717
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
10074
9718
|
"div",
|
|
10075
9719
|
{
|
|
10076
9720
|
"data-ohw-navbar-container-chrome": "",
|
|
@@ -10082,7 +9726,7 @@ function NavbarContainerChrome({
|
|
|
10082
9726
|
width: rect.width + chromeGap * 2,
|
|
10083
9727
|
height: rect.height + chromeGap * 2
|
|
10084
9728
|
},
|
|
10085
|
-
children: /* @__PURE__ */ (0,
|
|
9729
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
10086
9730
|
"button",
|
|
10087
9731
|
{
|
|
10088
9732
|
type: "button",
|
|
@@ -10099,7 +9743,7 @@ function NavbarContainerChrome({
|
|
|
10099
9743
|
e.stopPropagation();
|
|
10100
9744
|
onAdd();
|
|
10101
9745
|
},
|
|
10102
|
-
children: /* @__PURE__ */ (0,
|
|
9746
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react12.Plus, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
|
|
10103
9747
|
}
|
|
10104
9748
|
)
|
|
10105
9749
|
}
|
|
@@ -10108,7 +9752,7 @@ function NavbarContainerChrome({
|
|
|
10108
9752
|
|
|
10109
9753
|
// src/ui/drop-indicator.tsx
|
|
10110
9754
|
var React9 = __toESM(require("react"), 1);
|
|
10111
|
-
var
|
|
9755
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
10112
9756
|
var dropIndicatorVariants = cva(
|
|
10113
9757
|
"ov-gap-line pointer-events-none shrink-0 transition-opacity duration-150",
|
|
10114
9758
|
{
|
|
@@ -10132,7 +9776,7 @@ var dropIndicatorVariants = cva(
|
|
|
10132
9776
|
);
|
|
10133
9777
|
var DropIndicator = React9.forwardRef(
|
|
10134
9778
|
({ className, direction, state, ...props }, ref) => {
|
|
10135
|
-
return /* @__PURE__ */ (0,
|
|
9779
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
10136
9780
|
"div",
|
|
10137
9781
|
{
|
|
10138
9782
|
ref,
|
|
@@ -10149,7 +9793,7 @@ var DropIndicator = React9.forwardRef(
|
|
|
10149
9793
|
DropIndicator.displayName = "DropIndicator";
|
|
10150
9794
|
|
|
10151
9795
|
// src/ui/badge.tsx
|
|
10152
|
-
var
|
|
9796
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
10153
9797
|
var badgeVariants = cva(
|
|
10154
9798
|
"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",
|
|
10155
9799
|
{
|
|
@@ -10167,13 +9811,13 @@ var badgeVariants = cva(
|
|
|
10167
9811
|
}
|
|
10168
9812
|
);
|
|
10169
9813
|
function Badge({ className, variant, ...props }) {
|
|
10170
|
-
return /* @__PURE__ */ (0,
|
|
9814
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: cn(badgeVariants({ variant }), className), ...props });
|
|
10171
9815
|
}
|
|
10172
9816
|
|
|
10173
9817
|
// src/OhhwellsBridge.tsx
|
|
10174
|
-
var
|
|
10175
|
-
var
|
|
10176
|
-
var
|
|
9818
|
+
var import_lucide_react13 = require("lucide-react");
|
|
9819
|
+
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
9820
|
+
var PRIMARY2 = "#0885FE";
|
|
10177
9821
|
var IMAGE_FADE_MS = 300;
|
|
10178
9822
|
function runOpacityFade(el, onDone) {
|
|
10179
9823
|
const anim = el.animate([{ opacity: 0 }, { opacity: 1 }], {
|
|
@@ -10351,7 +9995,7 @@ function mountSchedulingWidget(insertAfter, notifyOnConnect = false, scheduleId,
|
|
|
10351
9995
|
const root = (0, import_client.createRoot)(container);
|
|
10352
9996
|
(0, import_react_dom2.flushSync)(() => {
|
|
10353
9997
|
root.render(
|
|
10354
|
-
/* @__PURE__ */ (0,
|
|
9998
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
10355
9999
|
SchedulingWidget,
|
|
10356
10000
|
{
|
|
10357
10001
|
notifyOnConnect,
|
|
@@ -10426,10 +10070,6 @@ function syncNavigationDragCursorAttrs() {
|
|
|
10426
10070
|
el.setAttribute("data-ohw-can-drag", "");
|
|
10427
10071
|
});
|
|
10428
10072
|
}
|
|
10429
|
-
var AI_NODE_TYPES = /* @__PURE__ */ new Set(["image", "bg-image", "video", "link", "plain", "text/rich", "text"]);
|
|
10430
|
-
function normalizeAiNodeType(type) {
|
|
10431
|
-
return AI_NODE_TYPES.has(type) ? type : "text";
|
|
10432
|
-
}
|
|
10433
10073
|
function isMediaEditable(el) {
|
|
10434
10074
|
const t = el.dataset.ohwEditable;
|
|
10435
10075
|
return t === "image" || t === "bg-image" || t === "video";
|
|
@@ -10722,7 +10362,7 @@ function getNavigationSelectionParent(el) {
|
|
|
10722
10362
|
if (!isFooterLinksContainer(el) && (el.hasAttribute("data-ohw-footer-col") || el.hasAttribute("data-ohw-footer-column") || isInferredFooterGroup2(el))) {
|
|
10723
10363
|
return getFooterLinksContainer();
|
|
10724
10364
|
}
|
|
10725
|
-
if (el.hasAttribute("data-ohw-nav-container") || el.hasAttribute("data-ohw-nav-drawer") ||
|
|
10365
|
+
if (el.hasAttribute("data-ohw-nav-container") || el.hasAttribute("data-ohw-nav-drawer") || isFooterLinksContainer(el)) {
|
|
10726
10366
|
return getNavigationRoot(el);
|
|
10727
10367
|
}
|
|
10728
10368
|
return null;
|
|
@@ -10961,7 +10601,7 @@ function EditGlowChrome({
|
|
|
10961
10601
|
hideHandle = false
|
|
10962
10602
|
}) {
|
|
10963
10603
|
const GAP = SELECTION_CHROME_GAP2;
|
|
10964
|
-
return /* @__PURE__ */ (0,
|
|
10604
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
|
|
10965
10605
|
"div",
|
|
10966
10606
|
{
|
|
10967
10607
|
ref: elRef,
|
|
@@ -10976,7 +10616,7 @@ function EditGlowChrome({
|
|
|
10976
10616
|
zIndex: 2147483646
|
|
10977
10617
|
},
|
|
10978
10618
|
children: [
|
|
10979
|
-
/* @__PURE__ */ (0,
|
|
10619
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
10980
10620
|
"div",
|
|
10981
10621
|
{
|
|
10982
10622
|
style: {
|
|
@@ -10989,7 +10629,7 @@ function EditGlowChrome({
|
|
|
10989
10629
|
}
|
|
10990
10630
|
}
|
|
10991
10631
|
),
|
|
10992
|
-
reorderHrefKey && !hideHandle && /* @__PURE__ */ (0,
|
|
10632
|
+
reorderHrefKey && !hideHandle && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
10993
10633
|
"div",
|
|
10994
10634
|
{
|
|
10995
10635
|
"data-ohw-drag-handle-container": "",
|
|
@@ -11001,7 +10641,7 @@ function EditGlowChrome({
|
|
|
11001
10641
|
transform: "translate(calc(-100% - 7px), -50%)",
|
|
11002
10642
|
pointerEvents: dragDisabled ? "none" : "auto"
|
|
11003
10643
|
},
|
|
11004
|
-
children: /* @__PURE__ */ (0,
|
|
10644
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
11005
10645
|
DragHandle,
|
|
11006
10646
|
{
|
|
11007
10647
|
"aria-label": `Reorder ${reorderHrefKey}`,
|
|
@@ -11184,9 +10824,9 @@ function FloatingToolbar({
|
|
|
11184
10824
|
showEditLink,
|
|
11185
10825
|
onEditLink
|
|
11186
10826
|
}) {
|
|
11187
|
-
const localRef =
|
|
11188
|
-
const [measuredW, setMeasuredW] =
|
|
11189
|
-
const setRefs =
|
|
10827
|
+
const localRef = import_react12.default.useRef(null);
|
|
10828
|
+
const [measuredW, setMeasuredW] = import_react12.default.useState(330);
|
|
10829
|
+
const setRefs = import_react12.default.useCallback(
|
|
11190
10830
|
(node) => {
|
|
11191
10831
|
localRef.current = node;
|
|
11192
10832
|
if (typeof elRef === "function") elRef(node);
|
|
@@ -11198,7 +10838,7 @@ function FloatingToolbar({
|
|
|
11198
10838
|
},
|
|
11199
10839
|
[elRef]
|
|
11200
10840
|
);
|
|
11201
|
-
|
|
10841
|
+
import_react12.default.useLayoutEffect(() => {
|
|
11202
10842
|
const node = localRef.current;
|
|
11203
10843
|
if (!node) return;
|
|
11204
10844
|
const update = () => {
|
|
@@ -11211,7 +10851,7 @@ function FloatingToolbar({
|
|
|
11211
10851
|
return () => ro.disconnect();
|
|
11212
10852
|
}, [showEditLink, activeCommands]);
|
|
11213
10853
|
const { top, left, transform } = calcToolbarPos(rect, parentScroll, measuredW);
|
|
11214
|
-
return /* @__PURE__ */ (0,
|
|
10854
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
11215
10855
|
"div",
|
|
11216
10856
|
{
|
|
11217
10857
|
ref: setRefs,
|
|
@@ -11223,12 +10863,12 @@ function FloatingToolbar({
|
|
|
11223
10863
|
zIndex: 2147483647,
|
|
11224
10864
|
pointerEvents: "auto"
|
|
11225
10865
|
},
|
|
11226
|
-
children: /* @__PURE__ */ (0,
|
|
11227
|
-
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ (0,
|
|
11228
|
-
gi > 0 && /* @__PURE__ */ (0,
|
|
10866
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(CustomToolbar, { children: [
|
|
10867
|
+
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react12.default.Fragment, { children: [
|
|
10868
|
+
gi > 0 && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(CustomToolbarDivider, {}),
|
|
11229
10869
|
btns.map((btn) => {
|
|
11230
10870
|
const isActive = activeCommands.has(btn.cmd);
|
|
11231
|
-
return /* @__PURE__ */ (0,
|
|
10871
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
11232
10872
|
CustomToolbarButton,
|
|
11233
10873
|
{
|
|
11234
10874
|
title: btn.title,
|
|
@@ -11237,7 +10877,7 @@ function FloatingToolbar({
|
|
|
11237
10877
|
e.preventDefault();
|
|
11238
10878
|
onCommand(btn.cmd);
|
|
11239
10879
|
},
|
|
11240
|
-
children: /* @__PURE__ */ (0,
|
|
10880
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
11241
10881
|
"svg",
|
|
11242
10882
|
{
|
|
11243
10883
|
width: "16",
|
|
@@ -11258,7 +10898,7 @@ function FloatingToolbar({
|
|
|
11258
10898
|
);
|
|
11259
10899
|
})
|
|
11260
10900
|
] }, gi)),
|
|
11261
|
-
showEditLink ? /* @__PURE__ */ (0,
|
|
10901
|
+
showEditLink ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
11262
10902
|
CustomToolbarButton,
|
|
11263
10903
|
{
|
|
11264
10904
|
type: "button",
|
|
@@ -11272,7 +10912,7 @@ function FloatingToolbar({
|
|
|
11272
10912
|
e.preventDefault();
|
|
11273
10913
|
e.stopPropagation();
|
|
11274
10914
|
},
|
|
11275
|
-
children: /* @__PURE__ */ (0,
|
|
10915
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_lucide_react13.Link, { className: "size-4 shrink-0", "aria-hidden": true })
|
|
11276
10916
|
}
|
|
11277
10917
|
) : null
|
|
11278
10918
|
] })
|
|
@@ -11289,7 +10929,7 @@ function StateToggle({
|
|
|
11289
10929
|
states,
|
|
11290
10930
|
onStateChange
|
|
11291
10931
|
}) {
|
|
11292
|
-
return /* @__PURE__ */ (0,
|
|
10932
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
11293
10933
|
ToggleGroup,
|
|
11294
10934
|
{
|
|
11295
10935
|
"data-ohw-state-toggle": "",
|
|
@@ -11303,7 +10943,7 @@ function StateToggle({
|
|
|
11303
10943
|
left: rect.right - 8,
|
|
11304
10944
|
transform: "translateX(-100%)"
|
|
11305
10945
|
},
|
|
11306
|
-
children: states.map((state) => /* @__PURE__ */ (0,
|
|
10946
|
+
children: states.map((state) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ToggleGroupItem, { value: state, size: "sm", children: state }, state))
|
|
11307
10947
|
}
|
|
11308
10948
|
);
|
|
11309
10949
|
}
|
|
@@ -11330,8 +10970,8 @@ function OhhwellsBridge() {
|
|
|
11330
10970
|
const router = (0, import_navigation2.useRouter)();
|
|
11331
10971
|
const searchParams = (0, import_navigation2.useSearchParams)();
|
|
11332
10972
|
const isEditMode = isEditSessionActive();
|
|
11333
|
-
const [bridgeRoot, setBridgeRoot] = (0,
|
|
11334
|
-
(0,
|
|
10973
|
+
const [bridgeRoot, setBridgeRoot] = (0, import_react12.useState)(null);
|
|
10974
|
+
(0, import_react12.useEffect)(() => {
|
|
11335
10975
|
const figtreeFontId = "ohw-figtree-font";
|
|
11336
10976
|
if (!document.getElementById(figtreeFontId)) {
|
|
11337
10977
|
const preconnect1 = Object.assign(document.createElement("link"), { rel: "preconnect", href: "https://fonts.googleapis.com" });
|
|
@@ -11359,107 +10999,106 @@ function OhhwellsBridge() {
|
|
|
11359
10999
|
const subdomainFromQuery = searchParams.get("subdomain");
|
|
11360
11000
|
const subdomain = resolveSubdomain(subdomainFromQuery);
|
|
11361
11001
|
useLinkHrefGuardian(pathname, subdomain, isEditMode);
|
|
11362
|
-
const postToParent2 = (0,
|
|
11002
|
+
const postToParent2 = (0, import_react12.useCallback)((data) => {
|
|
11363
11003
|
if (typeof window !== "undefined" && window.parent !== window) {
|
|
11364
11004
|
window.parent.postMessage(data, "*");
|
|
11365
11005
|
}
|
|
11366
11006
|
}, []);
|
|
11367
|
-
const [fetchState, setFetchState] = (0,
|
|
11368
|
-
const autoSaveTimers = (0,
|
|
11369
|
-
const activeElRef = (0,
|
|
11370
|
-
const pointerHeldRef = (0,
|
|
11371
|
-
const selectedElRef = (0,
|
|
11372
|
-
const selectedHrefKeyRef = (0,
|
|
11373
|
-
const selectedFooterColAttrRef = (0,
|
|
11374
|
-
const originalContentRef = (0,
|
|
11375
|
-
const activeStateElRef = (0,
|
|
11376
|
-
const parentScrollRef = (0,
|
|
11377
|
-
const visibleViewportRef = (0,
|
|
11378
|
-
const [dialogPortalContainer, setDialogPortalContainer] = (0,
|
|
11379
|
-
const attachVisibleViewport = (0,
|
|
11007
|
+
const [fetchState, setFetchState] = (0, import_react12.useState)("idle");
|
|
11008
|
+
const autoSaveTimers = (0, import_react12.useRef)(/* @__PURE__ */ new Map());
|
|
11009
|
+
const activeElRef = (0, import_react12.useRef)(null);
|
|
11010
|
+
const pointerHeldRef = (0, import_react12.useRef)(false);
|
|
11011
|
+
const selectedElRef = (0, import_react12.useRef)(null);
|
|
11012
|
+
const selectedHrefKeyRef = (0, import_react12.useRef)(null);
|
|
11013
|
+
const selectedFooterColAttrRef = (0, import_react12.useRef)(null);
|
|
11014
|
+
const originalContentRef = (0, import_react12.useRef)(null);
|
|
11015
|
+
const activeStateElRef = (0, import_react12.useRef)(null);
|
|
11016
|
+
const parentScrollRef = (0, import_react12.useRef)(null);
|
|
11017
|
+
const visibleViewportRef = (0, import_react12.useRef)(null);
|
|
11018
|
+
const [dialogPortalContainer, setDialogPortalContainer] = (0, import_react12.useState)(null);
|
|
11019
|
+
const attachVisibleViewport = (0, import_react12.useCallback)((node) => {
|
|
11380
11020
|
visibleViewportRef.current = node;
|
|
11381
11021
|
setDialogPortalContainer(node);
|
|
11382
11022
|
if (node) applyVisibleViewport(node, parentScrollRef.current);
|
|
11383
11023
|
}, []);
|
|
11384
|
-
const toolbarElRef = (0,
|
|
11385
|
-
const glowElRef = (0,
|
|
11386
|
-
const hoveredImageRef = (0,
|
|
11387
|
-
const hoveredImageHasTextOverlapRef = (0,
|
|
11388
|
-
const dragOverElRef = (0,
|
|
11389
|
-
const [mediaHover, setMediaHover] = (0,
|
|
11390
|
-
const [carouselHover, setCarouselHover] = (0,
|
|
11391
|
-
const [uploadingRects, setUploadingRects] = (0,
|
|
11392
|
-
const hoveredGapRef = (0,
|
|
11393
|
-
const imageUnhoverTimerRef = (0,
|
|
11394
|
-
const imageShowTimerRef = (0,
|
|
11395
|
-
const editStylesRef = (0,
|
|
11396
|
-
const activateRef = (0,
|
|
11024
|
+
const toolbarElRef = (0, import_react12.useRef)(null);
|
|
11025
|
+
const glowElRef = (0, import_react12.useRef)(null);
|
|
11026
|
+
const hoveredImageRef = (0, import_react12.useRef)(null);
|
|
11027
|
+
const hoveredImageHasTextOverlapRef = (0, import_react12.useRef)(false);
|
|
11028
|
+
const dragOverElRef = (0, import_react12.useRef)(null);
|
|
11029
|
+
const [mediaHover, setMediaHover] = (0, import_react12.useState)(null);
|
|
11030
|
+
const [carouselHover, setCarouselHover] = (0, import_react12.useState)(null);
|
|
11031
|
+
const [uploadingRects, setUploadingRects] = (0, import_react12.useState)({});
|
|
11032
|
+
const hoveredGapRef = (0, import_react12.useRef)(null);
|
|
11033
|
+
const imageUnhoverTimerRef = (0, import_react12.useRef)(null);
|
|
11034
|
+
const imageShowTimerRef = (0, import_react12.useRef)(null);
|
|
11035
|
+
const editStylesRef = (0, import_react12.useRef)(null);
|
|
11036
|
+
const activateRef = (0, import_react12.useRef)(() => {
|
|
11397
11037
|
});
|
|
11398
|
-
const deactivateRef = (0,
|
|
11038
|
+
const deactivateRef = (0, import_react12.useRef)(() => {
|
|
11399
11039
|
});
|
|
11400
|
-
const selectRef = (0,
|
|
11040
|
+
const selectRef = (0, import_react12.useRef)(() => {
|
|
11401
11041
|
});
|
|
11402
|
-
const selectFrameRef = (0,
|
|
11042
|
+
const selectFrameRef = (0, import_react12.useRef)(() => {
|
|
11403
11043
|
});
|
|
11404
|
-
const deselectRef = (0,
|
|
11044
|
+
const deselectRef = (0, import_react12.useRef)(() => {
|
|
11405
11045
|
});
|
|
11406
|
-
const reselectNavigationItemRef = (0,
|
|
11046
|
+
const reselectNavigationItemRef = (0, import_react12.useRef)(() => {
|
|
11407
11047
|
});
|
|
11408
|
-
const commitNavigationTextEditRef = (0,
|
|
11048
|
+
const commitNavigationTextEditRef = (0, import_react12.useRef)(() => {
|
|
11409
11049
|
});
|
|
11410
|
-
const handleDeleteSelectedRef = (0,
|
|
11411
|
-
const runPendingDeleteUndoRef = (0,
|
|
11412
|
-
const isFooterFrameSelectionRef = (0,
|
|
11413
|
-
const refreshActiveCommandsRef = (0,
|
|
11050
|
+
const handleDeleteSelectedRef = (0, import_react12.useRef)(() => false);
|
|
11051
|
+
const runPendingDeleteUndoRef = (0, import_react12.useRef)(() => false);
|
|
11052
|
+
const isFooterFrameSelectionRef = (0, import_react12.useRef)(false);
|
|
11053
|
+
const refreshActiveCommandsRef = (0, import_react12.useRef)(() => {
|
|
11414
11054
|
});
|
|
11415
|
-
const postToParentRef = (0,
|
|
11055
|
+
const postToParentRef = (0, import_react12.useRef)(postToParent2);
|
|
11416
11056
|
postToParentRef.current = postToParent2;
|
|
11417
|
-
const
|
|
11418
|
-
const
|
|
11419
|
-
const
|
|
11420
|
-
const [
|
|
11421
|
-
const
|
|
11422
|
-
const toolbarVariantRef = (0, import_react13.useRef)("none");
|
|
11057
|
+
const sectionsLoadedRef = (0, import_react12.useRef)(false);
|
|
11058
|
+
const pendingScheduleConfigRequests = (0, import_react12.useRef)([]);
|
|
11059
|
+
const [toolbarRect, setToolbarRect] = (0, import_react12.useState)(null);
|
|
11060
|
+
const [toolbarVariant, setToolbarVariant] = (0, import_react12.useState)("none");
|
|
11061
|
+
const toolbarVariantRef = (0, import_react12.useRef)("none");
|
|
11423
11062
|
toolbarVariantRef.current = toolbarVariant;
|
|
11424
|
-
const [selectedIsCta, setSelectedIsCta] = (0,
|
|
11425
|
-
const [reorderHrefKey, setReorderHrefKey] = (0,
|
|
11426
|
-
const [reorderDragDisabled, setReorderDragDisabled] = (0,
|
|
11427
|
-
const [toggleState, setToggleState] = (0,
|
|
11428
|
-
const [maxBadge, setMaxBadge] = (0,
|
|
11429
|
-
const [activeCommands, setActiveCommands] = (0,
|
|
11430
|
-
const [sectionGap, setSectionGap] = (0,
|
|
11431
|
-
const [toolbarShowEditLink, setToolbarShowEditLink] = (0,
|
|
11432
|
-
const hoveredNavContainerRef = (0,
|
|
11433
|
-
const [hoveredNavContainerRect, setHoveredNavContainerRect] = (0,
|
|
11434
|
-
const hoveredItemElRef = (0,
|
|
11435
|
-
const [hoveredItemRect, setHoveredItemRect] = (0,
|
|
11436
|
-
const siblingHintElRef = (0,
|
|
11437
|
-
const [siblingHintRect, setSiblingHintRect] = (0,
|
|
11438
|
-
const [siblingHintRects, setSiblingHintRects] = (0,
|
|
11439
|
-
const [isItemDragging, setIsItemDragging] = (0,
|
|
11440
|
-
const [isFooterFrameSelection, setIsFooterFrameSelection] = (0,
|
|
11063
|
+
const [selectedIsCta, setSelectedIsCta] = (0, import_react12.useState)(false);
|
|
11064
|
+
const [reorderHrefKey, setReorderHrefKey] = (0, import_react12.useState)(null);
|
|
11065
|
+
const [reorderDragDisabled, setReorderDragDisabled] = (0, import_react12.useState)(false);
|
|
11066
|
+
const [toggleState, setToggleState] = (0, import_react12.useState)(null);
|
|
11067
|
+
const [maxBadge, setMaxBadge] = (0, import_react12.useState)(null);
|
|
11068
|
+
const [activeCommands, setActiveCommands] = (0, import_react12.useState)(/* @__PURE__ */ new Set());
|
|
11069
|
+
const [sectionGap, setSectionGap] = (0, import_react12.useState)(null);
|
|
11070
|
+
const [toolbarShowEditLink, setToolbarShowEditLink] = (0, import_react12.useState)(false);
|
|
11071
|
+
const hoveredNavContainerRef = (0, import_react12.useRef)(null);
|
|
11072
|
+
const [hoveredNavContainerRect, setHoveredNavContainerRect] = (0, import_react12.useState)(null);
|
|
11073
|
+
const hoveredItemElRef = (0, import_react12.useRef)(null);
|
|
11074
|
+
const [hoveredItemRect, setHoveredItemRect] = (0, import_react12.useState)(null);
|
|
11075
|
+
const siblingHintElRef = (0, import_react12.useRef)(null);
|
|
11076
|
+
const [siblingHintRect, setSiblingHintRect] = (0, import_react12.useState)(null);
|
|
11077
|
+
const [siblingHintRects, setSiblingHintRects] = (0, import_react12.useState)([]);
|
|
11078
|
+
const [isItemDragging, setIsItemDragging] = (0, import_react12.useState)(false);
|
|
11079
|
+
const [isFooterFrameSelection, setIsFooterFrameSelection] = (0, import_react12.useState)(false);
|
|
11441
11080
|
isFooterFrameSelectionRef.current = isFooterFrameSelection;
|
|
11442
|
-
const [navDropdownPreviewOpen, setNavDropdownPreviewOpen] = (0,
|
|
11443
|
-
const [footerHeadingVisible, setFooterHeadingVisible] = (0,
|
|
11444
|
-
const footerDragRef = (0,
|
|
11445
|
-
const [footerDropSlots, setFooterDropSlots] = (0,
|
|
11446
|
-
const [activeFooterDropIndex, setActiveFooterDropIndex] = (0,
|
|
11447
|
-
const [draggedItemRect, setDraggedItemRect] = (0,
|
|
11448
|
-
const footerPointerDragRef = (0,
|
|
11449
|
-
const suppressNextClickRef = (0,
|
|
11450
|
-
const suppressClickUntilRef = (0,
|
|
11451
|
-
const [linkPopover, setLinkPopover] = (0,
|
|
11452
|
-
const linkPopoverSessionRef = (0,
|
|
11453
|
-
const addNavAfterAnchorRef = (0,
|
|
11454
|
-
const editContentRef = (0,
|
|
11455
|
-
const pendingDeleteUndoRef = (0,
|
|
11456
|
-
const [sitePages, setSitePages] = (0,
|
|
11457
|
-
const [sectionsByPath, setSectionsByPath] = (0,
|
|
11458
|
-
const sectionsPrefetchGenRef = (0,
|
|
11459
|
-
const setLinkPopoverRef = (0,
|
|
11460
|
-
const linkPopoverPanelRef = (0,
|
|
11461
|
-
const linkPopoverOpenRef = (0,
|
|
11462
|
-
const linkPopoverGraceUntilRef = (0,
|
|
11081
|
+
const [navDropdownPreviewOpen, setNavDropdownPreviewOpen] = (0, import_react12.useState)(null);
|
|
11082
|
+
const [footerHeadingVisible, setFooterHeadingVisible] = (0, import_react12.useState)(null);
|
|
11083
|
+
const footerDragRef = (0, import_react12.useRef)(null);
|
|
11084
|
+
const [footerDropSlots, setFooterDropSlots] = (0, import_react12.useState)([]);
|
|
11085
|
+
const [activeFooterDropIndex, setActiveFooterDropIndex] = (0, import_react12.useState)(null);
|
|
11086
|
+
const [draggedItemRect, setDraggedItemRect] = (0, import_react12.useState)(null);
|
|
11087
|
+
const footerPointerDragRef = (0, import_react12.useRef)(null);
|
|
11088
|
+
const suppressNextClickRef = (0, import_react12.useRef)(false);
|
|
11089
|
+
const suppressClickUntilRef = (0, import_react12.useRef)(0);
|
|
11090
|
+
const [linkPopover, setLinkPopover] = (0, import_react12.useState)(null);
|
|
11091
|
+
const linkPopoverSessionRef = (0, import_react12.useRef)(null);
|
|
11092
|
+
const addNavAfterAnchorRef = (0, import_react12.useRef)(null);
|
|
11093
|
+
const editContentRef = (0, import_react12.useRef)({});
|
|
11094
|
+
const pendingDeleteUndoRef = (0, import_react12.useRef)(null);
|
|
11095
|
+
const [sitePages, setSitePages] = (0, import_react12.useState)([]);
|
|
11096
|
+
const [sectionsByPath, setSectionsByPath] = (0, import_react12.useState)({});
|
|
11097
|
+
const sectionsPrefetchGenRef = (0, import_react12.useRef)(0);
|
|
11098
|
+
const setLinkPopoverRef = (0, import_react12.useRef)(setLinkPopover);
|
|
11099
|
+
const linkPopoverPanelRef = (0, import_react12.useRef)(null);
|
|
11100
|
+
const linkPopoverOpenRef = (0, import_react12.useRef)(false);
|
|
11101
|
+
const linkPopoverGraceUntilRef = (0, import_react12.useRef)(0);
|
|
11463
11102
|
setLinkPopoverRef.current = setLinkPopover;
|
|
11464
11103
|
linkPopoverSessionRef.current = linkPopover;
|
|
11465
11104
|
const {
|
|
@@ -11498,7 +11137,7 @@ function OhhwellsBridge() {
|
|
|
11498
11137
|
const bumpLinkPopoverGrace = () => {
|
|
11499
11138
|
linkPopoverGraceUntilRef.current = Date.now() + 350;
|
|
11500
11139
|
};
|
|
11501
|
-
const runSectionsPrefetch = (0,
|
|
11140
|
+
const runSectionsPrefetch = (0, import_react12.useCallback)((pages) => {
|
|
11502
11141
|
if (!isEditMode || shouldUseDevFixtures() || pages.length === 0) return;
|
|
11503
11142
|
const gen = ++sectionsPrefetchGenRef.current;
|
|
11504
11143
|
const paths = pages.map((p) => p.path);
|
|
@@ -11517,9 +11156,9 @@ function OhhwellsBridge() {
|
|
|
11517
11156
|
);
|
|
11518
11157
|
});
|
|
11519
11158
|
}, [isEditMode, pathname]);
|
|
11520
|
-
const runSectionsPrefetchRef = (0,
|
|
11159
|
+
const runSectionsPrefetchRef = (0, import_react12.useRef)(runSectionsPrefetch);
|
|
11521
11160
|
runSectionsPrefetchRef.current = runSectionsPrefetch;
|
|
11522
|
-
(0,
|
|
11161
|
+
(0, import_react12.useEffect)(() => {
|
|
11523
11162
|
if (!linkPopover) {
|
|
11524
11163
|
document.documentElement.removeAttribute("data-ohw-link-popover-open");
|
|
11525
11164
|
return;
|
|
@@ -11547,7 +11186,7 @@ function OhhwellsBridge() {
|
|
|
11547
11186
|
document.documentElement.removeAttribute("data-ohw-link-popover-open");
|
|
11548
11187
|
};
|
|
11549
11188
|
}, [linkPopover, postToParent2]);
|
|
11550
|
-
(0,
|
|
11189
|
+
(0, import_react12.useEffect)(() => {
|
|
11551
11190
|
if (!isEditMode) return;
|
|
11552
11191
|
const useFixtures = shouldUseDevFixtures();
|
|
11553
11192
|
if (useFixtures) {
|
|
@@ -11571,14 +11210,14 @@ function OhhwellsBridge() {
|
|
|
11571
11210
|
if (!useFixtures) postToParent2({ type: "ow:request-site-pages" });
|
|
11572
11211
|
return () => window.removeEventListener("message", onSitePages);
|
|
11573
11212
|
}, [isEditMode, postToParent2]);
|
|
11574
|
-
(0,
|
|
11213
|
+
(0, import_react12.useEffect)(() => {
|
|
11575
11214
|
if (!isEditMode || shouldUseDevFixtures()) return;
|
|
11576
11215
|
void loadAllSectionsManifest().then((manifest) => {
|
|
11577
11216
|
if (Object.keys(manifest).length === 0) return;
|
|
11578
11217
|
setSectionsByPath((prev) => ({ ...manifest, ...prev }));
|
|
11579
11218
|
});
|
|
11580
11219
|
}, [isEditMode]);
|
|
11581
|
-
(0,
|
|
11220
|
+
(0, import_react12.useEffect)(() => {
|
|
11582
11221
|
const update = () => {
|
|
11583
11222
|
const el = activeElRef.current ?? selectedElRef.current;
|
|
11584
11223
|
if (el) setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
@@ -11602,10 +11241,10 @@ function OhhwellsBridge() {
|
|
|
11602
11241
|
vvp.removeEventListener("resize", update);
|
|
11603
11242
|
};
|
|
11604
11243
|
}, []);
|
|
11605
|
-
const refreshStateRules = (0,
|
|
11244
|
+
const refreshStateRules = (0, import_react12.useCallback)(() => {
|
|
11606
11245
|
editStylesRef.current?.forceHover && (editStylesRef.current.forceHover.textContent = collectStateRules());
|
|
11607
11246
|
}, []);
|
|
11608
|
-
const processConfigRequest = (0,
|
|
11247
|
+
const processConfigRequest = (0, import_react12.useCallback)((insertAfterVal) => {
|
|
11609
11248
|
const tracker = getSectionsTracker();
|
|
11610
11249
|
let entries = [];
|
|
11611
11250
|
try {
|
|
@@ -11628,7 +11267,7 @@ function OhhwellsBridge() {
|
|
|
11628
11267
|
}
|
|
11629
11268
|
window.postMessage({ type: "ow:schedule-config", insertAfter: insertAfterVal, scheduleId: null }, "*");
|
|
11630
11269
|
}, [isEditMode]);
|
|
11631
|
-
const deactivate = (0,
|
|
11270
|
+
const deactivate = (0, import_react12.useCallback)(() => {
|
|
11632
11271
|
const el = activeElRef.current;
|
|
11633
11272
|
if (!el) return;
|
|
11634
11273
|
const key = el.dataset.ohwKey;
|
|
@@ -11661,12 +11300,12 @@ function OhhwellsBridge() {
|
|
|
11661
11300
|
setToolbarShowEditLink(false);
|
|
11662
11301
|
postToParent2({ type: "ow:exit-edit" });
|
|
11663
11302
|
}, [postToParent2]);
|
|
11664
|
-
const clearSelectedAttr = (0,
|
|
11303
|
+
const clearSelectedAttr = (0, import_react12.useCallback)(() => {
|
|
11665
11304
|
document.querySelectorAll("[data-ohw-selected]").forEach((el) => {
|
|
11666
11305
|
el.removeAttribute("data-ohw-selected");
|
|
11667
11306
|
});
|
|
11668
11307
|
}, []);
|
|
11669
|
-
const deselect = (0,
|
|
11308
|
+
const deselect = (0, import_react12.useCallback)(() => {
|
|
11670
11309
|
clearSelectedAttr();
|
|
11671
11310
|
selectedElRef.current = null;
|
|
11672
11311
|
selectedHrefKeyRef.current = null;
|
|
@@ -11683,19 +11322,17 @@ function OhhwellsBridge() {
|
|
|
11683
11322
|
setIsItemDragging(false);
|
|
11684
11323
|
hoveredNavContainerRef.current = null;
|
|
11685
11324
|
setHoveredNavContainerRect(null);
|
|
11686
|
-
hoveredItemElRef.current = null;
|
|
11687
|
-
setHoveredItemRect(null);
|
|
11688
11325
|
if (!activeElRef.current) {
|
|
11689
11326
|
setNavGroupForceOpen(null, false);
|
|
11690
11327
|
setToolbarRect(null);
|
|
11691
11328
|
setToolbarVariant("none");
|
|
11692
11329
|
}
|
|
11693
11330
|
}, [clearSelectedAttr]);
|
|
11694
|
-
const markSelected = (0,
|
|
11331
|
+
const markSelected = (0, import_react12.useCallback)((el) => {
|
|
11695
11332
|
clearSelectedAttr();
|
|
11696
11333
|
el.setAttribute("data-ohw-selected", "");
|
|
11697
11334
|
}, [clearSelectedAttr]);
|
|
11698
|
-
const resolveHrefKeyElement = (0,
|
|
11335
|
+
const resolveHrefKeyElement = (0, import_react12.useCallback)((hrefKey) => {
|
|
11699
11336
|
if (isFooterHrefKey(hrefKey)) {
|
|
11700
11337
|
return document.querySelector(
|
|
11701
11338
|
`footer [data-ohw-href-key="${CSS.escape(hrefKey)}"]`
|
|
@@ -11710,7 +11347,7 @@ function OhhwellsBridge() {
|
|
|
11710
11347
|
`[data-ohw-href-key="${CSS.escape(hrefKey)}"]`
|
|
11711
11348
|
);
|
|
11712
11349
|
}, []);
|
|
11713
|
-
const resyncSelectedNavigationItem = (0,
|
|
11350
|
+
const resyncSelectedNavigationItem = (0, import_react12.useCallback)(() => {
|
|
11714
11351
|
const hrefKey = selectedHrefKeyRef.current;
|
|
11715
11352
|
if (hrefKey) {
|
|
11716
11353
|
const link = resolveHrefKeyElement(hrefKey);
|
|
@@ -11748,7 +11385,7 @@ function OhhwellsBridge() {
|
|
|
11748
11385
|
);
|
|
11749
11386
|
}
|
|
11750
11387
|
}, [resolveHrefKeyElement]);
|
|
11751
|
-
const reselectNavigationItem = (0,
|
|
11388
|
+
const reselectNavigationItem = (0, import_react12.useCallback)((navAnchor) => {
|
|
11752
11389
|
selectedElRef.current = navAnchor;
|
|
11753
11390
|
selectedHrefKeyRef.current = navAnchor.getAttribute("data-ohw-href-key");
|
|
11754
11391
|
selectedFooterColAttrRef.current = null;
|
|
@@ -11777,7 +11414,7 @@ function OhhwellsBridge() {
|
|
|
11777
11414
|
setToolbarShowEditLink(false);
|
|
11778
11415
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
11779
11416
|
}, [markSelected]);
|
|
11780
|
-
const commitNavigationTextEdit = (0,
|
|
11417
|
+
const commitNavigationTextEdit = (0, import_react12.useCallback)((navAnchor) => {
|
|
11781
11418
|
const el = activeElRef.current;
|
|
11782
11419
|
if (!el) return;
|
|
11783
11420
|
const key = el.dataset.ohwKey;
|
|
@@ -11804,7 +11441,7 @@ function OhhwellsBridge() {
|
|
|
11804
11441
|
postToParent2({ type: "ow:exit-edit" });
|
|
11805
11442
|
reselectNavigationItem(navAnchor);
|
|
11806
11443
|
}, [postToParent2, reselectNavigationItem]);
|
|
11807
|
-
const handleAddTopLevelNavItem = (0,
|
|
11444
|
+
const handleAddTopLevelNavItem = (0, import_react12.useCallback)(() => {
|
|
11808
11445
|
const items = listNavbarRootItems();
|
|
11809
11446
|
addNavAfterAnchorRef.current = items[items.length - 1] ?? null;
|
|
11810
11447
|
deselectRef.current();
|
|
@@ -11816,7 +11453,7 @@ function OhhwellsBridge() {
|
|
|
11816
11453
|
intent: "add-nav"
|
|
11817
11454
|
});
|
|
11818
11455
|
}, []);
|
|
11819
|
-
const maybeWarnNavLinkDropdownConflict = (0,
|
|
11456
|
+
const maybeWarnNavLinkDropdownConflict = (0, import_react12.useCallback)(
|
|
11820
11457
|
(anchor) => {
|
|
11821
11458
|
if (!isNavbarHrefKey(anchor.getAttribute("data-ohw-href-key"))) return;
|
|
11822
11459
|
if (!navDropdownsOpenOnClick()) return;
|
|
@@ -11829,7 +11466,7 @@ function OhhwellsBridge() {
|
|
|
11829
11466
|
},
|
|
11830
11467
|
[postToParent2]
|
|
11831
11468
|
);
|
|
11832
|
-
const handleNavDropdownOpenChange = (0,
|
|
11469
|
+
const handleNavDropdownOpenChange = (0, import_react12.useCallback)((open) => {
|
|
11833
11470
|
const selected = selectedElRef.current;
|
|
11834
11471
|
if (!selected || !isNavigationItem2(selected)) return;
|
|
11835
11472
|
setNavGroupForceOpen(selected, open);
|
|
@@ -11841,7 +11478,7 @@ function OhhwellsBridge() {
|
|
|
11841
11478
|
}
|
|
11842
11479
|
});
|
|
11843
11480
|
}, []);
|
|
11844
|
-
const handleFooterHeadingVisibleChange = (0,
|
|
11481
|
+
const handleFooterHeadingVisibleChange = (0, import_react12.useCallback)(
|
|
11845
11482
|
(visible) => {
|
|
11846
11483
|
const selected = selectedElRef.current;
|
|
11847
11484
|
if (!selected || !isFooterFrameSelectionRef.current) return;
|
|
@@ -11865,7 +11502,7 @@ function OhhwellsBridge() {
|
|
|
11865
11502
|
},
|
|
11866
11503
|
[postToParent2]
|
|
11867
11504
|
);
|
|
11868
|
-
const enterEditOnNewItem = (0,
|
|
11505
|
+
const enterEditOnNewItem = (0, import_react12.useCallback)((anchor) => {
|
|
11869
11506
|
const label = anchor.querySelector('[data-ohw-editable="text"]');
|
|
11870
11507
|
if (!label) {
|
|
11871
11508
|
selectRef.current(anchor);
|
|
@@ -11874,7 +11511,7 @@ function OhhwellsBridge() {
|
|
|
11874
11511
|
setNavGroupForceOpen(anchor, true);
|
|
11875
11512
|
activateRef.current(label);
|
|
11876
11513
|
}, []);
|
|
11877
|
-
const handleAddChildItem = (0,
|
|
11514
|
+
const handleAddChildItem = (0, import_react12.useCallback)(() => {
|
|
11878
11515
|
const selected = selectedElRef.current;
|
|
11879
11516
|
if (!selected) return;
|
|
11880
11517
|
if (toolbarVariantRef.current === "select-frame" && isFooterFrameSelection) {
|
|
@@ -11950,7 +11587,7 @@ function OhhwellsBridge() {
|
|
|
11950
11587
|
enterEditOnNewItem(result.anchor);
|
|
11951
11588
|
});
|
|
11952
11589
|
}, [enterEditOnNewItem, isFooterFrameSelection, maybeWarnNavLinkDropdownConflict, postToParent2]);
|
|
11953
|
-
const handleAddFooterColumn = (0,
|
|
11590
|
+
const handleAddFooterColumn = (0, import_react12.useCallback)(() => {
|
|
11954
11591
|
if (!canAddFooterColumn()) {
|
|
11955
11592
|
postToParent2({
|
|
11956
11593
|
type: "ow:toast",
|
|
@@ -11971,7 +11608,7 @@ function OhhwellsBridge() {
|
|
|
11971
11608
|
selectRef.current(result.firstLink);
|
|
11972
11609
|
});
|
|
11973
11610
|
}, [postToParent2]);
|
|
11974
|
-
const clearFooterDragVisuals = (0,
|
|
11611
|
+
const clearFooterDragVisuals = (0, import_react12.useCallback)(() => {
|
|
11975
11612
|
footerDragRef.current = null;
|
|
11976
11613
|
setSiblingHintRects([]);
|
|
11977
11614
|
setFooterDropSlots([]);
|
|
@@ -11980,7 +11617,7 @@ function OhhwellsBridge() {
|
|
|
11980
11617
|
setIsItemDragging(false);
|
|
11981
11618
|
unlockFooterDragInteraction();
|
|
11982
11619
|
}, []);
|
|
11983
|
-
const refreshFooterDragVisuals = (0,
|
|
11620
|
+
const refreshFooterDragVisuals = (0, import_react12.useCallback)((session, activeSlot, clientX, clientY) => {
|
|
11984
11621
|
const dragged = session.draggedEl;
|
|
11985
11622
|
setDraggedItemRect(dragged.getBoundingClientRect());
|
|
11986
11623
|
if (typeof clientX === "number" && typeof clientY === "number") {
|
|
@@ -12005,13 +11642,13 @@ function OhhwellsBridge() {
|
|
|
12005
11642
|
const activeIdx = activeSlot ? slots.findIndex((s) => s.insertIndex === activeSlot.insertIndex) : -1;
|
|
12006
11643
|
setActiveFooterDropIndex(activeIdx >= 0 ? activeIdx : null);
|
|
12007
11644
|
}, []);
|
|
12008
|
-
const refreshFooterDragVisualsRef = (0,
|
|
11645
|
+
const refreshFooterDragVisualsRef = (0, import_react12.useRef)(refreshFooterDragVisuals);
|
|
12009
11646
|
refreshFooterDragVisualsRef.current = refreshFooterDragVisuals;
|
|
12010
|
-
const commitFooterDragRef = (0,
|
|
11647
|
+
const commitFooterDragRef = (0, import_react12.useRef)(() => {
|
|
12011
11648
|
});
|
|
12012
|
-
const beginFooterDragRef = (0,
|
|
11649
|
+
const beginFooterDragRef = (0, import_react12.useRef)(() => {
|
|
12013
11650
|
});
|
|
12014
|
-
const beginFooterDrag = (0,
|
|
11651
|
+
const beginFooterDrag = (0, import_react12.useCallback)(
|
|
12015
11652
|
(session) => {
|
|
12016
11653
|
const rect = session.draggedEl.getBoundingClientRect();
|
|
12017
11654
|
session.lastClientX = session.lastClientX || rect.left + rect.width / 2;
|
|
@@ -12031,7 +11668,7 @@ function OhhwellsBridge() {
|
|
|
12031
11668
|
[refreshFooterDragVisuals]
|
|
12032
11669
|
);
|
|
12033
11670
|
beginFooterDragRef.current = beginFooterDrag;
|
|
12034
|
-
const commitFooterDrag = (0,
|
|
11671
|
+
const commitFooterDrag = (0, import_react12.useCallback)(
|
|
12035
11672
|
(clientX, clientY) => {
|
|
12036
11673
|
const session = footerDragRef.current;
|
|
12037
11674
|
if (!session) {
|
|
@@ -12135,7 +11772,7 @@ function OhhwellsBridge() {
|
|
|
12135
11772
|
[clearFooterDragVisuals, resolveHrefKeyElement, resyncSelectedNavigationItem]
|
|
12136
11773
|
);
|
|
12137
11774
|
commitFooterDragRef.current = commitFooterDrag;
|
|
12138
|
-
const startFooterLinkDrag = (0,
|
|
11775
|
+
const startFooterLinkDrag = (0, import_react12.useCallback)(
|
|
12139
11776
|
(anchor, clientX, clientY, wasSelected) => {
|
|
12140
11777
|
const hrefKey = anchor.getAttribute("data-ohw-href-key");
|
|
12141
11778
|
if (!hrefKey || !isFooterHrefKey(hrefKey)) return false;
|
|
@@ -12156,7 +11793,7 @@ function OhhwellsBridge() {
|
|
|
12156
11793
|
},
|
|
12157
11794
|
[beginFooterDrag]
|
|
12158
11795
|
);
|
|
12159
|
-
const startFooterColumnDrag = (0,
|
|
11796
|
+
const startFooterColumnDrag = (0, import_react12.useCallback)(
|
|
12160
11797
|
(columnEl, clientX, clientY, wasSelected) => {
|
|
12161
11798
|
const columns = listFooterColumns();
|
|
12162
11799
|
const idx = columns.indexOf(columnEl);
|
|
@@ -12176,7 +11813,7 @@ function OhhwellsBridge() {
|
|
|
12176
11813
|
},
|
|
12177
11814
|
[beginFooterDrag]
|
|
12178
11815
|
);
|
|
12179
|
-
const handleItemDragStart = (0,
|
|
11816
|
+
const handleItemDragStart = (0, import_react12.useCallback)(
|
|
12180
11817
|
(e) => {
|
|
12181
11818
|
const selected = selectedElRef.current;
|
|
12182
11819
|
if (!selected) {
|
|
@@ -12196,7 +11833,7 @@ function OhhwellsBridge() {
|
|
|
12196
11833
|
},
|
|
12197
11834
|
[startFooterColumnDrag, startFooterLinkDrag, startNavLinkDrag]
|
|
12198
11835
|
);
|
|
12199
|
-
const handleItemDragEnd = (0,
|
|
11836
|
+
const handleItemDragEnd = (0, import_react12.useCallback)(
|
|
12200
11837
|
(e) => {
|
|
12201
11838
|
if (footerDragRef.current) {
|
|
12202
11839
|
const x = e?.clientX;
|
|
@@ -12222,7 +11859,7 @@ function OhhwellsBridge() {
|
|
|
12222
11859
|
},
|
|
12223
11860
|
[commitFooterDrag, commitNavDrag, navDragRef]
|
|
12224
11861
|
);
|
|
12225
|
-
const handleItemChromePointerDown = (0,
|
|
11862
|
+
const handleItemChromePointerDown = (0, import_react12.useCallback)((e) => {
|
|
12226
11863
|
if (e.button !== 0) return;
|
|
12227
11864
|
const selected = selectedElRef.current;
|
|
12228
11865
|
if (!selected) return;
|
|
@@ -12253,7 +11890,7 @@ function OhhwellsBridge() {
|
|
|
12253
11890
|
}
|
|
12254
11891
|
if (armNavPressFromChrome(selected, e.clientX, e.clientY, e.pointerId)) return;
|
|
12255
11892
|
}, [armNavPressFromChrome]);
|
|
12256
|
-
const handleItemChromeClick = (0,
|
|
11893
|
+
const handleItemChromeClick = (0, import_react12.useCallback)((clientX, clientY) => {
|
|
12257
11894
|
if (suppressNextClickRef.current || Date.now() < suppressClickUntilRef.current) {
|
|
12258
11895
|
suppressNextClickRef.current = false;
|
|
12259
11896
|
return;
|
|
@@ -12266,10 +11903,9 @@ function OhhwellsBridge() {
|
|
|
12266
11903
|
}, []);
|
|
12267
11904
|
reselectNavigationItemRef.current = reselectNavigationItem;
|
|
12268
11905
|
commitNavigationTextEditRef.current = commitNavigationTextEdit;
|
|
12269
|
-
const select = (0,
|
|
11906
|
+
const select = (0, import_react12.useCallback)((anchor) => {
|
|
12270
11907
|
if (!isNavigationItem2(anchor)) return;
|
|
12271
11908
|
if (activeElRef.current) deactivate();
|
|
12272
|
-
aiSectionApiRef.current?.selectFromElement(anchor);
|
|
12273
11909
|
selectedElRef.current = anchor;
|
|
12274
11910
|
selectedHrefKeyRef.current = anchor.getAttribute("data-ohw-href-key");
|
|
12275
11911
|
selectedFooterColAttrRef.current = null;
|
|
@@ -12305,10 +11941,9 @@ function OhhwellsBridge() {
|
|
|
12305
11941
|
setToolbarShowEditLink(false);
|
|
12306
11942
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
12307
11943
|
}, [deactivate, markSelected]);
|
|
12308
|
-
const selectFrame = (0,
|
|
11944
|
+
const selectFrame = (0, import_react12.useCallback)((el) => {
|
|
12309
11945
|
if (!isNavigationContainer(el)) return;
|
|
12310
11946
|
if (activeElRef.current) deactivate();
|
|
12311
|
-
aiSectionApiRef.current?.selectFromElement(el);
|
|
12312
11947
|
const isFooterColumn = !isFooterLinksContainer(el) && (el.hasAttribute("data-ohw-footer-col") || Boolean(el.closest("footer") && isInferredFooterGroup2(el)));
|
|
12313
11948
|
selectedElRef.current = el;
|
|
12314
11949
|
selectedHrefKeyRef.current = null;
|
|
@@ -12352,7 +11987,7 @@ function OhhwellsBridge() {
|
|
|
12352
11987
|
setToolbarShowEditLink(false);
|
|
12353
11988
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
12354
11989
|
}, [deactivate, markSelected, postToParent2]);
|
|
12355
|
-
const activate = (0,
|
|
11990
|
+
const activate = (0, import_react12.useCallback)((el, options) => {
|
|
12356
11991
|
if (activeElRef.current === el) return;
|
|
12357
11992
|
clearSelectedAttr();
|
|
12358
11993
|
selectedElRef.current = null;
|
|
@@ -12413,15 +12048,7 @@ function OhhwellsBridge() {
|
|
|
12413
12048
|
setReorderDragDisabled(reorderDisabled);
|
|
12414
12049
|
}
|
|
12415
12050
|
setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
12416
|
-
|
|
12417
|
-
postToParent2({
|
|
12418
|
-
type: "ow:enter-edit",
|
|
12419
|
-
key: el.dataset.ohwKey,
|
|
12420
|
-
// Section the edited element belongs to, so the editor can scope AI prompts to it.
|
|
12421
|
-
sectionId: sectionEl?.dataset.ohwSection ?? null,
|
|
12422
|
-
sectionLabel: sectionEl?.dataset.ohwSectionLabel ?? null
|
|
12423
|
-
});
|
|
12424
|
-
aiSectionApiRef.current?.selectFromElement(el, { report: false });
|
|
12051
|
+
postToParent2({ type: "ow:enter-edit", key: el.dataset.ohwKey });
|
|
12425
12052
|
requestAnimationFrame(() => refreshActiveCommandsRef.current());
|
|
12426
12053
|
}, [clearSelectedAttr, deactivate, postToParent2]);
|
|
12427
12054
|
activateRef.current = activate;
|
|
@@ -12429,34 +12056,7 @@ function OhhwellsBridge() {
|
|
|
12429
12056
|
selectRef.current = select;
|
|
12430
12057
|
selectFrameRef.current = selectFrame;
|
|
12431
12058
|
deselectRef.current = deselect;
|
|
12432
|
-
|
|
12433
|
-
(0, import_react13.useEffect)(() => {
|
|
12434
|
-
if (!isEditMode) {
|
|
12435
|
-
if (lastSiteWideScopeRef.current !== false) {
|
|
12436
|
-
lastSiteWideScopeRef.current = false;
|
|
12437
|
-
postToParent2({ type: "ow:site-wide-scope", active: false });
|
|
12438
|
-
}
|
|
12439
|
-
return;
|
|
12440
|
-
}
|
|
12441
|
-
const active = isSiteWideScopeActive({
|
|
12442
|
-
selected: selectedElRef.current,
|
|
12443
|
-
hoveredItem: hoveredItemElRef.current,
|
|
12444
|
-
hoveredNavContainer: hoveredNavContainerRef.current,
|
|
12445
|
-
active: activeElRef.current
|
|
12446
|
-
});
|
|
12447
|
-
if (lastSiteWideScopeRef.current === active) return;
|
|
12448
|
-
lastSiteWideScopeRef.current = active;
|
|
12449
|
-
postToParent2({ type: "ow:site-wide-scope", active });
|
|
12450
|
-
}, [
|
|
12451
|
-
isEditMode,
|
|
12452
|
-
hoveredItemRect,
|
|
12453
|
-
hoveredNavContainerRect,
|
|
12454
|
-
toolbarVariant,
|
|
12455
|
-
toolbarRect,
|
|
12456
|
-
isFooterFrameSelection,
|
|
12457
|
-
postToParent2
|
|
12458
|
-
]);
|
|
12459
|
-
(0, import_react13.useLayoutEffect)(() => {
|
|
12059
|
+
(0, import_react12.useLayoutEffect)(() => {
|
|
12460
12060
|
if (!subdomain || isEditMode) {
|
|
12461
12061
|
setFetchState("done");
|
|
12462
12062
|
return;
|
|
@@ -12527,7 +12127,7 @@ function OhhwellsBridge() {
|
|
|
12527
12127
|
cancelled = true;
|
|
12528
12128
|
};
|
|
12529
12129
|
}, [subdomain, isEditMode]);
|
|
12530
|
-
(0,
|
|
12130
|
+
(0, import_react12.useEffect)(() => {
|
|
12531
12131
|
if (!subdomain || isEditMode) return;
|
|
12532
12132
|
let debounceTimer = null;
|
|
12533
12133
|
let observer = null;
|
|
@@ -12578,16 +12178,16 @@ function OhhwellsBridge() {
|
|
|
12578
12178
|
if (debounceTimer) clearTimeout(debounceTimer);
|
|
12579
12179
|
};
|
|
12580
12180
|
}, [subdomain, isEditMode, pathname]);
|
|
12581
|
-
(0,
|
|
12181
|
+
(0, import_react12.useLayoutEffect)(() => {
|
|
12582
12182
|
const el = document.getElementById("ohw-loader");
|
|
12583
12183
|
if (!el) return;
|
|
12584
12184
|
const visible = Boolean(subdomain) && fetchState !== "done";
|
|
12585
12185
|
el.style.display = visible ? "flex" : "none";
|
|
12586
12186
|
}, [subdomain, fetchState]);
|
|
12587
|
-
(0,
|
|
12187
|
+
(0, import_react12.useEffect)(() => {
|
|
12588
12188
|
postToParent2({ type: "ow:navigation", path: pathname });
|
|
12589
12189
|
}, [pathname, postToParent2]);
|
|
12590
|
-
(0,
|
|
12190
|
+
(0, import_react12.useEffect)(() => {
|
|
12591
12191
|
if (!isEditMode) return;
|
|
12592
12192
|
if (linkPopoverSessionRef.current?.intent === "add-nav") return;
|
|
12593
12193
|
if (document.querySelector("[data-ohw-section-picker]")) return;
|
|
@@ -12595,7 +12195,7 @@ function OhhwellsBridge() {
|
|
|
12595
12195
|
deselectRef.current();
|
|
12596
12196
|
deactivateRef.current();
|
|
12597
12197
|
}, [pathname, isEditMode]);
|
|
12598
|
-
(0,
|
|
12198
|
+
(0, import_react12.useEffect)(() => {
|
|
12599
12199
|
const contentForNav = () => {
|
|
12600
12200
|
if (isEditMode) return editContentRef.current;
|
|
12601
12201
|
if (!subdomain) return {};
|
|
@@ -12660,7 +12260,7 @@ function OhhwellsBridge() {
|
|
|
12660
12260
|
observer?.disconnect();
|
|
12661
12261
|
};
|
|
12662
12262
|
}, [isEditMode, pathname, subdomain, fetchState, resyncSelectedNavigationItem]);
|
|
12663
|
-
(0,
|
|
12263
|
+
(0, import_react12.useEffect)(() => {
|
|
12664
12264
|
if (!isEditMode) return;
|
|
12665
12265
|
const measure = () => {
|
|
12666
12266
|
const h = document.body.scrollHeight;
|
|
@@ -12684,7 +12284,7 @@ function OhhwellsBridge() {
|
|
|
12684
12284
|
window.removeEventListener("resize", handleResize);
|
|
12685
12285
|
};
|
|
12686
12286
|
}, [pathname, isEditMode, postToParent2]);
|
|
12687
|
-
(0,
|
|
12287
|
+
(0, import_react12.useEffect)(() => {
|
|
12688
12288
|
if (!subdomainFromQuery || isEditMode) return;
|
|
12689
12289
|
const handleClick = (e) => {
|
|
12690
12290
|
const anchor = e.target.closest("a");
|
|
@@ -12700,7 +12300,7 @@ function OhhwellsBridge() {
|
|
|
12700
12300
|
document.addEventListener("click", handleClick, true);
|
|
12701
12301
|
return () => document.removeEventListener("click", handleClick, true);
|
|
12702
12302
|
}, [subdomainFromQuery, isEditMode, router]);
|
|
12703
|
-
(0,
|
|
12303
|
+
(0, import_react12.useEffect)(() => {
|
|
12704
12304
|
if (!isEditMode) {
|
|
12705
12305
|
editStylesRef.current?.base.remove();
|
|
12706
12306
|
editStylesRef.current?.forceHover.remove();
|
|
@@ -12752,7 +12352,7 @@ function OhhwellsBridge() {
|
|
|
12752
12352
|
[data-ohw-editable="bg-image"], [data-ohw-editable="bg-image"] * { cursor: pointer !important; }
|
|
12753
12353
|
[data-ohw-editable="link"], [data-ohw-editable="link"] * { cursor: pointer !important; }
|
|
12754
12354
|
[data-ohw-hovered]:not([contenteditable]):not([data-ohw-href-key]) {
|
|
12755
|
-
outline: 2px dashed ${
|
|
12355
|
+
outline: 2px dashed ${PRIMARY2} !important;
|
|
12756
12356
|
outline-offset: 4px;
|
|
12757
12357
|
}
|
|
12758
12358
|
[data-ohw-href-key] [data-ohw-hovered],
|
|
@@ -12787,11 +12387,11 @@ function OhhwellsBridge() {
|
|
|
12787
12387
|
footer [data-ohw-href-key] [data-ohw-editable][contenteditable],
|
|
12788
12388
|
footer [data-ohw-href-key] [data-ohw-editable][contenteditable] * {
|
|
12789
12389
|
outline: none !important;
|
|
12790
|
-
caret-color: ${
|
|
12390
|
+
caret-color: ${PRIMARY2} !important;
|
|
12791
12391
|
cursor: text !important;
|
|
12792
12392
|
}
|
|
12793
12393
|
[data-ohw-editable][contenteditable]::selection,
|
|
12794
|
-
[data-ohw-editable][contenteditable] *::selection { background: ${
|
|
12394
|
+
[data-ohw-editable][contenteditable] *::selection { background: ${PRIMARY2}59 !important; }
|
|
12795
12395
|
[data-ohw-editable-state], [data-ohw-editable-state] * { pointer-events: none !important; }
|
|
12796
12396
|
[data-ohw-editable-state][data-ohw-active-state] [data-ohw-editable] { pointer-events: auto !important; }
|
|
12797
12397
|
[data-ohw-editable-state][data-ohw-active-state][data-ohw-editable] { pointer-events: auto !important; }
|
|
@@ -12806,7 +12406,7 @@ function OhhwellsBridge() {
|
|
|
12806
12406
|
stateViews.textContent = `
|
|
12807
12407
|
[data-ohw-state-view]:not([data-ohw-state-view="default"]) { display: none; }
|
|
12808
12408
|
[data-ohw-state-view="default"] [data-ohw-editable] { pointer-events: auto !important; }
|
|
12809
|
-
[data-ohw-state-hovered] { outline: 2px dashed ${
|
|
12409
|
+
[data-ohw-state-hovered] { outline: 2px dashed ${PRIMARY2} !important; outline-offset: 4px; }
|
|
12810
12410
|
[data-ohw-state-hovered]:has([data-ohw-hovered]) { outline: none !important; }
|
|
12811
12411
|
`;
|
|
12812
12412
|
document.head.appendChild(base);
|
|
@@ -12830,10 +12430,6 @@ function OhhwellsBridge() {
|
|
|
12830
12430
|
if (target.closest("[data-ohw-max-badge]")) return;
|
|
12831
12431
|
if (isInsideLinkEditor(target)) return;
|
|
12832
12432
|
if (target.closest('[data-ohw-edit-chrome], [data-ohw-item-interaction], [data-ohw-drag-handle-container], [data-slot="drag-handle"]')) {
|
|
12833
|
-
const beneath = document.elementsFromPoint(e.clientX, e.clientY).find(
|
|
12834
|
-
(el) => el instanceof HTMLElement && !el.closest("[data-ohw-bridge-root]") && el.closest("[data-ohw-section]") != null
|
|
12835
|
-
);
|
|
12836
|
-
if (beneath) aiSectionApiRef.current?.selectFromElement(beneath);
|
|
12837
12433
|
if (target.closest("[data-ohw-item-drag-surface]")) {
|
|
12838
12434
|
e.preventDefault();
|
|
12839
12435
|
e.stopPropagation();
|
|
@@ -12892,21 +12488,11 @@ function OhhwellsBridge() {
|
|
|
12892
12488
|
return;
|
|
12893
12489
|
}
|
|
12894
12490
|
}
|
|
12895
|
-
const logoEl = getLogoElement(target);
|
|
12896
|
-
if (logoEl) {
|
|
12897
|
-
e.preventDefault();
|
|
12898
|
-
e.stopPropagation();
|
|
12899
|
-
deselectRef.current();
|
|
12900
|
-
deactivateRef.current();
|
|
12901
|
-
postToParentRef.current({ type: "ow:open-logo-settings" });
|
|
12902
|
-
return;
|
|
12903
|
-
}
|
|
12904
12491
|
const editable = target.closest("[data-ohw-editable]");
|
|
12905
12492
|
if (editable) {
|
|
12906
12493
|
if (editable.dataset.ohwEditable === "link") {
|
|
12907
12494
|
e.preventDefault();
|
|
12908
12495
|
e.stopPropagation();
|
|
12909
|
-
aiSectionApiRef.current?.selectFromElement(editable);
|
|
12910
12496
|
deselectRef.current();
|
|
12911
12497
|
deactivateRef.current();
|
|
12912
12498
|
bumpLinkPopoverGrace();
|
|
@@ -12920,7 +12506,6 @@ function OhhwellsBridge() {
|
|
|
12920
12506
|
if (isMediaEditable(editable)) {
|
|
12921
12507
|
e.preventDefault();
|
|
12922
12508
|
e.stopPropagation();
|
|
12923
|
-
aiSectionApiRef.current?.selectFromElement(editable);
|
|
12924
12509
|
postToParentRef.current({ type: "ow:image-pick", key: editable.dataset.ohwKey ?? "", elementType: editable.dataset.ohwEditable ?? "image" });
|
|
12925
12510
|
return;
|
|
12926
12511
|
}
|
|
@@ -13023,7 +12608,6 @@ function OhhwellsBridge() {
|
|
|
13023
12608
|
closeLinkPopoverRef.current();
|
|
13024
12609
|
return;
|
|
13025
12610
|
}
|
|
13026
|
-
aiSectionApiRef.current?.handleBackgroundClick(target, e.clientX, e.clientY);
|
|
13027
12611
|
deselectRef.current();
|
|
13028
12612
|
deactivateRef.current();
|
|
13029
12613
|
};
|
|
@@ -13066,7 +12650,7 @@ function OhhwellsBridge() {
|
|
|
13066
12650
|
const allowFooterLinksHover = toolbarVariantRef.current !== "select-frame" || selectedIsFooterColumn;
|
|
13067
12651
|
if (allowNavContainerHover) {
|
|
13068
12652
|
const navContainer = target.closest("[data-ohw-nav-container]");
|
|
13069
|
-
if (navContainer && !getNavigationItemAnchor(target)
|
|
12653
|
+
if (navContainer && !getNavigationItemAnchor(target)) {
|
|
13070
12654
|
hoveredNavContainerRef.current = navContainer;
|
|
13071
12655
|
setHoveredNavContainerRect(navContainer.getBoundingClientRect());
|
|
13072
12656
|
hoveredItemElRef.current = null;
|
|
@@ -13095,15 +12679,6 @@ function OhhwellsBridge() {
|
|
|
13095
12679
|
setHoveredNavContainerRect(null);
|
|
13096
12680
|
}
|
|
13097
12681
|
}
|
|
13098
|
-
const logoEl = getLogoElement(target);
|
|
13099
|
-
if (logoEl) {
|
|
13100
|
-
hoveredNavContainerRef.current = null;
|
|
13101
|
-
setHoveredNavContainerRect(null);
|
|
13102
|
-
if (selectedElRef.current === logoEl) return;
|
|
13103
|
-
hoveredItemElRef.current = logoEl;
|
|
13104
|
-
setHoveredItemRect(logoEl.getBoundingClientRect());
|
|
13105
|
-
return;
|
|
13106
|
-
}
|
|
13107
12682
|
const navAnchor = getNavigationItemAnchor(target);
|
|
13108
12683
|
if (navAnchor) {
|
|
13109
12684
|
hoveredNavContainerRef.current = null;
|
|
@@ -13136,12 +12711,6 @@ function OhhwellsBridge() {
|
|
|
13136
12711
|
setHoveredItemRect(hoverTarget.getBoundingClientRect());
|
|
13137
12712
|
} else if (!isInsideNavigationItem(editable)) {
|
|
13138
12713
|
hoverTarget.setAttribute("data-ohw-hovered", "");
|
|
13139
|
-
if (editable.closest("footer") || editable.closest('[data-ohw-section="footer"]')) {
|
|
13140
|
-
hoveredNavContainerRef.current = null;
|
|
13141
|
-
setHoveredNavContainerRect(null);
|
|
13142
|
-
hoveredItemElRef.current = editable;
|
|
13143
|
-
setHoveredItemRect(editable.getBoundingClientRect());
|
|
13144
|
-
}
|
|
13145
12714
|
}
|
|
13146
12715
|
}
|
|
13147
12716
|
};
|
|
@@ -13177,18 +12746,6 @@ function OhhwellsBridge() {
|
|
|
13177
12746
|
}
|
|
13178
12747
|
return;
|
|
13179
12748
|
}
|
|
13180
|
-
const logoEl = getLogoElement(target);
|
|
13181
|
-
if (logoEl) {
|
|
13182
|
-
const related2 = e.relatedTarget instanceof Element ? e.relatedTarget : null;
|
|
13183
|
-
if (related2 && (logoEl === related2 || logoEl.contains(related2) || related2.closest?.('[data-ohw-role="logo"], [data-ohw-logo]'))) {
|
|
13184
|
-
return;
|
|
13185
|
-
}
|
|
13186
|
-
if (hoveredItemElRef.current === logoEl) {
|
|
13187
|
-
hoveredItemElRef.current = null;
|
|
13188
|
-
setHoveredItemRect(null);
|
|
13189
|
-
}
|
|
13190
|
-
return;
|
|
13191
|
-
}
|
|
13192
12749
|
const editable = target.closest("[data-ohw-editable]");
|
|
13193
12750
|
if (!editable) return;
|
|
13194
12751
|
const related = e.relatedTarget instanceof Element ? e.relatedTarget : null;
|
|
@@ -13202,13 +12759,6 @@ function OhhwellsBridge() {
|
|
|
13202
12759
|
}
|
|
13203
12760
|
} else {
|
|
13204
12761
|
hoverTarget.removeAttribute("data-ohw-hovered");
|
|
13205
|
-
if (hoveredItemElRef.current === editable) {
|
|
13206
|
-
const stillOnEditable = related instanceof Element && related.closest("[data-ohw-editable]") === editable;
|
|
13207
|
-
if (!stillOnEditable) {
|
|
13208
|
-
hoveredItemElRef.current = null;
|
|
13209
|
-
setHoveredItemRect(null);
|
|
13210
|
-
}
|
|
13211
|
-
}
|
|
13212
12762
|
}
|
|
13213
12763
|
}
|
|
13214
12764
|
};
|
|
@@ -13325,26 +12875,6 @@ function OhhwellsBridge() {
|
|
|
13325
12875
|
hoveredNavContainerRef.current = null;
|
|
13326
12876
|
setHoveredNavContainerRect(null);
|
|
13327
12877
|
}
|
|
13328
|
-
const logoCandidates = [
|
|
13329
|
-
...document.querySelectorAll('[data-ohw-role="logo"], [data-ohw-logo]'),
|
|
13330
|
-
...document.querySelectorAll("nav a:not([data-ohw-href-key]), [data-ohw-nav-root] a:not([data-ohw-href-key])"),
|
|
13331
|
-
...document.querySelectorAll("footer img")
|
|
13332
|
-
];
|
|
13333
|
-
const seenLogos = /* @__PURE__ */ new Set();
|
|
13334
|
-
for (const candidate of logoCandidates) {
|
|
13335
|
-
const logo = getLogoElement(candidate);
|
|
13336
|
-
if (!logo || seenLogos.has(logo)) continue;
|
|
13337
|
-
seenLogos.add(logo);
|
|
13338
|
-
const r2 = logo.getBoundingClientRect();
|
|
13339
|
-
if (x < r2.left || x > r2.right || y < r2.top || y > r2.bottom) continue;
|
|
13340
|
-
hoveredNavContainerRef.current = null;
|
|
13341
|
-
setHoveredNavContainerRect(null);
|
|
13342
|
-
if (selectedElRef.current !== logo) {
|
|
13343
|
-
hoveredItemElRef.current = logo;
|
|
13344
|
-
setHoveredItemRect(logo.getBoundingClientRect());
|
|
13345
|
-
}
|
|
13346
|
-
return;
|
|
13347
|
-
}
|
|
13348
12878
|
const navContainers = Array.from(
|
|
13349
12879
|
document.querySelectorAll("[data-ohw-nav-container]")
|
|
13350
12880
|
);
|
|
@@ -14245,25 +13775,6 @@ function OhhwellsBridge() {
|
|
|
14245
13775
|
const h = document.documentElement.scrollHeight;
|
|
14246
13776
|
if (h > 50) postToParentRef.current({ type: "ow:height", height: h });
|
|
14247
13777
|
};
|
|
14248
|
-
const handleCollectSection = (e) => {
|
|
14249
|
-
if (e.data?.type !== "ow:collect-section") return;
|
|
14250
|
-
const sectionId = e.data.sectionId;
|
|
14251
|
-
if (typeof sectionId !== "string" || !sectionId) return;
|
|
14252
|
-
const sectionEl = document.querySelector(
|
|
14253
|
-
`[data-ohw-section="${CSS.escape(sectionId)}"]`
|
|
14254
|
-
);
|
|
14255
|
-
const nodes = sectionEl ? collectEditableNodes(void 0, sectionEl).filter(
|
|
14256
|
-
(n) => n.key && !n.key.startsWith("__ohw_") && !["meta", "sections", "carousel", "video-setting"].includes(n.type)
|
|
14257
|
-
).map((n) => ({ ...n, text: n.text ?? "", type: normalizeAiNodeType(n.type) })) : [];
|
|
14258
|
-
const box = sectionEl?.getBoundingClientRect();
|
|
14259
|
-
const rect = box ? {
|
|
14260
|
-
top: box.top + window.scrollY,
|
|
14261
|
-
left: box.left + window.scrollX,
|
|
14262
|
-
width: box.width,
|
|
14263
|
-
height: box.height
|
|
14264
|
-
} : null;
|
|
14265
|
-
postToParentRef.current({ type: "ow:section-nodes", sectionId, found: !!sectionEl, nodes, rect });
|
|
14266
|
-
};
|
|
14267
13778
|
let selectionChangeRaf = null;
|
|
14268
13779
|
const runSelectionChange = () => {
|
|
14269
13780
|
selectionChangeRaf = null;
|
|
@@ -14425,19 +13936,6 @@ function OhhwellsBridge() {
|
|
|
14425
13936
|
postToParentRef.current({ type: "ow:image-pick", key: stateCardImage.dataset.ohwKey ?? "", elementType: stateCardImage.dataset.ohwEditable ?? "image" });
|
|
14426
13937
|
return;
|
|
14427
13938
|
}
|
|
14428
|
-
const logoAtPoint = Array.from(
|
|
14429
|
-
document.querySelectorAll('[data-ohw-role="logo"], [data-ohw-logo]')
|
|
14430
|
-
).map((el) => getLogoElement(el)).find((logo) => {
|
|
14431
|
-
if (!logo) return false;
|
|
14432
|
-
const r2 = logo.getBoundingClientRect();
|
|
14433
|
-
return clientX >= r2.left && clientX <= r2.right && clientY >= r2.top && clientY <= r2.bottom;
|
|
14434
|
-
});
|
|
14435
|
-
if (logoAtPoint) {
|
|
14436
|
-
deselectRef.current();
|
|
14437
|
-
deactivateRef.current();
|
|
14438
|
-
postToParentRef.current({ type: "ow:open-logo-settings" });
|
|
14439
|
-
return;
|
|
14440
|
-
}
|
|
14441
13939
|
const textEditable = Array.from(
|
|
14442
13940
|
document.querySelectorAll(NON_MEDIA_SELECTOR)
|
|
14443
13941
|
).find((el) => {
|
|
@@ -14489,7 +13987,6 @@ function OhhwellsBridge() {
|
|
|
14489
13987
|
selectFrameRef.current(footerColumn);
|
|
14490
13988
|
return;
|
|
14491
13989
|
}
|
|
14492
|
-
aiSectionApiRef.current?.handleBackgroundClick(e.target, clientX, clientY);
|
|
14493
13990
|
deactivateRef.current();
|
|
14494
13991
|
};
|
|
14495
13992
|
window.addEventListener("message", handleSave);
|
|
@@ -14498,7 +13995,6 @@ function OhhwellsBridge() {
|
|
|
14498
13995
|
window.addEventListener("message", handleScheduleLinked);
|
|
14499
13996
|
window.addEventListener("message", handleClearSchedulingWidget);
|
|
14500
13997
|
window.addEventListener("message", handleRemoveSchedulingSection);
|
|
14501
|
-
window.addEventListener("message", handleCollectSection);
|
|
14502
13998
|
window.addEventListener("message", handleImageUrl);
|
|
14503
13999
|
window.addEventListener("message", handleImageUploading);
|
|
14504
14000
|
window.addEventListener("message", handleCarouselChange);
|
|
@@ -14549,7 +14045,6 @@ function OhhwellsBridge() {
|
|
|
14549
14045
|
window.removeEventListener("message", handleScheduleLinked);
|
|
14550
14046
|
window.removeEventListener("message", handleClearSchedulingWidget);
|
|
14551
14047
|
window.removeEventListener("message", handleRemoveSchedulingSection);
|
|
14552
|
-
window.removeEventListener("message", handleCollectSection);
|
|
14553
14048
|
window.removeEventListener("message", handleImageUrl);
|
|
14554
14049
|
window.removeEventListener("message", handleImageUploading);
|
|
14555
14050
|
window.removeEventListener("message", handleCarouselChange);
|
|
@@ -14568,7 +14063,7 @@ function OhhwellsBridge() {
|
|
|
14568
14063
|
if (imageShowTimerRef.current) clearTimeout(imageShowTimerRef.current);
|
|
14569
14064
|
};
|
|
14570
14065
|
}, [isEditMode, refreshStateRules]);
|
|
14571
|
-
(0,
|
|
14066
|
+
(0, import_react12.useEffect)(() => {
|
|
14572
14067
|
if (!isEditMode) return;
|
|
14573
14068
|
const THRESHOLD = 10;
|
|
14574
14069
|
const resolveWasSelected = (el) => {
|
|
@@ -14722,7 +14217,7 @@ function OhhwellsBridge() {
|
|
|
14722
14217
|
unlockFooterDragInteraction();
|
|
14723
14218
|
};
|
|
14724
14219
|
}, [isEditMode]);
|
|
14725
|
-
(0,
|
|
14220
|
+
(0, import_react12.useEffect)(() => {
|
|
14726
14221
|
const handler = (e) => {
|
|
14727
14222
|
if (e.data?.type !== "ow:request-schedule-config") return;
|
|
14728
14223
|
const insertAfterVal = e.data.insertAfter;
|
|
@@ -14738,7 +14233,7 @@ function OhhwellsBridge() {
|
|
|
14738
14233
|
window.addEventListener("message", handler);
|
|
14739
14234
|
return () => window.removeEventListener("message", handler);
|
|
14740
14235
|
}, [processConfigRequest]);
|
|
14741
|
-
(0,
|
|
14236
|
+
(0, import_react12.useEffect)(() => {
|
|
14742
14237
|
if (!isEditMode) return;
|
|
14743
14238
|
document.querySelectorAll("[data-ohw-active-state]").forEach((el) => {
|
|
14744
14239
|
el.removeAttribute("data-ohw-active-state");
|
|
@@ -14762,7 +14257,6 @@ function OhhwellsBridge() {
|
|
|
14762
14257
|
postToParent2({
|
|
14763
14258
|
type: "ow:ready",
|
|
14764
14259
|
version: "1",
|
|
14765
|
-
bridgeVersion: "0.1.51",
|
|
14766
14260
|
path: pathname,
|
|
14767
14261
|
nodes: collectEditableNodes(editContentRef.current),
|
|
14768
14262
|
sections
|
|
@@ -14774,13 +14268,13 @@ function OhhwellsBridge() {
|
|
|
14774
14268
|
clearTimeout(timer);
|
|
14775
14269
|
};
|
|
14776
14270
|
}, [pathname, isEditMode, refreshStateRules, postToParent2]);
|
|
14777
|
-
(0,
|
|
14271
|
+
(0, import_react12.useEffect)(() => {
|
|
14778
14272
|
scrollToHashSectionWhenReady();
|
|
14779
14273
|
const onHashChange = () => scrollToHashSectionWhenReady();
|
|
14780
14274
|
window.addEventListener("hashchange", onHashChange);
|
|
14781
14275
|
return () => window.removeEventListener("hashchange", onHashChange);
|
|
14782
14276
|
}, [pathname]);
|
|
14783
|
-
const handleCommand = (0,
|
|
14277
|
+
const handleCommand = (0, import_react12.useCallback)((cmd) => {
|
|
14784
14278
|
const el = activeElRef.current;
|
|
14785
14279
|
const selBefore = window.getSelection();
|
|
14786
14280
|
let savedOffsets = null;
|
|
@@ -14816,7 +14310,7 @@ function OhhwellsBridge() {
|
|
|
14816
14310
|
if (el) setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
14817
14311
|
refreshActiveCommandsRef.current();
|
|
14818
14312
|
}, []);
|
|
14819
|
-
const handleStateChange = (0,
|
|
14313
|
+
const handleStateChange = (0, import_react12.useCallback)((state) => {
|
|
14820
14314
|
if (!activeStateElRef.current) return;
|
|
14821
14315
|
const el = activeStateElRef.current;
|
|
14822
14316
|
if (state === "Default") {
|
|
@@ -14829,7 +14323,7 @@ function OhhwellsBridge() {
|
|
|
14829
14323
|
}
|
|
14830
14324
|
setToggleState((prev) => prev ? { ...prev, activeState: state } : null);
|
|
14831
14325
|
}, [deactivate]);
|
|
14832
|
-
const reselectAfterLinkPopover = (0,
|
|
14326
|
+
const reselectAfterLinkPopover = (0, import_react12.useCallback)(
|
|
14833
14327
|
(hrefKey) => {
|
|
14834
14328
|
requestAnimationFrame(() => {
|
|
14835
14329
|
const el = resolveHrefKeyElement(hrefKey);
|
|
@@ -14838,7 +14332,7 @@ function OhhwellsBridge() {
|
|
|
14838
14332
|
},
|
|
14839
14333
|
[resolveHrefKeyElement]
|
|
14840
14334
|
);
|
|
14841
|
-
const closeLinkPopover = (0,
|
|
14335
|
+
const closeLinkPopover = (0, import_react12.useCallback)(() => {
|
|
14842
14336
|
const session = linkPopoverSessionRef.current;
|
|
14843
14337
|
addNavAfterAnchorRef.current = null;
|
|
14844
14338
|
setLinkPopover(null);
|
|
@@ -14846,9 +14340,9 @@ function OhhwellsBridge() {
|
|
|
14846
14340
|
reselectAfterLinkPopover(session.key);
|
|
14847
14341
|
}
|
|
14848
14342
|
}, [reselectAfterLinkPopover]);
|
|
14849
|
-
const closeLinkPopoverRef = (0,
|
|
14343
|
+
const closeLinkPopoverRef = (0, import_react12.useRef)(closeLinkPopover);
|
|
14850
14344
|
closeLinkPopoverRef.current = closeLinkPopover;
|
|
14851
|
-
const openLinkPopoverForActive = (0,
|
|
14345
|
+
const openLinkPopoverForActive = (0, import_react12.useCallback)(() => {
|
|
14852
14346
|
const hrefCtx = getHrefKeyFromElement(activeElRef.current);
|
|
14853
14347
|
if (!hrefCtx) return;
|
|
14854
14348
|
bumpLinkPopoverGrace();
|
|
@@ -14859,7 +14353,7 @@ function OhhwellsBridge() {
|
|
|
14859
14353
|
});
|
|
14860
14354
|
deactivate();
|
|
14861
14355
|
}, [deactivate]);
|
|
14862
|
-
const openLinkPopoverForSelected = (0,
|
|
14356
|
+
const openLinkPopoverForSelected = (0, import_react12.useCallback)(() => {
|
|
14863
14357
|
const anchor = selectedElRef.current;
|
|
14864
14358
|
if (!anchor) return;
|
|
14865
14359
|
const key = anchor.getAttribute("data-ohw-href-key");
|
|
@@ -14872,7 +14366,7 @@ function OhhwellsBridge() {
|
|
|
14872
14366
|
});
|
|
14873
14367
|
deselect();
|
|
14874
14368
|
}, [deselect]);
|
|
14875
|
-
const handleSelectParent = (0,
|
|
14369
|
+
const handleSelectParent = (0, import_react12.useCallback)(() => {
|
|
14876
14370
|
const selected = selectedElRef.current;
|
|
14877
14371
|
if (!selected) return;
|
|
14878
14372
|
if (toolbarVariantRef.current === "select-frame") {
|
|
@@ -14899,7 +14393,7 @@ function OhhwellsBridge() {
|
|
|
14899
14393
|
}
|
|
14900
14394
|
deselectRef.current();
|
|
14901
14395
|
}, []);
|
|
14902
|
-
const handleDuplicateSelected = (0,
|
|
14396
|
+
const handleDuplicateSelected = (0, import_react12.useCallback)(() => {
|
|
14903
14397
|
const selected = selectedElRef.current;
|
|
14904
14398
|
if (!selected || !isNavigationItem2(selected)) return;
|
|
14905
14399
|
const hrefKey = selected.getAttribute("data-ohw-href-key");
|
|
@@ -14989,7 +14483,7 @@ function OhhwellsBridge() {
|
|
|
14989
14483
|
});
|
|
14990
14484
|
}
|
|
14991
14485
|
}, [postToParent2]);
|
|
14992
|
-
const runPendingDeleteUndo = (0,
|
|
14486
|
+
const runPendingDeleteUndo = (0, import_react12.useCallback)(() => {
|
|
14993
14487
|
const pending = pendingDeleteUndoRef.current;
|
|
14994
14488
|
if (!pending) return false;
|
|
14995
14489
|
pendingDeleteUndoRef.current = null;
|
|
@@ -14997,7 +14491,7 @@ function OhhwellsBridge() {
|
|
|
14997
14491
|
enforceLinkHrefs();
|
|
14998
14492
|
return true;
|
|
14999
14493
|
}, []);
|
|
15000
|
-
const handleDeleteSelected = (0,
|
|
14494
|
+
const handleDeleteSelected = (0, import_react12.useCallback)(() => {
|
|
15001
14495
|
const selected = selectedElRef.current;
|
|
15002
14496
|
if (!selected) return false;
|
|
15003
14497
|
return deleteSelectedNavFooterItem({
|
|
@@ -15018,7 +14512,7 @@ function OhhwellsBridge() {
|
|
|
15018
14512
|
}, [postToParent2]);
|
|
15019
14513
|
handleDeleteSelectedRef.current = handleDeleteSelected;
|
|
15020
14514
|
runPendingDeleteUndoRef.current = runPendingDeleteUndo;
|
|
15021
|
-
const handleLinkPopoverSubmit = (0,
|
|
14515
|
+
const handleLinkPopoverSubmit = (0, import_react12.useCallback)(
|
|
15022
14516
|
(target) => {
|
|
15023
14517
|
const session = linkPopoverSessionRef.current;
|
|
15024
14518
|
if (!session) return;
|
|
@@ -15083,19 +14577,19 @@ function OhhwellsBridge() {
|
|
|
15083
14577
|
const showEditLink = toolbarShowEditLink;
|
|
15084
14578
|
const currentSections = sectionsByPath[pathname] ?? [];
|
|
15085
14579
|
linkPopoverOpenRef.current = linkPopover !== null;
|
|
15086
|
-
const handleMediaReplace = (0,
|
|
14580
|
+
const handleMediaReplace = (0, import_react12.useCallback)(
|
|
15087
14581
|
(key) => {
|
|
15088
14582
|
postToParent2({ type: "ow:image-pick", key, elementType: mediaHover?.elementType ?? "image" });
|
|
15089
14583
|
},
|
|
15090
14584
|
[postToParent2, mediaHover?.elementType]
|
|
15091
14585
|
);
|
|
15092
|
-
const handleEditCarousel = (0,
|
|
14586
|
+
const handleEditCarousel = (0, import_react12.useCallback)(
|
|
15093
14587
|
(key) => {
|
|
15094
14588
|
postToParent2({ type: "ow:carousel-open", key, images: readCarouselValue(key) });
|
|
15095
14589
|
},
|
|
15096
14590
|
[postToParent2]
|
|
15097
14591
|
);
|
|
15098
|
-
const handleMediaFadeOutComplete = (0,
|
|
14592
|
+
const handleMediaFadeOutComplete = (0, import_react12.useCallback)((key) => {
|
|
15099
14593
|
setUploadingRects((prev) => {
|
|
15100
14594
|
if (!(key in prev)) return prev;
|
|
15101
14595
|
const next = { ...prev };
|
|
@@ -15103,7 +14597,7 @@ function OhhwellsBridge() {
|
|
|
15103
14597
|
return next;
|
|
15104
14598
|
});
|
|
15105
14599
|
}, []);
|
|
15106
|
-
const handleVideoSettingsChange = (0,
|
|
14600
|
+
const handleVideoSettingsChange = (0, import_react12.useCallback)(
|
|
15107
14601
|
(key, settings) => {
|
|
15108
14602
|
document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
|
|
15109
14603
|
const video = getVideoEl2(el);
|
|
@@ -15126,10 +14620,9 @@ function OhhwellsBridge() {
|
|
|
15126
14620
|
[postToParent2]
|
|
15127
14621
|
);
|
|
15128
14622
|
return bridgeRoot ? (0, import_react_dom3.createPortal)(
|
|
15129
|
-
/* @__PURE__ */ (0,
|
|
15130
|
-
/* @__PURE__ */ (0,
|
|
15131
|
-
|
|
15132
|
-
Object.entries(uploadingRects).map(([key, { rect, fadingOut }]) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
14623
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
|
|
14624
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { ref: attachVisibleViewport, "data-ohw-visible-viewport": "", "aria-hidden": true }),
|
|
14625
|
+
Object.entries(uploadingRects).map(([key, { rect, fadingOut }]) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15133
14626
|
MediaOverlay,
|
|
15134
14627
|
{
|
|
15135
14628
|
hover: { key, rect, elementType: "image", isDragOver: false, hasTextOverlap: false },
|
|
@@ -15140,7 +14633,7 @@ function OhhwellsBridge() {
|
|
|
15140
14633
|
},
|
|
15141
14634
|
`uploading-${key}`
|
|
15142
14635
|
)),
|
|
15143
|
-
mediaHover && !(mediaHover.key in uploadingRects) && /* @__PURE__ */ (0,
|
|
14636
|
+
mediaHover && !(mediaHover.key in uploadingRects) && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15144
14637
|
MediaOverlay,
|
|
15145
14638
|
{
|
|
15146
14639
|
hover: mediaHover,
|
|
@@ -15149,11 +14642,11 @@ function OhhwellsBridge() {
|
|
|
15149
14642
|
onVideoSettingsChange: handleVideoSettingsChange
|
|
15150
14643
|
}
|
|
15151
14644
|
),
|
|
15152
|
-
carouselHover && !linkPopover && !isItemDragging && /* @__PURE__ */ (0,
|
|
15153
|
-
siblingHintRect && !linkPopover && !isItemDragging && siblingHintRects.length === 0 && /* @__PURE__ */ (0,
|
|
15154
|
-
siblingHintRects.length > 0 && !linkPopover && !isItemDragging && siblingHintRects.map((rect, i) => /* @__PURE__ */ (0,
|
|
15155
|
-
isItemDragging && draggedItemRect && selectedElRef.current !== footerDragRef.current?.draggedEl && selectedElRef.current !== navDragRef.current?.draggedEl && /* @__PURE__ */ (0,
|
|
15156
|
-
isItemDragging && footerDropSlots.map((slot, i) => /* @__PURE__ */ (0,
|
|
14645
|
+
carouselHover && !linkPopover && !isItemDragging && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(CarouselOverlay, { hover: carouselHover, onEdit: handleEditCarousel }),
|
|
14646
|
+
siblingHintRect && !linkPopover && !isItemDragging && siblingHintRects.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ItemInteractionLayer, { rect: siblingHintRect, state: "sibling-hint" }),
|
|
14647
|
+
siblingHintRects.length > 0 && !linkPopover && !isItemDragging && siblingHintRects.map((rect, i) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ItemInteractionLayer, { rect, state: "sibling-hint" }, `sibling-hint-${i}`)),
|
|
14648
|
+
isItemDragging && draggedItemRect && selectedElRef.current !== footerDragRef.current?.draggedEl && selectedElRef.current !== navDragRef.current?.draggedEl && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ItemInteractionLayer, { rect: draggedItemRect, state: "dragging" }),
|
|
14649
|
+
isItemDragging && footerDropSlots.map((slot, i) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15157
14650
|
"div",
|
|
15158
14651
|
{
|
|
15159
14652
|
className: "pointer-events-none fixed z-2147483646",
|
|
@@ -15163,7 +14656,7 @@ function OhhwellsBridge() {
|
|
|
15163
14656
|
width: slot.width,
|
|
15164
14657
|
height: slot.height
|
|
15165
14658
|
},
|
|
15166
|
-
children: /* @__PURE__ */ (0,
|
|
14659
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15167
14660
|
DropIndicator,
|
|
15168
14661
|
{
|
|
15169
14662
|
direction: slot.direction,
|
|
@@ -15174,7 +14667,7 @@ function OhhwellsBridge() {
|
|
|
15174
14667
|
},
|
|
15175
14668
|
`footer-drop-${slot.direction}-${slot.columnIndex}-${slot.insertIndex}-${i}`
|
|
15176
14669
|
)),
|
|
15177
|
-
isItemDragging && navDropSlots.map((slot, i) => /* @__PURE__ */ (0,
|
|
14670
|
+
isItemDragging && navDropSlots.map((slot, i) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15178
14671
|
"div",
|
|
15179
14672
|
{
|
|
15180
14673
|
className: "pointer-events-none fixed z-2147483646",
|
|
@@ -15184,7 +14677,7 @@ function OhhwellsBridge() {
|
|
|
15184
14677
|
width: slot.width,
|
|
15185
14678
|
height: slot.height
|
|
15186
14679
|
},
|
|
15187
|
-
children: /* @__PURE__ */ (0,
|
|
14680
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15188
14681
|
DropIndicator,
|
|
15189
14682
|
{
|
|
15190
14683
|
direction: slot.direction,
|
|
@@ -15195,10 +14688,10 @@ function OhhwellsBridge() {
|
|
|
15195
14688
|
},
|
|
15196
14689
|
`nav-drop-${slot.direction}-${slot.parentId ?? "root"}-${slot.insertIndex}-${i}`
|
|
15197
14690
|
)),
|
|
15198
|
-
hoveredNavContainerRect && (toolbarVariant !== "select-frame" || isFooterFrameSelection) && !linkPopover && !isItemDragging && /* @__PURE__ */ (0,
|
|
15199
|
-
hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */ (0,
|
|
15200
|
-
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isNavbarLinksContainer2(selectedElRef.current) && /* @__PURE__ */ (0,
|
|
15201
|
-
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isFooterLinksContainer(selectedElRef.current) && /* @__PURE__ */ (0,
|
|
14691
|
+
hoveredNavContainerRect && (toolbarVariant !== "select-frame" || isFooterFrameSelection) && !linkPopover && !isItemDragging && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ItemInteractionLayer, { rect: hoveredNavContainerRect, state: "hover" }),
|
|
14692
|
+
hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ItemInteractionLayer, { rect: hoveredItemRect, state: "hover" }),
|
|
14693
|
+
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isNavbarLinksContainer2(selectedElRef.current) && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(NavbarContainerChrome, { rect: toolbarRect, onAdd: handleAddTopLevelNavItem }),
|
|
14694
|
+
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isFooterLinksContainer(selectedElRef.current) && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15202
14695
|
FooterContainerChrome,
|
|
15203
14696
|
{
|
|
15204
14697
|
rect: toolbarRect,
|
|
@@ -15206,7 +14699,7 @@ function OhhwellsBridge() {
|
|
|
15206
14699
|
addDisabled: !canAddFooterColumn()
|
|
15207
14700
|
}
|
|
15208
14701
|
),
|
|
15209
|
-
toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame") && /* @__PURE__ */ (0,
|
|
14702
|
+
toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame") && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15210
14703
|
ItemInteractionLayer,
|
|
15211
14704
|
{
|
|
15212
14705
|
rect: isItemDragging && draggedItemRect && (footerDragRef.current?.wasSelected || navDragRef.current?.wasSelected) ? draggedItemRect : toolbarRect,
|
|
@@ -15221,7 +14714,7 @@ function OhhwellsBridge() {
|
|
|
15221
14714
|
onItemPointerDown: handleItemChromePointerDown,
|
|
15222
14715
|
onItemClick: handleItemChromeClick,
|
|
15223
14716
|
itemDragSurface: !isFooterFrameSelection,
|
|
15224
|
-
toolbar: toolbarVariant === "link-action" && !isItemDragging || toolbarVariant === "select-frame" && isFooterFrameSelection && !isItemDragging ? /* @__PURE__ */ (0,
|
|
14717
|
+
toolbar: toolbarVariant === "link-action" && !isItemDragging || toolbarVariant === "select-frame" && isFooterFrameSelection && !isItemDragging ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15225
14718
|
ItemActionToolbar,
|
|
15226
14719
|
{
|
|
15227
14720
|
onEditLink: openLinkPopoverForSelected,
|
|
@@ -15246,8 +14739,8 @@ function OhhwellsBridge() {
|
|
|
15246
14739
|
) : void 0
|
|
15247
14740
|
}
|
|
15248
14741
|
),
|
|
15249
|
-
toolbarRect && toolbarVariant === "rich-text" && !linkPopover && /* @__PURE__ */ (0,
|
|
15250
|
-
/* @__PURE__ */ (0,
|
|
14742
|
+
toolbarRect && toolbarVariant === "rich-text" && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
|
|
14743
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15251
14744
|
EditGlowChrome,
|
|
15252
14745
|
{
|
|
15253
14746
|
rect: toolbarRect,
|
|
@@ -15257,7 +14750,7 @@ function OhhwellsBridge() {
|
|
|
15257
14750
|
hideHandle: isItemDragging
|
|
15258
14751
|
}
|
|
15259
14752
|
),
|
|
15260
|
-
/* @__PURE__ */ (0,
|
|
14753
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15261
14754
|
FloatingToolbar,
|
|
15262
14755
|
{
|
|
15263
14756
|
rect: toolbarRect,
|
|
@@ -15270,7 +14763,7 @@ function OhhwellsBridge() {
|
|
|
15270
14763
|
}
|
|
15271
14764
|
)
|
|
15272
14765
|
] }),
|
|
15273
|
-
maxBadge && /* @__PURE__ */ (0,
|
|
14766
|
+
maxBadge && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
|
|
15274
14767
|
"div",
|
|
15275
14768
|
{
|
|
15276
14769
|
"data-ohw-max-badge": "",
|
|
@@ -15296,7 +14789,7 @@ function OhhwellsBridge() {
|
|
|
15296
14789
|
]
|
|
15297
14790
|
}
|
|
15298
14791
|
),
|
|
15299
|
-
toggleState && !linkPopover && /* @__PURE__ */ (0,
|
|
14792
|
+
toggleState && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15300
14793
|
StateToggle,
|
|
15301
14794
|
{
|
|
15302
14795
|
rect: toggleState.rect,
|
|
@@ -15305,15 +14798,15 @@ function OhhwellsBridge() {
|
|
|
15305
14798
|
onStateChange: handleStateChange
|
|
15306
14799
|
}
|
|
15307
14800
|
),
|
|
15308
|
-
sectionGap && !linkPopover && /* @__PURE__ */ (0,
|
|
14801
|
+
sectionGap && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
|
|
15309
14802
|
"div",
|
|
15310
14803
|
{
|
|
15311
14804
|
"data-ohw-section-insert-line": "",
|
|
15312
14805
|
className: "fixed left-0 w-full z-2147483646 flex items-center pointer-events-none",
|
|
15313
14806
|
style: { top: sectionGap.y, transform: "translateY(-50%)" },
|
|
15314
14807
|
children: [
|
|
15315
|
-
/* @__PURE__ */ (0,
|
|
15316
|
-
/* @__PURE__ */ (0,
|
|
14808
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } }),
|
|
14809
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15317
14810
|
Badge,
|
|
15318
14811
|
{
|
|
15319
14812
|
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",
|
|
@@ -15330,11 +14823,11 @@ function OhhwellsBridge() {
|
|
|
15330
14823
|
children: "Add Section"
|
|
15331
14824
|
}
|
|
15332
14825
|
),
|
|
15333
|
-
/* @__PURE__ */ (0,
|
|
14826
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } })
|
|
15334
14827
|
]
|
|
15335
14828
|
}
|
|
15336
14829
|
),
|
|
15337
|
-
linkPopover && dialogPortalContainer ? /* @__PURE__ */ (0,
|
|
14830
|
+
linkPopover && dialogPortalContainer ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
15338
14831
|
LinkPopover,
|
|
15339
14832
|
{
|
|
15340
14833
|
panelRef: linkPopoverPanelRef,
|