@ohhwells/bridge 0.1.51-next.123 → 0.1.51-next.124
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/dist/index.cjs +725 -402
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +701 -378
- package/dist/index.js.map +1 -1
- package/dist/styles.css +4 -0
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -69,7 +69,7 @@ __export(index_exports, {
|
|
|
69
69
|
module.exports = __toCommonJS(index_exports);
|
|
70
70
|
|
|
71
71
|
// src/OhhwellsBridge.tsx
|
|
72
|
-
var
|
|
72
|
+
var import_react13 = __toESM(require("react"), 1);
|
|
73
73
|
var import_client = require("react-dom/client");
|
|
74
74
|
var import_react_dom2 = require("react-dom");
|
|
75
75
|
|
|
@@ -5306,29 +5306,12 @@ function CarouselOverlay({
|
|
|
5306
5306
|
);
|
|
5307
5307
|
}
|
|
5308
5308
|
|
|
5309
|
-
// src/
|
|
5310
|
-
var
|
|
5311
|
-
var
|
|
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
|
-
}
|
|
5309
|
+
// src/ui/ai-section/AiSectionOverlay.tsx
|
|
5310
|
+
var import_react6 = require("react");
|
|
5311
|
+
var import_lucide_react5 = require("lucide-react");
|
|
5330
5312
|
|
|
5331
5313
|
// src/lib/sections.ts
|
|
5314
|
+
var LINK_PICKER_EXCLUDED_IDS = /* @__PURE__ */ new Set(["navbar", "footer"]);
|
|
5332
5315
|
function titleCaseSectionId(id) {
|
|
5333
5316
|
return id.split("-").filter(Boolean).map((w) => w.charAt(0).toUpperCase() + w.slice(1)).join(" ");
|
|
5334
5317
|
}
|
|
@@ -5337,7 +5320,7 @@ function parseSectionsFromRoot(root) {
|
|
|
5337
5320
|
const sections = [];
|
|
5338
5321
|
for (const el of root.querySelectorAll("[data-ohw-section]")) {
|
|
5339
5322
|
const id = el.getAttribute("data-ohw-section") ?? "";
|
|
5340
|
-
if (!id || seen.has(id)) continue;
|
|
5323
|
+
if (!id || seen.has(id) || LINK_PICKER_EXCLUDED_IDS.has(id)) continue;
|
|
5341
5324
|
if (el.parentElement?.closest("[data-ohw-section]")) continue;
|
|
5342
5325
|
seen.add(id);
|
|
5343
5326
|
const label = el.getAttribute("data-ohw-section-label") ?? titleCaseSectionId(id);
|
|
@@ -5354,6 +5337,333 @@ function parseSectionsFromHtml(html) {
|
|
|
5354
5337
|
return parseSectionsFromRoot(doc);
|
|
5355
5338
|
}
|
|
5356
5339
|
|
|
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
|
+
|
|
5357
5667
|
// src/ui/link-modal/linkModal.utils.ts
|
|
5358
5668
|
function parseTarget(target) {
|
|
5359
5669
|
if (!target) return { pageRoute: "", sectionId: null };
|
|
@@ -5586,28 +5896,28 @@ function scrollToHashSectionWhenReady(behavior = "smooth") {
|
|
|
5586
5896
|
}
|
|
5587
5897
|
|
|
5588
5898
|
// src/ui/link-modal/LinkPopover.tsx
|
|
5589
|
-
var
|
|
5899
|
+
var import_react10 = require("react");
|
|
5590
5900
|
|
|
5591
5901
|
// src/ui/dialog.tsx
|
|
5592
5902
|
var React7 = __toESM(require("react"), 1);
|
|
5593
5903
|
var import_radix_ui6 = require("radix-ui");
|
|
5594
|
-
var
|
|
5595
|
-
var
|
|
5904
|
+
var import_lucide_react6 = require("lucide-react");
|
|
5905
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
5596
5906
|
function Dialog2({
|
|
5597
5907
|
...props
|
|
5598
5908
|
}) {
|
|
5599
|
-
return /* @__PURE__ */ (0,
|
|
5909
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_radix_ui6.Dialog.Root, { "data-slot": "dialog", ...props });
|
|
5600
5910
|
}
|
|
5601
5911
|
function DialogPortal({
|
|
5602
5912
|
...props
|
|
5603
5913
|
}) {
|
|
5604
|
-
return /* @__PURE__ */ (0,
|
|
5914
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_radix_ui6.Dialog.Portal, { ...props });
|
|
5605
5915
|
}
|
|
5606
5916
|
function DialogOverlay({
|
|
5607
5917
|
className,
|
|
5608
5918
|
...props
|
|
5609
5919
|
}) {
|
|
5610
|
-
return /* @__PURE__ */ (0,
|
|
5920
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
5611
5921
|
import_radix_ui6.Dialog.Overlay,
|
|
5612
5922
|
{
|
|
5613
5923
|
"data-slot": "dialog-overlay",
|
|
@@ -5620,9 +5930,9 @@ function DialogOverlay({
|
|
|
5620
5930
|
var DialogContent = React7.forwardRef(
|
|
5621
5931
|
({ className, children, showCloseButton = true, container, ...props }, ref) => {
|
|
5622
5932
|
const positionMode = container ? "absolute" : "fixed";
|
|
5623
|
-
return /* @__PURE__ */ (0,
|
|
5624
|
-
/* @__PURE__ */ (0,
|
|
5625
|
-
/* @__PURE__ */ (0,
|
|
5933
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(DialogPortal, { container: container ?? void 0, children: [
|
|
5934
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(DialogOverlay, { className: cn(positionMode, "inset-0") }),
|
|
5935
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
|
|
5626
5936
|
import_radix_ui6.Dialog.Content,
|
|
5627
5937
|
{
|
|
5628
5938
|
ref,
|
|
@@ -5638,13 +5948,13 @@ var DialogContent = React7.forwardRef(
|
|
|
5638
5948
|
...props,
|
|
5639
5949
|
children: [
|
|
5640
5950
|
children,
|
|
5641
|
-
showCloseButton ? /* @__PURE__ */ (0,
|
|
5951
|
+
showCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
5642
5952
|
import_radix_ui6.Dialog.Close,
|
|
5643
5953
|
{
|
|
5644
5954
|
type: "button",
|
|
5645
5955
|
className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50",
|
|
5646
5956
|
"aria-label": "Close",
|
|
5647
|
-
children: /* @__PURE__ */ (0,
|
|
5957
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_lucide_react6.X, { size: 16, "aria-hidden": true })
|
|
5648
5958
|
}
|
|
5649
5959
|
) : null
|
|
5650
5960
|
]
|
|
@@ -5658,13 +5968,13 @@ function DialogHeader({
|
|
|
5658
5968
|
className,
|
|
5659
5969
|
...props
|
|
5660
5970
|
}) {
|
|
5661
|
-
return /* @__PURE__ */ (0,
|
|
5971
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: cn("flex flex-col gap-1.5", className), ...props });
|
|
5662
5972
|
}
|
|
5663
5973
|
function DialogFooter({
|
|
5664
5974
|
className,
|
|
5665
5975
|
...props
|
|
5666
5976
|
}) {
|
|
5667
|
-
return /* @__PURE__ */ (0,
|
|
5977
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
5668
5978
|
"div",
|
|
5669
5979
|
{
|
|
5670
5980
|
className: cn("flex items-center justify-end gap-2", className),
|
|
@@ -5672,7 +5982,7 @@ function DialogFooter({
|
|
|
5672
5982
|
}
|
|
5673
5983
|
);
|
|
5674
5984
|
}
|
|
5675
|
-
var DialogTitle = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
5985
|
+
var DialogTitle = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
5676
5986
|
import_radix_ui6.Dialog.Title,
|
|
5677
5987
|
{
|
|
5678
5988
|
ref,
|
|
@@ -5684,7 +5994,7 @@ var DialogTitle = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE
|
|
|
5684
5994
|
}
|
|
5685
5995
|
));
|
|
5686
5996
|
DialogTitle.displayName = import_radix_ui6.Dialog.Title.displayName;
|
|
5687
|
-
var DialogDescription = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
5997
|
+
var DialogDescription = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
5688
5998
|
import_radix_ui6.Dialog.Description,
|
|
5689
5999
|
{
|
|
5690
6000
|
ref,
|
|
@@ -5696,63 +6006,63 @@ DialogDescription.displayName = import_radix_ui6.Dialog.Description.displayName;
|
|
|
5696
6006
|
var DialogClose = import_radix_ui6.Dialog.Close;
|
|
5697
6007
|
|
|
5698
6008
|
// src/ui/link-modal/LinkEditorPanel.tsx
|
|
5699
|
-
var
|
|
6009
|
+
var import_lucide_react10 = require("lucide-react");
|
|
5700
6010
|
|
|
5701
6011
|
// src/ui/link-modal/DestinationBreadcrumb.tsx
|
|
5702
|
-
var
|
|
5703
|
-
var
|
|
6012
|
+
var import_lucide_react7 = require("lucide-react");
|
|
6013
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
5704
6014
|
function DestinationBreadcrumb({
|
|
5705
6015
|
pageTitle,
|
|
5706
6016
|
sectionLabel
|
|
5707
6017
|
}) {
|
|
5708
|
-
return /* @__PURE__ */ (0,
|
|
5709
|
-
/* @__PURE__ */ (0,
|
|
5710
|
-
/* @__PURE__ */ (0,
|
|
5711
|
-
/* @__PURE__ */ (0,
|
|
5712
|
-
/* @__PURE__ */ (0,
|
|
5713
|
-
/* @__PURE__ */ (0,
|
|
6018
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex w-full flex-col gap-2", children: [
|
|
6019
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "text-sm font-medium! text-foreground m-0", children: "Destination" }),
|
|
6020
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex items-center gap-3", children: [
|
|
6021
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
6022
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_lucide_react7.File, { size: 16, className: "shrink-0 text-foreground", "aria-hidden": true }),
|
|
6023
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "text-sm font-medium leading-none text-foreground!", children: pageTitle })
|
|
5714
6024
|
] }),
|
|
5715
|
-
/* @__PURE__ */ (0,
|
|
5716
|
-
|
|
6025
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
6026
|
+
import_lucide_react7.ArrowRight,
|
|
5717
6027
|
{
|
|
5718
6028
|
size: 16,
|
|
5719
6029
|
className: "shrink-0 text-muted-foreground",
|
|
5720
6030
|
"aria-hidden": true
|
|
5721
6031
|
}
|
|
5722
6032
|
),
|
|
5723
|
-
/* @__PURE__ */ (0,
|
|
5724
|
-
/* @__PURE__ */ (0,
|
|
5725
|
-
|
|
6033
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
|
|
6034
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
6035
|
+
import_lucide_react7.GalleryVertical,
|
|
5726
6036
|
{
|
|
5727
6037
|
size: 16,
|
|
5728
6038
|
className: "shrink-0 text-foreground",
|
|
5729
6039
|
"aria-hidden": true
|
|
5730
6040
|
}
|
|
5731
6041
|
),
|
|
5732
|
-
/* @__PURE__ */ (0,
|
|
6042
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "truncate text-sm font-medium leading-none text-foreground", children: sectionLabel })
|
|
5733
6043
|
] })
|
|
5734
6044
|
] })
|
|
5735
6045
|
] });
|
|
5736
6046
|
}
|
|
5737
6047
|
|
|
5738
6048
|
// src/ui/link-modal/SectionTreeItem.tsx
|
|
5739
|
-
var
|
|
5740
|
-
var
|
|
6049
|
+
var import_lucide_react8 = require("lucide-react");
|
|
6050
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
5741
6051
|
function SectionTreeItem({
|
|
5742
6052
|
section,
|
|
5743
6053
|
onSelect,
|
|
5744
6054
|
selected
|
|
5745
6055
|
}) {
|
|
5746
6056
|
const interactive = Boolean(onSelect);
|
|
5747
|
-
return /* @__PURE__ */ (0,
|
|
5748
|
-
/* @__PURE__ */ (0,
|
|
6057
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex h-9 w-full items-end pl-3", children: [
|
|
6058
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
5749
6059
|
"div",
|
|
5750
6060
|
{
|
|
5751
6061
|
className: "mr-[-1px] h-9 w-2 shrink-0 rounded-bl-sm border-b border-l border-border mb-4",
|
|
5752
6062
|
"aria-hidden": true
|
|
5753
6063
|
}
|
|
5754
6064
|
),
|
|
5755
|
-
/* @__PURE__ */ (0,
|
|
6065
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
|
|
5756
6066
|
"div",
|
|
5757
6067
|
{
|
|
5758
6068
|
role: interactive ? "button" : void 0,
|
|
@@ -5770,15 +6080,15 @@ function SectionTreeItem({
|
|
|
5770
6080
|
interactive && selected && "border-primary"
|
|
5771
6081
|
),
|
|
5772
6082
|
children: [
|
|
5773
|
-
/* @__PURE__ */ (0,
|
|
5774
|
-
|
|
6083
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
6084
|
+
import_lucide_react8.GalleryVertical,
|
|
5775
6085
|
{
|
|
5776
6086
|
size: 16,
|
|
5777
6087
|
className: "shrink-0 text-foreground",
|
|
5778
6088
|
"aria-hidden": true
|
|
5779
6089
|
}
|
|
5780
6090
|
),
|
|
5781
|
-
/* @__PURE__ */ (0,
|
|
6091
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "truncate text-sm font-normal leading-5 text-foreground", children: section.label })
|
|
5782
6092
|
]
|
|
5783
6093
|
}
|
|
5784
6094
|
)
|
|
@@ -5786,14 +6096,14 @@ function SectionTreeItem({
|
|
|
5786
6096
|
}
|
|
5787
6097
|
|
|
5788
6098
|
// src/ui/link-modal/UrlOrPageInput.tsx
|
|
5789
|
-
var
|
|
6099
|
+
var import_react7 = require("react");
|
|
5790
6100
|
|
|
5791
6101
|
// src/ui/input.tsx
|
|
5792
6102
|
var React8 = __toESM(require("react"), 1);
|
|
5793
|
-
var
|
|
6103
|
+
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
5794
6104
|
var Input = React8.forwardRef(
|
|
5795
6105
|
({ className, type, ...props }, ref) => {
|
|
5796
|
-
return /* @__PURE__ */ (0,
|
|
6106
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
5797
6107
|
"input",
|
|
5798
6108
|
{
|
|
5799
6109
|
type,
|
|
@@ -5812,9 +6122,9 @@ Input.displayName = "Input";
|
|
|
5812
6122
|
|
|
5813
6123
|
// src/ui/label.tsx
|
|
5814
6124
|
var import_radix_ui7 = require("radix-ui");
|
|
5815
|
-
var
|
|
6125
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
5816
6126
|
function Label({ className, ...props }) {
|
|
5817
|
-
return /* @__PURE__ */ (0,
|
|
6127
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
5818
6128
|
import_radix_ui7.Label.Root,
|
|
5819
6129
|
{
|
|
5820
6130
|
"data-slot": "label",
|
|
@@ -5825,12 +6135,12 @@ function Label({ className, ...props }) {
|
|
|
5825
6135
|
}
|
|
5826
6136
|
|
|
5827
6137
|
// src/ui/link-modal/UrlOrPageInput.tsx
|
|
5828
|
-
var
|
|
5829
|
-
var
|
|
6138
|
+
var import_lucide_react9 = require("lucide-react");
|
|
6139
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
5830
6140
|
function FieldChevron({
|
|
5831
6141
|
onClick
|
|
5832
6142
|
}) {
|
|
5833
|
-
return /* @__PURE__ */ (0,
|
|
6143
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
5834
6144
|
"button",
|
|
5835
6145
|
{
|
|
5836
6146
|
type: "button",
|
|
@@ -5838,7 +6148,7 @@ function FieldChevron({
|
|
|
5838
6148
|
onClick,
|
|
5839
6149
|
"aria-label": "Open page list",
|
|
5840
6150
|
tabIndex: -1,
|
|
5841
|
-
children: /* @__PURE__ */ (0,
|
|
6151
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react9.ChevronDown, { size: 16 })
|
|
5842
6152
|
}
|
|
5843
6153
|
);
|
|
5844
6154
|
}
|
|
@@ -5854,11 +6164,11 @@ function UrlOrPageInput({
|
|
|
5854
6164
|
readOnly = false,
|
|
5855
6165
|
urlError
|
|
5856
6166
|
}) {
|
|
5857
|
-
const inputId = (0,
|
|
5858
|
-
const inputRef = (0,
|
|
5859
|
-
const rootRef = (0,
|
|
5860
|
-
const [isFocused, setIsFocused] = (0,
|
|
5861
|
-
(0,
|
|
6167
|
+
const inputId = (0, import_react7.useId)();
|
|
6168
|
+
const inputRef = (0, import_react7.useRef)(null);
|
|
6169
|
+
const rootRef = (0, import_react7.useRef)(null);
|
|
6170
|
+
const [isFocused, setIsFocused] = (0, import_react7.useState)(false);
|
|
6171
|
+
(0, import_react7.useEffect)(() => {
|
|
5862
6172
|
if (!dropdownOpen) return;
|
|
5863
6173
|
const isOutside = (e) => {
|
|
5864
6174
|
const root = rootRef.current;
|
|
@@ -5899,19 +6209,19 @@ function UrlOrPageInput({
|
|
|
5899
6209
|
"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]",
|
|
5900
6210
|
urlError ? "border-destructive shadow-[0_0_0_1px_var(--ohw-destructive)]" : isFocused ? "border-primary shadow-[0_0_0_1px_var(--ohw-primary)]" : "border-input"
|
|
5901
6211
|
);
|
|
5902
|
-
return /* @__PURE__ */ (0,
|
|
5903
|
-
/* @__PURE__ */ (0,
|
|
5904
|
-
/* @__PURE__ */ (0,
|
|
5905
|
-
/* @__PURE__ */ (0,
|
|
5906
|
-
selectedPage ? /* @__PURE__ */ (0,
|
|
5907
|
-
|
|
6212
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex w-full flex-col gap-2 p-0", children: [
|
|
6213
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Label, { htmlFor: inputId, className: cn(urlError && "text-destructive"), children: "Destination" }),
|
|
6214
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { ref: rootRef, className: "relative w-full", children: [
|
|
6215
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { "data-ohw-link-field": true, className: fieldClassName, children: [
|
|
6216
|
+
selectedPage ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "flex shrink-0 items-center pr-2", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
6217
|
+
import_lucide_react9.File,
|
|
5908
6218
|
{
|
|
5909
6219
|
size: 16,
|
|
5910
6220
|
className: "shrink-0 text-foreground",
|
|
5911
6221
|
"aria-hidden": true
|
|
5912
6222
|
}
|
|
5913
6223
|
) }) : null,
|
|
5914
|
-
readOnly ? /* @__PURE__ */ (0,
|
|
6224
|
+
readOnly ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "min-w-0 flex-1 truncate text-sm leading-5 text-foreground", children: selectedPage?.title ?? value }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
5915
6225
|
Input,
|
|
5916
6226
|
{
|
|
5917
6227
|
ref: inputRef,
|
|
@@ -5937,7 +6247,7 @@ function UrlOrPageInput({
|
|
|
5937
6247
|
)
|
|
5938
6248
|
}
|
|
5939
6249
|
),
|
|
5940
|
-
selectedPage && !readOnly ? /* @__PURE__ */ (0,
|
|
6250
|
+
selectedPage && !readOnly ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
5941
6251
|
"button",
|
|
5942
6252
|
{
|
|
5943
6253
|
type: "button",
|
|
@@ -5945,26 +6255,26 @@ function UrlOrPageInput({
|
|
|
5945
6255
|
onMouseDown: clearSelection,
|
|
5946
6256
|
"aria-label": "Clear selected page",
|
|
5947
6257
|
tabIndex: -1,
|
|
5948
|
-
children: /* @__PURE__ */ (0,
|
|
6258
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react9.X, { size: 16, "aria-hidden": true })
|
|
5949
6259
|
}
|
|
5950
6260
|
) : null,
|
|
5951
|
-
!readOnly ? /* @__PURE__ */ (0,
|
|
6261
|
+
!readOnly ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(FieldChevron, { onClick: toggleDropdown }) : null
|
|
5952
6262
|
] }),
|
|
5953
|
-
dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */ (0,
|
|
6263
|
+
dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
5954
6264
|
"div",
|
|
5955
6265
|
{
|
|
5956
6266
|
"data-ohw-link-page-dropdown": "",
|
|
5957
6267
|
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",
|
|
5958
6268
|
onMouseDown: (e) => e.preventDefault(),
|
|
5959
|
-
children: filteredPages.map((page) => /* @__PURE__ */ (0,
|
|
6269
|
+
children: filteredPages.map((page) => /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
5960
6270
|
"button",
|
|
5961
6271
|
{
|
|
5962
6272
|
type: "button",
|
|
5963
6273
|
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",
|
|
5964
6274
|
onClick: () => onPageSelect(page),
|
|
5965
6275
|
children: [
|
|
5966
|
-
/* @__PURE__ */ (0,
|
|
5967
|
-
/* @__PURE__ */ (0,
|
|
6276
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react9.File, { size: 16, className: "shrink-0", "aria-hidden": true }),
|
|
6277
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "truncate", children: page.title })
|
|
5968
6278
|
]
|
|
5969
6279
|
},
|
|
5970
6280
|
page.path
|
|
@@ -5972,34 +6282,34 @@ function UrlOrPageInput({
|
|
|
5972
6282
|
}
|
|
5973
6283
|
) : null
|
|
5974
6284
|
] }),
|
|
5975
|
-
urlError ? /* @__PURE__ */ (0,
|
|
6285
|
+
urlError ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-sm font-medium text-destructive", children: urlError }) : null
|
|
5976
6286
|
] });
|
|
5977
6287
|
}
|
|
5978
6288
|
|
|
5979
6289
|
// src/ui/link-modal/LinkEditorPanel.tsx
|
|
5980
|
-
var
|
|
6290
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
5981
6291
|
function LinkEditorPanel({ state, onClose }) {
|
|
5982
6292
|
const isCancel = state.secondaryLabel === "Cancel" || state.secondaryLabel === "Back to sections";
|
|
5983
|
-
return /* @__PURE__ */ (0,
|
|
5984
|
-
/* @__PURE__ */ (0,
|
|
6293
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
|
|
6294
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DialogClose, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
5985
6295
|
"button",
|
|
5986
6296
|
{
|
|
5987
6297
|
type: "button",
|
|
5988
6298
|
className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50 h-7",
|
|
5989
6299
|
"aria-label": "Close",
|
|
5990
6300
|
onClick: onClose,
|
|
5991
|
-
children: /* @__PURE__ */ (0,
|
|
6301
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react10.X, { size: 16, "aria-hidden": true })
|
|
5992
6302
|
}
|
|
5993
6303
|
) }),
|
|
5994
|
-
/* @__PURE__ */ (0,
|
|
5995
|
-
/* @__PURE__ */ (0,
|
|
5996
|
-
state.showBreadcrumb && state.selectedPage && state.selectedSection ? /* @__PURE__ */ (0,
|
|
6304
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DialogHeader, { className: "w-full gap-1.5 p-6 pr-12", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DialogTitle, { className: "m-0 w-full break-words", children: state.title }) }),
|
|
6305
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex w-full flex-col gap-3 px-6 pb-8 pt-1", children: [
|
|
6306
|
+
state.showBreadcrumb && state.selectedPage && state.selectedSection ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
5997
6307
|
DestinationBreadcrumb,
|
|
5998
6308
|
{
|
|
5999
6309
|
pageTitle: state.selectedPage.title,
|
|
6000
6310
|
sectionLabel: state.selectedSection.label
|
|
6001
6311
|
}
|
|
6002
|
-
) : /* @__PURE__ */ (0,
|
|
6312
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
6003
6313
|
UrlOrPageInput,
|
|
6004
6314
|
{
|
|
6005
6315
|
value: state.searchValue,
|
|
@@ -6012,8 +6322,8 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
6012
6322
|
urlError: state.urlError
|
|
6013
6323
|
}
|
|
6014
6324
|
),
|
|
6015
|
-
state.showChooseSection ? /* @__PURE__ */ (0,
|
|
6016
|
-
/* @__PURE__ */ (0,
|
|
6325
|
+
state.showChooseSection ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-col justify-center gap-2", children: [
|
|
6326
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
6017
6327
|
Button,
|
|
6018
6328
|
{
|
|
6019
6329
|
type: "button",
|
|
@@ -6024,15 +6334,15 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
6024
6334
|
children: "Choose a section"
|
|
6025
6335
|
}
|
|
6026
6336
|
),
|
|
6027
|
-
/* @__PURE__ */ (0,
|
|
6028
|
-
/* @__PURE__ */ (0,
|
|
6029
|
-
/* @__PURE__ */ (0,
|
|
6337
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center gap-1 text-sm text-muted-foreground", children: [
|
|
6338
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react10.Info, { size: 16, className: "shrink-0", "aria-hidden": true }),
|
|
6339
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: "Pick a section this link should scroll to." })
|
|
6030
6340
|
] })
|
|
6031
6341
|
] }) : null,
|
|
6032
|
-
state.showSectionRow && state.selectedSection ? /* @__PURE__ */ (0,
|
|
6342
|
+
state.showSectionRow && state.selectedSection ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SectionTreeItem, { section: state.selectedSection, selected: true }) : null
|
|
6033
6343
|
] }),
|
|
6034
|
-
/* @__PURE__ */ (0,
|
|
6035
|
-
/* @__PURE__ */ (0,
|
|
6344
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(DialogFooter, { className: "w-full px-6 pb-6", children: [
|
|
6345
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
6036
6346
|
Button,
|
|
6037
6347
|
{
|
|
6038
6348
|
type: "button",
|
|
@@ -6047,7 +6357,7 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
6047
6357
|
children: state.secondaryLabel
|
|
6048
6358
|
}
|
|
6049
6359
|
),
|
|
6050
|
-
/* @__PURE__ */ (0,
|
|
6360
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
6051
6361
|
Button,
|
|
6052
6362
|
{
|
|
6053
6363
|
type: "button",
|
|
@@ -6066,11 +6376,11 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
6066
6376
|
}
|
|
6067
6377
|
|
|
6068
6378
|
// src/ui/link-modal/SectionPickerOverlay.tsx
|
|
6069
|
-
var
|
|
6379
|
+
var import_react8 = require("react");
|
|
6070
6380
|
var import_react_dom = require("react-dom");
|
|
6071
|
-
var
|
|
6381
|
+
var import_lucide_react11 = require("lucide-react");
|
|
6072
6382
|
var import_navigation = require("next/navigation");
|
|
6073
|
-
var
|
|
6383
|
+
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
6074
6384
|
var DIM_OVERLAY = "rgba(0, 0, 0, 0.45)";
|
|
6075
6385
|
function rectsEqual(a, b) {
|
|
6076
6386
|
if (a.size !== b.size) return false;
|
|
@@ -6103,12 +6413,12 @@ function hitTestSectionId(x, y, sectionIds, rects) {
|
|
|
6103
6413
|
return null;
|
|
6104
6414
|
}
|
|
6105
6415
|
function useSectionRects(sectionIdsKey, enabled) {
|
|
6106
|
-
const [rects, setRects] = (0,
|
|
6107
|
-
const sectionIds = (0,
|
|
6416
|
+
const [rects, setRects] = (0, import_react8.useState)(/* @__PURE__ */ new Map());
|
|
6417
|
+
const sectionIds = (0, import_react8.useMemo)(
|
|
6108
6418
|
() => sectionIdsKey ? sectionIdsKey.split("\0") : [],
|
|
6109
6419
|
[sectionIdsKey]
|
|
6110
6420
|
);
|
|
6111
|
-
(0,
|
|
6421
|
+
(0, import_react8.useEffect)(() => {
|
|
6112
6422
|
if (!enabled || sectionIds.length === 0) {
|
|
6113
6423
|
setRects((prev) => prev.size === 0 ? prev : /* @__PURE__ */ new Map());
|
|
6114
6424
|
return;
|
|
@@ -6149,13 +6459,13 @@ function SectionPickerOverlay({
|
|
|
6149
6459
|
}) {
|
|
6150
6460
|
const router = (0, import_navigation.useRouter)();
|
|
6151
6461
|
const pathname = (0, import_navigation.usePathname)();
|
|
6152
|
-
const [selectedId, setSelectedId] = (0,
|
|
6153
|
-
const [hoveredId, setHoveredId] = (0,
|
|
6154
|
-
const pointerRef = (0,
|
|
6155
|
-
const pointerScreenRef = (0,
|
|
6156
|
-
const iframeOffsetTopRef = (0,
|
|
6157
|
-
const sectionIdsRef = (0,
|
|
6158
|
-
const [chromeClip, setChromeClip] = (0,
|
|
6462
|
+
const [selectedId, setSelectedId] = (0, import_react8.useState)(null);
|
|
6463
|
+
const [hoveredId, setHoveredId] = (0, import_react8.useState)(null);
|
|
6464
|
+
const pointerRef = (0, import_react8.useRef)(null);
|
|
6465
|
+
const pointerScreenRef = (0, import_react8.useRef)(null);
|
|
6466
|
+
const iframeOffsetTopRef = (0, import_react8.useRef)(null);
|
|
6467
|
+
const sectionIdsRef = (0, import_react8.useRef)([]);
|
|
6468
|
+
const [chromeClip, setChromeClip] = (0, import_react8.useState)(
|
|
6159
6469
|
() => ({
|
|
6160
6470
|
top: 0,
|
|
6161
6471
|
bottom: typeof window !== "undefined" ? window.innerHeight : 0
|
|
@@ -6163,12 +6473,12 @@ function SectionPickerOverlay({
|
|
|
6163
6473
|
);
|
|
6164
6474
|
const normalizedTarget = normalizePath(pagePath);
|
|
6165
6475
|
const isOnTargetPage = normalizePath(pathname) === normalizedTarget;
|
|
6166
|
-
(0,
|
|
6476
|
+
(0, import_react8.useEffect)(() => {
|
|
6167
6477
|
if (isOnTargetPage) return;
|
|
6168
6478
|
const search = readPreservedSearch();
|
|
6169
6479
|
router.push(`${normalizedTarget}${search}`);
|
|
6170
6480
|
}, [isOnTargetPage, normalizedTarget, router]);
|
|
6171
|
-
(0,
|
|
6481
|
+
(0, import_react8.useEffect)(() => {
|
|
6172
6482
|
document.documentElement.setAttribute("data-ohw-section-picking", "");
|
|
6173
6483
|
document.querySelectorAll("[data-ohw-hovered]").forEach((el) => {
|
|
6174
6484
|
el.removeAttribute("data-ohw-hovered");
|
|
@@ -6180,24 +6490,24 @@ function SectionPickerOverlay({
|
|
|
6180
6490
|
document.documentElement.removeAttribute("data-ohw-section-picking");
|
|
6181
6491
|
};
|
|
6182
6492
|
}, []);
|
|
6183
|
-
const liveSections = (0,
|
|
6493
|
+
const liveSections = (0, import_react8.useMemo)(() => {
|
|
6184
6494
|
if (!isOnTargetPage) return sections;
|
|
6185
6495
|
const live = collectSectionsFromDom();
|
|
6186
6496
|
if (live.length === 0) return sections;
|
|
6187
6497
|
const labels = new Map(sections.map((s) => [s.id, s.label]));
|
|
6188
6498
|
return live.map((s) => ({ id: s.id, label: labels.get(s.id) ?? s.label }));
|
|
6189
6499
|
}, [isOnTargetPage, sections, pathname]);
|
|
6190
|
-
const sectionIdsKey = (0,
|
|
6500
|
+
const sectionIdsKey = (0, import_react8.useMemo)(
|
|
6191
6501
|
() => liveSections.map((s) => s.id).join("\0"),
|
|
6192
6502
|
[liveSections]
|
|
6193
6503
|
);
|
|
6194
|
-
const sectionIds = (0,
|
|
6504
|
+
const sectionIds = (0, import_react8.useMemo)(
|
|
6195
6505
|
() => liveSections.map((s) => s.id),
|
|
6196
6506
|
[liveSections]
|
|
6197
6507
|
);
|
|
6198
6508
|
sectionIdsRef.current = sectionIds;
|
|
6199
6509
|
const rects = useSectionRects(sectionIdsKey, isOnTargetPage);
|
|
6200
|
-
const applyHoverAt = (0,
|
|
6510
|
+
const applyHoverAt = (0, import_react8.useCallback)(
|
|
6201
6511
|
(x, y, liveRects) => {
|
|
6202
6512
|
const ids = sectionIdsRef.current;
|
|
6203
6513
|
const map = liveRects ?? readSectionRects(ids);
|
|
@@ -6206,7 +6516,7 @@ function SectionPickerOverlay({
|
|
|
6206
6516
|
},
|
|
6207
6517
|
[]
|
|
6208
6518
|
);
|
|
6209
|
-
(0,
|
|
6519
|
+
(0, import_react8.useEffect)(() => {
|
|
6210
6520
|
const applyClip = (iframeOffsetTop, visibleCanvasTop, canvasH) => {
|
|
6211
6521
|
const top = Math.max(0, visibleCanvasTop - iframeOffsetTop);
|
|
6212
6522
|
const bottom = Math.min(
|
|
@@ -6248,12 +6558,12 @@ function SectionPickerOverlay({
|
|
|
6248
6558
|
window.removeEventListener("resize", onResize);
|
|
6249
6559
|
};
|
|
6250
6560
|
}, [applyHoverAt]);
|
|
6251
|
-
(0,
|
|
6561
|
+
(0, import_react8.useEffect)(() => {
|
|
6252
6562
|
const ptr = pointerRef.current;
|
|
6253
6563
|
if (!ptr) return;
|
|
6254
6564
|
applyHoverAt(ptr.x, ptr.y, rects);
|
|
6255
6565
|
}, [rects, applyHoverAt]);
|
|
6256
|
-
(0,
|
|
6566
|
+
(0, import_react8.useEffect)(() => {
|
|
6257
6567
|
const rememberPointer = (clientX, clientY) => {
|
|
6258
6568
|
pointerRef.current = { x: clientX, y: clientY };
|
|
6259
6569
|
const top = iframeOffsetTopRef.current;
|
|
@@ -6277,7 +6587,7 @@ function SectionPickerOverlay({
|
|
|
6277
6587
|
window.removeEventListener("message", onPointerSync);
|
|
6278
6588
|
};
|
|
6279
6589
|
}, [rects, applyHoverAt]);
|
|
6280
|
-
const handleSelect = (0,
|
|
6590
|
+
const handleSelect = (0, import_react8.useCallback)(
|
|
6281
6591
|
(section) => {
|
|
6282
6592
|
if (selectedId) return;
|
|
6283
6593
|
setSelectedId(section.id);
|
|
@@ -6285,7 +6595,7 @@ function SectionPickerOverlay({
|
|
|
6285
6595
|
},
|
|
6286
6596
|
[selectedId, onSelect]
|
|
6287
6597
|
);
|
|
6288
|
-
(0,
|
|
6598
|
+
(0, import_react8.useEffect)(() => {
|
|
6289
6599
|
const onKeyDown = (e) => {
|
|
6290
6600
|
if (e.key === "Escape") {
|
|
6291
6601
|
e.preventDefault();
|
|
@@ -6299,7 +6609,7 @@ function SectionPickerOverlay({
|
|
|
6299
6609
|
const portalRoot = typeof document !== "undefined" ? document.querySelector("[data-ohw-bridge-root]") ?? document.body : null;
|
|
6300
6610
|
if (!portalRoot) return null;
|
|
6301
6611
|
return (0, import_react_dom.createPortal)(
|
|
6302
|
-
/* @__PURE__ */ (0,
|
|
6612
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
|
|
6303
6613
|
"div",
|
|
6304
6614
|
{
|
|
6305
6615
|
"data-ohw-section-picker": "",
|
|
@@ -6309,12 +6619,12 @@ function SectionPickerOverlay({
|
|
|
6309
6619
|
role: "dialog",
|
|
6310
6620
|
"aria-label": "Choose a section",
|
|
6311
6621
|
children: [
|
|
6312
|
-
/* @__PURE__ */ (0,
|
|
6622
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
6313
6623
|
"div",
|
|
6314
6624
|
{
|
|
6315
6625
|
className: "pointer-events-auto fixed left-5 z-[2]",
|
|
6316
6626
|
style: { top: chromeClip.top + 20 },
|
|
6317
|
-
children: /* @__PURE__ */ (0,
|
|
6627
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
|
|
6318
6628
|
Button,
|
|
6319
6629
|
{
|
|
6320
6630
|
type: "button",
|
|
@@ -6323,14 +6633,14 @@ function SectionPickerOverlay({
|
|
|
6323
6633
|
className: "h-8 min-w-0 gap-1 border-border bg-background px-2 py-1.5 shadow-sm hover:bg-muted cursor-pointer",
|
|
6324
6634
|
onClick: onBack,
|
|
6325
6635
|
children: [
|
|
6326
|
-
/* @__PURE__ */ (0,
|
|
6636
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react11.ArrowLeft, { className: "size-4 shrink-0", "aria-hidden": true }),
|
|
6327
6637
|
"Back"
|
|
6328
6638
|
]
|
|
6329
6639
|
}
|
|
6330
6640
|
)
|
|
6331
6641
|
}
|
|
6332
6642
|
),
|
|
6333
|
-
/* @__PURE__ */ (0,
|
|
6643
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
6334
6644
|
"div",
|
|
6335
6645
|
{
|
|
6336
6646
|
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",
|
|
@@ -6343,7 +6653,7 @@ function SectionPickerOverlay({
|
|
|
6343
6653
|
children: "Click on section to select"
|
|
6344
6654
|
}
|
|
6345
6655
|
),
|
|
6346
|
-
!isOnTargetPage ? /* @__PURE__ */ (0,
|
|
6656
|
+
!isOnTargetPage ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
6347
6657
|
"div",
|
|
6348
6658
|
{
|
|
6349
6659
|
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",
|
|
@@ -6351,14 +6661,14 @@ function SectionPickerOverlay({
|
|
|
6351
6661
|
children: "Loading page preview\u2026"
|
|
6352
6662
|
}
|
|
6353
6663
|
) : null,
|
|
6354
|
-
isOnTargetPage && liveSections.length === 0 ? /* @__PURE__ */ (0,
|
|
6664
|
+
isOnTargetPage && liveSections.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "pointer-events-auto fixed inset-0 z-[1] flex items-center justify-center bg-muted/40", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { className: "text-sm text-muted-foreground", children: "No sections found on this page." }) }) : null,
|
|
6355
6665
|
isOnTargetPage ? liveSections.map((section) => {
|
|
6356
6666
|
const rect = rects.get(section.id);
|
|
6357
6667
|
if (!rect || rect.width <= 0 || rect.height <= 0) return null;
|
|
6358
6668
|
const isSelected = selectedId === section.id;
|
|
6359
6669
|
const isHovered = hoveredId === section.id;
|
|
6360
6670
|
const isLit = isSelected || isHovered;
|
|
6361
|
-
return /* @__PURE__ */ (0,
|
|
6671
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
|
|
6362
6672
|
"button",
|
|
6363
6673
|
{
|
|
6364
6674
|
type: "button",
|
|
@@ -6373,7 +6683,7 @@ function SectionPickerOverlay({
|
|
|
6373
6683
|
"aria-label": `Select section ${section.label}`,
|
|
6374
6684
|
onClick: () => handleSelect(section),
|
|
6375
6685
|
children: [
|
|
6376
|
-
isLit ? /* @__PURE__ */ (0,
|
|
6686
|
+
isLit ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
6377
6687
|
"span",
|
|
6378
6688
|
{
|
|
6379
6689
|
className: "pointer-events-none absolute",
|
|
@@ -6386,13 +6696,13 @@ function SectionPickerOverlay({
|
|
|
6386
6696
|
"aria-hidden": true
|
|
6387
6697
|
}
|
|
6388
6698
|
) : null,
|
|
6389
|
-
isSelected ? /* @__PURE__ */ (0,
|
|
6699
|
+
isSelected ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
6390
6700
|
"span",
|
|
6391
6701
|
{
|
|
6392
6702
|
className: "absolute right-3 top-3 flex size-8 items-center justify-center rounded-full text-white",
|
|
6393
6703
|
style: { backgroundColor: "var(--ohw-primary, #0885fe)" },
|
|
6394
6704
|
"aria-hidden": true,
|
|
6395
|
-
children: /* @__PURE__ */ (0,
|
|
6705
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react11.Check, { className: "size-5" })
|
|
6396
6706
|
}
|
|
6397
6707
|
) : null
|
|
6398
6708
|
]
|
|
@@ -6408,7 +6718,7 @@ function SectionPickerOverlay({
|
|
|
6408
6718
|
}
|
|
6409
6719
|
|
|
6410
6720
|
// src/ui/link-modal/useLinkModalState.ts
|
|
6411
|
-
var
|
|
6721
|
+
var import_react9 = require("react");
|
|
6412
6722
|
function useLinkModalState({
|
|
6413
6723
|
open,
|
|
6414
6724
|
mode,
|
|
@@ -6420,14 +6730,14 @@ function useLinkModalState({
|
|
|
6420
6730
|
onClose,
|
|
6421
6731
|
onSubmit
|
|
6422
6732
|
}) {
|
|
6423
|
-
const availablePages = (0,
|
|
6424
|
-
const [searchValue, setSearchValue] = (0,
|
|
6425
|
-
const [selectedPage, setSelectedPage] = (0,
|
|
6426
|
-
const [selectedSection, setSelectedSection] = (0,
|
|
6427
|
-
const [step, setStep] = (0,
|
|
6428
|
-
const [dropdownOpen, setDropdownOpen] = (0,
|
|
6429
|
-
const [urlError, setUrlError] = (0,
|
|
6430
|
-
const reset = (0,
|
|
6733
|
+
const availablePages = (0, import_react9.useMemo)(() => pages, [pages]);
|
|
6734
|
+
const [searchValue, setSearchValue] = (0, import_react9.useState)("");
|
|
6735
|
+
const [selectedPage, setSelectedPage] = (0, import_react9.useState)(null);
|
|
6736
|
+
const [selectedSection, setSelectedSection] = (0, import_react9.useState)(null);
|
|
6737
|
+
const [step, setStep] = (0, import_react9.useState)("input");
|
|
6738
|
+
const [dropdownOpen, setDropdownOpen] = (0, import_react9.useState)(false);
|
|
6739
|
+
const [urlError, setUrlError] = (0, import_react9.useState)("");
|
|
6740
|
+
const reset = (0, import_react9.useCallback)(() => {
|
|
6431
6741
|
setSearchValue("");
|
|
6432
6742
|
setSelectedPage(null);
|
|
6433
6743
|
setSelectedSection(null);
|
|
@@ -6435,7 +6745,7 @@ function useLinkModalState({
|
|
|
6435
6745
|
setDropdownOpen(false);
|
|
6436
6746
|
setUrlError("");
|
|
6437
6747
|
}, []);
|
|
6438
|
-
(0,
|
|
6748
|
+
(0, import_react9.useEffect)(() => {
|
|
6439
6749
|
if (!open) return;
|
|
6440
6750
|
if (mode === "edit" && initialTarget) {
|
|
6441
6751
|
const { pageRoute } = parseTarget(initialTarget);
|
|
@@ -6451,11 +6761,11 @@ function useLinkModalState({
|
|
|
6451
6761
|
setDropdownOpen(false);
|
|
6452
6762
|
setUrlError("");
|
|
6453
6763
|
}, [open, mode, initialTarget, reset]);
|
|
6454
|
-
const filteredPages = (0,
|
|
6764
|
+
const filteredPages = (0, import_react9.useMemo)(() => {
|
|
6455
6765
|
if (!searchValue.trim()) return availablePages;
|
|
6456
6766
|
return availablePages.filter((p) => p.title.toLowerCase().startsWith(searchValue.toLowerCase()));
|
|
6457
6767
|
}, [availablePages, searchValue]);
|
|
6458
|
-
const activeSections = (0,
|
|
6768
|
+
const activeSections = (0, import_react9.useMemo)(() => {
|
|
6459
6769
|
if (!selectedPage) return [];
|
|
6460
6770
|
return getSectionsForPath(sectionsByPath, selectedPage.path);
|
|
6461
6771
|
}, [selectedPage, sectionsByPath]);
|
|
@@ -6504,7 +6814,7 @@ function useLinkModalState({
|
|
|
6504
6814
|
reset();
|
|
6505
6815
|
onClose();
|
|
6506
6816
|
};
|
|
6507
|
-
const isValid = (0,
|
|
6817
|
+
const isValid = (0, import_react9.useMemo)(() => {
|
|
6508
6818
|
if (urlError) return false;
|
|
6509
6819
|
if (showBreadcrumb) return true;
|
|
6510
6820
|
if (selectedPage) return true;
|
|
@@ -6572,7 +6882,7 @@ function useLinkModalState({
|
|
|
6572
6882
|
}
|
|
6573
6883
|
|
|
6574
6884
|
// src/ui/link-modal/LinkPopover.tsx
|
|
6575
|
-
var
|
|
6885
|
+
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
6576
6886
|
function postToParent(data) {
|
|
6577
6887
|
window.parent?.postMessage(data, "*");
|
|
6578
6888
|
}
|
|
@@ -6601,7 +6911,7 @@ function LinkPopover({
|
|
|
6601
6911
|
onSubmit
|
|
6602
6912
|
});
|
|
6603
6913
|
const sectionPickerActive = state.showSectionPicker && Boolean(state.selectedPage);
|
|
6604
|
-
(0,
|
|
6914
|
+
(0, import_react10.useEffect)(() => {
|
|
6605
6915
|
if (!open) return;
|
|
6606
6916
|
if (sectionPickerActive) {
|
|
6607
6917
|
postToParent({ type: "ui:unlock" });
|
|
@@ -6668,15 +6978,15 @@ function LinkPopover({
|
|
|
6668
6978
|
);
|
|
6669
6979
|
};
|
|
6670
6980
|
}, [open, sectionPickerActive]);
|
|
6671
|
-
return /* @__PURE__ */ (0,
|
|
6672
|
-
/* @__PURE__ */ (0,
|
|
6981
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
|
|
6982
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
6673
6983
|
Dialog2,
|
|
6674
6984
|
{
|
|
6675
6985
|
open: open && !sectionPickerActive,
|
|
6676
6986
|
onOpenChange: (next) => {
|
|
6677
6987
|
if (!next) onClose?.();
|
|
6678
6988
|
},
|
|
6679
|
-
children: /* @__PURE__ */ (0,
|
|
6989
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
6680
6990
|
DialogContent,
|
|
6681
6991
|
{
|
|
6682
6992
|
ref: panelRef,
|
|
@@ -6686,12 +6996,12 @@ function LinkPopover({
|
|
|
6686
6996
|
"data-ohw-bridge": "",
|
|
6687
6997
|
showCloseButton: false,
|
|
6688
6998
|
className: "gap-0 p-0 w-full max-w-[448px] pointer-events-auto z-[2147483646] overflow-visible",
|
|
6689
|
-
children: /* @__PURE__ */ (0,
|
|
6999
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(LinkEditorPanel, { state, onClose })
|
|
6690
7000
|
}
|
|
6691
7001
|
)
|
|
6692
7002
|
}
|
|
6693
7003
|
),
|
|
6694
|
-
sectionPickerActive && state.selectedPage ? /* @__PURE__ */ (0,
|
|
7004
|
+
sectionPickerActive && state.selectedPage ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
6695
7005
|
SectionPickerOverlay,
|
|
6696
7006
|
{
|
|
6697
7007
|
pagePath: state.selectedPage.path,
|
|
@@ -8896,7 +9206,7 @@ function hitTestNavDropSlot(clientX, clientY, draggedHrefKey) {
|
|
|
8896
9206
|
}
|
|
8897
9207
|
|
|
8898
9208
|
// src/useNavItemDrag.ts
|
|
8899
|
-
var
|
|
9209
|
+
var import_react11 = require("react");
|
|
8900
9210
|
function useNavItemDrag({
|
|
8901
9211
|
isEditMode,
|
|
8902
9212
|
editContentRef,
|
|
@@ -8921,11 +9231,11 @@ function useNavItemDrag({
|
|
|
8921
9231
|
isDragHandleDisabled: isDragHandleDisabled2,
|
|
8922
9232
|
isNavbarButton: isNavbarButton3
|
|
8923
9233
|
}) {
|
|
8924
|
-
const navDragRef = (0,
|
|
8925
|
-
const [navDropSlots, setNavDropSlots] = (0,
|
|
8926
|
-
const [activeNavDropIndex, setActiveNavDropIndex] = (0,
|
|
8927
|
-
const navPointerDragRef = (0,
|
|
8928
|
-
const clearNavDragVisuals = (0,
|
|
9234
|
+
const navDragRef = (0, import_react11.useRef)(null);
|
|
9235
|
+
const [navDropSlots, setNavDropSlots] = (0, import_react11.useState)([]);
|
|
9236
|
+
const [activeNavDropIndex, setActiveNavDropIndex] = (0, import_react11.useState)(null);
|
|
9237
|
+
const navPointerDragRef = (0, import_react11.useRef)(null);
|
|
9238
|
+
const clearNavDragVisuals = (0, import_react11.useCallback)(() => {
|
|
8929
9239
|
const session = navDragRef.current;
|
|
8930
9240
|
const keepOpenEl = session?.draggedEl?.closest("[data-ohw-nav-children]") != null ? session.draggedEl : null;
|
|
8931
9241
|
navDragRef.current = null;
|
|
@@ -8942,7 +9252,7 @@ function useNavItemDrag({
|
|
|
8942
9252
|
document.documentElement.removeAttribute("data-ohw-nav-dragging-root");
|
|
8943
9253
|
unlockItemDragInteraction();
|
|
8944
9254
|
}, [setDraggedItemRect, setIsItemDragging, setSiblingHintRects]);
|
|
8945
|
-
const refreshNavDragVisuals = (0,
|
|
9255
|
+
const refreshNavDragVisuals = (0, import_react11.useCallback)(
|
|
8946
9256
|
(session, activeSlot, clientX, clientY) => {
|
|
8947
9257
|
setDraggedItemRect(session.draggedEl.getBoundingClientRect());
|
|
8948
9258
|
if (typeof clientX === "number" && typeof clientY === "number") {
|
|
@@ -8960,13 +9270,13 @@ function useNavItemDrag({
|
|
|
8960
9270
|
},
|
|
8961
9271
|
[setDraggedItemRect, setSiblingHintRects]
|
|
8962
9272
|
);
|
|
8963
|
-
const refreshNavDragVisualsRef = (0,
|
|
9273
|
+
const refreshNavDragVisualsRef = (0, import_react11.useRef)(refreshNavDragVisuals);
|
|
8964
9274
|
refreshNavDragVisualsRef.current = refreshNavDragVisuals;
|
|
8965
|
-
const commitNavDragRef = (0,
|
|
9275
|
+
const commitNavDragRef = (0, import_react11.useRef)(() => {
|
|
8966
9276
|
});
|
|
8967
|
-
const beginNavDragRef = (0,
|
|
9277
|
+
const beginNavDragRef = (0, import_react11.useRef)(() => {
|
|
8968
9278
|
});
|
|
8969
|
-
const beginNavDrag = (0,
|
|
9279
|
+
const beginNavDrag = (0, import_react11.useCallback)(
|
|
8970
9280
|
(session) => {
|
|
8971
9281
|
const rect = session.draggedEl.getBoundingClientRect();
|
|
8972
9282
|
session.lastClientX = session.lastClientX || rect.left + rect.width / 2;
|
|
@@ -9000,7 +9310,7 @@ function useNavItemDrag({
|
|
|
9000
9310
|
]
|
|
9001
9311
|
);
|
|
9002
9312
|
beginNavDragRef.current = beginNavDrag;
|
|
9003
|
-
const commitNavDrag = (0,
|
|
9313
|
+
const commitNavDrag = (0, import_react11.useCallback)(
|
|
9004
9314
|
(clientX, clientY) => {
|
|
9005
9315
|
const session = navDragRef.current;
|
|
9006
9316
|
if (!session) {
|
|
@@ -9061,7 +9371,7 @@ function useNavItemDrag({
|
|
|
9061
9371
|
[clearNavDragVisuals, deselectRef, editContentRef, postToParentRef, selectRef]
|
|
9062
9372
|
);
|
|
9063
9373
|
commitNavDragRef.current = commitNavDrag;
|
|
9064
|
-
const startNavLinkDrag = (0,
|
|
9374
|
+
const startNavLinkDrag = (0, import_react11.useCallback)(
|
|
9065
9375
|
(anchor, clientX, clientY, wasSelected) => {
|
|
9066
9376
|
if (footerDragRef.current) return false;
|
|
9067
9377
|
const hrefKey = anchor.getAttribute("data-ohw-href-key");
|
|
@@ -9079,7 +9389,7 @@ function useNavItemDrag({
|
|
|
9079
9389
|
},
|
|
9080
9390
|
[beginNavDrag, footerDragRef, isDragHandleDisabled2, isNavbarButton3]
|
|
9081
9391
|
);
|
|
9082
|
-
const onNavDragOver = (0,
|
|
9392
|
+
const onNavDragOver = (0, import_react11.useCallback)(
|
|
9083
9393
|
(e) => {
|
|
9084
9394
|
const session = navDragRef.current;
|
|
9085
9395
|
if (!session) return false;
|
|
@@ -9091,7 +9401,7 @@ function useNavItemDrag({
|
|
|
9091
9401
|
},
|
|
9092
9402
|
[]
|
|
9093
9403
|
);
|
|
9094
|
-
(0,
|
|
9404
|
+
(0, import_react11.useEffect)(() => {
|
|
9095
9405
|
if (!isEditMode) return;
|
|
9096
9406
|
const THRESHOLD = 10;
|
|
9097
9407
|
const resolveWasSelected = (el) => {
|
|
@@ -9216,7 +9526,7 @@ function useNavItemDrag({
|
|
|
9216
9526
|
setLinkPopover,
|
|
9217
9527
|
suppressNextClickRef
|
|
9218
9528
|
]);
|
|
9219
|
-
const armNavPressFromChrome = (0,
|
|
9529
|
+
const armNavPressFromChrome = (0, import_react11.useCallback)(
|
|
9220
9530
|
(selected, clientX, clientY, pointerId) => {
|
|
9221
9531
|
const hrefKey = selected.getAttribute("data-ohw-href-key");
|
|
9222
9532
|
if (!hrefKey || !isNavbarHrefKey(hrefKey)) return false;
|
|
@@ -9247,8 +9557,8 @@ function useNavItemDrag({
|
|
|
9247
9557
|
}
|
|
9248
9558
|
|
|
9249
9559
|
// src/ui/footer-container-chrome.tsx
|
|
9250
|
-
var
|
|
9251
|
-
var
|
|
9560
|
+
var import_lucide_react12 = require("lucide-react");
|
|
9561
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
9252
9562
|
function FooterContainerChrome({
|
|
9253
9563
|
rect,
|
|
9254
9564
|
onAdd,
|
|
@@ -9256,7 +9566,7 @@ function FooterContainerChrome({
|
|
|
9256
9566
|
}) {
|
|
9257
9567
|
const chromeGap = 6;
|
|
9258
9568
|
const buttonMargin = 7;
|
|
9259
|
-
return /* @__PURE__ */ (0,
|
|
9569
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
9260
9570
|
"div",
|
|
9261
9571
|
{
|
|
9262
9572
|
"data-ohw-footer-container-chrome": "",
|
|
@@ -9268,8 +9578,8 @@ function FooterContainerChrome({
|
|
|
9268
9578
|
width: rect.width + chromeGap * 2,
|
|
9269
9579
|
height: rect.height + chromeGap * 2
|
|
9270
9580
|
},
|
|
9271
|
-
children: /* @__PURE__ */ (0,
|
|
9272
|
-
/* @__PURE__ */ (0,
|
|
9581
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(Tooltip, { children: [
|
|
9582
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
9273
9583
|
"button",
|
|
9274
9584
|
{
|
|
9275
9585
|
type: "button",
|
|
@@ -9288,17 +9598,17 @@ function FooterContainerChrome({
|
|
|
9288
9598
|
if (addDisabled) return;
|
|
9289
9599
|
onAdd();
|
|
9290
9600
|
},
|
|
9291
|
-
children: /* @__PURE__ */ (0,
|
|
9601
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react12.Plus, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
|
|
9292
9602
|
}
|
|
9293
9603
|
) }),
|
|
9294
|
-
/* @__PURE__ */ (0,
|
|
9604
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TooltipContent, { side: "bottom", sideOffset: 9, children: addDisabled ? "Maximum columns reached" : "Add item" })
|
|
9295
9605
|
] })
|
|
9296
9606
|
}
|
|
9297
9607
|
) });
|
|
9298
9608
|
}
|
|
9299
9609
|
|
|
9300
9610
|
// src/lib/carousel.ts
|
|
9301
|
-
var
|
|
9611
|
+
var import_react12 = require("react");
|
|
9302
9612
|
var CAROUSEL_ATTR = "data-ohw-carousel";
|
|
9303
9613
|
var CAROUSEL_VALUE_ATTR = "data-ohw-carousel-value";
|
|
9304
9614
|
var CAROUSEL_SLIDE_ATTR = "data-ohw-carousel-slide";
|
|
@@ -9360,8 +9670,8 @@ function applyCarouselNode(key, val) {
|
|
|
9360
9670
|
return true;
|
|
9361
9671
|
}
|
|
9362
9672
|
function useOhwCarousel(key, initial) {
|
|
9363
|
-
const [images, setImages] = (0,
|
|
9364
|
-
(0,
|
|
9673
|
+
const [images, setImages] = (0, import_react12.useState)(initial);
|
|
9674
|
+
(0, import_react12.useEffect)(() => {
|
|
9365
9675
|
const el = document.querySelector(
|
|
9366
9676
|
`[${CAROUSEL_ATTR}][data-ohw-key="${CSS.escape(key)}"]`
|
|
9367
9677
|
);
|
|
@@ -9716,14 +10026,14 @@ function deleteSelectedNavFooterItem(deps) {
|
|
|
9716
10026
|
}
|
|
9717
10027
|
|
|
9718
10028
|
// src/ui/navbar-container-chrome.tsx
|
|
9719
|
-
var
|
|
9720
|
-
var
|
|
10029
|
+
var import_lucide_react13 = require("lucide-react");
|
|
10030
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
9721
10031
|
function NavbarContainerChrome({
|
|
9722
10032
|
rect,
|
|
9723
10033
|
onAdd
|
|
9724
10034
|
}) {
|
|
9725
10035
|
const chromeGap = 6;
|
|
9726
|
-
return /* @__PURE__ */ (0,
|
|
10036
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
9727
10037
|
"div",
|
|
9728
10038
|
{
|
|
9729
10039
|
"data-ohw-navbar-container-chrome": "",
|
|
@@ -9735,7 +10045,7 @@ function NavbarContainerChrome({
|
|
|
9735
10045
|
width: rect.width + chromeGap * 2,
|
|
9736
10046
|
height: rect.height + chromeGap * 2
|
|
9737
10047
|
},
|
|
9738
|
-
children: /* @__PURE__ */ (0,
|
|
10048
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
9739
10049
|
"button",
|
|
9740
10050
|
{
|
|
9741
10051
|
type: "button",
|
|
@@ -9752,7 +10062,7 @@ function NavbarContainerChrome({
|
|
|
9752
10062
|
e.stopPropagation();
|
|
9753
10063
|
onAdd();
|
|
9754
10064
|
},
|
|
9755
|
-
children: /* @__PURE__ */ (0,
|
|
10065
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react13.Plus, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
|
|
9756
10066
|
}
|
|
9757
10067
|
)
|
|
9758
10068
|
}
|
|
@@ -9761,7 +10071,7 @@ function NavbarContainerChrome({
|
|
|
9761
10071
|
|
|
9762
10072
|
// src/ui/drop-indicator.tsx
|
|
9763
10073
|
var React9 = __toESM(require("react"), 1);
|
|
9764
|
-
var
|
|
10074
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
9765
10075
|
var dropIndicatorVariants = cva(
|
|
9766
10076
|
"ov-gap-line pointer-events-none shrink-0 transition-opacity duration-150",
|
|
9767
10077
|
{
|
|
@@ -9785,7 +10095,7 @@ var dropIndicatorVariants = cva(
|
|
|
9785
10095
|
);
|
|
9786
10096
|
var DropIndicator = React9.forwardRef(
|
|
9787
10097
|
({ className, direction, state, ...props }, ref) => {
|
|
9788
|
-
return /* @__PURE__ */ (0,
|
|
10098
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
9789
10099
|
"div",
|
|
9790
10100
|
{
|
|
9791
10101
|
ref,
|
|
@@ -9802,7 +10112,7 @@ var DropIndicator = React9.forwardRef(
|
|
|
9802
10112
|
DropIndicator.displayName = "DropIndicator";
|
|
9803
10113
|
|
|
9804
10114
|
// src/ui/badge.tsx
|
|
9805
|
-
var
|
|
10115
|
+
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
9806
10116
|
var badgeVariants = cva(
|
|
9807
10117
|
"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",
|
|
9808
10118
|
{
|
|
@@ -9820,13 +10130,13 @@ var badgeVariants = cva(
|
|
|
9820
10130
|
}
|
|
9821
10131
|
);
|
|
9822
10132
|
function Badge({ className, variant, ...props }) {
|
|
9823
|
-
return /* @__PURE__ */ (0,
|
|
10133
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: cn(badgeVariants({ variant }), className), ...props });
|
|
9824
10134
|
}
|
|
9825
10135
|
|
|
9826
10136
|
// src/OhhwellsBridge.tsx
|
|
9827
|
-
var
|
|
9828
|
-
var
|
|
9829
|
-
var
|
|
10137
|
+
var import_lucide_react14 = require("lucide-react");
|
|
10138
|
+
var import_jsx_runtime28 = require("react/jsx-runtime");
|
|
10139
|
+
var PRIMARY3 = "#0885FE";
|
|
9830
10140
|
var IMAGE_FADE_MS = 300;
|
|
9831
10141
|
function runOpacityFade(el, onDone) {
|
|
9832
10142
|
const anim = el.animate([{ opacity: 0 }, { opacity: 1 }], {
|
|
@@ -10004,7 +10314,7 @@ function mountSchedulingWidget(insertAfter, notifyOnConnect = false, scheduleId,
|
|
|
10004
10314
|
const root = (0, import_client.createRoot)(container);
|
|
10005
10315
|
(0, import_react_dom2.flushSync)(() => {
|
|
10006
10316
|
root.render(
|
|
10007
|
-
/* @__PURE__ */ (0,
|
|
10317
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
10008
10318
|
SchedulingWidget,
|
|
10009
10319
|
{
|
|
10010
10320
|
notifyOnConnect,
|
|
@@ -10614,7 +10924,7 @@ function EditGlowChrome({
|
|
|
10614
10924
|
hideHandle = false
|
|
10615
10925
|
}) {
|
|
10616
10926
|
const GAP = SELECTION_CHROME_GAP2;
|
|
10617
|
-
return /* @__PURE__ */ (0,
|
|
10927
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
|
|
10618
10928
|
"div",
|
|
10619
10929
|
{
|
|
10620
10930
|
ref: elRef,
|
|
@@ -10629,7 +10939,7 @@ function EditGlowChrome({
|
|
|
10629
10939
|
zIndex: 2147483646
|
|
10630
10940
|
},
|
|
10631
10941
|
children: [
|
|
10632
|
-
/* @__PURE__ */ (0,
|
|
10942
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
10633
10943
|
"div",
|
|
10634
10944
|
{
|
|
10635
10945
|
style: {
|
|
@@ -10642,7 +10952,7 @@ function EditGlowChrome({
|
|
|
10642
10952
|
}
|
|
10643
10953
|
}
|
|
10644
10954
|
),
|
|
10645
|
-
reorderHrefKey && !hideHandle && /* @__PURE__ */ (0,
|
|
10955
|
+
reorderHrefKey && !hideHandle && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
10646
10956
|
"div",
|
|
10647
10957
|
{
|
|
10648
10958
|
"data-ohw-drag-handle-container": "",
|
|
@@ -10654,7 +10964,7 @@ function EditGlowChrome({
|
|
|
10654
10964
|
transform: "translate(calc(-100% - 7px), -50%)",
|
|
10655
10965
|
pointerEvents: dragDisabled ? "none" : "auto"
|
|
10656
10966
|
},
|
|
10657
|
-
children: /* @__PURE__ */ (0,
|
|
10967
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
10658
10968
|
DragHandle,
|
|
10659
10969
|
{
|
|
10660
10970
|
"aria-label": `Reorder ${reorderHrefKey}`,
|
|
@@ -10837,9 +11147,9 @@ function FloatingToolbar({
|
|
|
10837
11147
|
showEditLink,
|
|
10838
11148
|
onEditLink
|
|
10839
11149
|
}) {
|
|
10840
|
-
const localRef =
|
|
10841
|
-
const [measuredW, setMeasuredW] =
|
|
10842
|
-
const setRefs =
|
|
11150
|
+
const localRef = import_react13.default.useRef(null);
|
|
11151
|
+
const [measuredW, setMeasuredW] = import_react13.default.useState(330);
|
|
11152
|
+
const setRefs = import_react13.default.useCallback(
|
|
10843
11153
|
(node) => {
|
|
10844
11154
|
localRef.current = node;
|
|
10845
11155
|
if (typeof elRef === "function") elRef(node);
|
|
@@ -10851,7 +11161,7 @@ function FloatingToolbar({
|
|
|
10851
11161
|
},
|
|
10852
11162
|
[elRef]
|
|
10853
11163
|
);
|
|
10854
|
-
|
|
11164
|
+
import_react13.default.useLayoutEffect(() => {
|
|
10855
11165
|
const node = localRef.current;
|
|
10856
11166
|
if (!node) return;
|
|
10857
11167
|
const update = () => {
|
|
@@ -10864,7 +11174,7 @@ function FloatingToolbar({
|
|
|
10864
11174
|
return () => ro.disconnect();
|
|
10865
11175
|
}, [showEditLink, activeCommands]);
|
|
10866
11176
|
const { top, left, transform } = calcToolbarPos(rect, parentScroll, measuredW);
|
|
10867
|
-
return /* @__PURE__ */ (0,
|
|
11177
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
10868
11178
|
"div",
|
|
10869
11179
|
{
|
|
10870
11180
|
ref: setRefs,
|
|
@@ -10876,12 +11186,12 @@ function FloatingToolbar({
|
|
|
10876
11186
|
zIndex: 2147483647,
|
|
10877
11187
|
pointerEvents: "auto"
|
|
10878
11188
|
},
|
|
10879
|
-
children: /* @__PURE__ */ (0,
|
|
10880
|
-
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ (0,
|
|
10881
|
-
gi > 0 && /* @__PURE__ */ (0,
|
|
11189
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(CustomToolbar, { children: [
|
|
11190
|
+
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_react13.default.Fragment, { children: [
|
|
11191
|
+
gi > 0 && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(CustomToolbarDivider, {}),
|
|
10882
11192
|
btns.map((btn) => {
|
|
10883
11193
|
const isActive = activeCommands.has(btn.cmd);
|
|
10884
|
-
return /* @__PURE__ */ (0,
|
|
11194
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
10885
11195
|
CustomToolbarButton,
|
|
10886
11196
|
{
|
|
10887
11197
|
title: btn.title,
|
|
@@ -10890,7 +11200,7 @@ function FloatingToolbar({
|
|
|
10890
11200
|
e.preventDefault();
|
|
10891
11201
|
onCommand(btn.cmd);
|
|
10892
11202
|
},
|
|
10893
|
-
children: /* @__PURE__ */ (0,
|
|
11203
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
10894
11204
|
"svg",
|
|
10895
11205
|
{
|
|
10896
11206
|
width: "16",
|
|
@@ -10911,7 +11221,7 @@ function FloatingToolbar({
|
|
|
10911
11221
|
);
|
|
10912
11222
|
})
|
|
10913
11223
|
] }, gi)),
|
|
10914
|
-
showEditLink ? /* @__PURE__ */ (0,
|
|
11224
|
+
showEditLink ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
10915
11225
|
CustomToolbarButton,
|
|
10916
11226
|
{
|
|
10917
11227
|
type: "button",
|
|
@@ -10925,7 +11235,7 @@ function FloatingToolbar({
|
|
|
10925
11235
|
e.preventDefault();
|
|
10926
11236
|
e.stopPropagation();
|
|
10927
11237
|
},
|
|
10928
|
-
children: /* @__PURE__ */ (0,
|
|
11238
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react14.Link, { className: "size-4 shrink-0", "aria-hidden": true })
|
|
10929
11239
|
}
|
|
10930
11240
|
) : null
|
|
10931
11241
|
] })
|
|
@@ -10942,7 +11252,7 @@ function StateToggle({
|
|
|
10942
11252
|
states,
|
|
10943
11253
|
onStateChange
|
|
10944
11254
|
}) {
|
|
10945
|
-
return /* @__PURE__ */ (0,
|
|
11255
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
10946
11256
|
ToggleGroup,
|
|
10947
11257
|
{
|
|
10948
11258
|
"data-ohw-state-toggle": "",
|
|
@@ -10956,7 +11266,7 @@ function StateToggle({
|
|
|
10956
11266
|
left: rect.right - 8,
|
|
10957
11267
|
transform: "translateX(-100%)"
|
|
10958
11268
|
},
|
|
10959
|
-
children: states.map((state) => /* @__PURE__ */ (0,
|
|
11269
|
+
children: states.map((state) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ToggleGroupItem, { value: state, size: "sm", children: state }, state))
|
|
10960
11270
|
}
|
|
10961
11271
|
);
|
|
10962
11272
|
}
|
|
@@ -10983,8 +11293,8 @@ function OhhwellsBridge() {
|
|
|
10983
11293
|
const router = (0, import_navigation2.useRouter)();
|
|
10984
11294
|
const searchParams = (0, import_navigation2.useSearchParams)();
|
|
10985
11295
|
const isEditMode = isEditSessionActive();
|
|
10986
|
-
const [bridgeRoot, setBridgeRoot] = (0,
|
|
10987
|
-
(0,
|
|
11296
|
+
const [bridgeRoot, setBridgeRoot] = (0, import_react13.useState)(null);
|
|
11297
|
+
(0, import_react13.useEffect)(() => {
|
|
10988
11298
|
const figtreeFontId = "ohw-figtree-font";
|
|
10989
11299
|
if (!document.getElementById(figtreeFontId)) {
|
|
10990
11300
|
const preconnect1 = Object.assign(document.createElement("link"), { rel: "preconnect", href: "https://fonts.googleapis.com" });
|
|
@@ -11012,106 +11322,107 @@ function OhhwellsBridge() {
|
|
|
11012
11322
|
const subdomainFromQuery = searchParams.get("subdomain");
|
|
11013
11323
|
const subdomain = resolveSubdomain(subdomainFromQuery);
|
|
11014
11324
|
useLinkHrefGuardian(pathname, subdomain, isEditMode);
|
|
11015
|
-
const postToParent2 = (0,
|
|
11325
|
+
const postToParent2 = (0, import_react13.useCallback)((data) => {
|
|
11016
11326
|
if (typeof window !== "undefined" && window.parent !== window) {
|
|
11017
11327
|
window.parent.postMessage(data, "*");
|
|
11018
11328
|
}
|
|
11019
11329
|
}, []);
|
|
11020
|
-
const [fetchState, setFetchState] = (0,
|
|
11021
|
-
const autoSaveTimers = (0,
|
|
11022
|
-
const activeElRef = (0,
|
|
11023
|
-
const pointerHeldRef = (0,
|
|
11024
|
-
const selectedElRef = (0,
|
|
11025
|
-
const selectedHrefKeyRef = (0,
|
|
11026
|
-
const selectedFooterColAttrRef = (0,
|
|
11027
|
-
const originalContentRef = (0,
|
|
11028
|
-
const activeStateElRef = (0,
|
|
11029
|
-
const parentScrollRef = (0,
|
|
11030
|
-
const visibleViewportRef = (0,
|
|
11031
|
-
const [dialogPortalContainer, setDialogPortalContainer] = (0,
|
|
11032
|
-
const attachVisibleViewport = (0,
|
|
11330
|
+
const [fetchState, setFetchState] = (0, import_react13.useState)("idle");
|
|
11331
|
+
const autoSaveTimers = (0, import_react13.useRef)(/* @__PURE__ */ new Map());
|
|
11332
|
+
const activeElRef = (0, import_react13.useRef)(null);
|
|
11333
|
+
const pointerHeldRef = (0, import_react13.useRef)(false);
|
|
11334
|
+
const selectedElRef = (0, import_react13.useRef)(null);
|
|
11335
|
+
const selectedHrefKeyRef = (0, import_react13.useRef)(null);
|
|
11336
|
+
const selectedFooterColAttrRef = (0, import_react13.useRef)(null);
|
|
11337
|
+
const originalContentRef = (0, import_react13.useRef)(null);
|
|
11338
|
+
const activeStateElRef = (0, import_react13.useRef)(null);
|
|
11339
|
+
const parentScrollRef = (0, import_react13.useRef)(null);
|
|
11340
|
+
const visibleViewportRef = (0, import_react13.useRef)(null);
|
|
11341
|
+
const [dialogPortalContainer, setDialogPortalContainer] = (0, import_react13.useState)(null);
|
|
11342
|
+
const attachVisibleViewport = (0, import_react13.useCallback)((node) => {
|
|
11033
11343
|
visibleViewportRef.current = node;
|
|
11034
11344
|
setDialogPortalContainer(node);
|
|
11035
11345
|
if (node) applyVisibleViewport(node, parentScrollRef.current);
|
|
11036
11346
|
}, []);
|
|
11037
|
-
const toolbarElRef = (0,
|
|
11038
|
-
const glowElRef = (0,
|
|
11039
|
-
const hoveredImageRef = (0,
|
|
11040
|
-
const hoveredImageHasTextOverlapRef = (0,
|
|
11041
|
-
const dragOverElRef = (0,
|
|
11042
|
-
const [mediaHover, setMediaHover] = (0,
|
|
11043
|
-
const [carouselHover, setCarouselHover] = (0,
|
|
11044
|
-
const [uploadingRects, setUploadingRects] = (0,
|
|
11045
|
-
const hoveredGapRef = (0,
|
|
11046
|
-
const imageUnhoverTimerRef = (0,
|
|
11047
|
-
const imageShowTimerRef = (0,
|
|
11048
|
-
const editStylesRef = (0,
|
|
11049
|
-
const activateRef = (0,
|
|
11347
|
+
const toolbarElRef = (0, import_react13.useRef)(null);
|
|
11348
|
+
const glowElRef = (0, import_react13.useRef)(null);
|
|
11349
|
+
const hoveredImageRef = (0, import_react13.useRef)(null);
|
|
11350
|
+
const hoveredImageHasTextOverlapRef = (0, import_react13.useRef)(false);
|
|
11351
|
+
const dragOverElRef = (0, import_react13.useRef)(null);
|
|
11352
|
+
const [mediaHover, setMediaHover] = (0, import_react13.useState)(null);
|
|
11353
|
+
const [carouselHover, setCarouselHover] = (0, import_react13.useState)(null);
|
|
11354
|
+
const [uploadingRects, setUploadingRects] = (0, import_react13.useState)({});
|
|
11355
|
+
const hoveredGapRef = (0, import_react13.useRef)(null);
|
|
11356
|
+
const imageUnhoverTimerRef = (0, import_react13.useRef)(null);
|
|
11357
|
+
const imageShowTimerRef = (0, import_react13.useRef)(null);
|
|
11358
|
+
const editStylesRef = (0, import_react13.useRef)(null);
|
|
11359
|
+
const activateRef = (0, import_react13.useRef)(() => {
|
|
11050
11360
|
});
|
|
11051
|
-
const deactivateRef = (0,
|
|
11361
|
+
const deactivateRef = (0, import_react13.useRef)(() => {
|
|
11052
11362
|
});
|
|
11053
|
-
const selectRef = (0,
|
|
11363
|
+
const selectRef = (0, import_react13.useRef)(() => {
|
|
11054
11364
|
});
|
|
11055
|
-
const selectFrameRef = (0,
|
|
11365
|
+
const selectFrameRef = (0, import_react13.useRef)(() => {
|
|
11056
11366
|
});
|
|
11057
|
-
const deselectRef = (0,
|
|
11367
|
+
const deselectRef = (0, import_react13.useRef)(() => {
|
|
11058
11368
|
});
|
|
11059
|
-
const reselectNavigationItemRef = (0,
|
|
11369
|
+
const reselectNavigationItemRef = (0, import_react13.useRef)(() => {
|
|
11060
11370
|
});
|
|
11061
|
-
const commitNavigationTextEditRef = (0,
|
|
11371
|
+
const commitNavigationTextEditRef = (0, import_react13.useRef)(() => {
|
|
11062
11372
|
});
|
|
11063
|
-
const handleDeleteSelectedRef = (0,
|
|
11064
|
-
const runPendingDeleteUndoRef = (0,
|
|
11065
|
-
const isFooterFrameSelectionRef = (0,
|
|
11066
|
-
const refreshActiveCommandsRef = (0,
|
|
11373
|
+
const handleDeleteSelectedRef = (0, import_react13.useRef)(() => false);
|
|
11374
|
+
const runPendingDeleteUndoRef = (0, import_react13.useRef)(() => false);
|
|
11375
|
+
const isFooterFrameSelectionRef = (0, import_react13.useRef)(false);
|
|
11376
|
+
const refreshActiveCommandsRef = (0, import_react13.useRef)(() => {
|
|
11067
11377
|
});
|
|
11068
|
-
const postToParentRef = (0,
|
|
11378
|
+
const postToParentRef = (0, import_react13.useRef)(postToParent2);
|
|
11069
11379
|
postToParentRef.current = postToParent2;
|
|
11070
|
-
const
|
|
11071
|
-
const
|
|
11072
|
-
const
|
|
11073
|
-
const [
|
|
11074
|
-
const
|
|
11380
|
+
const aiSectionApiRef = (0, import_react13.useRef)(null);
|
|
11381
|
+
const sectionsLoadedRef = (0, import_react13.useRef)(false);
|
|
11382
|
+
const pendingScheduleConfigRequests = (0, import_react13.useRef)([]);
|
|
11383
|
+
const [toolbarRect, setToolbarRect] = (0, import_react13.useState)(null);
|
|
11384
|
+
const [toolbarVariant, setToolbarVariant] = (0, import_react13.useState)("none");
|
|
11385
|
+
const toolbarVariantRef = (0, import_react13.useRef)("none");
|
|
11075
11386
|
toolbarVariantRef.current = toolbarVariant;
|
|
11076
|
-
const [selectedIsCta, setSelectedIsCta] = (0,
|
|
11077
|
-
const [reorderHrefKey, setReorderHrefKey] = (0,
|
|
11078
|
-
const [reorderDragDisabled, setReorderDragDisabled] = (0,
|
|
11079
|
-
const [toggleState, setToggleState] = (0,
|
|
11080
|
-
const [maxBadge, setMaxBadge] = (0,
|
|
11081
|
-
const [activeCommands, setActiveCommands] = (0,
|
|
11082
|
-
const [sectionGap, setSectionGap] = (0,
|
|
11083
|
-
const [toolbarShowEditLink, setToolbarShowEditLink] = (0,
|
|
11084
|
-
const hoveredNavContainerRef = (0,
|
|
11085
|
-
const [hoveredNavContainerRect, setHoveredNavContainerRect] = (0,
|
|
11086
|
-
const hoveredItemElRef = (0,
|
|
11087
|
-
const [hoveredItemRect, setHoveredItemRect] = (0,
|
|
11088
|
-
const siblingHintElRef = (0,
|
|
11089
|
-
const [siblingHintRect, setSiblingHintRect] = (0,
|
|
11090
|
-
const [siblingHintRects, setSiblingHintRects] = (0,
|
|
11091
|
-
const [isItemDragging, setIsItemDragging] = (0,
|
|
11092
|
-
const [isFooterFrameSelection, setIsFooterFrameSelection] = (0,
|
|
11387
|
+
const [selectedIsCta, setSelectedIsCta] = (0, import_react13.useState)(false);
|
|
11388
|
+
const [reorderHrefKey, setReorderHrefKey] = (0, import_react13.useState)(null);
|
|
11389
|
+
const [reorderDragDisabled, setReorderDragDisabled] = (0, import_react13.useState)(false);
|
|
11390
|
+
const [toggleState, setToggleState] = (0, import_react13.useState)(null);
|
|
11391
|
+
const [maxBadge, setMaxBadge] = (0, import_react13.useState)(null);
|
|
11392
|
+
const [activeCommands, setActiveCommands] = (0, import_react13.useState)(/* @__PURE__ */ new Set());
|
|
11393
|
+
const [sectionGap, setSectionGap] = (0, import_react13.useState)(null);
|
|
11394
|
+
const [toolbarShowEditLink, setToolbarShowEditLink] = (0, import_react13.useState)(false);
|
|
11395
|
+
const hoveredNavContainerRef = (0, import_react13.useRef)(null);
|
|
11396
|
+
const [hoveredNavContainerRect, setHoveredNavContainerRect] = (0, import_react13.useState)(null);
|
|
11397
|
+
const hoveredItemElRef = (0, import_react13.useRef)(null);
|
|
11398
|
+
const [hoveredItemRect, setHoveredItemRect] = (0, import_react13.useState)(null);
|
|
11399
|
+
const siblingHintElRef = (0, import_react13.useRef)(null);
|
|
11400
|
+
const [siblingHintRect, setSiblingHintRect] = (0, import_react13.useState)(null);
|
|
11401
|
+
const [siblingHintRects, setSiblingHintRects] = (0, import_react13.useState)([]);
|
|
11402
|
+
const [isItemDragging, setIsItemDragging] = (0, import_react13.useState)(false);
|
|
11403
|
+
const [isFooterFrameSelection, setIsFooterFrameSelection] = (0, import_react13.useState)(false);
|
|
11093
11404
|
isFooterFrameSelectionRef.current = isFooterFrameSelection;
|
|
11094
|
-
const [navDropdownPreviewOpen, setNavDropdownPreviewOpen] = (0,
|
|
11095
|
-
const [footerHeadingVisible, setFooterHeadingVisible] = (0,
|
|
11096
|
-
const footerDragRef = (0,
|
|
11097
|
-
const [footerDropSlots, setFooterDropSlots] = (0,
|
|
11098
|
-
const [activeFooterDropIndex, setActiveFooterDropIndex] = (0,
|
|
11099
|
-
const [draggedItemRect, setDraggedItemRect] = (0,
|
|
11100
|
-
const footerPointerDragRef = (0,
|
|
11101
|
-
const suppressNextClickRef = (0,
|
|
11102
|
-
const suppressClickUntilRef = (0,
|
|
11103
|
-
const [linkPopover, setLinkPopover] = (0,
|
|
11104
|
-
const linkPopoverSessionRef = (0,
|
|
11105
|
-
const addNavAfterAnchorRef = (0,
|
|
11106
|
-
const editContentRef = (0,
|
|
11107
|
-
const pendingDeleteUndoRef = (0,
|
|
11108
|
-
const [sitePages, setSitePages] = (0,
|
|
11109
|
-
const [sectionsByPath, setSectionsByPath] = (0,
|
|
11110
|
-
const sectionsPrefetchGenRef = (0,
|
|
11111
|
-
const setLinkPopoverRef = (0,
|
|
11112
|
-
const linkPopoverPanelRef = (0,
|
|
11113
|
-
const linkPopoverOpenRef = (0,
|
|
11114
|
-
const linkPopoverGraceUntilRef = (0,
|
|
11405
|
+
const [navDropdownPreviewOpen, setNavDropdownPreviewOpen] = (0, import_react13.useState)(null);
|
|
11406
|
+
const [footerHeadingVisible, setFooterHeadingVisible] = (0, import_react13.useState)(null);
|
|
11407
|
+
const footerDragRef = (0, import_react13.useRef)(null);
|
|
11408
|
+
const [footerDropSlots, setFooterDropSlots] = (0, import_react13.useState)([]);
|
|
11409
|
+
const [activeFooterDropIndex, setActiveFooterDropIndex] = (0, import_react13.useState)(null);
|
|
11410
|
+
const [draggedItemRect, setDraggedItemRect] = (0, import_react13.useState)(null);
|
|
11411
|
+
const footerPointerDragRef = (0, import_react13.useRef)(null);
|
|
11412
|
+
const suppressNextClickRef = (0, import_react13.useRef)(false);
|
|
11413
|
+
const suppressClickUntilRef = (0, import_react13.useRef)(0);
|
|
11414
|
+
const [linkPopover, setLinkPopover] = (0, import_react13.useState)(null);
|
|
11415
|
+
const linkPopoverSessionRef = (0, import_react13.useRef)(null);
|
|
11416
|
+
const addNavAfterAnchorRef = (0, import_react13.useRef)(null);
|
|
11417
|
+
const editContentRef = (0, import_react13.useRef)({});
|
|
11418
|
+
const pendingDeleteUndoRef = (0, import_react13.useRef)(null);
|
|
11419
|
+
const [sitePages, setSitePages] = (0, import_react13.useState)([]);
|
|
11420
|
+
const [sectionsByPath, setSectionsByPath] = (0, import_react13.useState)({});
|
|
11421
|
+
const sectionsPrefetchGenRef = (0, import_react13.useRef)(0);
|
|
11422
|
+
const setLinkPopoverRef = (0, import_react13.useRef)(setLinkPopover);
|
|
11423
|
+
const linkPopoverPanelRef = (0, import_react13.useRef)(null);
|
|
11424
|
+
const linkPopoverOpenRef = (0, import_react13.useRef)(false);
|
|
11425
|
+
const linkPopoverGraceUntilRef = (0, import_react13.useRef)(0);
|
|
11115
11426
|
setLinkPopoverRef.current = setLinkPopover;
|
|
11116
11427
|
linkPopoverSessionRef.current = linkPopover;
|
|
11117
11428
|
const {
|
|
@@ -11150,7 +11461,7 @@ function OhhwellsBridge() {
|
|
|
11150
11461
|
const bumpLinkPopoverGrace = () => {
|
|
11151
11462
|
linkPopoverGraceUntilRef.current = Date.now() + 350;
|
|
11152
11463
|
};
|
|
11153
|
-
const runSectionsPrefetch = (0,
|
|
11464
|
+
const runSectionsPrefetch = (0, import_react13.useCallback)((pages) => {
|
|
11154
11465
|
if (!isEditMode || shouldUseDevFixtures() || pages.length === 0) return;
|
|
11155
11466
|
const gen = ++sectionsPrefetchGenRef.current;
|
|
11156
11467
|
const paths = pages.map((p) => p.path);
|
|
@@ -11169,9 +11480,9 @@ function OhhwellsBridge() {
|
|
|
11169
11480
|
);
|
|
11170
11481
|
});
|
|
11171
11482
|
}, [isEditMode, pathname]);
|
|
11172
|
-
const runSectionsPrefetchRef = (0,
|
|
11483
|
+
const runSectionsPrefetchRef = (0, import_react13.useRef)(runSectionsPrefetch);
|
|
11173
11484
|
runSectionsPrefetchRef.current = runSectionsPrefetch;
|
|
11174
|
-
(0,
|
|
11485
|
+
(0, import_react13.useEffect)(() => {
|
|
11175
11486
|
if (!linkPopover) {
|
|
11176
11487
|
document.documentElement.removeAttribute("data-ohw-link-popover-open");
|
|
11177
11488
|
return;
|
|
@@ -11199,7 +11510,7 @@ function OhhwellsBridge() {
|
|
|
11199
11510
|
document.documentElement.removeAttribute("data-ohw-link-popover-open");
|
|
11200
11511
|
};
|
|
11201
11512
|
}, [linkPopover, postToParent2]);
|
|
11202
|
-
(0,
|
|
11513
|
+
(0, import_react13.useEffect)(() => {
|
|
11203
11514
|
if (!isEditMode) return;
|
|
11204
11515
|
const useFixtures = shouldUseDevFixtures();
|
|
11205
11516
|
if (useFixtures) {
|
|
@@ -11223,14 +11534,14 @@ function OhhwellsBridge() {
|
|
|
11223
11534
|
if (!useFixtures) postToParent2({ type: "ow:request-site-pages" });
|
|
11224
11535
|
return () => window.removeEventListener("message", onSitePages);
|
|
11225
11536
|
}, [isEditMode, postToParent2]);
|
|
11226
|
-
(0,
|
|
11537
|
+
(0, import_react13.useEffect)(() => {
|
|
11227
11538
|
if (!isEditMode || shouldUseDevFixtures()) return;
|
|
11228
11539
|
void loadAllSectionsManifest().then((manifest) => {
|
|
11229
11540
|
if (Object.keys(manifest).length === 0) return;
|
|
11230
11541
|
setSectionsByPath((prev) => ({ ...manifest, ...prev }));
|
|
11231
11542
|
});
|
|
11232
11543
|
}, [isEditMode]);
|
|
11233
|
-
(0,
|
|
11544
|
+
(0, import_react13.useEffect)(() => {
|
|
11234
11545
|
const update = () => {
|
|
11235
11546
|
const el = activeElRef.current ?? selectedElRef.current;
|
|
11236
11547
|
if (el) setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
@@ -11254,10 +11565,10 @@ function OhhwellsBridge() {
|
|
|
11254
11565
|
vvp.removeEventListener("resize", update);
|
|
11255
11566
|
};
|
|
11256
11567
|
}, []);
|
|
11257
|
-
const refreshStateRules = (0,
|
|
11568
|
+
const refreshStateRules = (0, import_react13.useCallback)(() => {
|
|
11258
11569
|
editStylesRef.current?.forceHover && (editStylesRef.current.forceHover.textContent = collectStateRules());
|
|
11259
11570
|
}, []);
|
|
11260
|
-
const processConfigRequest = (0,
|
|
11571
|
+
const processConfigRequest = (0, import_react13.useCallback)((insertAfterVal) => {
|
|
11261
11572
|
const tracker = getSectionsTracker();
|
|
11262
11573
|
let entries = [];
|
|
11263
11574
|
try {
|
|
@@ -11280,7 +11591,7 @@ function OhhwellsBridge() {
|
|
|
11280
11591
|
}
|
|
11281
11592
|
window.postMessage({ type: "ow:schedule-config", insertAfter: insertAfterVal, scheduleId: null }, "*");
|
|
11282
11593
|
}, [isEditMode]);
|
|
11283
|
-
const deactivate = (0,
|
|
11594
|
+
const deactivate = (0, import_react13.useCallback)(() => {
|
|
11284
11595
|
const el = activeElRef.current;
|
|
11285
11596
|
if (!el) return;
|
|
11286
11597
|
const key = el.dataset.ohwKey;
|
|
@@ -11313,12 +11624,12 @@ function OhhwellsBridge() {
|
|
|
11313
11624
|
setToolbarShowEditLink(false);
|
|
11314
11625
|
postToParent2({ type: "ow:exit-edit" });
|
|
11315
11626
|
}, [postToParent2]);
|
|
11316
|
-
const clearSelectedAttr = (0,
|
|
11627
|
+
const clearSelectedAttr = (0, import_react13.useCallback)(() => {
|
|
11317
11628
|
document.querySelectorAll("[data-ohw-selected]").forEach((el) => {
|
|
11318
11629
|
el.removeAttribute("data-ohw-selected");
|
|
11319
11630
|
});
|
|
11320
11631
|
}, []);
|
|
11321
|
-
const deselect = (0,
|
|
11632
|
+
const deselect = (0, import_react13.useCallback)(() => {
|
|
11322
11633
|
clearSelectedAttr();
|
|
11323
11634
|
selectedElRef.current = null;
|
|
11324
11635
|
selectedHrefKeyRef.current = null;
|
|
@@ -11341,11 +11652,11 @@ function OhhwellsBridge() {
|
|
|
11341
11652
|
setToolbarVariant("none");
|
|
11342
11653
|
}
|
|
11343
11654
|
}, [clearSelectedAttr]);
|
|
11344
|
-
const markSelected = (0,
|
|
11655
|
+
const markSelected = (0, import_react13.useCallback)((el) => {
|
|
11345
11656
|
clearSelectedAttr();
|
|
11346
11657
|
el.setAttribute("data-ohw-selected", "");
|
|
11347
11658
|
}, [clearSelectedAttr]);
|
|
11348
|
-
const resolveHrefKeyElement = (0,
|
|
11659
|
+
const resolveHrefKeyElement = (0, import_react13.useCallback)((hrefKey) => {
|
|
11349
11660
|
if (isFooterHrefKey(hrefKey)) {
|
|
11350
11661
|
return document.querySelector(
|
|
11351
11662
|
`footer [data-ohw-href-key="${CSS.escape(hrefKey)}"]`
|
|
@@ -11360,7 +11671,7 @@ function OhhwellsBridge() {
|
|
|
11360
11671
|
`[data-ohw-href-key="${CSS.escape(hrefKey)}"]`
|
|
11361
11672
|
);
|
|
11362
11673
|
}, []);
|
|
11363
|
-
const resyncSelectedNavigationItem = (0,
|
|
11674
|
+
const resyncSelectedNavigationItem = (0, import_react13.useCallback)(() => {
|
|
11364
11675
|
const hrefKey = selectedHrefKeyRef.current;
|
|
11365
11676
|
if (hrefKey) {
|
|
11366
11677
|
const link = resolveHrefKeyElement(hrefKey);
|
|
@@ -11398,7 +11709,7 @@ function OhhwellsBridge() {
|
|
|
11398
11709
|
);
|
|
11399
11710
|
}
|
|
11400
11711
|
}, [resolveHrefKeyElement]);
|
|
11401
|
-
const reselectNavigationItem = (0,
|
|
11712
|
+
const reselectNavigationItem = (0, import_react13.useCallback)((navAnchor) => {
|
|
11402
11713
|
selectedElRef.current = navAnchor;
|
|
11403
11714
|
selectedHrefKeyRef.current = navAnchor.getAttribute("data-ohw-href-key");
|
|
11404
11715
|
selectedFooterColAttrRef.current = null;
|
|
@@ -11427,7 +11738,7 @@ function OhhwellsBridge() {
|
|
|
11427
11738
|
setToolbarShowEditLink(false);
|
|
11428
11739
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
11429
11740
|
}, [markSelected]);
|
|
11430
|
-
const commitNavigationTextEdit = (0,
|
|
11741
|
+
const commitNavigationTextEdit = (0, import_react13.useCallback)((navAnchor) => {
|
|
11431
11742
|
const el = activeElRef.current;
|
|
11432
11743
|
if (!el) return;
|
|
11433
11744
|
const key = el.dataset.ohwKey;
|
|
@@ -11454,7 +11765,7 @@ function OhhwellsBridge() {
|
|
|
11454
11765
|
postToParent2({ type: "ow:exit-edit" });
|
|
11455
11766
|
reselectNavigationItem(navAnchor);
|
|
11456
11767
|
}, [postToParent2, reselectNavigationItem]);
|
|
11457
|
-
const handleAddTopLevelNavItem = (0,
|
|
11768
|
+
const handleAddTopLevelNavItem = (0, import_react13.useCallback)(() => {
|
|
11458
11769
|
const items = listNavbarRootItems();
|
|
11459
11770
|
addNavAfterAnchorRef.current = items[items.length - 1] ?? null;
|
|
11460
11771
|
deselectRef.current();
|
|
@@ -11466,7 +11777,7 @@ function OhhwellsBridge() {
|
|
|
11466
11777
|
intent: "add-nav"
|
|
11467
11778
|
});
|
|
11468
11779
|
}, []);
|
|
11469
|
-
const maybeWarnNavLinkDropdownConflict = (0,
|
|
11780
|
+
const maybeWarnNavLinkDropdownConflict = (0, import_react13.useCallback)(
|
|
11470
11781
|
(anchor) => {
|
|
11471
11782
|
if (!isNavbarHrefKey(anchor.getAttribute("data-ohw-href-key"))) return;
|
|
11472
11783
|
if (!navDropdownsOpenOnClick()) return;
|
|
@@ -11479,7 +11790,7 @@ function OhhwellsBridge() {
|
|
|
11479
11790
|
},
|
|
11480
11791
|
[postToParent2]
|
|
11481
11792
|
);
|
|
11482
|
-
const handleNavDropdownOpenChange = (0,
|
|
11793
|
+
const handleNavDropdownOpenChange = (0, import_react13.useCallback)((open) => {
|
|
11483
11794
|
const selected = selectedElRef.current;
|
|
11484
11795
|
if (!selected || !isNavigationItem2(selected)) return;
|
|
11485
11796
|
setNavGroupForceOpen(selected, open);
|
|
@@ -11491,7 +11802,7 @@ function OhhwellsBridge() {
|
|
|
11491
11802
|
}
|
|
11492
11803
|
});
|
|
11493
11804
|
}, []);
|
|
11494
|
-
const handleFooterHeadingVisibleChange = (0,
|
|
11805
|
+
const handleFooterHeadingVisibleChange = (0, import_react13.useCallback)(
|
|
11495
11806
|
(visible) => {
|
|
11496
11807
|
const selected = selectedElRef.current;
|
|
11497
11808
|
if (!selected || !isFooterFrameSelectionRef.current) return;
|
|
@@ -11515,7 +11826,7 @@ function OhhwellsBridge() {
|
|
|
11515
11826
|
},
|
|
11516
11827
|
[postToParent2]
|
|
11517
11828
|
);
|
|
11518
|
-
const enterEditOnNewItem = (0,
|
|
11829
|
+
const enterEditOnNewItem = (0, import_react13.useCallback)((anchor) => {
|
|
11519
11830
|
const label = anchor.querySelector('[data-ohw-editable="text"]');
|
|
11520
11831
|
if (!label) {
|
|
11521
11832
|
selectRef.current(anchor);
|
|
@@ -11524,7 +11835,7 @@ function OhhwellsBridge() {
|
|
|
11524
11835
|
setNavGroupForceOpen(anchor, true);
|
|
11525
11836
|
activateRef.current(label);
|
|
11526
11837
|
}, []);
|
|
11527
|
-
const handleAddChildItem = (0,
|
|
11838
|
+
const handleAddChildItem = (0, import_react13.useCallback)(() => {
|
|
11528
11839
|
const selected = selectedElRef.current;
|
|
11529
11840
|
if (!selected) return;
|
|
11530
11841
|
if (toolbarVariantRef.current === "select-frame" && isFooterFrameSelection) {
|
|
@@ -11600,7 +11911,7 @@ function OhhwellsBridge() {
|
|
|
11600
11911
|
enterEditOnNewItem(result.anchor);
|
|
11601
11912
|
});
|
|
11602
11913
|
}, [enterEditOnNewItem, isFooterFrameSelection, maybeWarnNavLinkDropdownConflict, postToParent2]);
|
|
11603
|
-
const handleAddFooterColumn = (0,
|
|
11914
|
+
const handleAddFooterColumn = (0, import_react13.useCallback)(() => {
|
|
11604
11915
|
if (!canAddFooterColumn()) {
|
|
11605
11916
|
postToParent2({
|
|
11606
11917
|
type: "ow:toast",
|
|
@@ -11621,7 +11932,7 @@ function OhhwellsBridge() {
|
|
|
11621
11932
|
selectRef.current(result.firstLink);
|
|
11622
11933
|
});
|
|
11623
11934
|
}, [postToParent2]);
|
|
11624
|
-
const clearFooterDragVisuals = (0,
|
|
11935
|
+
const clearFooterDragVisuals = (0, import_react13.useCallback)(() => {
|
|
11625
11936
|
footerDragRef.current = null;
|
|
11626
11937
|
setSiblingHintRects([]);
|
|
11627
11938
|
setFooterDropSlots([]);
|
|
@@ -11630,7 +11941,7 @@ function OhhwellsBridge() {
|
|
|
11630
11941
|
setIsItemDragging(false);
|
|
11631
11942
|
unlockFooterDragInteraction();
|
|
11632
11943
|
}, []);
|
|
11633
|
-
const refreshFooterDragVisuals = (0,
|
|
11944
|
+
const refreshFooterDragVisuals = (0, import_react13.useCallback)((session, activeSlot, clientX, clientY) => {
|
|
11634
11945
|
const dragged = session.draggedEl;
|
|
11635
11946
|
setDraggedItemRect(dragged.getBoundingClientRect());
|
|
11636
11947
|
if (typeof clientX === "number" && typeof clientY === "number") {
|
|
@@ -11655,13 +11966,13 @@ function OhhwellsBridge() {
|
|
|
11655
11966
|
const activeIdx = activeSlot ? slots.findIndex((s) => s.insertIndex === activeSlot.insertIndex) : -1;
|
|
11656
11967
|
setActiveFooterDropIndex(activeIdx >= 0 ? activeIdx : null);
|
|
11657
11968
|
}, []);
|
|
11658
|
-
const refreshFooterDragVisualsRef = (0,
|
|
11969
|
+
const refreshFooterDragVisualsRef = (0, import_react13.useRef)(refreshFooterDragVisuals);
|
|
11659
11970
|
refreshFooterDragVisualsRef.current = refreshFooterDragVisuals;
|
|
11660
|
-
const commitFooterDragRef = (0,
|
|
11971
|
+
const commitFooterDragRef = (0, import_react13.useRef)(() => {
|
|
11661
11972
|
});
|
|
11662
|
-
const beginFooterDragRef = (0,
|
|
11973
|
+
const beginFooterDragRef = (0, import_react13.useRef)(() => {
|
|
11663
11974
|
});
|
|
11664
|
-
const beginFooterDrag = (0,
|
|
11975
|
+
const beginFooterDrag = (0, import_react13.useCallback)(
|
|
11665
11976
|
(session) => {
|
|
11666
11977
|
const rect = session.draggedEl.getBoundingClientRect();
|
|
11667
11978
|
session.lastClientX = session.lastClientX || rect.left + rect.width / 2;
|
|
@@ -11681,7 +11992,7 @@ function OhhwellsBridge() {
|
|
|
11681
11992
|
[refreshFooterDragVisuals]
|
|
11682
11993
|
);
|
|
11683
11994
|
beginFooterDragRef.current = beginFooterDrag;
|
|
11684
|
-
const commitFooterDrag = (0,
|
|
11995
|
+
const commitFooterDrag = (0, import_react13.useCallback)(
|
|
11685
11996
|
(clientX, clientY) => {
|
|
11686
11997
|
const session = footerDragRef.current;
|
|
11687
11998
|
if (!session) {
|
|
@@ -11785,7 +12096,7 @@ function OhhwellsBridge() {
|
|
|
11785
12096
|
[clearFooterDragVisuals, resolveHrefKeyElement, resyncSelectedNavigationItem]
|
|
11786
12097
|
);
|
|
11787
12098
|
commitFooterDragRef.current = commitFooterDrag;
|
|
11788
|
-
const startFooterLinkDrag = (0,
|
|
12099
|
+
const startFooterLinkDrag = (0, import_react13.useCallback)(
|
|
11789
12100
|
(anchor, clientX, clientY, wasSelected) => {
|
|
11790
12101
|
const hrefKey = anchor.getAttribute("data-ohw-href-key");
|
|
11791
12102
|
if (!hrefKey || !isFooterHrefKey(hrefKey)) return false;
|
|
@@ -11806,7 +12117,7 @@ function OhhwellsBridge() {
|
|
|
11806
12117
|
},
|
|
11807
12118
|
[beginFooterDrag]
|
|
11808
12119
|
);
|
|
11809
|
-
const startFooterColumnDrag = (0,
|
|
12120
|
+
const startFooterColumnDrag = (0, import_react13.useCallback)(
|
|
11810
12121
|
(columnEl, clientX, clientY, wasSelected) => {
|
|
11811
12122
|
const columns = listFooterColumns();
|
|
11812
12123
|
const idx = columns.indexOf(columnEl);
|
|
@@ -11826,7 +12137,7 @@ function OhhwellsBridge() {
|
|
|
11826
12137
|
},
|
|
11827
12138
|
[beginFooterDrag]
|
|
11828
12139
|
);
|
|
11829
|
-
const handleItemDragStart = (0,
|
|
12140
|
+
const handleItemDragStart = (0, import_react13.useCallback)(
|
|
11830
12141
|
(e) => {
|
|
11831
12142
|
const selected = selectedElRef.current;
|
|
11832
12143
|
if (!selected) {
|
|
@@ -11846,7 +12157,7 @@ function OhhwellsBridge() {
|
|
|
11846
12157
|
},
|
|
11847
12158
|
[startFooterColumnDrag, startFooterLinkDrag, startNavLinkDrag]
|
|
11848
12159
|
);
|
|
11849
|
-
const handleItemDragEnd = (0,
|
|
12160
|
+
const handleItemDragEnd = (0, import_react13.useCallback)(
|
|
11850
12161
|
(e) => {
|
|
11851
12162
|
if (footerDragRef.current) {
|
|
11852
12163
|
const x = e?.clientX;
|
|
@@ -11872,7 +12183,7 @@ function OhhwellsBridge() {
|
|
|
11872
12183
|
},
|
|
11873
12184
|
[commitFooterDrag, commitNavDrag, navDragRef]
|
|
11874
12185
|
);
|
|
11875
|
-
const handleItemChromePointerDown = (0,
|
|
12186
|
+
const handleItemChromePointerDown = (0, import_react13.useCallback)((e) => {
|
|
11876
12187
|
if (e.button !== 0) return;
|
|
11877
12188
|
const selected = selectedElRef.current;
|
|
11878
12189
|
if (!selected) return;
|
|
@@ -11903,7 +12214,7 @@ function OhhwellsBridge() {
|
|
|
11903
12214
|
}
|
|
11904
12215
|
if (armNavPressFromChrome(selected, e.clientX, e.clientY, e.pointerId)) return;
|
|
11905
12216
|
}, [armNavPressFromChrome]);
|
|
11906
|
-
const handleItemChromeClick = (0,
|
|
12217
|
+
const handleItemChromeClick = (0, import_react13.useCallback)((clientX, clientY) => {
|
|
11907
12218
|
if (suppressNextClickRef.current || Date.now() < suppressClickUntilRef.current) {
|
|
11908
12219
|
suppressNextClickRef.current = false;
|
|
11909
12220
|
return;
|
|
@@ -11916,9 +12227,10 @@ function OhhwellsBridge() {
|
|
|
11916
12227
|
}, []);
|
|
11917
12228
|
reselectNavigationItemRef.current = reselectNavigationItem;
|
|
11918
12229
|
commitNavigationTextEditRef.current = commitNavigationTextEdit;
|
|
11919
|
-
const select = (0,
|
|
12230
|
+
const select = (0, import_react13.useCallback)((anchor) => {
|
|
11920
12231
|
if (!isNavigationItem2(anchor)) return;
|
|
11921
12232
|
if (activeElRef.current) deactivate();
|
|
12233
|
+
aiSectionApiRef.current?.selectFromElement(anchor);
|
|
11922
12234
|
selectedElRef.current = anchor;
|
|
11923
12235
|
selectedHrefKeyRef.current = anchor.getAttribute("data-ohw-href-key");
|
|
11924
12236
|
selectedFooterColAttrRef.current = null;
|
|
@@ -11954,9 +12266,10 @@ function OhhwellsBridge() {
|
|
|
11954
12266
|
setToolbarShowEditLink(false);
|
|
11955
12267
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
11956
12268
|
}, [deactivate, markSelected]);
|
|
11957
|
-
const selectFrame = (0,
|
|
12269
|
+
const selectFrame = (0, import_react13.useCallback)((el) => {
|
|
11958
12270
|
if (!isNavigationContainer(el)) return;
|
|
11959
12271
|
if (activeElRef.current) deactivate();
|
|
12272
|
+
aiSectionApiRef.current?.selectFromElement(el);
|
|
11960
12273
|
const isFooterColumn = !isFooterLinksContainer(el) && (el.hasAttribute("data-ohw-footer-col") || Boolean(el.closest("footer") && isInferredFooterGroup2(el)));
|
|
11961
12274
|
selectedElRef.current = el;
|
|
11962
12275
|
selectedHrefKeyRef.current = null;
|
|
@@ -12000,7 +12313,7 @@ function OhhwellsBridge() {
|
|
|
12000
12313
|
setToolbarShowEditLink(false);
|
|
12001
12314
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
12002
12315
|
}, [deactivate, markSelected, postToParent2]);
|
|
12003
|
-
const activate = (0,
|
|
12316
|
+
const activate = (0, import_react13.useCallback)((el, options) => {
|
|
12004
12317
|
if (activeElRef.current === el) return;
|
|
12005
12318
|
clearSelectedAttr();
|
|
12006
12319
|
selectedElRef.current = null;
|
|
@@ -12069,6 +12382,7 @@ function OhhwellsBridge() {
|
|
|
12069
12382
|
sectionId: sectionEl?.dataset.ohwSection ?? null,
|
|
12070
12383
|
sectionLabel: sectionEl?.dataset.ohwSectionLabel ?? null
|
|
12071
12384
|
});
|
|
12385
|
+
aiSectionApiRef.current?.selectFromElement(el, { report: false });
|
|
12072
12386
|
requestAnimationFrame(() => refreshActiveCommandsRef.current());
|
|
12073
12387
|
}, [clearSelectedAttr, deactivate, postToParent2]);
|
|
12074
12388
|
activateRef.current = activate;
|
|
@@ -12076,7 +12390,7 @@ function OhhwellsBridge() {
|
|
|
12076
12390
|
selectRef.current = select;
|
|
12077
12391
|
selectFrameRef.current = selectFrame;
|
|
12078
12392
|
deselectRef.current = deselect;
|
|
12079
|
-
(0,
|
|
12393
|
+
(0, import_react13.useLayoutEffect)(() => {
|
|
12080
12394
|
if (!subdomain || isEditMode) {
|
|
12081
12395
|
setFetchState("done");
|
|
12082
12396
|
return;
|
|
@@ -12147,7 +12461,7 @@ function OhhwellsBridge() {
|
|
|
12147
12461
|
cancelled = true;
|
|
12148
12462
|
};
|
|
12149
12463
|
}, [subdomain, isEditMode]);
|
|
12150
|
-
(0,
|
|
12464
|
+
(0, import_react13.useEffect)(() => {
|
|
12151
12465
|
if (!subdomain || isEditMode) return;
|
|
12152
12466
|
let debounceTimer = null;
|
|
12153
12467
|
let observer = null;
|
|
@@ -12198,16 +12512,16 @@ function OhhwellsBridge() {
|
|
|
12198
12512
|
if (debounceTimer) clearTimeout(debounceTimer);
|
|
12199
12513
|
};
|
|
12200
12514
|
}, [subdomain, isEditMode, pathname]);
|
|
12201
|
-
(0,
|
|
12515
|
+
(0, import_react13.useLayoutEffect)(() => {
|
|
12202
12516
|
const el = document.getElementById("ohw-loader");
|
|
12203
12517
|
if (!el) return;
|
|
12204
12518
|
const visible = Boolean(subdomain) && fetchState !== "done";
|
|
12205
12519
|
el.style.display = visible ? "flex" : "none";
|
|
12206
12520
|
}, [subdomain, fetchState]);
|
|
12207
|
-
(0,
|
|
12521
|
+
(0, import_react13.useEffect)(() => {
|
|
12208
12522
|
postToParent2({ type: "ow:navigation", path: pathname });
|
|
12209
12523
|
}, [pathname, postToParent2]);
|
|
12210
|
-
(0,
|
|
12524
|
+
(0, import_react13.useEffect)(() => {
|
|
12211
12525
|
if (!isEditMode) return;
|
|
12212
12526
|
if (linkPopoverSessionRef.current?.intent === "add-nav") return;
|
|
12213
12527
|
if (document.querySelector("[data-ohw-section-picker]")) return;
|
|
@@ -12215,7 +12529,7 @@ function OhhwellsBridge() {
|
|
|
12215
12529
|
deselectRef.current();
|
|
12216
12530
|
deactivateRef.current();
|
|
12217
12531
|
}, [pathname, isEditMode]);
|
|
12218
|
-
(0,
|
|
12532
|
+
(0, import_react13.useEffect)(() => {
|
|
12219
12533
|
const contentForNav = () => {
|
|
12220
12534
|
if (isEditMode) return editContentRef.current;
|
|
12221
12535
|
if (!subdomain) return {};
|
|
@@ -12280,7 +12594,7 @@ function OhhwellsBridge() {
|
|
|
12280
12594
|
observer?.disconnect();
|
|
12281
12595
|
};
|
|
12282
12596
|
}, [isEditMode, pathname, subdomain, fetchState, resyncSelectedNavigationItem]);
|
|
12283
|
-
(0,
|
|
12597
|
+
(0, import_react13.useEffect)(() => {
|
|
12284
12598
|
if (!isEditMode) return;
|
|
12285
12599
|
const measure = () => {
|
|
12286
12600
|
const h = document.body.scrollHeight;
|
|
@@ -12304,7 +12618,7 @@ function OhhwellsBridge() {
|
|
|
12304
12618
|
window.removeEventListener("resize", handleResize);
|
|
12305
12619
|
};
|
|
12306
12620
|
}, [pathname, isEditMode, postToParent2]);
|
|
12307
|
-
(0,
|
|
12621
|
+
(0, import_react13.useEffect)(() => {
|
|
12308
12622
|
if (!subdomainFromQuery || isEditMode) return;
|
|
12309
12623
|
const handleClick = (e) => {
|
|
12310
12624
|
const anchor = e.target.closest("a");
|
|
@@ -12320,7 +12634,7 @@ function OhhwellsBridge() {
|
|
|
12320
12634
|
document.addEventListener("click", handleClick, true);
|
|
12321
12635
|
return () => document.removeEventListener("click", handleClick, true);
|
|
12322
12636
|
}, [subdomainFromQuery, isEditMode, router]);
|
|
12323
|
-
(0,
|
|
12637
|
+
(0, import_react13.useEffect)(() => {
|
|
12324
12638
|
if (!isEditMode) {
|
|
12325
12639
|
editStylesRef.current?.base.remove();
|
|
12326
12640
|
editStylesRef.current?.forceHover.remove();
|
|
@@ -12372,7 +12686,7 @@ function OhhwellsBridge() {
|
|
|
12372
12686
|
[data-ohw-editable="bg-image"], [data-ohw-editable="bg-image"] * { cursor: pointer !important; }
|
|
12373
12687
|
[data-ohw-editable="link"], [data-ohw-editable="link"] * { cursor: pointer !important; }
|
|
12374
12688
|
[data-ohw-hovered]:not([contenteditable]):not([data-ohw-href-key]) {
|
|
12375
|
-
outline: 2px dashed ${
|
|
12689
|
+
outline: 2px dashed ${PRIMARY3} !important;
|
|
12376
12690
|
outline-offset: 4px;
|
|
12377
12691
|
}
|
|
12378
12692
|
[data-ohw-href-key] [data-ohw-hovered],
|
|
@@ -12407,11 +12721,11 @@ function OhhwellsBridge() {
|
|
|
12407
12721
|
footer [data-ohw-href-key] [data-ohw-editable][contenteditable],
|
|
12408
12722
|
footer [data-ohw-href-key] [data-ohw-editable][contenteditable] * {
|
|
12409
12723
|
outline: none !important;
|
|
12410
|
-
caret-color: ${
|
|
12724
|
+
caret-color: ${PRIMARY3} !important;
|
|
12411
12725
|
cursor: text !important;
|
|
12412
12726
|
}
|
|
12413
12727
|
[data-ohw-editable][contenteditable]::selection,
|
|
12414
|
-
[data-ohw-editable][contenteditable] *::selection { background: ${
|
|
12728
|
+
[data-ohw-editable][contenteditable] *::selection { background: ${PRIMARY3}59 !important; }
|
|
12415
12729
|
[data-ohw-editable-state], [data-ohw-editable-state] * { pointer-events: none !important; }
|
|
12416
12730
|
[data-ohw-editable-state][data-ohw-active-state] [data-ohw-editable] { pointer-events: auto !important; }
|
|
12417
12731
|
[data-ohw-editable-state][data-ohw-active-state][data-ohw-editable] { pointer-events: auto !important; }
|
|
@@ -12426,7 +12740,7 @@ function OhhwellsBridge() {
|
|
|
12426
12740
|
stateViews.textContent = `
|
|
12427
12741
|
[data-ohw-state-view]:not([data-ohw-state-view="default"]) { display: none; }
|
|
12428
12742
|
[data-ohw-state-view="default"] [data-ohw-editable] { pointer-events: auto !important; }
|
|
12429
|
-
[data-ohw-state-hovered] { outline: 2px dashed ${
|
|
12743
|
+
[data-ohw-state-hovered] { outline: 2px dashed ${PRIMARY3} !important; outline-offset: 4px; }
|
|
12430
12744
|
[data-ohw-state-hovered]:has([data-ohw-hovered]) { outline: none !important; }
|
|
12431
12745
|
`;
|
|
12432
12746
|
document.head.appendChild(base);
|
|
@@ -12450,6 +12764,10 @@ function OhhwellsBridge() {
|
|
|
12450
12764
|
if (target.closest("[data-ohw-max-badge]")) return;
|
|
12451
12765
|
if (isInsideLinkEditor(target)) return;
|
|
12452
12766
|
if (target.closest('[data-ohw-edit-chrome], [data-ohw-item-interaction], [data-ohw-drag-handle-container], [data-slot="drag-handle"]')) {
|
|
12767
|
+
const beneath = document.elementsFromPoint(e.clientX, e.clientY).find(
|
|
12768
|
+
(el) => el instanceof HTMLElement && !el.closest("[data-ohw-bridge-root]") && el.closest("[data-ohw-section]") != null
|
|
12769
|
+
);
|
|
12770
|
+
if (beneath) aiSectionApiRef.current?.selectFromElement(beneath);
|
|
12453
12771
|
if (target.closest("[data-ohw-item-drag-surface]")) {
|
|
12454
12772
|
e.preventDefault();
|
|
12455
12773
|
e.stopPropagation();
|
|
@@ -12513,6 +12831,7 @@ function OhhwellsBridge() {
|
|
|
12513
12831
|
if (editable.dataset.ohwEditable === "link") {
|
|
12514
12832
|
e.preventDefault();
|
|
12515
12833
|
e.stopPropagation();
|
|
12834
|
+
aiSectionApiRef.current?.selectFromElement(editable);
|
|
12516
12835
|
deselectRef.current();
|
|
12517
12836
|
deactivateRef.current();
|
|
12518
12837
|
bumpLinkPopoverGrace();
|
|
@@ -12526,6 +12845,7 @@ function OhhwellsBridge() {
|
|
|
12526
12845
|
if (isMediaEditable(editable)) {
|
|
12527
12846
|
e.preventDefault();
|
|
12528
12847
|
e.stopPropagation();
|
|
12848
|
+
aiSectionApiRef.current?.selectFromElement(editable);
|
|
12529
12849
|
postToParentRef.current({ type: "ow:image-pick", key: editable.dataset.ohwKey ?? "", elementType: editable.dataset.ohwEditable ?? "image" });
|
|
12530
12850
|
return;
|
|
12531
12851
|
}
|
|
@@ -12628,6 +12948,7 @@ function OhhwellsBridge() {
|
|
|
12628
12948
|
closeLinkPopoverRef.current();
|
|
12629
12949
|
return;
|
|
12630
12950
|
}
|
|
12951
|
+
aiSectionApiRef.current?.handleBackgroundClick(target, e.clientX, e.clientY);
|
|
12631
12952
|
deselectRef.current();
|
|
12632
12953
|
deactivateRef.current();
|
|
12633
12954
|
};
|
|
@@ -14026,6 +14347,7 @@ function OhhwellsBridge() {
|
|
|
14026
14347
|
selectFrameRef.current(footerColumn);
|
|
14027
14348
|
return;
|
|
14028
14349
|
}
|
|
14350
|
+
aiSectionApiRef.current?.handleBackgroundClick(e.target, clientX, clientY);
|
|
14029
14351
|
deactivateRef.current();
|
|
14030
14352
|
};
|
|
14031
14353
|
window.addEventListener("message", handleSave);
|
|
@@ -14104,7 +14426,7 @@ function OhhwellsBridge() {
|
|
|
14104
14426
|
if (imageShowTimerRef.current) clearTimeout(imageShowTimerRef.current);
|
|
14105
14427
|
};
|
|
14106
14428
|
}, [isEditMode, refreshStateRules]);
|
|
14107
|
-
(0,
|
|
14429
|
+
(0, import_react13.useEffect)(() => {
|
|
14108
14430
|
if (!isEditMode) return;
|
|
14109
14431
|
const THRESHOLD = 10;
|
|
14110
14432
|
const resolveWasSelected = (el) => {
|
|
@@ -14258,7 +14580,7 @@ function OhhwellsBridge() {
|
|
|
14258
14580
|
unlockFooterDragInteraction();
|
|
14259
14581
|
};
|
|
14260
14582
|
}, [isEditMode]);
|
|
14261
|
-
(0,
|
|
14583
|
+
(0, import_react13.useEffect)(() => {
|
|
14262
14584
|
const handler = (e) => {
|
|
14263
14585
|
if (e.data?.type !== "ow:request-schedule-config") return;
|
|
14264
14586
|
const insertAfterVal = e.data.insertAfter;
|
|
@@ -14274,7 +14596,7 @@ function OhhwellsBridge() {
|
|
|
14274
14596
|
window.addEventListener("message", handler);
|
|
14275
14597
|
return () => window.removeEventListener("message", handler);
|
|
14276
14598
|
}, [processConfigRequest]);
|
|
14277
|
-
(0,
|
|
14599
|
+
(0, import_react13.useEffect)(() => {
|
|
14278
14600
|
if (!isEditMode) return;
|
|
14279
14601
|
document.querySelectorAll("[data-ohw-active-state]").forEach((el) => {
|
|
14280
14602
|
el.removeAttribute("data-ohw-active-state");
|
|
@@ -14310,13 +14632,13 @@ function OhhwellsBridge() {
|
|
|
14310
14632
|
clearTimeout(timer);
|
|
14311
14633
|
};
|
|
14312
14634
|
}, [pathname, isEditMode, refreshStateRules, postToParent2]);
|
|
14313
|
-
(0,
|
|
14635
|
+
(0, import_react13.useEffect)(() => {
|
|
14314
14636
|
scrollToHashSectionWhenReady();
|
|
14315
14637
|
const onHashChange = () => scrollToHashSectionWhenReady();
|
|
14316
14638
|
window.addEventListener("hashchange", onHashChange);
|
|
14317
14639
|
return () => window.removeEventListener("hashchange", onHashChange);
|
|
14318
14640
|
}, [pathname]);
|
|
14319
|
-
const handleCommand = (0,
|
|
14641
|
+
const handleCommand = (0, import_react13.useCallback)((cmd) => {
|
|
14320
14642
|
const el = activeElRef.current;
|
|
14321
14643
|
const selBefore = window.getSelection();
|
|
14322
14644
|
let savedOffsets = null;
|
|
@@ -14352,7 +14674,7 @@ function OhhwellsBridge() {
|
|
|
14352
14674
|
if (el) setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
14353
14675
|
refreshActiveCommandsRef.current();
|
|
14354
14676
|
}, []);
|
|
14355
|
-
const handleStateChange = (0,
|
|
14677
|
+
const handleStateChange = (0, import_react13.useCallback)((state) => {
|
|
14356
14678
|
if (!activeStateElRef.current) return;
|
|
14357
14679
|
const el = activeStateElRef.current;
|
|
14358
14680
|
if (state === "Default") {
|
|
@@ -14365,7 +14687,7 @@ function OhhwellsBridge() {
|
|
|
14365
14687
|
}
|
|
14366
14688
|
setToggleState((prev) => prev ? { ...prev, activeState: state } : null);
|
|
14367
14689
|
}, [deactivate]);
|
|
14368
|
-
const reselectAfterLinkPopover = (0,
|
|
14690
|
+
const reselectAfterLinkPopover = (0, import_react13.useCallback)(
|
|
14369
14691
|
(hrefKey) => {
|
|
14370
14692
|
requestAnimationFrame(() => {
|
|
14371
14693
|
const el = resolveHrefKeyElement(hrefKey);
|
|
@@ -14374,7 +14696,7 @@ function OhhwellsBridge() {
|
|
|
14374
14696
|
},
|
|
14375
14697
|
[resolveHrefKeyElement]
|
|
14376
14698
|
);
|
|
14377
|
-
const closeLinkPopover = (0,
|
|
14699
|
+
const closeLinkPopover = (0, import_react13.useCallback)(() => {
|
|
14378
14700
|
const session = linkPopoverSessionRef.current;
|
|
14379
14701
|
addNavAfterAnchorRef.current = null;
|
|
14380
14702
|
setLinkPopover(null);
|
|
@@ -14382,9 +14704,9 @@ function OhhwellsBridge() {
|
|
|
14382
14704
|
reselectAfterLinkPopover(session.key);
|
|
14383
14705
|
}
|
|
14384
14706
|
}, [reselectAfterLinkPopover]);
|
|
14385
|
-
const closeLinkPopoverRef = (0,
|
|
14707
|
+
const closeLinkPopoverRef = (0, import_react13.useRef)(closeLinkPopover);
|
|
14386
14708
|
closeLinkPopoverRef.current = closeLinkPopover;
|
|
14387
|
-
const openLinkPopoverForActive = (0,
|
|
14709
|
+
const openLinkPopoverForActive = (0, import_react13.useCallback)(() => {
|
|
14388
14710
|
const hrefCtx = getHrefKeyFromElement(activeElRef.current);
|
|
14389
14711
|
if (!hrefCtx) return;
|
|
14390
14712
|
bumpLinkPopoverGrace();
|
|
@@ -14395,7 +14717,7 @@ function OhhwellsBridge() {
|
|
|
14395
14717
|
});
|
|
14396
14718
|
deactivate();
|
|
14397
14719
|
}, [deactivate]);
|
|
14398
|
-
const openLinkPopoverForSelected = (0,
|
|
14720
|
+
const openLinkPopoverForSelected = (0, import_react13.useCallback)(() => {
|
|
14399
14721
|
const anchor = selectedElRef.current;
|
|
14400
14722
|
if (!anchor) return;
|
|
14401
14723
|
const key = anchor.getAttribute("data-ohw-href-key");
|
|
@@ -14408,7 +14730,7 @@ function OhhwellsBridge() {
|
|
|
14408
14730
|
});
|
|
14409
14731
|
deselect();
|
|
14410
14732
|
}, [deselect]);
|
|
14411
|
-
const handleSelectParent = (0,
|
|
14733
|
+
const handleSelectParent = (0, import_react13.useCallback)(() => {
|
|
14412
14734
|
const selected = selectedElRef.current;
|
|
14413
14735
|
if (!selected) return;
|
|
14414
14736
|
if (toolbarVariantRef.current === "select-frame") {
|
|
@@ -14435,7 +14757,7 @@ function OhhwellsBridge() {
|
|
|
14435
14757
|
}
|
|
14436
14758
|
deselectRef.current();
|
|
14437
14759
|
}, []);
|
|
14438
|
-
const handleDuplicateSelected = (0,
|
|
14760
|
+
const handleDuplicateSelected = (0, import_react13.useCallback)(() => {
|
|
14439
14761
|
const selected = selectedElRef.current;
|
|
14440
14762
|
if (!selected || !isNavigationItem2(selected)) return;
|
|
14441
14763
|
const hrefKey = selected.getAttribute("data-ohw-href-key");
|
|
@@ -14525,7 +14847,7 @@ function OhhwellsBridge() {
|
|
|
14525
14847
|
});
|
|
14526
14848
|
}
|
|
14527
14849
|
}, [postToParent2]);
|
|
14528
|
-
const runPendingDeleteUndo = (0,
|
|
14850
|
+
const runPendingDeleteUndo = (0, import_react13.useCallback)(() => {
|
|
14529
14851
|
const pending = pendingDeleteUndoRef.current;
|
|
14530
14852
|
if (!pending) return false;
|
|
14531
14853
|
pendingDeleteUndoRef.current = null;
|
|
@@ -14533,7 +14855,7 @@ function OhhwellsBridge() {
|
|
|
14533
14855
|
enforceLinkHrefs();
|
|
14534
14856
|
return true;
|
|
14535
14857
|
}, []);
|
|
14536
|
-
const handleDeleteSelected = (0,
|
|
14858
|
+
const handleDeleteSelected = (0, import_react13.useCallback)(() => {
|
|
14537
14859
|
const selected = selectedElRef.current;
|
|
14538
14860
|
if (!selected) return false;
|
|
14539
14861
|
return deleteSelectedNavFooterItem({
|
|
@@ -14554,7 +14876,7 @@ function OhhwellsBridge() {
|
|
|
14554
14876
|
}, [postToParent2]);
|
|
14555
14877
|
handleDeleteSelectedRef.current = handleDeleteSelected;
|
|
14556
14878
|
runPendingDeleteUndoRef.current = runPendingDeleteUndo;
|
|
14557
|
-
const handleLinkPopoverSubmit = (0,
|
|
14879
|
+
const handleLinkPopoverSubmit = (0, import_react13.useCallback)(
|
|
14558
14880
|
(target) => {
|
|
14559
14881
|
const session = linkPopoverSessionRef.current;
|
|
14560
14882
|
if (!session) return;
|
|
@@ -14619,19 +14941,19 @@ function OhhwellsBridge() {
|
|
|
14619
14941
|
const showEditLink = toolbarShowEditLink;
|
|
14620
14942
|
const currentSections = sectionsByPath[pathname] ?? [];
|
|
14621
14943
|
linkPopoverOpenRef.current = linkPopover !== null;
|
|
14622
|
-
const handleMediaReplace = (0,
|
|
14944
|
+
const handleMediaReplace = (0, import_react13.useCallback)(
|
|
14623
14945
|
(key) => {
|
|
14624
14946
|
postToParent2({ type: "ow:image-pick", key, elementType: mediaHover?.elementType ?? "image" });
|
|
14625
14947
|
},
|
|
14626
14948
|
[postToParent2, mediaHover?.elementType]
|
|
14627
14949
|
);
|
|
14628
|
-
const handleEditCarousel = (0,
|
|
14950
|
+
const handleEditCarousel = (0, import_react13.useCallback)(
|
|
14629
14951
|
(key) => {
|
|
14630
14952
|
postToParent2({ type: "ow:carousel-open", key, images: readCarouselValue(key) });
|
|
14631
14953
|
},
|
|
14632
14954
|
[postToParent2]
|
|
14633
14955
|
);
|
|
14634
|
-
const handleMediaFadeOutComplete = (0,
|
|
14956
|
+
const handleMediaFadeOutComplete = (0, import_react13.useCallback)((key) => {
|
|
14635
14957
|
setUploadingRects((prev) => {
|
|
14636
14958
|
if (!(key in prev)) return prev;
|
|
14637
14959
|
const next = { ...prev };
|
|
@@ -14639,7 +14961,7 @@ function OhhwellsBridge() {
|
|
|
14639
14961
|
return next;
|
|
14640
14962
|
});
|
|
14641
14963
|
}, []);
|
|
14642
|
-
const handleVideoSettingsChange = (0,
|
|
14964
|
+
const handleVideoSettingsChange = (0, import_react13.useCallback)(
|
|
14643
14965
|
(key, settings) => {
|
|
14644
14966
|
document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
|
|
14645
14967
|
const video = getVideoEl2(el);
|
|
@@ -14662,9 +14984,10 @@ function OhhwellsBridge() {
|
|
|
14662
14984
|
[postToParent2]
|
|
14663
14985
|
);
|
|
14664
14986
|
return bridgeRoot ? (0, import_react_dom3.createPortal)(
|
|
14665
|
-
/* @__PURE__ */ (0,
|
|
14666
|
-
/* @__PURE__ */ (0,
|
|
14667
|
-
|
|
14987
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_jsx_runtime28.Fragment, { children: [
|
|
14988
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { ref: attachVisibleViewport, "data-ohw-visible-viewport": "", "aria-hidden": true }),
|
|
14989
|
+
isEditMode && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(AiSectionOverlay, { postToParent: postToParent2, apiRef: aiSectionApiRef }),
|
|
14990
|
+
Object.entries(uploadingRects).map(([key, { rect, fadingOut }]) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
14668
14991
|
MediaOverlay,
|
|
14669
14992
|
{
|
|
14670
14993
|
hover: { key, rect, elementType: "image", isDragOver: false, hasTextOverlap: false },
|
|
@@ -14675,7 +14998,7 @@ function OhhwellsBridge() {
|
|
|
14675
14998
|
},
|
|
14676
14999
|
`uploading-${key}`
|
|
14677
15000
|
)),
|
|
14678
|
-
mediaHover && !(mediaHover.key in uploadingRects) && /* @__PURE__ */ (0,
|
|
15001
|
+
mediaHover && !(mediaHover.key in uploadingRects) && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
14679
15002
|
MediaOverlay,
|
|
14680
15003
|
{
|
|
14681
15004
|
hover: mediaHover,
|
|
@@ -14684,11 +15007,11 @@ function OhhwellsBridge() {
|
|
|
14684
15007
|
onVideoSettingsChange: handleVideoSettingsChange
|
|
14685
15008
|
}
|
|
14686
15009
|
),
|
|
14687
|
-
carouselHover && !linkPopover && !isItemDragging && /* @__PURE__ */ (0,
|
|
14688
|
-
siblingHintRect && !linkPopover && !isItemDragging && siblingHintRects.length === 0 && /* @__PURE__ */ (0,
|
|
14689
|
-
siblingHintRects.length > 0 && !linkPopover && !isItemDragging && siblingHintRects.map((rect, i) => /* @__PURE__ */ (0,
|
|
14690
|
-
isItemDragging && draggedItemRect && selectedElRef.current !== footerDragRef.current?.draggedEl && selectedElRef.current !== navDragRef.current?.draggedEl && /* @__PURE__ */ (0,
|
|
14691
|
-
isItemDragging && footerDropSlots.map((slot, i) => /* @__PURE__ */ (0,
|
|
15010
|
+
carouselHover && !linkPopover && !isItemDragging && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(CarouselOverlay, { hover: carouselHover, onEdit: handleEditCarousel }),
|
|
15011
|
+
siblingHintRect && !linkPopover && !isItemDragging && siblingHintRects.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ItemInteractionLayer, { rect: siblingHintRect, state: "sibling-hint" }),
|
|
15012
|
+
siblingHintRects.length > 0 && !linkPopover && !isItemDragging && siblingHintRects.map((rect, i) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ItemInteractionLayer, { rect, state: "sibling-hint" }, `sibling-hint-${i}`)),
|
|
15013
|
+
isItemDragging && draggedItemRect && selectedElRef.current !== footerDragRef.current?.draggedEl && selectedElRef.current !== navDragRef.current?.draggedEl && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ItemInteractionLayer, { rect: draggedItemRect, state: "dragging" }),
|
|
15014
|
+
isItemDragging && footerDropSlots.map((slot, i) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
14692
15015
|
"div",
|
|
14693
15016
|
{
|
|
14694
15017
|
className: "pointer-events-none fixed z-2147483646",
|
|
@@ -14698,7 +15021,7 @@ function OhhwellsBridge() {
|
|
|
14698
15021
|
width: slot.width,
|
|
14699
15022
|
height: slot.height
|
|
14700
15023
|
},
|
|
14701
|
-
children: /* @__PURE__ */ (0,
|
|
15024
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
14702
15025
|
DropIndicator,
|
|
14703
15026
|
{
|
|
14704
15027
|
direction: slot.direction,
|
|
@@ -14709,7 +15032,7 @@ function OhhwellsBridge() {
|
|
|
14709
15032
|
},
|
|
14710
15033
|
`footer-drop-${slot.direction}-${slot.columnIndex}-${slot.insertIndex}-${i}`
|
|
14711
15034
|
)),
|
|
14712
|
-
isItemDragging && navDropSlots.map((slot, i) => /* @__PURE__ */ (0,
|
|
15035
|
+
isItemDragging && navDropSlots.map((slot, i) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
14713
15036
|
"div",
|
|
14714
15037
|
{
|
|
14715
15038
|
className: "pointer-events-none fixed z-2147483646",
|
|
@@ -14719,7 +15042,7 @@ function OhhwellsBridge() {
|
|
|
14719
15042
|
width: slot.width,
|
|
14720
15043
|
height: slot.height
|
|
14721
15044
|
},
|
|
14722
|
-
children: /* @__PURE__ */ (0,
|
|
15045
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
14723
15046
|
DropIndicator,
|
|
14724
15047
|
{
|
|
14725
15048
|
direction: slot.direction,
|
|
@@ -14730,10 +15053,10 @@ function OhhwellsBridge() {
|
|
|
14730
15053
|
},
|
|
14731
15054
|
`nav-drop-${slot.direction}-${slot.parentId ?? "root"}-${slot.insertIndex}-${i}`
|
|
14732
15055
|
)),
|
|
14733
|
-
hoveredNavContainerRect && (toolbarVariant !== "select-frame" || isFooterFrameSelection) && !linkPopover && !isItemDragging && /* @__PURE__ */ (0,
|
|
14734
|
-
hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */ (0,
|
|
14735
|
-
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isNavbarLinksContainer2(selectedElRef.current) && /* @__PURE__ */ (0,
|
|
14736
|
-
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isFooterLinksContainer(selectedElRef.current) && /* @__PURE__ */ (0,
|
|
15056
|
+
hoveredNavContainerRect && (toolbarVariant !== "select-frame" || isFooterFrameSelection) && !linkPopover && !isItemDragging && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ItemInteractionLayer, { rect: hoveredNavContainerRect, state: "hover" }),
|
|
15057
|
+
hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ItemInteractionLayer, { rect: hoveredItemRect, state: "hover" }),
|
|
15058
|
+
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isNavbarLinksContainer2(selectedElRef.current) && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(NavbarContainerChrome, { rect: toolbarRect, onAdd: handleAddTopLevelNavItem }),
|
|
15059
|
+
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isFooterLinksContainer(selectedElRef.current) && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
14737
15060
|
FooterContainerChrome,
|
|
14738
15061
|
{
|
|
14739
15062
|
rect: toolbarRect,
|
|
@@ -14741,7 +15064,7 @@ function OhhwellsBridge() {
|
|
|
14741
15064
|
addDisabled: !canAddFooterColumn()
|
|
14742
15065
|
}
|
|
14743
15066
|
),
|
|
14744
|
-
toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame") && /* @__PURE__ */ (0,
|
|
15067
|
+
toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame") && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
14745
15068
|
ItemInteractionLayer,
|
|
14746
15069
|
{
|
|
14747
15070
|
rect: isItemDragging && draggedItemRect && (footerDragRef.current?.wasSelected || navDragRef.current?.wasSelected) ? draggedItemRect : toolbarRect,
|
|
@@ -14756,7 +15079,7 @@ function OhhwellsBridge() {
|
|
|
14756
15079
|
onItemPointerDown: handleItemChromePointerDown,
|
|
14757
15080
|
onItemClick: handleItemChromeClick,
|
|
14758
15081
|
itemDragSurface: !isFooterFrameSelection,
|
|
14759
|
-
toolbar: toolbarVariant === "link-action" && !isItemDragging || toolbarVariant === "select-frame" && isFooterFrameSelection && !isItemDragging ? /* @__PURE__ */ (0,
|
|
15082
|
+
toolbar: toolbarVariant === "link-action" && !isItemDragging || toolbarVariant === "select-frame" && isFooterFrameSelection && !isItemDragging ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
14760
15083
|
ItemActionToolbar,
|
|
14761
15084
|
{
|
|
14762
15085
|
onEditLink: openLinkPopoverForSelected,
|
|
@@ -14781,8 +15104,8 @@ function OhhwellsBridge() {
|
|
|
14781
15104
|
) : void 0
|
|
14782
15105
|
}
|
|
14783
15106
|
),
|
|
14784
|
-
toolbarRect && toolbarVariant === "rich-text" && !linkPopover && /* @__PURE__ */ (0,
|
|
14785
|
-
/* @__PURE__ */ (0,
|
|
15107
|
+
toolbarRect && toolbarVariant === "rich-text" && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_jsx_runtime28.Fragment, { children: [
|
|
15108
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
14786
15109
|
EditGlowChrome,
|
|
14787
15110
|
{
|
|
14788
15111
|
rect: toolbarRect,
|
|
@@ -14792,7 +15115,7 @@ function OhhwellsBridge() {
|
|
|
14792
15115
|
hideHandle: isItemDragging
|
|
14793
15116
|
}
|
|
14794
15117
|
),
|
|
14795
|
-
/* @__PURE__ */ (0,
|
|
15118
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
14796
15119
|
FloatingToolbar,
|
|
14797
15120
|
{
|
|
14798
15121
|
rect: toolbarRect,
|
|
@@ -14805,7 +15128,7 @@ function OhhwellsBridge() {
|
|
|
14805
15128
|
}
|
|
14806
15129
|
)
|
|
14807
15130
|
] }),
|
|
14808
|
-
maxBadge && /* @__PURE__ */ (0,
|
|
15131
|
+
maxBadge && /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
|
|
14809
15132
|
"div",
|
|
14810
15133
|
{
|
|
14811
15134
|
"data-ohw-max-badge": "",
|
|
@@ -14831,7 +15154,7 @@ function OhhwellsBridge() {
|
|
|
14831
15154
|
]
|
|
14832
15155
|
}
|
|
14833
15156
|
),
|
|
14834
|
-
toggleState && !linkPopover && /* @__PURE__ */ (0,
|
|
15157
|
+
toggleState && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
14835
15158
|
StateToggle,
|
|
14836
15159
|
{
|
|
14837
15160
|
rect: toggleState.rect,
|
|
@@ -14840,15 +15163,15 @@ function OhhwellsBridge() {
|
|
|
14840
15163
|
onStateChange: handleStateChange
|
|
14841
15164
|
}
|
|
14842
15165
|
),
|
|
14843
|
-
sectionGap && !linkPopover && /* @__PURE__ */ (0,
|
|
15166
|
+
sectionGap && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
|
|
14844
15167
|
"div",
|
|
14845
15168
|
{
|
|
14846
15169
|
"data-ohw-section-insert-line": "",
|
|
14847
15170
|
className: "fixed left-0 w-full z-2147483646 flex items-center pointer-events-none",
|
|
14848
15171
|
style: { top: sectionGap.y, transform: "translateY(-50%)" },
|
|
14849
15172
|
children: [
|
|
14850
|
-
/* @__PURE__ */ (0,
|
|
14851
|
-
/* @__PURE__ */ (0,
|
|
15173
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } }),
|
|
15174
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
14852
15175
|
Badge,
|
|
14853
15176
|
{
|
|
14854
15177
|
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",
|
|
@@ -14865,11 +15188,11 @@ function OhhwellsBridge() {
|
|
|
14865
15188
|
children: "Add Section"
|
|
14866
15189
|
}
|
|
14867
15190
|
),
|
|
14868
|
-
/* @__PURE__ */ (0,
|
|
15191
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } })
|
|
14869
15192
|
]
|
|
14870
15193
|
}
|
|
14871
15194
|
),
|
|
14872
|
-
linkPopover && dialogPortalContainer ? /* @__PURE__ */ (0,
|
|
15195
|
+
linkPopover && dialogPortalContainer ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
14873
15196
|
LinkPopover,
|
|
14874
15197
|
{
|
|
14875
15198
|
panelRef: linkPopoverPanelRef,
|