@ohhwells/bridge 0.1.51-next.129 → 0.1.52
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -30
- package/dist/index.cjs +428 -935
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +404 -911
- package/dist/index.js.map +1 -1
- package/dist/styles.css +0 -4
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
|
|
3
3
|
// src/OhhwellsBridge.tsx
|
|
4
|
-
import React10, { useCallback as
|
|
4
|
+
import React10, { useCallback as useCallback5, useEffect as useEffect9, useLayoutEffect as useLayoutEffect3, useRef as useRef7, useState as useState9 } from "react";
|
|
5
5
|
import { createRoot } from "react-dom/client";
|
|
6
6
|
import { flushSync } from "react-dom";
|
|
7
7
|
|
|
@@ -5238,12 +5238,29 @@ function CarouselOverlay({
|
|
|
5238
5238
|
);
|
|
5239
5239
|
}
|
|
5240
5240
|
|
|
5241
|
-
// src/
|
|
5242
|
-
import {
|
|
5243
|
-
import {
|
|
5241
|
+
// src/OhhwellsBridge.tsx
|
|
5242
|
+
import { createPortal as createPortal2 } from "react-dom";
|
|
5243
|
+
import { usePathname as usePathname2, useRouter as useRouter2, useSearchParams } from "next/navigation";
|
|
5244
|
+
|
|
5245
|
+
// src/lib/session-search.ts
|
|
5246
|
+
var STORAGE_KEY = "ohw-preserved-search";
|
|
5247
|
+
function readPreservedSearch() {
|
|
5248
|
+
if (typeof window === "undefined") return "";
|
|
5249
|
+
const fromUrl = window.location.search;
|
|
5250
|
+
if (fromUrl && fromUrl !== "?") {
|
|
5251
|
+
sessionStorage.setItem(STORAGE_KEY, fromUrl);
|
|
5252
|
+
return fromUrl;
|
|
5253
|
+
}
|
|
5254
|
+
return sessionStorage.getItem(STORAGE_KEY) ?? "";
|
|
5255
|
+
}
|
|
5256
|
+
function isEditSessionActive() {
|
|
5257
|
+
const search = readPreservedSearch();
|
|
5258
|
+
if (!search || search === "?") return false;
|
|
5259
|
+
const q = search.startsWith("?") ? search.slice(1) : search;
|
|
5260
|
+
return new URLSearchParams(q).get("mode") === "edit";
|
|
5261
|
+
}
|
|
5244
5262
|
|
|
5245
5263
|
// src/lib/sections.ts
|
|
5246
|
-
var LINK_PICKER_EXCLUDED_IDS = /* @__PURE__ */ new Set(["navbar", "footer"]);
|
|
5247
5264
|
function titleCaseSectionId(id) {
|
|
5248
5265
|
return id.split("-").filter(Boolean).map((w) => w.charAt(0).toUpperCase() + w.slice(1)).join(" ");
|
|
5249
5266
|
}
|
|
@@ -5252,7 +5269,7 @@ function parseSectionsFromRoot(root) {
|
|
|
5252
5269
|
const sections = [];
|
|
5253
5270
|
for (const el of root.querySelectorAll("[data-ohw-section]")) {
|
|
5254
5271
|
const id = el.getAttribute("data-ohw-section") ?? "";
|
|
5255
|
-
if (!id || seen.has(id)
|
|
5272
|
+
if (!id || seen.has(id)) continue;
|
|
5256
5273
|
if (el.parentElement?.closest("[data-ohw-section]")) continue;
|
|
5257
5274
|
seen.add(id);
|
|
5258
5275
|
const label = el.getAttribute("data-ohw-section-label") ?? titleCaseSectionId(id);
|
|
@@ -5269,333 +5286,6 @@ function parseSectionsFromHtml(html) {
|
|
|
5269
5286
|
return parseSectionsFromRoot(doc);
|
|
5270
5287
|
}
|
|
5271
5288
|
|
|
5272
|
-
// src/ui/ai-section/AiSectionOverlay.tsx
|
|
5273
|
-
import { Fragment as Fragment4, jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
5274
|
-
function readRect(sectionId) {
|
|
5275
|
-
const el = document.querySelector(`[data-ohw-section="${CSS.escape(sectionId)}"]`);
|
|
5276
|
-
if (!el) return null;
|
|
5277
|
-
const r2 = el.getBoundingClientRect();
|
|
5278
|
-
if (r2.width <= 0 || r2.height <= 0) return null;
|
|
5279
|
-
return { top: r2.top, left: r2.left, width: r2.width, height: r2.height };
|
|
5280
|
-
}
|
|
5281
|
-
function useLiveSectionRect(sectionId) {
|
|
5282
|
-
const [rect, setRect] = useState4(null);
|
|
5283
|
-
useEffect3(() => {
|
|
5284
|
-
if (!sectionId) {
|
|
5285
|
-
setRect(null);
|
|
5286
|
-
return;
|
|
5287
|
-
}
|
|
5288
|
-
const update = () => {
|
|
5289
|
-
const next = readRect(sectionId);
|
|
5290
|
-
setRect(
|
|
5291
|
-
(prev) => prev && next && prev.top === next.top && prev.left === next.left && prev.width === next.width && prev.height === next.height ? prev : next
|
|
5292
|
-
);
|
|
5293
|
-
};
|
|
5294
|
-
update();
|
|
5295
|
-
const opts = { capture: true, passive: true };
|
|
5296
|
-
window.addEventListener("scroll", update, opts);
|
|
5297
|
-
window.addEventListener("resize", update);
|
|
5298
|
-
const el = document.querySelector(`[data-ohw-section="${CSS.escape(sectionId)}"]`);
|
|
5299
|
-
const ro = el ? new ResizeObserver(update) : null;
|
|
5300
|
-
if (el && ro) ro.observe(el);
|
|
5301
|
-
const interval = setInterval(update, 500);
|
|
5302
|
-
return () => {
|
|
5303
|
-
window.removeEventListener("scroll", update, opts);
|
|
5304
|
-
window.removeEventListener("resize", update);
|
|
5305
|
-
ro?.disconnect();
|
|
5306
|
-
clearInterval(interval);
|
|
5307
|
-
};
|
|
5308
|
-
}, [sectionId]);
|
|
5309
|
-
return rect;
|
|
5310
|
-
}
|
|
5311
|
-
var PRIMARY2 = "#0885FE";
|
|
5312
|
-
function edgeAwareRadius(rect) {
|
|
5313
|
-
const container = window.innerWidth <= 480 ? 16 : 24;
|
|
5314
|
-
const docHeight = document.documentElement.scrollHeight;
|
|
5315
|
-
const atTop = rect.top + window.scrollY <= 4;
|
|
5316
|
-
const atBottom = rect.top + rect.height + window.scrollY >= docHeight - 4;
|
|
5317
|
-
const top = atTop ? container : 4;
|
|
5318
|
-
const bottom = atBottom ? container : 4;
|
|
5319
|
-
return `${top}px ${top}px ${bottom}px ${bottom}px`;
|
|
5320
|
-
}
|
|
5321
|
-
function ReviewButton({
|
|
5322
|
-
label,
|
|
5323
|
-
onClick,
|
|
5324
|
-
children,
|
|
5325
|
-
background,
|
|
5326
|
-
color
|
|
5327
|
-
}) {
|
|
5328
|
-
const [hover, setHover] = useState4(false);
|
|
5329
|
-
return /* @__PURE__ */ jsxs7("div", { style: { position: "relative" }, children: [
|
|
5330
|
-
/* @__PURE__ */ jsx14(
|
|
5331
|
-
"button",
|
|
5332
|
-
{
|
|
5333
|
-
type: "button",
|
|
5334
|
-
"aria-label": label,
|
|
5335
|
-
onClick,
|
|
5336
|
-
onMouseEnter: () => setHover(true),
|
|
5337
|
-
onMouseLeave: () => setHover(false),
|
|
5338
|
-
style: {
|
|
5339
|
-
width: 32,
|
|
5340
|
-
height: 32,
|
|
5341
|
-
display: "flex",
|
|
5342
|
-
alignItems: "center",
|
|
5343
|
-
justifyContent: "center",
|
|
5344
|
-
borderRadius: 8,
|
|
5345
|
-
border: "none",
|
|
5346
|
-
cursor: "pointer",
|
|
5347
|
-
background,
|
|
5348
|
-
color,
|
|
5349
|
-
boxShadow: "0 2px 6px rgba(0,0,0,0.15)"
|
|
5350
|
-
},
|
|
5351
|
-
children
|
|
5352
|
-
}
|
|
5353
|
-
),
|
|
5354
|
-
hover && /* @__PURE__ */ jsx14(
|
|
5355
|
-
"div",
|
|
5356
|
-
{
|
|
5357
|
-
style: {
|
|
5358
|
-
position: "absolute",
|
|
5359
|
-
top: "100%",
|
|
5360
|
-
left: "50%",
|
|
5361
|
-
transform: "translateX(-50%)",
|
|
5362
|
-
marginTop: 6,
|
|
5363
|
-
background: "#0c0a09",
|
|
5364
|
-
color: "#ffffff",
|
|
5365
|
-
fontSize: 12,
|
|
5366
|
-
lineHeight: "16px",
|
|
5367
|
-
padding: "4px 8px",
|
|
5368
|
-
borderRadius: 8,
|
|
5369
|
-
whiteSpace: "nowrap",
|
|
5370
|
-
fontFamily: "Figtree, ui-sans-serif, system-ui, sans-serif",
|
|
5371
|
-
pointerEvents: "none"
|
|
5372
|
-
},
|
|
5373
|
-
children: label
|
|
5374
|
-
}
|
|
5375
|
-
)
|
|
5376
|
-
] });
|
|
5377
|
-
}
|
|
5378
|
-
function AiSectionOverlay({
|
|
5379
|
-
postToParent: postToParent2,
|
|
5380
|
-
apiRef
|
|
5381
|
-
}) {
|
|
5382
|
-
const [selectedId, setSelectedId] = useState4(null);
|
|
5383
|
-
const [reviewId, setReviewId] = useState4(null);
|
|
5384
|
-
const reviewIdRef = useRef4(null);
|
|
5385
|
-
reviewIdRef.current = reviewId;
|
|
5386
|
-
const selectedIdRef = useRef4(null);
|
|
5387
|
-
selectedIdRef.current = selectedId;
|
|
5388
|
-
const report = useCallback2(
|
|
5389
|
-
(el) => {
|
|
5390
|
-
postToParent2({
|
|
5391
|
-
type: "ow:section-selected",
|
|
5392
|
-
sectionId: el?.dataset.ohwSection ?? null,
|
|
5393
|
-
sectionLabel: el ? el.dataset.ohwSectionLabel ?? titleCaseSectionId(el.dataset.ohwSection ?? "") : null
|
|
5394
|
-
});
|
|
5395
|
-
},
|
|
5396
|
-
[postToParent2]
|
|
5397
|
-
);
|
|
5398
|
-
const selectFromElement = useCallback2(
|
|
5399
|
-
(el, options) => {
|
|
5400
|
-
const sectionEl = el?.closest("[data-ohw-section]") ?? null;
|
|
5401
|
-
const id = sectionEl?.dataset.ohwSection ?? null;
|
|
5402
|
-
if (id === selectedIdRef.current) return;
|
|
5403
|
-
setSelectedId(id);
|
|
5404
|
-
if (options?.report !== false) report(sectionEl);
|
|
5405
|
-
},
|
|
5406
|
-
[report]
|
|
5407
|
-
);
|
|
5408
|
-
useEffect3(() => {
|
|
5409
|
-
apiRef.current = {
|
|
5410
|
-
selectFromElement,
|
|
5411
|
-
handleBackgroundClick: (target, clientX, clientY) => {
|
|
5412
|
-
let sectionEl = target?.closest("[data-ohw-section]") ?? null;
|
|
5413
|
-
if (!sectionEl && clientX !== void 0 && clientY !== void 0) {
|
|
5414
|
-
const beneath = document.elementsFromPoint(clientX, clientY).find(
|
|
5415
|
-
(el) => el instanceof HTMLElement && !el.closest("[data-ohw-bridge-root]") && el.closest("[data-ohw-section]") != null
|
|
5416
|
-
);
|
|
5417
|
-
sectionEl = beneath?.closest("[data-ohw-section]") ?? null;
|
|
5418
|
-
}
|
|
5419
|
-
selectFromElement(sectionEl);
|
|
5420
|
-
return sectionEl != null;
|
|
5421
|
-
},
|
|
5422
|
-
clear: () => setSelectedId(null)
|
|
5423
|
-
};
|
|
5424
|
-
return () => {
|
|
5425
|
-
apiRef.current = null;
|
|
5426
|
-
};
|
|
5427
|
-
}, [apiRef, selectFromElement]);
|
|
5428
|
-
useEffect3(() => {
|
|
5429
|
-
const onMessage = (e) => {
|
|
5430
|
-
if (e.data?.type === "ow:ai-select" && e.data.sectionId === null) {
|
|
5431
|
-
setSelectedId(null);
|
|
5432
|
-
return;
|
|
5433
|
-
}
|
|
5434
|
-
if (e.data?.type === "ow:ai-review") {
|
|
5435
|
-
const sectionId = e.data.sectionId;
|
|
5436
|
-
if (sectionId === null) {
|
|
5437
|
-
setReviewId(null);
|
|
5438
|
-
return;
|
|
5439
|
-
}
|
|
5440
|
-
const found = readRect(sectionId) != null;
|
|
5441
|
-
setReviewId(found ? sectionId : null);
|
|
5442
|
-
postToParent2({ type: "ow:ai-review-started", sectionId, found });
|
|
5443
|
-
if (found) {
|
|
5444
|
-
document.querySelector(`[data-ohw-section="${CSS.escape(sectionId)}"]`)?.scrollIntoView({ behavior: "smooth", block: "nearest" });
|
|
5445
|
-
}
|
|
5446
|
-
}
|
|
5447
|
-
};
|
|
5448
|
-
window.addEventListener("message", onMessage);
|
|
5449
|
-
return () => window.removeEventListener("message", onMessage);
|
|
5450
|
-
}, [postToParent2]);
|
|
5451
|
-
const [hoveredId, setHoveredId] = useState4(null);
|
|
5452
|
-
useEffect3(() => {
|
|
5453
|
-
const onMove = (e) => {
|
|
5454
|
-
const t = e.target;
|
|
5455
|
-
if (!(t instanceof HTMLElement)) return;
|
|
5456
|
-
if (t.closest(
|
|
5457
|
-
"[data-ohw-toolbar], [data-ohw-edit-chrome], [data-ohw-item-interaction], [data-ohw-link-modal-root], [data-ohw-section-picker], [data-ohw-ai-review]"
|
|
5458
|
-
)) {
|
|
5459
|
-
setHoveredId(null);
|
|
5460
|
-
return;
|
|
5461
|
-
}
|
|
5462
|
-
const sec = t.closest("[data-ohw-section]");
|
|
5463
|
-
setHoveredId(sec?.dataset.ohwSection ?? null);
|
|
5464
|
-
};
|
|
5465
|
-
const onLeave = () => setHoveredId(null);
|
|
5466
|
-
document.addEventListener("mousemove", onMove, { passive: true });
|
|
5467
|
-
document.documentElement.addEventListener("mouseleave", onLeave);
|
|
5468
|
-
return () => {
|
|
5469
|
-
document.removeEventListener("mousemove", onMove);
|
|
5470
|
-
document.documentElement.removeEventListener("mouseleave", onLeave);
|
|
5471
|
-
};
|
|
5472
|
-
}, []);
|
|
5473
|
-
useEffect3(() => {
|
|
5474
|
-
const onKeyDown = (e) => {
|
|
5475
|
-
if (e.key !== "Escape") return;
|
|
5476
|
-
if (reviewIdRef.current) return;
|
|
5477
|
-
if (document.querySelector("[data-ohw-editing]")) return;
|
|
5478
|
-
if (selectedIdRef.current) {
|
|
5479
|
-
setSelectedId(null);
|
|
5480
|
-
report(null);
|
|
5481
|
-
}
|
|
5482
|
-
};
|
|
5483
|
-
document.addEventListener("keydown", onKeyDown);
|
|
5484
|
-
return () => document.removeEventListener("keydown", onKeyDown);
|
|
5485
|
-
}, [report]);
|
|
5486
|
-
const decide = useCallback2(
|
|
5487
|
-
(decision) => {
|
|
5488
|
-
const sectionId = reviewIdRef.current;
|
|
5489
|
-
if (!sectionId) return;
|
|
5490
|
-
setReviewId(null);
|
|
5491
|
-
postToParent2({ type: "ow:ai-review-decision", sectionId, decision });
|
|
5492
|
-
},
|
|
5493
|
-
[postToParent2]
|
|
5494
|
-
);
|
|
5495
|
-
const selectionRect = useLiveSectionRect(reviewId ? null : selectedId);
|
|
5496
|
-
const reviewRect = useLiveSectionRect(reviewId);
|
|
5497
|
-
const hoverRect = useLiveSectionRect(reviewId || hoveredId === selectedId ? null : hoveredId);
|
|
5498
|
-
return /* @__PURE__ */ jsxs7(Fragment4, { children: [
|
|
5499
|
-
hoverRect && /* @__PURE__ */ jsx14(
|
|
5500
|
-
"div",
|
|
5501
|
-
{
|
|
5502
|
-
"data-ohw-ai-section-hover": "",
|
|
5503
|
-
"aria-hidden": true,
|
|
5504
|
-
style: {
|
|
5505
|
-
position: "fixed",
|
|
5506
|
-
top: hoverRect.top,
|
|
5507
|
-
left: hoverRect.left,
|
|
5508
|
-
width: hoverRect.width,
|
|
5509
|
-
height: hoverRect.height,
|
|
5510
|
-
border: `2px solid rgba(8, 133, 254, 0.45)`,
|
|
5511
|
-
borderRadius: edgeAwareRadius(hoverRect),
|
|
5512
|
-
pointerEvents: "none",
|
|
5513
|
-
zIndex: 2147482900
|
|
5514
|
-
}
|
|
5515
|
-
}
|
|
5516
|
-
),
|
|
5517
|
-
selectionRect && /* @__PURE__ */ jsx14(
|
|
5518
|
-
"div",
|
|
5519
|
-
{
|
|
5520
|
-
"data-ohw-ai-section-selected": "",
|
|
5521
|
-
"aria-hidden": true,
|
|
5522
|
-
style: {
|
|
5523
|
-
position: "fixed",
|
|
5524
|
-
top: selectionRect.top,
|
|
5525
|
-
left: selectionRect.left,
|
|
5526
|
-
width: selectionRect.width,
|
|
5527
|
-
height: selectionRect.height,
|
|
5528
|
-
border: `2px solid ${PRIMARY2}`,
|
|
5529
|
-
borderRadius: edgeAwareRadius(selectionRect),
|
|
5530
|
-
pointerEvents: "none",
|
|
5531
|
-
zIndex: 2147483e3
|
|
5532
|
-
}
|
|
5533
|
-
}
|
|
5534
|
-
),
|
|
5535
|
-
reviewRect && /* @__PURE__ */ jsx14(
|
|
5536
|
-
"div",
|
|
5537
|
-
{
|
|
5538
|
-
"data-ohw-ai-review": "",
|
|
5539
|
-
style: {
|
|
5540
|
-
position: "fixed",
|
|
5541
|
-
top: reviewRect.top,
|
|
5542
|
-
left: reviewRect.left,
|
|
5543
|
-
width: reviewRect.width,
|
|
5544
|
-
height: reviewRect.height,
|
|
5545
|
-
border: `2px solid ${PRIMARY2}`,
|
|
5546
|
-
borderRadius: edgeAwareRadius(reviewRect),
|
|
5547
|
-
zIndex: 2147483200,
|
|
5548
|
-
// The veil itself: swallows clicks so the section stays locked until decided.
|
|
5549
|
-
background: "rgba(8, 133, 254, 0.04)",
|
|
5550
|
-
pointerEvents: "auto",
|
|
5551
|
-
cursor: "default"
|
|
5552
|
-
},
|
|
5553
|
-
onClick: (e) => e.stopPropagation(),
|
|
5554
|
-
children: /* @__PURE__ */ jsxs7(
|
|
5555
|
-
"div",
|
|
5556
|
-
{
|
|
5557
|
-
style: {
|
|
5558
|
-
position: "sticky",
|
|
5559
|
-
top: 12,
|
|
5560
|
-
display: "flex",
|
|
5561
|
-
gap: 8,
|
|
5562
|
-
justifyContent: "flex-end",
|
|
5563
|
-
paddingRight: 12,
|
|
5564
|
-
paddingTop: 12
|
|
5565
|
-
},
|
|
5566
|
-
children: [
|
|
5567
|
-
/* @__PURE__ */ jsx14(ReviewButton, { label: "Accept", onClick: () => decide("accept"), background: PRIMARY2, color: "#ffffff", children: /* @__PURE__ */ jsx14(Check, { size: 16, strokeWidth: 2.5, "aria-hidden": true }) }),
|
|
5568
|
-
/* @__PURE__ */ jsx14(ReviewButton, { label: "Discard", onClick: () => decide("discard"), background: "#EFF6FF", color: "#0c0a09", children: /* @__PURE__ */ jsx14(X, { size: 16, strokeWidth: 2, "aria-hidden": true }) })
|
|
5569
|
-
]
|
|
5570
|
-
}
|
|
5571
|
-
)
|
|
5572
|
-
}
|
|
5573
|
-
)
|
|
5574
|
-
] });
|
|
5575
|
-
}
|
|
5576
|
-
|
|
5577
|
-
// src/OhhwellsBridge.tsx
|
|
5578
|
-
import { createPortal as createPortal2 } from "react-dom";
|
|
5579
|
-
import { usePathname as usePathname2, useRouter as useRouter2, useSearchParams } from "next/navigation";
|
|
5580
|
-
|
|
5581
|
-
// src/lib/session-search.ts
|
|
5582
|
-
var STORAGE_KEY = "ohw-preserved-search";
|
|
5583
|
-
function readPreservedSearch() {
|
|
5584
|
-
if (typeof window === "undefined") return "";
|
|
5585
|
-
const fromUrl = window.location.search;
|
|
5586
|
-
if (fromUrl && fromUrl !== "?") {
|
|
5587
|
-
sessionStorage.setItem(STORAGE_KEY, fromUrl);
|
|
5588
|
-
return fromUrl;
|
|
5589
|
-
}
|
|
5590
|
-
return sessionStorage.getItem(STORAGE_KEY) ?? "";
|
|
5591
|
-
}
|
|
5592
|
-
function isEditSessionActive() {
|
|
5593
|
-
const search = readPreservedSearch();
|
|
5594
|
-
if (!search || search === "?") return false;
|
|
5595
|
-
const q = search.startsWith("?") ? search.slice(1) : search;
|
|
5596
|
-
return new URLSearchParams(q).get("mode") === "edit";
|
|
5597
|
-
}
|
|
5598
|
-
|
|
5599
5289
|
// src/ui/link-modal/linkModal.utils.ts
|
|
5600
5290
|
function parseTarget(target) {
|
|
5601
5291
|
if (!target) return { pageRoute: "", sectionId: null };
|
|
@@ -5828,28 +5518,28 @@ function scrollToHashSectionWhenReady(behavior = "smooth") {
|
|
|
5828
5518
|
}
|
|
5829
5519
|
|
|
5830
5520
|
// src/ui/link-modal/LinkPopover.tsx
|
|
5831
|
-
import { useEffect as
|
|
5521
|
+
import { useEffect as useEffect6 } from "react";
|
|
5832
5522
|
|
|
5833
5523
|
// src/ui/dialog.tsx
|
|
5834
5524
|
import * as React7 from "react";
|
|
5835
5525
|
import { Dialog as DialogPrimitive } from "radix-ui";
|
|
5836
|
-
import { X
|
|
5837
|
-
import { jsx as
|
|
5526
|
+
import { X } from "lucide-react";
|
|
5527
|
+
import { jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
5838
5528
|
function Dialog2({
|
|
5839
5529
|
...props
|
|
5840
5530
|
}) {
|
|
5841
|
-
return /* @__PURE__ */
|
|
5531
|
+
return /* @__PURE__ */ jsx14(DialogPrimitive.Root, { "data-slot": "dialog", ...props });
|
|
5842
5532
|
}
|
|
5843
5533
|
function DialogPortal({
|
|
5844
5534
|
...props
|
|
5845
5535
|
}) {
|
|
5846
|
-
return /* @__PURE__ */
|
|
5536
|
+
return /* @__PURE__ */ jsx14(DialogPrimitive.Portal, { ...props });
|
|
5847
5537
|
}
|
|
5848
5538
|
function DialogOverlay({
|
|
5849
5539
|
className,
|
|
5850
5540
|
...props
|
|
5851
5541
|
}) {
|
|
5852
|
-
return /* @__PURE__ */
|
|
5542
|
+
return /* @__PURE__ */ jsx14(
|
|
5853
5543
|
DialogPrimitive.Overlay,
|
|
5854
5544
|
{
|
|
5855
5545
|
"data-slot": "dialog-overlay",
|
|
@@ -5862,9 +5552,9 @@ function DialogOverlay({
|
|
|
5862
5552
|
var DialogContent = React7.forwardRef(
|
|
5863
5553
|
({ className, children, showCloseButton = true, container, ...props }, ref) => {
|
|
5864
5554
|
const positionMode = container ? "absolute" : "fixed";
|
|
5865
|
-
return /* @__PURE__ */
|
|
5866
|
-
/* @__PURE__ */
|
|
5867
|
-
/* @__PURE__ */
|
|
5555
|
+
return /* @__PURE__ */ jsxs7(DialogPortal, { container: container ?? void 0, children: [
|
|
5556
|
+
/* @__PURE__ */ jsx14(DialogOverlay, { className: cn(positionMode, "inset-0") }),
|
|
5557
|
+
/* @__PURE__ */ jsxs7(
|
|
5868
5558
|
DialogPrimitive.Content,
|
|
5869
5559
|
{
|
|
5870
5560
|
ref,
|
|
@@ -5880,13 +5570,13 @@ var DialogContent = React7.forwardRef(
|
|
|
5880
5570
|
...props,
|
|
5881
5571
|
children: [
|
|
5882
5572
|
children,
|
|
5883
|
-
showCloseButton ? /* @__PURE__ */
|
|
5573
|
+
showCloseButton ? /* @__PURE__ */ jsx14(
|
|
5884
5574
|
DialogPrimitive.Close,
|
|
5885
5575
|
{
|
|
5886
5576
|
type: "button",
|
|
5887
5577
|
className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50",
|
|
5888
5578
|
"aria-label": "Close",
|
|
5889
|
-
children: /* @__PURE__ */
|
|
5579
|
+
children: /* @__PURE__ */ jsx14(X, { size: 16, "aria-hidden": true })
|
|
5890
5580
|
}
|
|
5891
5581
|
) : null
|
|
5892
5582
|
]
|
|
@@ -5900,13 +5590,13 @@ function DialogHeader({
|
|
|
5900
5590
|
className,
|
|
5901
5591
|
...props
|
|
5902
5592
|
}) {
|
|
5903
|
-
return /* @__PURE__ */
|
|
5593
|
+
return /* @__PURE__ */ jsx14("div", { className: cn("flex flex-col gap-1.5", className), ...props });
|
|
5904
5594
|
}
|
|
5905
5595
|
function DialogFooter({
|
|
5906
5596
|
className,
|
|
5907
5597
|
...props
|
|
5908
5598
|
}) {
|
|
5909
|
-
return /* @__PURE__ */
|
|
5599
|
+
return /* @__PURE__ */ jsx14(
|
|
5910
5600
|
"div",
|
|
5911
5601
|
{
|
|
5912
5602
|
className: cn("flex items-center justify-end gap-2", className),
|
|
@@ -5914,7 +5604,7 @@ function DialogFooter({
|
|
|
5914
5604
|
}
|
|
5915
5605
|
);
|
|
5916
5606
|
}
|
|
5917
|
-
var DialogTitle = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
|
|
5607
|
+
var DialogTitle = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx14(
|
|
5918
5608
|
DialogPrimitive.Title,
|
|
5919
5609
|
{
|
|
5920
5610
|
ref,
|
|
@@ -5926,7 +5616,7 @@ var DialogTitle = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE
|
|
|
5926
5616
|
}
|
|
5927
5617
|
));
|
|
5928
5618
|
DialogTitle.displayName = DialogPrimitive.Title.displayName;
|
|
5929
|
-
var DialogDescription = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
|
|
5619
|
+
var DialogDescription = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx14(
|
|
5930
5620
|
DialogPrimitive.Description,
|
|
5931
5621
|
{
|
|
5932
5622
|
ref,
|
|
@@ -5938,23 +5628,23 @@ DialogDescription.displayName = DialogPrimitive.Description.displayName;
|
|
|
5938
5628
|
var DialogClose = DialogPrimitive.Close;
|
|
5939
5629
|
|
|
5940
5630
|
// src/ui/link-modal/LinkEditorPanel.tsx
|
|
5941
|
-
import { Info, X as
|
|
5631
|
+
import { Info, X as X3 } from "lucide-react";
|
|
5942
5632
|
|
|
5943
5633
|
// src/ui/link-modal/DestinationBreadcrumb.tsx
|
|
5944
5634
|
import { ArrowRight, File, GalleryVertical } from "lucide-react";
|
|
5945
|
-
import { jsx as
|
|
5635
|
+
import { jsx as jsx15, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
5946
5636
|
function DestinationBreadcrumb({
|
|
5947
5637
|
pageTitle,
|
|
5948
5638
|
sectionLabel
|
|
5949
5639
|
}) {
|
|
5950
|
-
return /* @__PURE__ */
|
|
5951
|
-
/* @__PURE__ */
|
|
5952
|
-
/* @__PURE__ */
|
|
5953
|
-
/* @__PURE__ */
|
|
5954
|
-
/* @__PURE__ */
|
|
5955
|
-
/* @__PURE__ */
|
|
5640
|
+
return /* @__PURE__ */ jsxs8("div", { className: "flex w-full flex-col gap-2", children: [
|
|
5641
|
+
/* @__PURE__ */ jsx15("p", { className: "text-sm font-medium! text-foreground m-0", children: "Destination" }),
|
|
5642
|
+
/* @__PURE__ */ jsxs8("div", { className: "flex items-center gap-3", children: [
|
|
5643
|
+
/* @__PURE__ */ jsxs8("div", { className: "flex items-center gap-2", children: [
|
|
5644
|
+
/* @__PURE__ */ jsx15(File, { size: 16, className: "shrink-0 text-foreground", "aria-hidden": true }),
|
|
5645
|
+
/* @__PURE__ */ jsx15("span", { className: "text-sm font-medium leading-none text-foreground!", children: pageTitle })
|
|
5956
5646
|
] }),
|
|
5957
|
-
/* @__PURE__ */
|
|
5647
|
+
/* @__PURE__ */ jsx15(
|
|
5958
5648
|
ArrowRight,
|
|
5959
5649
|
{
|
|
5960
5650
|
size: 16,
|
|
@@ -5962,8 +5652,8 @@ function DestinationBreadcrumb({
|
|
|
5962
5652
|
"aria-hidden": true
|
|
5963
5653
|
}
|
|
5964
5654
|
),
|
|
5965
|
-
/* @__PURE__ */
|
|
5966
|
-
/* @__PURE__ */
|
|
5655
|
+
/* @__PURE__ */ jsxs8("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
|
|
5656
|
+
/* @__PURE__ */ jsx15(
|
|
5967
5657
|
GalleryVertical,
|
|
5968
5658
|
{
|
|
5969
5659
|
size: 16,
|
|
@@ -5971,7 +5661,7 @@ function DestinationBreadcrumb({
|
|
|
5971
5661
|
"aria-hidden": true
|
|
5972
5662
|
}
|
|
5973
5663
|
),
|
|
5974
|
-
/* @__PURE__ */
|
|
5664
|
+
/* @__PURE__ */ jsx15("span", { className: "truncate text-sm font-medium leading-none text-foreground", children: sectionLabel })
|
|
5975
5665
|
] })
|
|
5976
5666
|
] })
|
|
5977
5667
|
] });
|
|
@@ -5979,22 +5669,22 @@ function DestinationBreadcrumb({
|
|
|
5979
5669
|
|
|
5980
5670
|
// src/ui/link-modal/SectionTreeItem.tsx
|
|
5981
5671
|
import { GalleryVertical as GalleryVertical2 } from "lucide-react";
|
|
5982
|
-
import { jsx as
|
|
5672
|
+
import { jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
5983
5673
|
function SectionTreeItem({
|
|
5984
5674
|
section,
|
|
5985
5675
|
onSelect,
|
|
5986
5676
|
selected
|
|
5987
5677
|
}) {
|
|
5988
5678
|
const interactive = Boolean(onSelect);
|
|
5989
|
-
return /* @__PURE__ */
|
|
5990
|
-
/* @__PURE__ */
|
|
5679
|
+
return /* @__PURE__ */ jsxs9("div", { className: "flex h-9 w-full items-end pl-3", children: [
|
|
5680
|
+
/* @__PURE__ */ jsx16(
|
|
5991
5681
|
"div",
|
|
5992
5682
|
{
|
|
5993
5683
|
className: "mr-[-1px] h-9 w-2 shrink-0 rounded-bl-sm border-b border-l border-border mb-4",
|
|
5994
5684
|
"aria-hidden": true
|
|
5995
5685
|
}
|
|
5996
5686
|
),
|
|
5997
|
-
/* @__PURE__ */
|
|
5687
|
+
/* @__PURE__ */ jsxs9(
|
|
5998
5688
|
"div",
|
|
5999
5689
|
{
|
|
6000
5690
|
role: interactive ? "button" : void 0,
|
|
@@ -6012,7 +5702,7 @@ function SectionTreeItem({
|
|
|
6012
5702
|
interactive && selected && "border-primary"
|
|
6013
5703
|
),
|
|
6014
5704
|
children: [
|
|
6015
|
-
/* @__PURE__ */
|
|
5705
|
+
/* @__PURE__ */ jsx16(
|
|
6016
5706
|
GalleryVertical2,
|
|
6017
5707
|
{
|
|
6018
5708
|
size: 16,
|
|
@@ -6020,7 +5710,7 @@ function SectionTreeItem({
|
|
|
6020
5710
|
"aria-hidden": true
|
|
6021
5711
|
}
|
|
6022
5712
|
),
|
|
6023
|
-
/* @__PURE__ */
|
|
5713
|
+
/* @__PURE__ */ jsx16("span", { className: "truncate text-sm font-normal leading-5 text-foreground", children: section.label })
|
|
6024
5714
|
]
|
|
6025
5715
|
}
|
|
6026
5716
|
)
|
|
@@ -6028,14 +5718,14 @@ function SectionTreeItem({
|
|
|
6028
5718
|
}
|
|
6029
5719
|
|
|
6030
5720
|
// src/ui/link-modal/UrlOrPageInput.tsx
|
|
6031
|
-
import { useEffect as
|
|
5721
|
+
import { useEffect as useEffect3, useId as useId2, useRef as useRef4, useState as useState4 } from "react";
|
|
6032
5722
|
|
|
6033
5723
|
// src/ui/input.tsx
|
|
6034
5724
|
import * as React8 from "react";
|
|
6035
|
-
import { jsx as
|
|
5725
|
+
import { jsx as jsx17 } from "react/jsx-runtime";
|
|
6036
5726
|
var Input = React8.forwardRef(
|
|
6037
5727
|
({ className, type, ...props }, ref) => {
|
|
6038
|
-
return /* @__PURE__ */
|
|
5728
|
+
return /* @__PURE__ */ jsx17(
|
|
6039
5729
|
"input",
|
|
6040
5730
|
{
|
|
6041
5731
|
type,
|
|
@@ -6054,9 +5744,9 @@ Input.displayName = "Input";
|
|
|
6054
5744
|
|
|
6055
5745
|
// src/ui/label.tsx
|
|
6056
5746
|
import { Label as LabelPrimitive } from "radix-ui";
|
|
6057
|
-
import { jsx as
|
|
5747
|
+
import { jsx as jsx18 } from "react/jsx-runtime";
|
|
6058
5748
|
function Label({ className, ...props }) {
|
|
6059
|
-
return /* @__PURE__ */
|
|
5749
|
+
return /* @__PURE__ */ jsx18(
|
|
6060
5750
|
LabelPrimitive.Root,
|
|
6061
5751
|
{
|
|
6062
5752
|
"data-slot": "label",
|
|
@@ -6067,12 +5757,12 @@ function Label({ className, ...props }) {
|
|
|
6067
5757
|
}
|
|
6068
5758
|
|
|
6069
5759
|
// src/ui/link-modal/UrlOrPageInput.tsx
|
|
6070
|
-
import { ChevronDown, File as File2, X as
|
|
6071
|
-
import { jsx as
|
|
5760
|
+
import { ChevronDown, File as File2, X as X2 } from "lucide-react";
|
|
5761
|
+
import { jsx as jsx19, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
6072
5762
|
function FieldChevron({
|
|
6073
5763
|
onClick
|
|
6074
5764
|
}) {
|
|
6075
|
-
return /* @__PURE__ */
|
|
5765
|
+
return /* @__PURE__ */ jsx19(
|
|
6076
5766
|
"button",
|
|
6077
5767
|
{
|
|
6078
5768
|
type: "button",
|
|
@@ -6080,7 +5770,7 @@ function FieldChevron({
|
|
|
6080
5770
|
onClick,
|
|
6081
5771
|
"aria-label": "Open page list",
|
|
6082
5772
|
tabIndex: -1,
|
|
6083
|
-
children: /* @__PURE__ */
|
|
5773
|
+
children: /* @__PURE__ */ jsx19(ChevronDown, { size: 16 })
|
|
6084
5774
|
}
|
|
6085
5775
|
);
|
|
6086
5776
|
}
|
|
@@ -6097,10 +5787,10 @@ function UrlOrPageInput({
|
|
|
6097
5787
|
urlError
|
|
6098
5788
|
}) {
|
|
6099
5789
|
const inputId = useId2();
|
|
6100
|
-
const inputRef =
|
|
6101
|
-
const rootRef =
|
|
6102
|
-
const [isFocused, setIsFocused] =
|
|
6103
|
-
|
|
5790
|
+
const inputRef = useRef4(null);
|
|
5791
|
+
const rootRef = useRef4(null);
|
|
5792
|
+
const [isFocused, setIsFocused] = useState4(false);
|
|
5793
|
+
useEffect3(() => {
|
|
6104
5794
|
if (!dropdownOpen) return;
|
|
6105
5795
|
const isOutside = (e) => {
|
|
6106
5796
|
const root = rootRef.current;
|
|
@@ -6141,11 +5831,11 @@ function UrlOrPageInput({
|
|
|
6141
5831
|
"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]",
|
|
6142
5832
|
urlError ? "border-destructive shadow-[0_0_0_1px_var(--ohw-destructive)]" : isFocused ? "border-primary shadow-[0_0_0_1px_var(--ohw-primary)]" : "border-input"
|
|
6143
5833
|
);
|
|
6144
|
-
return /* @__PURE__ */
|
|
6145
|
-
/* @__PURE__ */
|
|
6146
|
-
/* @__PURE__ */
|
|
6147
|
-
/* @__PURE__ */
|
|
6148
|
-
selectedPage ? /* @__PURE__ */
|
|
5834
|
+
return /* @__PURE__ */ jsxs10("div", { className: "flex w-full flex-col gap-2 p-0", children: [
|
|
5835
|
+
/* @__PURE__ */ jsx19(Label, { htmlFor: inputId, className: cn(urlError && "text-destructive"), children: "Destination" }),
|
|
5836
|
+
/* @__PURE__ */ jsxs10("div", { ref: rootRef, className: "relative w-full", children: [
|
|
5837
|
+
/* @__PURE__ */ jsxs10("div", { "data-ohw-link-field": true, className: fieldClassName, children: [
|
|
5838
|
+
selectedPage ? /* @__PURE__ */ jsx19("div", { className: "flex shrink-0 items-center pr-2", children: /* @__PURE__ */ jsx19(
|
|
6149
5839
|
File2,
|
|
6150
5840
|
{
|
|
6151
5841
|
size: 16,
|
|
@@ -6153,7 +5843,7 @@ function UrlOrPageInput({
|
|
|
6153
5843
|
"aria-hidden": true
|
|
6154
5844
|
}
|
|
6155
5845
|
) }) : null,
|
|
6156
|
-
readOnly ? /* @__PURE__ */
|
|
5846
|
+
readOnly ? /* @__PURE__ */ jsx19("span", { className: "min-w-0 flex-1 truncate text-sm leading-5 text-foreground", children: selectedPage?.title ?? value }) : /* @__PURE__ */ jsx19(
|
|
6157
5847
|
Input,
|
|
6158
5848
|
{
|
|
6159
5849
|
ref: inputRef,
|
|
@@ -6179,7 +5869,7 @@ function UrlOrPageInput({
|
|
|
6179
5869
|
)
|
|
6180
5870
|
}
|
|
6181
5871
|
),
|
|
6182
|
-
selectedPage && !readOnly ? /* @__PURE__ */
|
|
5872
|
+
selectedPage && !readOnly ? /* @__PURE__ */ jsx19(
|
|
6183
5873
|
"button",
|
|
6184
5874
|
{
|
|
6185
5875
|
type: "button",
|
|
@@ -6187,26 +5877,26 @@ function UrlOrPageInput({
|
|
|
6187
5877
|
onMouseDown: clearSelection,
|
|
6188
5878
|
"aria-label": "Clear selected page",
|
|
6189
5879
|
tabIndex: -1,
|
|
6190
|
-
children: /* @__PURE__ */
|
|
5880
|
+
children: /* @__PURE__ */ jsx19(X2, { size: 16, "aria-hidden": true })
|
|
6191
5881
|
}
|
|
6192
5882
|
) : null,
|
|
6193
|
-
!readOnly ? /* @__PURE__ */
|
|
5883
|
+
!readOnly ? /* @__PURE__ */ jsx19(FieldChevron, { onClick: toggleDropdown }) : null
|
|
6194
5884
|
] }),
|
|
6195
|
-
dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */
|
|
5885
|
+
dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */ jsx19(
|
|
6196
5886
|
"div",
|
|
6197
5887
|
{
|
|
6198
5888
|
"data-ohw-link-page-dropdown": "",
|
|
6199
5889
|
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",
|
|
6200
5890
|
onMouseDown: (e) => e.preventDefault(),
|
|
6201
|
-
children: filteredPages.map((page) => /* @__PURE__ */
|
|
5891
|
+
children: filteredPages.map((page) => /* @__PURE__ */ jsxs10(
|
|
6202
5892
|
"button",
|
|
6203
5893
|
{
|
|
6204
5894
|
type: "button",
|
|
6205
5895
|
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",
|
|
6206
5896
|
onClick: () => onPageSelect(page),
|
|
6207
5897
|
children: [
|
|
6208
|
-
/* @__PURE__ */
|
|
6209
|
-
/* @__PURE__ */
|
|
5898
|
+
/* @__PURE__ */ jsx19(File2, { size: 16, className: "shrink-0", "aria-hidden": true }),
|
|
5899
|
+
/* @__PURE__ */ jsx19("span", { className: "truncate", children: page.title })
|
|
6210
5900
|
]
|
|
6211
5901
|
},
|
|
6212
5902
|
page.path
|
|
@@ -6214,34 +5904,34 @@ function UrlOrPageInput({
|
|
|
6214
5904
|
}
|
|
6215
5905
|
) : null
|
|
6216
5906
|
] }),
|
|
6217
|
-
urlError ? /* @__PURE__ */
|
|
5907
|
+
urlError ? /* @__PURE__ */ jsx19("p", { className: "text-sm font-medium text-destructive", children: urlError }) : null
|
|
6218
5908
|
] });
|
|
6219
5909
|
}
|
|
6220
5910
|
|
|
6221
5911
|
// src/ui/link-modal/LinkEditorPanel.tsx
|
|
6222
|
-
import { Fragment as
|
|
5912
|
+
import { Fragment as Fragment4, jsx as jsx20, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
6223
5913
|
function LinkEditorPanel({ state, onClose }) {
|
|
6224
5914
|
const isCancel = state.secondaryLabel === "Cancel" || state.secondaryLabel === "Back to sections";
|
|
6225
|
-
return /* @__PURE__ */
|
|
6226
|
-
/* @__PURE__ */
|
|
5915
|
+
return /* @__PURE__ */ jsxs11(Fragment4, { children: [
|
|
5916
|
+
/* @__PURE__ */ jsx20(DialogClose, { asChild: true, children: /* @__PURE__ */ jsx20(
|
|
6227
5917
|
"button",
|
|
6228
5918
|
{
|
|
6229
5919
|
type: "button",
|
|
6230
5920
|
className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50 h-7",
|
|
6231
5921
|
"aria-label": "Close",
|
|
6232
5922
|
onClick: onClose,
|
|
6233
|
-
children: /* @__PURE__ */
|
|
5923
|
+
children: /* @__PURE__ */ jsx20(X3, { size: 16, "aria-hidden": true })
|
|
6234
5924
|
}
|
|
6235
5925
|
) }),
|
|
6236
|
-
/* @__PURE__ */
|
|
6237
|
-
/* @__PURE__ */
|
|
6238
|
-
state.showBreadcrumb && state.selectedPage && state.selectedSection ? /* @__PURE__ */
|
|
5926
|
+
/* @__PURE__ */ jsx20(DialogHeader, { className: "w-full gap-1.5 p-6 pr-12", children: /* @__PURE__ */ jsx20(DialogTitle, { className: "m-0 w-full break-words", children: state.title }) }),
|
|
5927
|
+
/* @__PURE__ */ jsxs11("div", { className: "flex w-full flex-col gap-3 px-6 pb-8 pt-1", children: [
|
|
5928
|
+
state.showBreadcrumb && state.selectedPage && state.selectedSection ? /* @__PURE__ */ jsx20(
|
|
6239
5929
|
DestinationBreadcrumb,
|
|
6240
5930
|
{
|
|
6241
5931
|
pageTitle: state.selectedPage.title,
|
|
6242
5932
|
sectionLabel: state.selectedSection.label
|
|
6243
5933
|
}
|
|
6244
|
-
) : /* @__PURE__ */
|
|
5934
|
+
) : /* @__PURE__ */ jsx20(
|
|
6245
5935
|
UrlOrPageInput,
|
|
6246
5936
|
{
|
|
6247
5937
|
value: state.searchValue,
|
|
@@ -6254,8 +5944,8 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
6254
5944
|
urlError: state.urlError
|
|
6255
5945
|
}
|
|
6256
5946
|
),
|
|
6257
|
-
state.showChooseSection ? /* @__PURE__ */
|
|
6258
|
-
/* @__PURE__ */
|
|
5947
|
+
state.showChooseSection ? /* @__PURE__ */ jsxs11("div", { className: "flex flex-col justify-center gap-2", children: [
|
|
5948
|
+
/* @__PURE__ */ jsx20(
|
|
6259
5949
|
Button,
|
|
6260
5950
|
{
|
|
6261
5951
|
type: "button",
|
|
@@ -6266,15 +5956,15 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
6266
5956
|
children: "Choose a section"
|
|
6267
5957
|
}
|
|
6268
5958
|
),
|
|
6269
|
-
/* @__PURE__ */
|
|
6270
|
-
/* @__PURE__ */
|
|
6271
|
-
/* @__PURE__ */
|
|
5959
|
+
/* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-1 text-sm text-muted-foreground", children: [
|
|
5960
|
+
/* @__PURE__ */ jsx20(Info, { size: 16, className: "shrink-0", "aria-hidden": true }),
|
|
5961
|
+
/* @__PURE__ */ jsx20("span", { children: "Pick a section this link should scroll to." })
|
|
6272
5962
|
] })
|
|
6273
5963
|
] }) : null,
|
|
6274
|
-
state.showSectionRow && state.selectedSection ? /* @__PURE__ */
|
|
5964
|
+
state.showSectionRow && state.selectedSection ? /* @__PURE__ */ jsx20(SectionTreeItem, { section: state.selectedSection, selected: true }) : null
|
|
6275
5965
|
] }),
|
|
6276
|
-
/* @__PURE__ */
|
|
6277
|
-
/* @__PURE__ */
|
|
5966
|
+
/* @__PURE__ */ jsxs11(DialogFooter, { className: "w-full px-6 pb-6", children: [
|
|
5967
|
+
/* @__PURE__ */ jsx20(
|
|
6278
5968
|
Button,
|
|
6279
5969
|
{
|
|
6280
5970
|
type: "button",
|
|
@@ -6289,7 +5979,7 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
6289
5979
|
children: state.secondaryLabel
|
|
6290
5980
|
}
|
|
6291
5981
|
),
|
|
6292
|
-
/* @__PURE__ */
|
|
5982
|
+
/* @__PURE__ */ jsx20(
|
|
6293
5983
|
Button,
|
|
6294
5984
|
{
|
|
6295
5985
|
type: "button",
|
|
@@ -6308,11 +5998,11 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
6308
5998
|
}
|
|
6309
5999
|
|
|
6310
6000
|
// src/ui/link-modal/SectionPickerOverlay.tsx
|
|
6311
|
-
import { useCallback as
|
|
6001
|
+
import { useCallback as useCallback2, useEffect as useEffect4, useMemo as useMemo2, useRef as useRef5, useState as useState5 } from "react";
|
|
6312
6002
|
import { createPortal } from "react-dom";
|
|
6313
|
-
import { ArrowLeft, Check
|
|
6003
|
+
import { ArrowLeft, Check } from "lucide-react";
|
|
6314
6004
|
import { usePathname, useRouter } from "next/navigation";
|
|
6315
|
-
import { jsx as
|
|
6005
|
+
import { jsx as jsx21, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
6316
6006
|
var DIM_OVERLAY = "rgba(0, 0, 0, 0.45)";
|
|
6317
6007
|
function rectsEqual(a, b) {
|
|
6318
6008
|
if (a.size !== b.size) return false;
|
|
@@ -6345,12 +6035,12 @@ function hitTestSectionId(x, y, sectionIds, rects) {
|
|
|
6345
6035
|
return null;
|
|
6346
6036
|
}
|
|
6347
6037
|
function useSectionRects(sectionIdsKey, enabled) {
|
|
6348
|
-
const [rects, setRects] =
|
|
6038
|
+
const [rects, setRects] = useState5(/* @__PURE__ */ new Map());
|
|
6349
6039
|
const sectionIds = useMemo2(
|
|
6350
6040
|
() => sectionIdsKey ? sectionIdsKey.split("\0") : [],
|
|
6351
6041
|
[sectionIdsKey]
|
|
6352
6042
|
);
|
|
6353
|
-
|
|
6043
|
+
useEffect4(() => {
|
|
6354
6044
|
if (!enabled || sectionIds.length === 0) {
|
|
6355
6045
|
setRects((prev) => prev.size === 0 ? prev : /* @__PURE__ */ new Map());
|
|
6356
6046
|
return;
|
|
@@ -6391,13 +6081,13 @@ function SectionPickerOverlay({
|
|
|
6391
6081
|
}) {
|
|
6392
6082
|
const router = useRouter();
|
|
6393
6083
|
const pathname = usePathname();
|
|
6394
|
-
const [selectedId, setSelectedId] =
|
|
6395
|
-
const [hoveredId, setHoveredId] =
|
|
6396
|
-
const pointerRef =
|
|
6397
|
-
const pointerScreenRef =
|
|
6398
|
-
const iframeOffsetTopRef =
|
|
6399
|
-
const sectionIdsRef =
|
|
6400
|
-
const [chromeClip, setChromeClip] =
|
|
6084
|
+
const [selectedId, setSelectedId] = useState5(null);
|
|
6085
|
+
const [hoveredId, setHoveredId] = useState5(null);
|
|
6086
|
+
const pointerRef = useRef5(null);
|
|
6087
|
+
const pointerScreenRef = useRef5(null);
|
|
6088
|
+
const iframeOffsetTopRef = useRef5(null);
|
|
6089
|
+
const sectionIdsRef = useRef5([]);
|
|
6090
|
+
const [chromeClip, setChromeClip] = useState5(
|
|
6401
6091
|
() => ({
|
|
6402
6092
|
top: 0,
|
|
6403
6093
|
bottom: typeof window !== "undefined" ? window.innerHeight : 0
|
|
@@ -6405,12 +6095,12 @@ function SectionPickerOverlay({
|
|
|
6405
6095
|
);
|
|
6406
6096
|
const normalizedTarget = normalizePath(pagePath);
|
|
6407
6097
|
const isOnTargetPage = normalizePath(pathname) === normalizedTarget;
|
|
6408
|
-
|
|
6098
|
+
useEffect4(() => {
|
|
6409
6099
|
if (isOnTargetPage) return;
|
|
6410
6100
|
const search = readPreservedSearch();
|
|
6411
6101
|
router.push(`${normalizedTarget}${search}`);
|
|
6412
6102
|
}, [isOnTargetPage, normalizedTarget, router]);
|
|
6413
|
-
|
|
6103
|
+
useEffect4(() => {
|
|
6414
6104
|
document.documentElement.setAttribute("data-ohw-section-picking", "");
|
|
6415
6105
|
document.querySelectorAll("[data-ohw-hovered]").forEach((el) => {
|
|
6416
6106
|
el.removeAttribute("data-ohw-hovered");
|
|
@@ -6439,7 +6129,7 @@ function SectionPickerOverlay({
|
|
|
6439
6129
|
);
|
|
6440
6130
|
sectionIdsRef.current = sectionIds;
|
|
6441
6131
|
const rects = useSectionRects(sectionIdsKey, isOnTargetPage);
|
|
6442
|
-
const applyHoverAt =
|
|
6132
|
+
const applyHoverAt = useCallback2(
|
|
6443
6133
|
(x, y, liveRects) => {
|
|
6444
6134
|
const ids = sectionIdsRef.current;
|
|
6445
6135
|
const map = liveRects ?? readSectionRects(ids);
|
|
@@ -6448,7 +6138,7 @@ function SectionPickerOverlay({
|
|
|
6448
6138
|
},
|
|
6449
6139
|
[]
|
|
6450
6140
|
);
|
|
6451
|
-
|
|
6141
|
+
useEffect4(() => {
|
|
6452
6142
|
const applyClip = (iframeOffsetTop, visibleCanvasTop, canvasH) => {
|
|
6453
6143
|
const top = Math.max(0, visibleCanvasTop - iframeOffsetTop);
|
|
6454
6144
|
const bottom = Math.min(
|
|
@@ -6490,12 +6180,12 @@ function SectionPickerOverlay({
|
|
|
6490
6180
|
window.removeEventListener("resize", onResize);
|
|
6491
6181
|
};
|
|
6492
6182
|
}, [applyHoverAt]);
|
|
6493
|
-
|
|
6183
|
+
useEffect4(() => {
|
|
6494
6184
|
const ptr = pointerRef.current;
|
|
6495
6185
|
if (!ptr) return;
|
|
6496
6186
|
applyHoverAt(ptr.x, ptr.y, rects);
|
|
6497
6187
|
}, [rects, applyHoverAt]);
|
|
6498
|
-
|
|
6188
|
+
useEffect4(() => {
|
|
6499
6189
|
const rememberPointer = (clientX, clientY) => {
|
|
6500
6190
|
pointerRef.current = { x: clientX, y: clientY };
|
|
6501
6191
|
const top = iframeOffsetTopRef.current;
|
|
@@ -6519,7 +6209,7 @@ function SectionPickerOverlay({
|
|
|
6519
6209
|
window.removeEventListener("message", onPointerSync);
|
|
6520
6210
|
};
|
|
6521
6211
|
}, [rects, applyHoverAt]);
|
|
6522
|
-
const handleSelect =
|
|
6212
|
+
const handleSelect = useCallback2(
|
|
6523
6213
|
(section) => {
|
|
6524
6214
|
if (selectedId) return;
|
|
6525
6215
|
setSelectedId(section.id);
|
|
@@ -6527,7 +6217,7 @@ function SectionPickerOverlay({
|
|
|
6527
6217
|
},
|
|
6528
6218
|
[selectedId, onSelect]
|
|
6529
6219
|
);
|
|
6530
|
-
|
|
6220
|
+
useEffect4(() => {
|
|
6531
6221
|
const onKeyDown = (e) => {
|
|
6532
6222
|
if (e.key === "Escape") {
|
|
6533
6223
|
e.preventDefault();
|
|
@@ -6541,7 +6231,7 @@ function SectionPickerOverlay({
|
|
|
6541
6231
|
const portalRoot = typeof document !== "undefined" ? document.querySelector("[data-ohw-bridge-root]") ?? document.body : null;
|
|
6542
6232
|
if (!portalRoot) return null;
|
|
6543
6233
|
return createPortal(
|
|
6544
|
-
/* @__PURE__ */
|
|
6234
|
+
/* @__PURE__ */ jsxs12(
|
|
6545
6235
|
"div",
|
|
6546
6236
|
{
|
|
6547
6237
|
"data-ohw-section-picker": "",
|
|
@@ -6551,12 +6241,12 @@ function SectionPickerOverlay({
|
|
|
6551
6241
|
role: "dialog",
|
|
6552
6242
|
"aria-label": "Choose a section",
|
|
6553
6243
|
children: [
|
|
6554
|
-
/* @__PURE__ */
|
|
6244
|
+
/* @__PURE__ */ jsx21(
|
|
6555
6245
|
"div",
|
|
6556
6246
|
{
|
|
6557
6247
|
className: "pointer-events-auto fixed left-5 z-[2]",
|
|
6558
6248
|
style: { top: chromeClip.top + 20 },
|
|
6559
|
-
children: /* @__PURE__ */
|
|
6249
|
+
children: /* @__PURE__ */ jsxs12(
|
|
6560
6250
|
Button,
|
|
6561
6251
|
{
|
|
6562
6252
|
type: "button",
|
|
@@ -6565,14 +6255,14 @@ function SectionPickerOverlay({
|
|
|
6565
6255
|
className: "h-8 min-w-0 gap-1 border-border bg-background px-2 py-1.5 shadow-sm hover:bg-muted cursor-pointer",
|
|
6566
6256
|
onClick: onBack,
|
|
6567
6257
|
children: [
|
|
6568
|
-
/* @__PURE__ */
|
|
6258
|
+
/* @__PURE__ */ jsx21(ArrowLeft, { className: "size-4 shrink-0", "aria-hidden": true }),
|
|
6569
6259
|
"Back"
|
|
6570
6260
|
]
|
|
6571
6261
|
}
|
|
6572
6262
|
)
|
|
6573
6263
|
}
|
|
6574
6264
|
),
|
|
6575
|
-
/* @__PURE__ */
|
|
6265
|
+
/* @__PURE__ */ jsx21(
|
|
6576
6266
|
"div",
|
|
6577
6267
|
{
|
|
6578
6268
|
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",
|
|
@@ -6585,7 +6275,7 @@ function SectionPickerOverlay({
|
|
|
6585
6275
|
children: "Click on section to select"
|
|
6586
6276
|
}
|
|
6587
6277
|
),
|
|
6588
|
-
!isOnTargetPage ? /* @__PURE__ */
|
|
6278
|
+
!isOnTargetPage ? /* @__PURE__ */ jsx21(
|
|
6589
6279
|
"div",
|
|
6590
6280
|
{
|
|
6591
6281
|
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",
|
|
@@ -6593,14 +6283,14 @@ function SectionPickerOverlay({
|
|
|
6593
6283
|
children: "Loading page preview\u2026"
|
|
6594
6284
|
}
|
|
6595
6285
|
) : null,
|
|
6596
|
-
isOnTargetPage && liveSections.length === 0 ? /* @__PURE__ */
|
|
6286
|
+
isOnTargetPage && liveSections.length === 0 ? /* @__PURE__ */ jsx21("div", { className: "pointer-events-auto fixed inset-0 z-[1] flex items-center justify-center bg-muted/40", children: /* @__PURE__ */ jsx21("p", { className: "text-sm text-muted-foreground", children: "No sections found on this page." }) }) : null,
|
|
6597
6287
|
isOnTargetPage ? liveSections.map((section) => {
|
|
6598
6288
|
const rect = rects.get(section.id);
|
|
6599
6289
|
if (!rect || rect.width <= 0 || rect.height <= 0) return null;
|
|
6600
6290
|
const isSelected = selectedId === section.id;
|
|
6601
6291
|
const isHovered = hoveredId === section.id;
|
|
6602
6292
|
const isLit = isSelected || isHovered;
|
|
6603
|
-
return /* @__PURE__ */
|
|
6293
|
+
return /* @__PURE__ */ jsxs12(
|
|
6604
6294
|
"button",
|
|
6605
6295
|
{
|
|
6606
6296
|
type: "button",
|
|
@@ -6615,7 +6305,7 @@ function SectionPickerOverlay({
|
|
|
6615
6305
|
"aria-label": `Select section ${section.label}`,
|
|
6616
6306
|
onClick: () => handleSelect(section),
|
|
6617
6307
|
children: [
|
|
6618
|
-
isLit ? /* @__PURE__ */
|
|
6308
|
+
isLit ? /* @__PURE__ */ jsx21(
|
|
6619
6309
|
"span",
|
|
6620
6310
|
{
|
|
6621
6311
|
className: "pointer-events-none absolute",
|
|
@@ -6628,13 +6318,13 @@ function SectionPickerOverlay({
|
|
|
6628
6318
|
"aria-hidden": true
|
|
6629
6319
|
}
|
|
6630
6320
|
) : null,
|
|
6631
|
-
isSelected ? /* @__PURE__ */
|
|
6321
|
+
isSelected ? /* @__PURE__ */ jsx21(
|
|
6632
6322
|
"span",
|
|
6633
6323
|
{
|
|
6634
6324
|
className: "absolute right-3 top-3 flex size-8 items-center justify-center rounded-full text-white",
|
|
6635
6325
|
style: { backgroundColor: "var(--ohw-primary, #0885fe)" },
|
|
6636
6326
|
"aria-hidden": true,
|
|
6637
|
-
children: /* @__PURE__ */
|
|
6327
|
+
children: /* @__PURE__ */ jsx21(Check, { className: "size-5" })
|
|
6638
6328
|
}
|
|
6639
6329
|
) : null
|
|
6640
6330
|
]
|
|
@@ -6650,7 +6340,7 @@ function SectionPickerOverlay({
|
|
|
6650
6340
|
}
|
|
6651
6341
|
|
|
6652
6342
|
// src/ui/link-modal/useLinkModalState.ts
|
|
6653
|
-
import { useCallback as
|
|
6343
|
+
import { useCallback as useCallback3, useEffect as useEffect5, useMemo as useMemo3, useState as useState6 } from "react";
|
|
6654
6344
|
function useLinkModalState({
|
|
6655
6345
|
open,
|
|
6656
6346
|
mode,
|
|
@@ -6663,13 +6353,13 @@ function useLinkModalState({
|
|
|
6663
6353
|
onSubmit
|
|
6664
6354
|
}) {
|
|
6665
6355
|
const availablePages = useMemo3(() => pages, [pages]);
|
|
6666
|
-
const [searchValue, setSearchValue] =
|
|
6667
|
-
const [selectedPage, setSelectedPage] =
|
|
6668
|
-
const [selectedSection, setSelectedSection] =
|
|
6669
|
-
const [step, setStep] =
|
|
6670
|
-
const [dropdownOpen, setDropdownOpen] =
|
|
6671
|
-
const [urlError, setUrlError] =
|
|
6672
|
-
const reset =
|
|
6356
|
+
const [searchValue, setSearchValue] = useState6("");
|
|
6357
|
+
const [selectedPage, setSelectedPage] = useState6(null);
|
|
6358
|
+
const [selectedSection, setSelectedSection] = useState6(null);
|
|
6359
|
+
const [step, setStep] = useState6("input");
|
|
6360
|
+
const [dropdownOpen, setDropdownOpen] = useState6(false);
|
|
6361
|
+
const [urlError, setUrlError] = useState6("");
|
|
6362
|
+
const reset = useCallback3(() => {
|
|
6673
6363
|
setSearchValue("");
|
|
6674
6364
|
setSelectedPage(null);
|
|
6675
6365
|
setSelectedSection(null);
|
|
@@ -6677,7 +6367,7 @@ function useLinkModalState({
|
|
|
6677
6367
|
setDropdownOpen(false);
|
|
6678
6368
|
setUrlError("");
|
|
6679
6369
|
}, []);
|
|
6680
|
-
|
|
6370
|
+
useEffect5(() => {
|
|
6681
6371
|
if (!open) return;
|
|
6682
6372
|
if (mode === "edit" && initialTarget) {
|
|
6683
6373
|
const { pageRoute } = parseTarget(initialTarget);
|
|
@@ -6814,7 +6504,7 @@ function useLinkModalState({
|
|
|
6814
6504
|
}
|
|
6815
6505
|
|
|
6816
6506
|
// src/ui/link-modal/LinkPopover.tsx
|
|
6817
|
-
import { Fragment as
|
|
6507
|
+
import { Fragment as Fragment5, jsx as jsx22, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
6818
6508
|
function postToParent(data) {
|
|
6819
6509
|
window.parent?.postMessage(data, "*");
|
|
6820
6510
|
}
|
|
@@ -6843,7 +6533,7 @@ function LinkPopover({
|
|
|
6843
6533
|
onSubmit
|
|
6844
6534
|
});
|
|
6845
6535
|
const sectionPickerActive = state.showSectionPicker && Boolean(state.selectedPage);
|
|
6846
|
-
|
|
6536
|
+
useEffect6(() => {
|
|
6847
6537
|
if (!open) return;
|
|
6848
6538
|
if (sectionPickerActive) {
|
|
6849
6539
|
postToParent({ type: "ui:unlock" });
|
|
@@ -6910,15 +6600,15 @@ function LinkPopover({
|
|
|
6910
6600
|
);
|
|
6911
6601
|
};
|
|
6912
6602
|
}, [open, sectionPickerActive]);
|
|
6913
|
-
return /* @__PURE__ */
|
|
6914
|
-
/* @__PURE__ */
|
|
6603
|
+
return /* @__PURE__ */ jsxs13(Fragment5, { children: [
|
|
6604
|
+
/* @__PURE__ */ jsx22(
|
|
6915
6605
|
Dialog2,
|
|
6916
6606
|
{
|
|
6917
6607
|
open: open && !sectionPickerActive,
|
|
6918
6608
|
onOpenChange: (next) => {
|
|
6919
6609
|
if (!next) onClose?.();
|
|
6920
6610
|
},
|
|
6921
|
-
children: /* @__PURE__ */
|
|
6611
|
+
children: /* @__PURE__ */ jsx22(
|
|
6922
6612
|
DialogContent,
|
|
6923
6613
|
{
|
|
6924
6614
|
ref: panelRef,
|
|
@@ -6928,12 +6618,12 @@ function LinkPopover({
|
|
|
6928
6618
|
"data-ohw-bridge": "",
|
|
6929
6619
|
showCloseButton: false,
|
|
6930
6620
|
className: "gap-0 p-0 w-full max-w-[448px] pointer-events-auto z-[2147483646] overflow-visible",
|
|
6931
|
-
children: /* @__PURE__ */
|
|
6621
|
+
children: /* @__PURE__ */ jsx22(LinkEditorPanel, { state, onClose })
|
|
6932
6622
|
}
|
|
6933
6623
|
)
|
|
6934
6624
|
}
|
|
6935
6625
|
),
|
|
6936
|
-
sectionPickerActive && state.selectedPage ? /* @__PURE__ */
|
|
6626
|
+
sectionPickerActive && state.selectedPage ? /* @__PURE__ */ jsx22(
|
|
6937
6627
|
SectionPickerOverlay,
|
|
6938
6628
|
{
|
|
6939
6629
|
pagePath: state.selectedPage.path,
|
|
@@ -8908,43 +8598,6 @@ function deleteFooterColumn(column) {
|
|
|
8908
8598
|
};
|
|
8909
8599
|
}
|
|
8910
8600
|
|
|
8911
|
-
// src/lib/site-wide-scope.ts
|
|
8912
|
-
function getLogoElement(el) {
|
|
8913
|
-
const marked = el.closest('[data-ohw-role="logo"], [data-ohw-logo]');
|
|
8914
|
-
if (marked) return marked;
|
|
8915
|
-
const root = el.closest("nav, [data-ohw-nav-root], footer");
|
|
8916
|
-
if (!root) return null;
|
|
8917
|
-
const anchor = el.closest("a");
|
|
8918
|
-
if (anchor && root.contains(anchor) && !anchor.hasAttribute("data-ohw-href-key") && !anchor.closest("[data-ohw-nav-container]") && Boolean(anchor.querySelector("img") || anchor.matches("img"))) {
|
|
8919
|
-
return anchor;
|
|
8920
|
-
}
|
|
8921
|
-
const img = el.matches("img") ? el : null;
|
|
8922
|
-
if (img && !img.closest("[data-ohw-href-key]") && !img.closest("[data-ohw-nav-container]") && (img.closest("footer") || img.closest("nav, [data-ohw-nav-root]"))) {
|
|
8923
|
-
return img;
|
|
8924
|
-
}
|
|
8925
|
-
return null;
|
|
8926
|
-
}
|
|
8927
|
-
function isInFooter(el) {
|
|
8928
|
-
if (!el) return false;
|
|
8929
|
-
return Boolean(el.closest("footer") || el.closest('[data-ohw-section="footer"]'));
|
|
8930
|
-
}
|
|
8931
|
-
function isSiteWideElement(el) {
|
|
8932
|
-
if (!el) return false;
|
|
8933
|
-
if (getLogoElement(el)) return true;
|
|
8934
|
-
if (isInFooter(el)) return true;
|
|
8935
|
-
if (el.hasAttribute("data-ohw-nav-container") || el.hasAttribute("data-ohw-nav-root")) {
|
|
8936
|
-
return true;
|
|
8937
|
-
}
|
|
8938
|
-
if (el.hasAttribute("data-ohw-href-key") && el.closest("nav, [data-ohw-nav-root], [data-ohw-nav-drawer], aside")) {
|
|
8939
|
-
return true;
|
|
8940
|
-
}
|
|
8941
|
-
if (el.closest('[data-ohw-role="navbar-button"]')) return true;
|
|
8942
|
-
return false;
|
|
8943
|
-
}
|
|
8944
|
-
function isSiteWideScopeActive(args) {
|
|
8945
|
-
return isSiteWideElement(args.selected) || isSiteWideElement(args.hoveredItem) || isSiteWideElement(args.hoveredNavContainer) || isSiteWideElement(args.active);
|
|
8946
|
-
}
|
|
8947
|
-
|
|
8948
8601
|
// src/lib/add-footer-column.ts
|
|
8949
8602
|
function buildFooterColumnEditContentPatch(result) {
|
|
8950
8603
|
return {
|
|
@@ -9175,7 +8828,7 @@ function hitTestNavDropSlot(clientX, clientY, draggedHrefKey) {
|
|
|
9175
8828
|
}
|
|
9176
8829
|
|
|
9177
8830
|
// src/useNavItemDrag.ts
|
|
9178
|
-
import { useCallback as
|
|
8831
|
+
import { useCallback as useCallback4, useEffect as useEffect7, useRef as useRef6, useState as useState7 } from "react";
|
|
9179
8832
|
function useNavItemDrag({
|
|
9180
8833
|
isEditMode,
|
|
9181
8834
|
editContentRef,
|
|
@@ -9200,11 +8853,11 @@ function useNavItemDrag({
|
|
|
9200
8853
|
isDragHandleDisabled: isDragHandleDisabled2,
|
|
9201
8854
|
isNavbarButton: isNavbarButton3
|
|
9202
8855
|
}) {
|
|
9203
|
-
const navDragRef =
|
|
9204
|
-
const [navDropSlots, setNavDropSlots] =
|
|
9205
|
-
const [activeNavDropIndex, setActiveNavDropIndex] =
|
|
9206
|
-
const navPointerDragRef =
|
|
9207
|
-
const clearNavDragVisuals =
|
|
8856
|
+
const navDragRef = useRef6(null);
|
|
8857
|
+
const [navDropSlots, setNavDropSlots] = useState7([]);
|
|
8858
|
+
const [activeNavDropIndex, setActiveNavDropIndex] = useState7(null);
|
|
8859
|
+
const navPointerDragRef = useRef6(null);
|
|
8860
|
+
const clearNavDragVisuals = useCallback4(() => {
|
|
9208
8861
|
const session = navDragRef.current;
|
|
9209
8862
|
const keepOpenEl = session?.draggedEl?.closest("[data-ohw-nav-children]") != null ? session.draggedEl : null;
|
|
9210
8863
|
navDragRef.current = null;
|
|
@@ -9221,7 +8874,7 @@ function useNavItemDrag({
|
|
|
9221
8874
|
document.documentElement.removeAttribute("data-ohw-nav-dragging-root");
|
|
9222
8875
|
unlockItemDragInteraction();
|
|
9223
8876
|
}, [setDraggedItemRect, setIsItemDragging, setSiblingHintRects]);
|
|
9224
|
-
const refreshNavDragVisuals =
|
|
8877
|
+
const refreshNavDragVisuals = useCallback4(
|
|
9225
8878
|
(session, activeSlot, clientX, clientY) => {
|
|
9226
8879
|
setDraggedItemRect(session.draggedEl.getBoundingClientRect());
|
|
9227
8880
|
if (typeof clientX === "number" && typeof clientY === "number") {
|
|
@@ -9239,13 +8892,13 @@ function useNavItemDrag({
|
|
|
9239
8892
|
},
|
|
9240
8893
|
[setDraggedItemRect, setSiblingHintRects]
|
|
9241
8894
|
);
|
|
9242
|
-
const refreshNavDragVisualsRef =
|
|
8895
|
+
const refreshNavDragVisualsRef = useRef6(refreshNavDragVisuals);
|
|
9243
8896
|
refreshNavDragVisualsRef.current = refreshNavDragVisuals;
|
|
9244
|
-
const commitNavDragRef =
|
|
8897
|
+
const commitNavDragRef = useRef6(() => {
|
|
9245
8898
|
});
|
|
9246
|
-
const beginNavDragRef =
|
|
8899
|
+
const beginNavDragRef = useRef6(() => {
|
|
9247
8900
|
});
|
|
9248
|
-
const beginNavDrag =
|
|
8901
|
+
const beginNavDrag = useCallback4(
|
|
9249
8902
|
(session) => {
|
|
9250
8903
|
const rect = session.draggedEl.getBoundingClientRect();
|
|
9251
8904
|
session.lastClientX = session.lastClientX || rect.left + rect.width / 2;
|
|
@@ -9279,7 +8932,7 @@ function useNavItemDrag({
|
|
|
9279
8932
|
]
|
|
9280
8933
|
);
|
|
9281
8934
|
beginNavDragRef.current = beginNavDrag;
|
|
9282
|
-
const commitNavDrag =
|
|
8935
|
+
const commitNavDrag = useCallback4(
|
|
9283
8936
|
(clientX, clientY) => {
|
|
9284
8937
|
const session = navDragRef.current;
|
|
9285
8938
|
if (!session) {
|
|
@@ -9340,7 +8993,7 @@ function useNavItemDrag({
|
|
|
9340
8993
|
[clearNavDragVisuals, deselectRef, editContentRef, postToParentRef, selectRef]
|
|
9341
8994
|
);
|
|
9342
8995
|
commitNavDragRef.current = commitNavDrag;
|
|
9343
|
-
const startNavLinkDrag =
|
|
8996
|
+
const startNavLinkDrag = useCallback4(
|
|
9344
8997
|
(anchor, clientX, clientY, wasSelected) => {
|
|
9345
8998
|
if (footerDragRef.current) return false;
|
|
9346
8999
|
const hrefKey = anchor.getAttribute("data-ohw-href-key");
|
|
@@ -9358,7 +9011,7 @@ function useNavItemDrag({
|
|
|
9358
9011
|
},
|
|
9359
9012
|
[beginNavDrag, footerDragRef, isDragHandleDisabled2, isNavbarButton3]
|
|
9360
9013
|
);
|
|
9361
|
-
const onNavDragOver =
|
|
9014
|
+
const onNavDragOver = useCallback4(
|
|
9362
9015
|
(e) => {
|
|
9363
9016
|
const session = navDragRef.current;
|
|
9364
9017
|
if (!session) return false;
|
|
@@ -9370,7 +9023,7 @@ function useNavItemDrag({
|
|
|
9370
9023
|
},
|
|
9371
9024
|
[]
|
|
9372
9025
|
);
|
|
9373
|
-
|
|
9026
|
+
useEffect7(() => {
|
|
9374
9027
|
if (!isEditMode) return;
|
|
9375
9028
|
const THRESHOLD = 10;
|
|
9376
9029
|
const resolveWasSelected = (el) => {
|
|
@@ -9495,7 +9148,7 @@ function useNavItemDrag({
|
|
|
9495
9148
|
setLinkPopover,
|
|
9496
9149
|
suppressNextClickRef
|
|
9497
9150
|
]);
|
|
9498
|
-
const armNavPressFromChrome =
|
|
9151
|
+
const armNavPressFromChrome = useCallback4(
|
|
9499
9152
|
(selected, clientX, clientY, pointerId) => {
|
|
9500
9153
|
const hrefKey = selected.getAttribute("data-ohw-href-key");
|
|
9501
9154
|
if (!hrefKey || !isNavbarHrefKey(hrefKey)) return false;
|
|
@@ -9527,7 +9180,7 @@ function useNavItemDrag({
|
|
|
9527
9180
|
|
|
9528
9181
|
// src/ui/footer-container-chrome.tsx
|
|
9529
9182
|
import { Plus as Plus2 } from "lucide-react";
|
|
9530
|
-
import { jsx as
|
|
9183
|
+
import { jsx as jsx23, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
9531
9184
|
function FooterContainerChrome({
|
|
9532
9185
|
rect,
|
|
9533
9186
|
onAdd,
|
|
@@ -9535,7 +9188,7 @@ function FooterContainerChrome({
|
|
|
9535
9188
|
}) {
|
|
9536
9189
|
const chromeGap = 6;
|
|
9537
9190
|
const buttonMargin = 7;
|
|
9538
|
-
return /* @__PURE__ */
|
|
9191
|
+
return /* @__PURE__ */ jsx23(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsx23(
|
|
9539
9192
|
"div",
|
|
9540
9193
|
{
|
|
9541
9194
|
"data-ohw-footer-container-chrome": "",
|
|
@@ -9547,8 +9200,8 @@ function FooterContainerChrome({
|
|
|
9547
9200
|
width: rect.width + chromeGap * 2,
|
|
9548
9201
|
height: rect.height + chromeGap * 2
|
|
9549
9202
|
},
|
|
9550
|
-
children: /* @__PURE__ */
|
|
9551
|
-
/* @__PURE__ */
|
|
9203
|
+
children: /* @__PURE__ */ jsxs14(Tooltip, { children: [
|
|
9204
|
+
/* @__PURE__ */ jsx23(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx23(
|
|
9552
9205
|
"button",
|
|
9553
9206
|
{
|
|
9554
9207
|
type: "button",
|
|
@@ -9567,17 +9220,17 @@ function FooterContainerChrome({
|
|
|
9567
9220
|
if (addDisabled) return;
|
|
9568
9221
|
onAdd();
|
|
9569
9222
|
},
|
|
9570
|
-
children: /* @__PURE__ */
|
|
9223
|
+
children: /* @__PURE__ */ jsx23(Plus2, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
|
|
9571
9224
|
}
|
|
9572
9225
|
) }),
|
|
9573
|
-
/* @__PURE__ */
|
|
9226
|
+
/* @__PURE__ */ jsx23(TooltipContent, { side: "bottom", sideOffset: 9, children: addDisabled ? "Maximum columns reached" : "Add item" })
|
|
9574
9227
|
] })
|
|
9575
9228
|
}
|
|
9576
9229
|
) });
|
|
9577
9230
|
}
|
|
9578
9231
|
|
|
9579
9232
|
// src/lib/carousel.ts
|
|
9580
|
-
import { useEffect as
|
|
9233
|
+
import { useEffect as useEffect8, useState as useState8 } from "react";
|
|
9581
9234
|
var CAROUSEL_ATTR = "data-ohw-carousel";
|
|
9582
9235
|
var CAROUSEL_VALUE_ATTR = "data-ohw-carousel-value";
|
|
9583
9236
|
var CAROUSEL_SLIDE_ATTR = "data-ohw-carousel-slide";
|
|
@@ -9639,8 +9292,8 @@ function applyCarouselNode(key, val) {
|
|
|
9639
9292
|
return true;
|
|
9640
9293
|
}
|
|
9641
9294
|
function useOhwCarousel(key, initial) {
|
|
9642
|
-
const [images, setImages] =
|
|
9643
|
-
|
|
9295
|
+
const [images, setImages] = useState8(initial);
|
|
9296
|
+
useEffect8(() => {
|
|
9644
9297
|
const el = document.querySelector(
|
|
9645
9298
|
`[${CAROUSEL_ATTR}][data-ohw-key="${CSS.escape(key)}"]`
|
|
9646
9299
|
);
|
|
@@ -9675,13 +9328,10 @@ function getLinkHref3(el) {
|
|
|
9675
9328
|
const anchor = el instanceof HTMLAnchorElement ? el : el.querySelector("a");
|
|
9676
9329
|
return anchor?.getAttribute("href") ?? "";
|
|
9677
9330
|
}
|
|
9678
|
-
function collectEditableNodes(extraContent
|
|
9679
|
-
const
|
|
9680
|
-
|
|
9681
|
-
|
|
9682
|
-
editableEls.unshift(root);
|
|
9683
|
-
}
|
|
9684
|
-
const nodes = editableEls.map((el) => {
|
|
9331
|
+
function collectEditableNodes(extraContent) {
|
|
9332
|
+
const nodes = Array.from(
|
|
9333
|
+
document.querySelectorAll("[data-ohw-editable]")
|
|
9334
|
+
).map((el) => {
|
|
9685
9335
|
if (el.dataset.ohwEditable === "image") {
|
|
9686
9336
|
const img = el instanceof HTMLImageElement ? el : el.querySelector("img");
|
|
9687
9337
|
return { key: el.dataset.ohwKey ?? "", type: "image", text: img?.src ?? "" };
|
|
@@ -9703,16 +9353,12 @@ function collectEditableNodes(extraContent, root = document) {
|
|
|
9703
9353
|
text: el.dataset.ohwEditable === "plain" ? el.innerText ?? "" : el.innerHTML
|
|
9704
9354
|
};
|
|
9705
9355
|
});
|
|
9706
|
-
|
|
9707
|
-
if (isScoped && root instanceof HTMLElement && root.matches("[data-ohw-href-key]")) {
|
|
9708
|
-
hrefEls.unshift(root);
|
|
9709
|
-
}
|
|
9710
|
-
hrefEls.forEach((el) => {
|
|
9356
|
+
document.querySelectorAll("[data-ohw-href-key]").forEach((el) => {
|
|
9711
9357
|
const key = el.getAttribute("data-ohw-href-key") ?? "";
|
|
9712
9358
|
if (!key) return;
|
|
9713
9359
|
nodes.push({ key, type: "link", text: getLinkHref3(el) });
|
|
9714
9360
|
});
|
|
9715
|
-
if (extraContent
|
|
9361
|
+
if (extraContent) {
|
|
9716
9362
|
for (const key of [NAV_ORDER_KEY, FOOTER_ORDER_KEY, NAV_COUNT_KEY]) {
|
|
9717
9363
|
const text = extraContent[key];
|
|
9718
9364
|
if (typeof text === "string" && text.length > 0) {
|
|
@@ -9720,32 +9366,30 @@ function collectEditableNodes(extraContent, root = document) {
|
|
|
9720
9366
|
}
|
|
9721
9367
|
}
|
|
9722
9368
|
}
|
|
9723
|
-
|
|
9724
|
-
|
|
9725
|
-
|
|
9726
|
-
|
|
9727
|
-
|
|
9728
|
-
|
|
9729
|
-
|
|
9730
|
-
|
|
9731
|
-
text: String(video.autoplay)
|
|
9732
|
-
});
|
|
9733
|
-
nodes.push({
|
|
9734
|
-
key: `${key}${VIDEO_MUTED_SUFFIX}`,
|
|
9735
|
-
type: "video-setting",
|
|
9736
|
-
text: String(video.muted)
|
|
9737
|
-
});
|
|
9369
|
+
document.querySelectorAll('[data-ohw-editable="video"]').forEach((el) => {
|
|
9370
|
+
const key = el.dataset.ohwKey ?? "";
|
|
9371
|
+
const video = getVideoEl(el);
|
|
9372
|
+
if (!key || !video) return;
|
|
9373
|
+
nodes.push({
|
|
9374
|
+
key: `${key}${VIDEO_AUTOPLAY_SUFFIX}`,
|
|
9375
|
+
type: "video-setting",
|
|
9376
|
+
text: String(video.autoplay)
|
|
9738
9377
|
});
|
|
9739
|
-
|
|
9740
|
-
|
|
9741
|
-
|
|
9378
|
+
nodes.push({
|
|
9379
|
+
key: `${key}${VIDEO_MUTED_SUFFIX}`,
|
|
9380
|
+
type: "video-setting",
|
|
9381
|
+
text: String(video.muted)
|
|
9382
|
+
});
|
|
9383
|
+
});
|
|
9384
|
+
for (const key of listCarouselKeys()) {
|
|
9385
|
+
nodes.push({ key, type: "carousel", text: JSON.stringify(readCarouselValue(key)) });
|
|
9742
9386
|
}
|
|
9743
9387
|
const byKey = /* @__PURE__ */ new Map();
|
|
9744
9388
|
for (const node of nodes) {
|
|
9745
9389
|
if (!node.key) continue;
|
|
9746
9390
|
if (!byKey.has(node.key)) byKey.set(node.key, node);
|
|
9747
9391
|
}
|
|
9748
|
-
if (extraContent
|
|
9392
|
+
if (extraContent) {
|
|
9749
9393
|
applyNavFooterDeleteOverrides(byKey, extraContent);
|
|
9750
9394
|
}
|
|
9751
9395
|
return Array.from(byKey.values());
|
|
@@ -9996,13 +9640,13 @@ function deleteSelectedNavFooterItem(deps) {
|
|
|
9996
9640
|
|
|
9997
9641
|
// src/ui/navbar-container-chrome.tsx
|
|
9998
9642
|
import { Plus as Plus3 } from "lucide-react";
|
|
9999
|
-
import { jsx as
|
|
9643
|
+
import { jsx as jsx24 } from "react/jsx-runtime";
|
|
10000
9644
|
function NavbarContainerChrome({
|
|
10001
9645
|
rect,
|
|
10002
9646
|
onAdd
|
|
10003
9647
|
}) {
|
|
10004
9648
|
const chromeGap = 6;
|
|
10005
|
-
return /* @__PURE__ */
|
|
9649
|
+
return /* @__PURE__ */ jsx24(
|
|
10006
9650
|
"div",
|
|
10007
9651
|
{
|
|
10008
9652
|
"data-ohw-navbar-container-chrome": "",
|
|
@@ -10014,7 +9658,7 @@ function NavbarContainerChrome({
|
|
|
10014
9658
|
width: rect.width + chromeGap * 2,
|
|
10015
9659
|
height: rect.height + chromeGap * 2
|
|
10016
9660
|
},
|
|
10017
|
-
children: /* @__PURE__ */
|
|
9661
|
+
children: /* @__PURE__ */ jsx24(
|
|
10018
9662
|
"button",
|
|
10019
9663
|
{
|
|
10020
9664
|
type: "button",
|
|
@@ -10031,7 +9675,7 @@ function NavbarContainerChrome({
|
|
|
10031
9675
|
e.stopPropagation();
|
|
10032
9676
|
onAdd();
|
|
10033
9677
|
},
|
|
10034
|
-
children: /* @__PURE__ */
|
|
9678
|
+
children: /* @__PURE__ */ jsx24(Plus3, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
|
|
10035
9679
|
}
|
|
10036
9680
|
)
|
|
10037
9681
|
}
|
|
@@ -10040,7 +9684,7 @@ function NavbarContainerChrome({
|
|
|
10040
9684
|
|
|
10041
9685
|
// src/ui/drop-indicator.tsx
|
|
10042
9686
|
import * as React9 from "react";
|
|
10043
|
-
import { jsx as
|
|
9687
|
+
import { jsx as jsx25 } from "react/jsx-runtime";
|
|
10044
9688
|
var dropIndicatorVariants = cva(
|
|
10045
9689
|
"ov-gap-line pointer-events-none shrink-0 transition-opacity duration-150",
|
|
10046
9690
|
{
|
|
@@ -10064,7 +9708,7 @@ var dropIndicatorVariants = cva(
|
|
|
10064
9708
|
);
|
|
10065
9709
|
var DropIndicator = React9.forwardRef(
|
|
10066
9710
|
({ className, direction, state, ...props }, ref) => {
|
|
10067
|
-
return /* @__PURE__ */
|
|
9711
|
+
return /* @__PURE__ */ jsx25(
|
|
10068
9712
|
"div",
|
|
10069
9713
|
{
|
|
10070
9714
|
ref,
|
|
@@ -10081,7 +9725,7 @@ var DropIndicator = React9.forwardRef(
|
|
|
10081
9725
|
DropIndicator.displayName = "DropIndicator";
|
|
10082
9726
|
|
|
10083
9727
|
// src/ui/badge.tsx
|
|
10084
|
-
import { jsx as
|
|
9728
|
+
import { jsx as jsx26 } from "react/jsx-runtime";
|
|
10085
9729
|
var badgeVariants = cva(
|
|
10086
9730
|
"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",
|
|
10087
9731
|
{
|
|
@@ -10099,13 +9743,13 @@ var badgeVariants = cva(
|
|
|
10099
9743
|
}
|
|
10100
9744
|
);
|
|
10101
9745
|
function Badge({ className, variant, ...props }) {
|
|
10102
|
-
return /* @__PURE__ */
|
|
9746
|
+
return /* @__PURE__ */ jsx26("div", { className: cn(badgeVariants({ variant }), className), ...props });
|
|
10103
9747
|
}
|
|
10104
9748
|
|
|
10105
9749
|
// src/OhhwellsBridge.tsx
|
|
10106
9750
|
import { Link as Link2 } from "lucide-react";
|
|
10107
|
-
import { Fragment as
|
|
10108
|
-
var
|
|
9751
|
+
import { Fragment as Fragment6, jsx as jsx27, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
9752
|
+
var PRIMARY2 = "#0885FE";
|
|
10109
9753
|
var IMAGE_FADE_MS = 300;
|
|
10110
9754
|
function runOpacityFade(el, onDone) {
|
|
10111
9755
|
const anim = el.animate([{ opacity: 0 }, { opacity: 1 }], {
|
|
@@ -10283,7 +9927,7 @@ function mountSchedulingWidget(insertAfter, notifyOnConnect = false, scheduleId,
|
|
|
10283
9927
|
const root = createRoot(container);
|
|
10284
9928
|
flushSync(() => {
|
|
10285
9929
|
root.render(
|
|
10286
|
-
/* @__PURE__ */
|
|
9930
|
+
/* @__PURE__ */ jsx27(
|
|
10287
9931
|
SchedulingWidget,
|
|
10288
9932
|
{
|
|
10289
9933
|
notifyOnConnect,
|
|
@@ -10358,10 +10002,6 @@ function syncNavigationDragCursorAttrs() {
|
|
|
10358
10002
|
el.setAttribute("data-ohw-can-drag", "");
|
|
10359
10003
|
});
|
|
10360
10004
|
}
|
|
10361
|
-
var AI_NODE_TYPES = /* @__PURE__ */ new Set(["image", "bg-image", "video", "link", "plain", "text/rich", "text"]);
|
|
10362
|
-
function normalizeAiNodeType(type) {
|
|
10363
|
-
return AI_NODE_TYPES.has(type) ? type : "text";
|
|
10364
|
-
}
|
|
10365
10005
|
function isMediaEditable(el) {
|
|
10366
10006
|
const t = el.dataset.ohwEditable;
|
|
10367
10007
|
return t === "image" || t === "bg-image" || t === "video";
|
|
@@ -10654,7 +10294,7 @@ function getNavigationSelectionParent(el) {
|
|
|
10654
10294
|
if (!isFooterLinksContainer(el) && (el.hasAttribute("data-ohw-footer-col") || el.hasAttribute("data-ohw-footer-column") || isInferredFooterGroup2(el))) {
|
|
10655
10295
|
return getFooterLinksContainer();
|
|
10656
10296
|
}
|
|
10657
|
-
if (el.hasAttribute("data-ohw-nav-container") || el.hasAttribute("data-ohw-nav-drawer") ||
|
|
10297
|
+
if (el.hasAttribute("data-ohw-nav-container") || el.hasAttribute("data-ohw-nav-drawer") || isFooterLinksContainer(el)) {
|
|
10658
10298
|
return getNavigationRoot(el);
|
|
10659
10299
|
}
|
|
10660
10300
|
return null;
|
|
@@ -10893,7 +10533,7 @@ function EditGlowChrome({
|
|
|
10893
10533
|
hideHandle = false
|
|
10894
10534
|
}) {
|
|
10895
10535
|
const GAP = SELECTION_CHROME_GAP2;
|
|
10896
|
-
return /* @__PURE__ */
|
|
10536
|
+
return /* @__PURE__ */ jsxs15(
|
|
10897
10537
|
"div",
|
|
10898
10538
|
{
|
|
10899
10539
|
ref: elRef,
|
|
@@ -10908,7 +10548,7 @@ function EditGlowChrome({
|
|
|
10908
10548
|
zIndex: 2147483646
|
|
10909
10549
|
},
|
|
10910
10550
|
children: [
|
|
10911
|
-
/* @__PURE__ */
|
|
10551
|
+
/* @__PURE__ */ jsx27(
|
|
10912
10552
|
"div",
|
|
10913
10553
|
{
|
|
10914
10554
|
style: {
|
|
@@ -10921,7 +10561,7 @@ function EditGlowChrome({
|
|
|
10921
10561
|
}
|
|
10922
10562
|
}
|
|
10923
10563
|
),
|
|
10924
|
-
reorderHrefKey && !hideHandle && /* @__PURE__ */
|
|
10564
|
+
reorderHrefKey && !hideHandle && /* @__PURE__ */ jsx27(
|
|
10925
10565
|
"div",
|
|
10926
10566
|
{
|
|
10927
10567
|
"data-ohw-drag-handle-container": "",
|
|
@@ -10933,7 +10573,7 @@ function EditGlowChrome({
|
|
|
10933
10573
|
transform: "translate(calc(-100% - 7px), -50%)",
|
|
10934
10574
|
pointerEvents: dragDisabled ? "none" : "auto"
|
|
10935
10575
|
},
|
|
10936
|
-
children: /* @__PURE__ */
|
|
10576
|
+
children: /* @__PURE__ */ jsx27(
|
|
10937
10577
|
DragHandle,
|
|
10938
10578
|
{
|
|
10939
10579
|
"aria-label": `Reorder ${reorderHrefKey}`,
|
|
@@ -11143,7 +10783,7 @@ function FloatingToolbar({
|
|
|
11143
10783
|
return () => ro.disconnect();
|
|
11144
10784
|
}, [showEditLink, activeCommands]);
|
|
11145
10785
|
const { top, left, transform } = calcToolbarPos(rect, parentScroll, measuredW);
|
|
11146
|
-
return /* @__PURE__ */
|
|
10786
|
+
return /* @__PURE__ */ jsx27(
|
|
11147
10787
|
"div",
|
|
11148
10788
|
{
|
|
11149
10789
|
ref: setRefs,
|
|
@@ -11155,12 +10795,12 @@ function FloatingToolbar({
|
|
|
11155
10795
|
zIndex: 2147483647,
|
|
11156
10796
|
pointerEvents: "auto"
|
|
11157
10797
|
},
|
|
11158
|
-
children: /* @__PURE__ */
|
|
11159
|
-
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */
|
|
11160
|
-
gi > 0 && /* @__PURE__ */
|
|
10798
|
+
children: /* @__PURE__ */ jsxs15(CustomToolbar, { children: [
|
|
10799
|
+
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ jsxs15(React10.Fragment, { children: [
|
|
10800
|
+
gi > 0 && /* @__PURE__ */ jsx27(CustomToolbarDivider, {}),
|
|
11161
10801
|
btns.map((btn) => {
|
|
11162
10802
|
const isActive = activeCommands.has(btn.cmd);
|
|
11163
|
-
return /* @__PURE__ */
|
|
10803
|
+
return /* @__PURE__ */ jsx27(
|
|
11164
10804
|
CustomToolbarButton,
|
|
11165
10805
|
{
|
|
11166
10806
|
title: btn.title,
|
|
@@ -11169,7 +10809,7 @@ function FloatingToolbar({
|
|
|
11169
10809
|
e.preventDefault();
|
|
11170
10810
|
onCommand(btn.cmd);
|
|
11171
10811
|
},
|
|
11172
|
-
children: /* @__PURE__ */
|
|
10812
|
+
children: /* @__PURE__ */ jsx27(
|
|
11173
10813
|
"svg",
|
|
11174
10814
|
{
|
|
11175
10815
|
width: "16",
|
|
@@ -11190,7 +10830,7 @@ function FloatingToolbar({
|
|
|
11190
10830
|
);
|
|
11191
10831
|
})
|
|
11192
10832
|
] }, gi)),
|
|
11193
|
-
showEditLink ? /* @__PURE__ */
|
|
10833
|
+
showEditLink ? /* @__PURE__ */ jsx27(
|
|
11194
10834
|
CustomToolbarButton,
|
|
11195
10835
|
{
|
|
11196
10836
|
type: "button",
|
|
@@ -11204,7 +10844,7 @@ function FloatingToolbar({
|
|
|
11204
10844
|
e.preventDefault();
|
|
11205
10845
|
e.stopPropagation();
|
|
11206
10846
|
},
|
|
11207
|
-
children: /* @__PURE__ */
|
|
10847
|
+
children: /* @__PURE__ */ jsx27(Link2, { className: "size-4 shrink-0", "aria-hidden": true })
|
|
11208
10848
|
}
|
|
11209
10849
|
) : null
|
|
11210
10850
|
] })
|
|
@@ -11221,7 +10861,7 @@ function StateToggle({
|
|
|
11221
10861
|
states,
|
|
11222
10862
|
onStateChange
|
|
11223
10863
|
}) {
|
|
11224
|
-
return /* @__PURE__ */
|
|
10864
|
+
return /* @__PURE__ */ jsx27(
|
|
11225
10865
|
ToggleGroup,
|
|
11226
10866
|
{
|
|
11227
10867
|
"data-ohw-state-toggle": "",
|
|
@@ -11235,7 +10875,7 @@ function StateToggle({
|
|
|
11235
10875
|
left: rect.right - 8,
|
|
11236
10876
|
transform: "translateX(-100%)"
|
|
11237
10877
|
},
|
|
11238
|
-
children: states.map((state) => /* @__PURE__ */
|
|
10878
|
+
children: states.map((state) => /* @__PURE__ */ jsx27(ToggleGroupItem, { value: state, size: "sm", children: state }, state))
|
|
11239
10879
|
}
|
|
11240
10880
|
);
|
|
11241
10881
|
}
|
|
@@ -11262,8 +10902,8 @@ function OhhwellsBridge() {
|
|
|
11262
10902
|
const router = useRouter2();
|
|
11263
10903
|
const searchParams = useSearchParams();
|
|
11264
10904
|
const isEditMode = isEditSessionActive();
|
|
11265
|
-
const [bridgeRoot, setBridgeRoot] =
|
|
11266
|
-
|
|
10905
|
+
const [bridgeRoot, setBridgeRoot] = useState9(null);
|
|
10906
|
+
useEffect9(() => {
|
|
11267
10907
|
const figtreeFontId = "ohw-figtree-font";
|
|
11268
10908
|
if (!document.getElementById(figtreeFontId)) {
|
|
11269
10909
|
const preconnect1 = Object.assign(document.createElement("link"), { rel: "preconnect", href: "https://fonts.googleapis.com" });
|
|
@@ -11291,107 +10931,106 @@ function OhhwellsBridge() {
|
|
|
11291
10931
|
const subdomainFromQuery = searchParams.get("subdomain");
|
|
11292
10932
|
const subdomain = resolveSubdomain(subdomainFromQuery);
|
|
11293
10933
|
useLinkHrefGuardian(pathname, subdomain, isEditMode);
|
|
11294
|
-
const postToParent2 =
|
|
10934
|
+
const postToParent2 = useCallback5((data) => {
|
|
11295
10935
|
if (typeof window !== "undefined" && window.parent !== window) {
|
|
11296
10936
|
window.parent.postMessage(data, "*");
|
|
11297
10937
|
}
|
|
11298
10938
|
}, []);
|
|
11299
|
-
const [fetchState, setFetchState] =
|
|
11300
|
-
const autoSaveTimers =
|
|
11301
|
-
const activeElRef =
|
|
11302
|
-
const pointerHeldRef =
|
|
11303
|
-
const selectedElRef =
|
|
11304
|
-
const selectedHrefKeyRef =
|
|
11305
|
-
const selectedFooterColAttrRef =
|
|
11306
|
-
const originalContentRef =
|
|
11307
|
-
const activeStateElRef =
|
|
11308
|
-
const parentScrollRef =
|
|
11309
|
-
const visibleViewportRef =
|
|
11310
|
-
const [dialogPortalContainer, setDialogPortalContainer] =
|
|
11311
|
-
const attachVisibleViewport =
|
|
10939
|
+
const [fetchState, setFetchState] = useState9("idle");
|
|
10940
|
+
const autoSaveTimers = useRef7(/* @__PURE__ */ new Map());
|
|
10941
|
+
const activeElRef = useRef7(null);
|
|
10942
|
+
const pointerHeldRef = useRef7(false);
|
|
10943
|
+
const selectedElRef = useRef7(null);
|
|
10944
|
+
const selectedHrefKeyRef = useRef7(null);
|
|
10945
|
+
const selectedFooterColAttrRef = useRef7(null);
|
|
10946
|
+
const originalContentRef = useRef7(null);
|
|
10947
|
+
const activeStateElRef = useRef7(null);
|
|
10948
|
+
const parentScrollRef = useRef7(null);
|
|
10949
|
+
const visibleViewportRef = useRef7(null);
|
|
10950
|
+
const [dialogPortalContainer, setDialogPortalContainer] = useState9(null);
|
|
10951
|
+
const attachVisibleViewport = useCallback5((node) => {
|
|
11312
10952
|
visibleViewportRef.current = node;
|
|
11313
10953
|
setDialogPortalContainer(node);
|
|
11314
10954
|
if (node) applyVisibleViewport(node, parentScrollRef.current);
|
|
11315
10955
|
}, []);
|
|
11316
|
-
const toolbarElRef =
|
|
11317
|
-
const glowElRef =
|
|
11318
|
-
const hoveredImageRef =
|
|
11319
|
-
const hoveredImageHasTextOverlapRef =
|
|
11320
|
-
const dragOverElRef =
|
|
11321
|
-
const [mediaHover, setMediaHover] =
|
|
11322
|
-
const [carouselHover, setCarouselHover] =
|
|
11323
|
-
const [uploadingRects, setUploadingRects] =
|
|
11324
|
-
const hoveredGapRef =
|
|
11325
|
-
const imageUnhoverTimerRef =
|
|
11326
|
-
const imageShowTimerRef =
|
|
11327
|
-
const editStylesRef =
|
|
11328
|
-
const activateRef =
|
|
10956
|
+
const toolbarElRef = useRef7(null);
|
|
10957
|
+
const glowElRef = useRef7(null);
|
|
10958
|
+
const hoveredImageRef = useRef7(null);
|
|
10959
|
+
const hoveredImageHasTextOverlapRef = useRef7(false);
|
|
10960
|
+
const dragOverElRef = useRef7(null);
|
|
10961
|
+
const [mediaHover, setMediaHover] = useState9(null);
|
|
10962
|
+
const [carouselHover, setCarouselHover] = useState9(null);
|
|
10963
|
+
const [uploadingRects, setUploadingRects] = useState9({});
|
|
10964
|
+
const hoveredGapRef = useRef7(null);
|
|
10965
|
+
const imageUnhoverTimerRef = useRef7(null);
|
|
10966
|
+
const imageShowTimerRef = useRef7(null);
|
|
10967
|
+
const editStylesRef = useRef7(null);
|
|
10968
|
+
const activateRef = useRef7(() => {
|
|
11329
10969
|
});
|
|
11330
|
-
const deactivateRef =
|
|
10970
|
+
const deactivateRef = useRef7(() => {
|
|
11331
10971
|
});
|
|
11332
|
-
const selectRef =
|
|
10972
|
+
const selectRef = useRef7(() => {
|
|
11333
10973
|
});
|
|
11334
|
-
const selectFrameRef =
|
|
10974
|
+
const selectFrameRef = useRef7(() => {
|
|
11335
10975
|
});
|
|
11336
|
-
const deselectRef =
|
|
10976
|
+
const deselectRef = useRef7(() => {
|
|
11337
10977
|
});
|
|
11338
|
-
const reselectNavigationItemRef =
|
|
10978
|
+
const reselectNavigationItemRef = useRef7(() => {
|
|
11339
10979
|
});
|
|
11340
|
-
const commitNavigationTextEditRef =
|
|
10980
|
+
const commitNavigationTextEditRef = useRef7(() => {
|
|
11341
10981
|
});
|
|
11342
|
-
const handleDeleteSelectedRef =
|
|
11343
|
-
const runPendingDeleteUndoRef =
|
|
11344
|
-
const isFooterFrameSelectionRef =
|
|
11345
|
-
const refreshActiveCommandsRef =
|
|
10982
|
+
const handleDeleteSelectedRef = useRef7(() => false);
|
|
10983
|
+
const runPendingDeleteUndoRef = useRef7(() => false);
|
|
10984
|
+
const isFooterFrameSelectionRef = useRef7(false);
|
|
10985
|
+
const refreshActiveCommandsRef = useRef7(() => {
|
|
11346
10986
|
});
|
|
11347
|
-
const postToParentRef =
|
|
10987
|
+
const postToParentRef = useRef7(postToParent2);
|
|
11348
10988
|
postToParentRef.current = postToParent2;
|
|
11349
|
-
const
|
|
11350
|
-
const
|
|
11351
|
-
const
|
|
11352
|
-
const [
|
|
11353
|
-
const
|
|
11354
|
-
const toolbarVariantRef = useRef8("none");
|
|
10989
|
+
const sectionsLoadedRef = useRef7(false);
|
|
10990
|
+
const pendingScheduleConfigRequests = useRef7([]);
|
|
10991
|
+
const [toolbarRect, setToolbarRect] = useState9(null);
|
|
10992
|
+
const [toolbarVariant, setToolbarVariant] = useState9("none");
|
|
10993
|
+
const toolbarVariantRef = useRef7("none");
|
|
11355
10994
|
toolbarVariantRef.current = toolbarVariant;
|
|
11356
|
-
const [selectedIsCta, setSelectedIsCta] =
|
|
11357
|
-
const [reorderHrefKey, setReorderHrefKey] =
|
|
11358
|
-
const [reorderDragDisabled, setReorderDragDisabled] =
|
|
11359
|
-
const [toggleState, setToggleState] =
|
|
11360
|
-
const [maxBadge, setMaxBadge] =
|
|
11361
|
-
const [activeCommands, setActiveCommands] =
|
|
11362
|
-
const [sectionGap, setSectionGap] =
|
|
11363
|
-
const [toolbarShowEditLink, setToolbarShowEditLink] =
|
|
11364
|
-
const hoveredNavContainerRef =
|
|
11365
|
-
const [hoveredNavContainerRect, setHoveredNavContainerRect] =
|
|
11366
|
-
const hoveredItemElRef =
|
|
11367
|
-
const [hoveredItemRect, setHoveredItemRect] =
|
|
11368
|
-
const siblingHintElRef =
|
|
11369
|
-
const [siblingHintRect, setSiblingHintRect] =
|
|
11370
|
-
const [siblingHintRects, setSiblingHintRects] =
|
|
11371
|
-
const [isItemDragging, setIsItemDragging] =
|
|
11372
|
-
const [isFooterFrameSelection, setIsFooterFrameSelection] =
|
|
10995
|
+
const [selectedIsCta, setSelectedIsCta] = useState9(false);
|
|
10996
|
+
const [reorderHrefKey, setReorderHrefKey] = useState9(null);
|
|
10997
|
+
const [reorderDragDisabled, setReorderDragDisabled] = useState9(false);
|
|
10998
|
+
const [toggleState, setToggleState] = useState9(null);
|
|
10999
|
+
const [maxBadge, setMaxBadge] = useState9(null);
|
|
11000
|
+
const [activeCommands, setActiveCommands] = useState9(/* @__PURE__ */ new Set());
|
|
11001
|
+
const [sectionGap, setSectionGap] = useState9(null);
|
|
11002
|
+
const [toolbarShowEditLink, setToolbarShowEditLink] = useState9(false);
|
|
11003
|
+
const hoveredNavContainerRef = useRef7(null);
|
|
11004
|
+
const [hoveredNavContainerRect, setHoveredNavContainerRect] = useState9(null);
|
|
11005
|
+
const hoveredItemElRef = useRef7(null);
|
|
11006
|
+
const [hoveredItemRect, setHoveredItemRect] = useState9(null);
|
|
11007
|
+
const siblingHintElRef = useRef7(null);
|
|
11008
|
+
const [siblingHintRect, setSiblingHintRect] = useState9(null);
|
|
11009
|
+
const [siblingHintRects, setSiblingHintRects] = useState9([]);
|
|
11010
|
+
const [isItemDragging, setIsItemDragging] = useState9(false);
|
|
11011
|
+
const [isFooterFrameSelection, setIsFooterFrameSelection] = useState9(false);
|
|
11373
11012
|
isFooterFrameSelectionRef.current = isFooterFrameSelection;
|
|
11374
|
-
const [navDropdownPreviewOpen, setNavDropdownPreviewOpen] =
|
|
11375
|
-
const [footerHeadingVisible, setFooterHeadingVisible] =
|
|
11376
|
-
const footerDragRef =
|
|
11377
|
-
const [footerDropSlots, setFooterDropSlots] =
|
|
11378
|
-
const [activeFooterDropIndex, setActiveFooterDropIndex] =
|
|
11379
|
-
const [draggedItemRect, setDraggedItemRect] =
|
|
11380
|
-
const footerPointerDragRef =
|
|
11381
|
-
const suppressNextClickRef =
|
|
11382
|
-
const suppressClickUntilRef =
|
|
11383
|
-
const [linkPopover, setLinkPopover] =
|
|
11384
|
-
const linkPopoverSessionRef =
|
|
11385
|
-
const addNavAfterAnchorRef =
|
|
11386
|
-
const editContentRef =
|
|
11387
|
-
const pendingDeleteUndoRef =
|
|
11388
|
-
const [sitePages, setSitePages] =
|
|
11389
|
-
const [sectionsByPath, setSectionsByPath] =
|
|
11390
|
-
const sectionsPrefetchGenRef =
|
|
11391
|
-
const setLinkPopoverRef =
|
|
11392
|
-
const linkPopoverPanelRef =
|
|
11393
|
-
const linkPopoverOpenRef =
|
|
11394
|
-
const linkPopoverGraceUntilRef =
|
|
11013
|
+
const [navDropdownPreviewOpen, setNavDropdownPreviewOpen] = useState9(null);
|
|
11014
|
+
const [footerHeadingVisible, setFooterHeadingVisible] = useState9(null);
|
|
11015
|
+
const footerDragRef = useRef7(null);
|
|
11016
|
+
const [footerDropSlots, setFooterDropSlots] = useState9([]);
|
|
11017
|
+
const [activeFooterDropIndex, setActiveFooterDropIndex] = useState9(null);
|
|
11018
|
+
const [draggedItemRect, setDraggedItemRect] = useState9(null);
|
|
11019
|
+
const footerPointerDragRef = useRef7(null);
|
|
11020
|
+
const suppressNextClickRef = useRef7(false);
|
|
11021
|
+
const suppressClickUntilRef = useRef7(0);
|
|
11022
|
+
const [linkPopover, setLinkPopover] = useState9(null);
|
|
11023
|
+
const linkPopoverSessionRef = useRef7(null);
|
|
11024
|
+
const addNavAfterAnchorRef = useRef7(null);
|
|
11025
|
+
const editContentRef = useRef7({});
|
|
11026
|
+
const pendingDeleteUndoRef = useRef7(null);
|
|
11027
|
+
const [sitePages, setSitePages] = useState9([]);
|
|
11028
|
+
const [sectionsByPath, setSectionsByPath] = useState9({});
|
|
11029
|
+
const sectionsPrefetchGenRef = useRef7(0);
|
|
11030
|
+
const setLinkPopoverRef = useRef7(setLinkPopover);
|
|
11031
|
+
const linkPopoverPanelRef = useRef7(null);
|
|
11032
|
+
const linkPopoverOpenRef = useRef7(false);
|
|
11033
|
+
const linkPopoverGraceUntilRef = useRef7(0);
|
|
11395
11034
|
setLinkPopoverRef.current = setLinkPopover;
|
|
11396
11035
|
linkPopoverSessionRef.current = linkPopover;
|
|
11397
11036
|
const {
|
|
@@ -11430,7 +11069,7 @@ function OhhwellsBridge() {
|
|
|
11430
11069
|
const bumpLinkPopoverGrace = () => {
|
|
11431
11070
|
linkPopoverGraceUntilRef.current = Date.now() + 350;
|
|
11432
11071
|
};
|
|
11433
|
-
const runSectionsPrefetch =
|
|
11072
|
+
const runSectionsPrefetch = useCallback5((pages) => {
|
|
11434
11073
|
if (!isEditMode || shouldUseDevFixtures() || pages.length === 0) return;
|
|
11435
11074
|
const gen = ++sectionsPrefetchGenRef.current;
|
|
11436
11075
|
const paths = pages.map((p) => p.path);
|
|
@@ -11449,9 +11088,9 @@ function OhhwellsBridge() {
|
|
|
11449
11088
|
);
|
|
11450
11089
|
});
|
|
11451
11090
|
}, [isEditMode, pathname]);
|
|
11452
|
-
const runSectionsPrefetchRef =
|
|
11091
|
+
const runSectionsPrefetchRef = useRef7(runSectionsPrefetch);
|
|
11453
11092
|
runSectionsPrefetchRef.current = runSectionsPrefetch;
|
|
11454
|
-
|
|
11093
|
+
useEffect9(() => {
|
|
11455
11094
|
if (!linkPopover) {
|
|
11456
11095
|
document.documentElement.removeAttribute("data-ohw-link-popover-open");
|
|
11457
11096
|
return;
|
|
@@ -11479,7 +11118,7 @@ function OhhwellsBridge() {
|
|
|
11479
11118
|
document.documentElement.removeAttribute("data-ohw-link-popover-open");
|
|
11480
11119
|
};
|
|
11481
11120
|
}, [linkPopover, postToParent2]);
|
|
11482
|
-
|
|
11121
|
+
useEffect9(() => {
|
|
11483
11122
|
if (!isEditMode) return;
|
|
11484
11123
|
const useFixtures = shouldUseDevFixtures();
|
|
11485
11124
|
if (useFixtures) {
|
|
@@ -11503,14 +11142,14 @@ function OhhwellsBridge() {
|
|
|
11503
11142
|
if (!useFixtures) postToParent2({ type: "ow:request-site-pages" });
|
|
11504
11143
|
return () => window.removeEventListener("message", onSitePages);
|
|
11505
11144
|
}, [isEditMode, postToParent2]);
|
|
11506
|
-
|
|
11145
|
+
useEffect9(() => {
|
|
11507
11146
|
if (!isEditMode || shouldUseDevFixtures()) return;
|
|
11508
11147
|
void loadAllSectionsManifest().then((manifest) => {
|
|
11509
11148
|
if (Object.keys(manifest).length === 0) return;
|
|
11510
11149
|
setSectionsByPath((prev) => ({ ...manifest, ...prev }));
|
|
11511
11150
|
});
|
|
11512
11151
|
}, [isEditMode]);
|
|
11513
|
-
|
|
11152
|
+
useEffect9(() => {
|
|
11514
11153
|
const update = () => {
|
|
11515
11154
|
const el = activeElRef.current ?? selectedElRef.current;
|
|
11516
11155
|
if (el) setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
@@ -11534,10 +11173,10 @@ function OhhwellsBridge() {
|
|
|
11534
11173
|
vvp.removeEventListener("resize", update);
|
|
11535
11174
|
};
|
|
11536
11175
|
}, []);
|
|
11537
|
-
const refreshStateRules =
|
|
11176
|
+
const refreshStateRules = useCallback5(() => {
|
|
11538
11177
|
editStylesRef.current?.forceHover && (editStylesRef.current.forceHover.textContent = collectStateRules());
|
|
11539
11178
|
}, []);
|
|
11540
|
-
const processConfigRequest =
|
|
11179
|
+
const processConfigRequest = useCallback5((insertAfterVal) => {
|
|
11541
11180
|
const tracker = getSectionsTracker();
|
|
11542
11181
|
let entries = [];
|
|
11543
11182
|
try {
|
|
@@ -11560,7 +11199,7 @@ function OhhwellsBridge() {
|
|
|
11560
11199
|
}
|
|
11561
11200
|
window.postMessage({ type: "ow:schedule-config", insertAfter: insertAfterVal, scheduleId: null }, "*");
|
|
11562
11201
|
}, [isEditMode]);
|
|
11563
|
-
const deactivate =
|
|
11202
|
+
const deactivate = useCallback5(() => {
|
|
11564
11203
|
const el = activeElRef.current;
|
|
11565
11204
|
if (!el) return;
|
|
11566
11205
|
const key = el.dataset.ohwKey;
|
|
@@ -11593,12 +11232,12 @@ function OhhwellsBridge() {
|
|
|
11593
11232
|
setToolbarShowEditLink(false);
|
|
11594
11233
|
postToParent2({ type: "ow:exit-edit" });
|
|
11595
11234
|
}, [postToParent2]);
|
|
11596
|
-
const clearSelectedAttr =
|
|
11235
|
+
const clearSelectedAttr = useCallback5(() => {
|
|
11597
11236
|
document.querySelectorAll("[data-ohw-selected]").forEach((el) => {
|
|
11598
11237
|
el.removeAttribute("data-ohw-selected");
|
|
11599
11238
|
});
|
|
11600
11239
|
}, []);
|
|
11601
|
-
const deselect =
|
|
11240
|
+
const deselect = useCallback5(() => {
|
|
11602
11241
|
clearSelectedAttr();
|
|
11603
11242
|
selectedElRef.current = null;
|
|
11604
11243
|
selectedHrefKeyRef.current = null;
|
|
@@ -11615,19 +11254,17 @@ function OhhwellsBridge() {
|
|
|
11615
11254
|
setIsItemDragging(false);
|
|
11616
11255
|
hoveredNavContainerRef.current = null;
|
|
11617
11256
|
setHoveredNavContainerRect(null);
|
|
11618
|
-
hoveredItemElRef.current = null;
|
|
11619
|
-
setHoveredItemRect(null);
|
|
11620
11257
|
if (!activeElRef.current) {
|
|
11621
11258
|
setNavGroupForceOpen(null, false);
|
|
11622
11259
|
setToolbarRect(null);
|
|
11623
11260
|
setToolbarVariant("none");
|
|
11624
11261
|
}
|
|
11625
11262
|
}, [clearSelectedAttr]);
|
|
11626
|
-
const markSelected =
|
|
11263
|
+
const markSelected = useCallback5((el) => {
|
|
11627
11264
|
clearSelectedAttr();
|
|
11628
11265
|
el.setAttribute("data-ohw-selected", "");
|
|
11629
11266
|
}, [clearSelectedAttr]);
|
|
11630
|
-
const resolveHrefKeyElement =
|
|
11267
|
+
const resolveHrefKeyElement = useCallback5((hrefKey) => {
|
|
11631
11268
|
if (isFooterHrefKey(hrefKey)) {
|
|
11632
11269
|
return document.querySelector(
|
|
11633
11270
|
`footer [data-ohw-href-key="${CSS.escape(hrefKey)}"]`
|
|
@@ -11642,7 +11279,7 @@ function OhhwellsBridge() {
|
|
|
11642
11279
|
`[data-ohw-href-key="${CSS.escape(hrefKey)}"]`
|
|
11643
11280
|
);
|
|
11644
11281
|
}, []);
|
|
11645
|
-
const resyncSelectedNavigationItem =
|
|
11282
|
+
const resyncSelectedNavigationItem = useCallback5(() => {
|
|
11646
11283
|
const hrefKey = selectedHrefKeyRef.current;
|
|
11647
11284
|
if (hrefKey) {
|
|
11648
11285
|
const link = resolveHrefKeyElement(hrefKey);
|
|
@@ -11680,7 +11317,7 @@ function OhhwellsBridge() {
|
|
|
11680
11317
|
);
|
|
11681
11318
|
}
|
|
11682
11319
|
}, [resolveHrefKeyElement]);
|
|
11683
|
-
const reselectNavigationItem =
|
|
11320
|
+
const reselectNavigationItem = useCallback5((navAnchor) => {
|
|
11684
11321
|
selectedElRef.current = navAnchor;
|
|
11685
11322
|
selectedHrefKeyRef.current = navAnchor.getAttribute("data-ohw-href-key");
|
|
11686
11323
|
selectedFooterColAttrRef.current = null;
|
|
@@ -11709,7 +11346,7 @@ function OhhwellsBridge() {
|
|
|
11709
11346
|
setToolbarShowEditLink(false);
|
|
11710
11347
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
11711
11348
|
}, [markSelected]);
|
|
11712
|
-
const commitNavigationTextEdit =
|
|
11349
|
+
const commitNavigationTextEdit = useCallback5((navAnchor) => {
|
|
11713
11350
|
const el = activeElRef.current;
|
|
11714
11351
|
if (!el) return;
|
|
11715
11352
|
const key = el.dataset.ohwKey;
|
|
@@ -11736,7 +11373,7 @@ function OhhwellsBridge() {
|
|
|
11736
11373
|
postToParent2({ type: "ow:exit-edit" });
|
|
11737
11374
|
reselectNavigationItem(navAnchor);
|
|
11738
11375
|
}, [postToParent2, reselectNavigationItem]);
|
|
11739
|
-
const handleAddTopLevelNavItem =
|
|
11376
|
+
const handleAddTopLevelNavItem = useCallback5(() => {
|
|
11740
11377
|
const items = listNavbarRootItems();
|
|
11741
11378
|
addNavAfterAnchorRef.current = items[items.length - 1] ?? null;
|
|
11742
11379
|
deselectRef.current();
|
|
@@ -11748,7 +11385,7 @@ function OhhwellsBridge() {
|
|
|
11748
11385
|
intent: "add-nav"
|
|
11749
11386
|
});
|
|
11750
11387
|
}, []);
|
|
11751
|
-
const maybeWarnNavLinkDropdownConflict =
|
|
11388
|
+
const maybeWarnNavLinkDropdownConflict = useCallback5(
|
|
11752
11389
|
(anchor) => {
|
|
11753
11390
|
if (!isNavbarHrefKey(anchor.getAttribute("data-ohw-href-key"))) return;
|
|
11754
11391
|
if (!navDropdownsOpenOnClick()) return;
|
|
@@ -11761,7 +11398,7 @@ function OhhwellsBridge() {
|
|
|
11761
11398
|
},
|
|
11762
11399
|
[postToParent2]
|
|
11763
11400
|
);
|
|
11764
|
-
const handleNavDropdownOpenChange =
|
|
11401
|
+
const handleNavDropdownOpenChange = useCallback5((open) => {
|
|
11765
11402
|
const selected = selectedElRef.current;
|
|
11766
11403
|
if (!selected || !isNavigationItem2(selected)) return;
|
|
11767
11404
|
setNavGroupForceOpen(selected, open);
|
|
@@ -11773,7 +11410,7 @@ function OhhwellsBridge() {
|
|
|
11773
11410
|
}
|
|
11774
11411
|
});
|
|
11775
11412
|
}, []);
|
|
11776
|
-
const handleFooterHeadingVisibleChange =
|
|
11413
|
+
const handleFooterHeadingVisibleChange = useCallback5(
|
|
11777
11414
|
(visible) => {
|
|
11778
11415
|
const selected = selectedElRef.current;
|
|
11779
11416
|
if (!selected || !isFooterFrameSelectionRef.current) return;
|
|
@@ -11797,7 +11434,7 @@ function OhhwellsBridge() {
|
|
|
11797
11434
|
},
|
|
11798
11435
|
[postToParent2]
|
|
11799
11436
|
);
|
|
11800
|
-
const enterEditOnNewItem =
|
|
11437
|
+
const enterEditOnNewItem = useCallback5((anchor) => {
|
|
11801
11438
|
const label = anchor.querySelector('[data-ohw-editable="text"]');
|
|
11802
11439
|
if (!label) {
|
|
11803
11440
|
selectRef.current(anchor);
|
|
@@ -11806,7 +11443,7 @@ function OhhwellsBridge() {
|
|
|
11806
11443
|
setNavGroupForceOpen(anchor, true);
|
|
11807
11444
|
activateRef.current(label);
|
|
11808
11445
|
}, []);
|
|
11809
|
-
const handleAddChildItem =
|
|
11446
|
+
const handleAddChildItem = useCallback5(() => {
|
|
11810
11447
|
const selected = selectedElRef.current;
|
|
11811
11448
|
if (!selected) return;
|
|
11812
11449
|
if (toolbarVariantRef.current === "select-frame" && isFooterFrameSelection) {
|
|
@@ -11882,7 +11519,7 @@ function OhhwellsBridge() {
|
|
|
11882
11519
|
enterEditOnNewItem(result.anchor);
|
|
11883
11520
|
});
|
|
11884
11521
|
}, [enterEditOnNewItem, isFooterFrameSelection, maybeWarnNavLinkDropdownConflict, postToParent2]);
|
|
11885
|
-
const handleAddFooterColumn =
|
|
11522
|
+
const handleAddFooterColumn = useCallback5(() => {
|
|
11886
11523
|
if (!canAddFooterColumn()) {
|
|
11887
11524
|
postToParent2({
|
|
11888
11525
|
type: "ow:toast",
|
|
@@ -11903,7 +11540,7 @@ function OhhwellsBridge() {
|
|
|
11903
11540
|
selectRef.current(result.firstLink);
|
|
11904
11541
|
});
|
|
11905
11542
|
}, [postToParent2]);
|
|
11906
|
-
const clearFooterDragVisuals =
|
|
11543
|
+
const clearFooterDragVisuals = useCallback5(() => {
|
|
11907
11544
|
footerDragRef.current = null;
|
|
11908
11545
|
setSiblingHintRects([]);
|
|
11909
11546
|
setFooterDropSlots([]);
|
|
@@ -11912,7 +11549,7 @@ function OhhwellsBridge() {
|
|
|
11912
11549
|
setIsItemDragging(false);
|
|
11913
11550
|
unlockFooterDragInteraction();
|
|
11914
11551
|
}, []);
|
|
11915
|
-
const refreshFooterDragVisuals =
|
|
11552
|
+
const refreshFooterDragVisuals = useCallback5((session, activeSlot, clientX, clientY) => {
|
|
11916
11553
|
const dragged = session.draggedEl;
|
|
11917
11554
|
setDraggedItemRect(dragged.getBoundingClientRect());
|
|
11918
11555
|
if (typeof clientX === "number" && typeof clientY === "number") {
|
|
@@ -11937,13 +11574,13 @@ function OhhwellsBridge() {
|
|
|
11937
11574
|
const activeIdx = activeSlot ? slots.findIndex((s) => s.insertIndex === activeSlot.insertIndex) : -1;
|
|
11938
11575
|
setActiveFooterDropIndex(activeIdx >= 0 ? activeIdx : null);
|
|
11939
11576
|
}, []);
|
|
11940
|
-
const refreshFooterDragVisualsRef =
|
|
11577
|
+
const refreshFooterDragVisualsRef = useRef7(refreshFooterDragVisuals);
|
|
11941
11578
|
refreshFooterDragVisualsRef.current = refreshFooterDragVisuals;
|
|
11942
|
-
const commitFooterDragRef =
|
|
11579
|
+
const commitFooterDragRef = useRef7(() => {
|
|
11943
11580
|
});
|
|
11944
|
-
const beginFooterDragRef =
|
|
11581
|
+
const beginFooterDragRef = useRef7(() => {
|
|
11945
11582
|
});
|
|
11946
|
-
const beginFooterDrag =
|
|
11583
|
+
const beginFooterDrag = useCallback5(
|
|
11947
11584
|
(session) => {
|
|
11948
11585
|
const rect = session.draggedEl.getBoundingClientRect();
|
|
11949
11586
|
session.lastClientX = session.lastClientX || rect.left + rect.width / 2;
|
|
@@ -11963,7 +11600,7 @@ function OhhwellsBridge() {
|
|
|
11963
11600
|
[refreshFooterDragVisuals]
|
|
11964
11601
|
);
|
|
11965
11602
|
beginFooterDragRef.current = beginFooterDrag;
|
|
11966
|
-
const commitFooterDrag =
|
|
11603
|
+
const commitFooterDrag = useCallback5(
|
|
11967
11604
|
(clientX, clientY) => {
|
|
11968
11605
|
const session = footerDragRef.current;
|
|
11969
11606
|
if (!session) {
|
|
@@ -12067,7 +11704,7 @@ function OhhwellsBridge() {
|
|
|
12067
11704
|
[clearFooterDragVisuals, resolveHrefKeyElement, resyncSelectedNavigationItem]
|
|
12068
11705
|
);
|
|
12069
11706
|
commitFooterDragRef.current = commitFooterDrag;
|
|
12070
|
-
const startFooterLinkDrag =
|
|
11707
|
+
const startFooterLinkDrag = useCallback5(
|
|
12071
11708
|
(anchor, clientX, clientY, wasSelected) => {
|
|
12072
11709
|
const hrefKey = anchor.getAttribute("data-ohw-href-key");
|
|
12073
11710
|
if (!hrefKey || !isFooterHrefKey(hrefKey)) return false;
|
|
@@ -12088,7 +11725,7 @@ function OhhwellsBridge() {
|
|
|
12088
11725
|
},
|
|
12089
11726
|
[beginFooterDrag]
|
|
12090
11727
|
);
|
|
12091
|
-
const startFooterColumnDrag =
|
|
11728
|
+
const startFooterColumnDrag = useCallback5(
|
|
12092
11729
|
(columnEl, clientX, clientY, wasSelected) => {
|
|
12093
11730
|
const columns = listFooterColumns();
|
|
12094
11731
|
const idx = columns.indexOf(columnEl);
|
|
@@ -12108,7 +11745,7 @@ function OhhwellsBridge() {
|
|
|
12108
11745
|
},
|
|
12109
11746
|
[beginFooterDrag]
|
|
12110
11747
|
);
|
|
12111
|
-
const handleItemDragStart =
|
|
11748
|
+
const handleItemDragStart = useCallback5(
|
|
12112
11749
|
(e) => {
|
|
12113
11750
|
const selected = selectedElRef.current;
|
|
12114
11751
|
if (!selected) {
|
|
@@ -12128,7 +11765,7 @@ function OhhwellsBridge() {
|
|
|
12128
11765
|
},
|
|
12129
11766
|
[startFooterColumnDrag, startFooterLinkDrag, startNavLinkDrag]
|
|
12130
11767
|
);
|
|
12131
|
-
const handleItemDragEnd =
|
|
11768
|
+
const handleItemDragEnd = useCallback5(
|
|
12132
11769
|
(e) => {
|
|
12133
11770
|
if (footerDragRef.current) {
|
|
12134
11771
|
const x = e?.clientX;
|
|
@@ -12154,7 +11791,7 @@ function OhhwellsBridge() {
|
|
|
12154
11791
|
},
|
|
12155
11792
|
[commitFooterDrag, commitNavDrag, navDragRef]
|
|
12156
11793
|
);
|
|
12157
|
-
const handleItemChromePointerDown =
|
|
11794
|
+
const handleItemChromePointerDown = useCallback5((e) => {
|
|
12158
11795
|
if (e.button !== 0) return;
|
|
12159
11796
|
const selected = selectedElRef.current;
|
|
12160
11797
|
if (!selected) return;
|
|
@@ -12185,7 +11822,7 @@ function OhhwellsBridge() {
|
|
|
12185
11822
|
}
|
|
12186
11823
|
if (armNavPressFromChrome(selected, e.clientX, e.clientY, e.pointerId)) return;
|
|
12187
11824
|
}, [armNavPressFromChrome]);
|
|
12188
|
-
const handleItemChromeClick =
|
|
11825
|
+
const handleItemChromeClick = useCallback5((clientX, clientY) => {
|
|
12189
11826
|
if (suppressNextClickRef.current || Date.now() < suppressClickUntilRef.current) {
|
|
12190
11827
|
suppressNextClickRef.current = false;
|
|
12191
11828
|
return;
|
|
@@ -12198,10 +11835,9 @@ function OhhwellsBridge() {
|
|
|
12198
11835
|
}, []);
|
|
12199
11836
|
reselectNavigationItemRef.current = reselectNavigationItem;
|
|
12200
11837
|
commitNavigationTextEditRef.current = commitNavigationTextEdit;
|
|
12201
|
-
const select =
|
|
11838
|
+
const select = useCallback5((anchor) => {
|
|
12202
11839
|
if (!isNavigationItem2(anchor)) return;
|
|
12203
11840
|
if (activeElRef.current) deactivate();
|
|
12204
|
-
aiSectionApiRef.current?.selectFromElement(anchor);
|
|
12205
11841
|
selectedElRef.current = anchor;
|
|
12206
11842
|
selectedHrefKeyRef.current = anchor.getAttribute("data-ohw-href-key");
|
|
12207
11843
|
selectedFooterColAttrRef.current = null;
|
|
@@ -12237,10 +11873,9 @@ function OhhwellsBridge() {
|
|
|
12237
11873
|
setToolbarShowEditLink(false);
|
|
12238
11874
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
12239
11875
|
}, [deactivate, markSelected]);
|
|
12240
|
-
const selectFrame =
|
|
11876
|
+
const selectFrame = useCallback5((el) => {
|
|
12241
11877
|
if (!isNavigationContainer(el)) return;
|
|
12242
11878
|
if (activeElRef.current) deactivate();
|
|
12243
|
-
aiSectionApiRef.current?.selectFromElement(el);
|
|
12244
11879
|
const isFooterColumn = !isFooterLinksContainer(el) && (el.hasAttribute("data-ohw-footer-col") || Boolean(el.closest("footer") && isInferredFooterGroup2(el)));
|
|
12245
11880
|
selectedElRef.current = el;
|
|
12246
11881
|
selectedHrefKeyRef.current = null;
|
|
@@ -12284,7 +11919,7 @@ function OhhwellsBridge() {
|
|
|
12284
11919
|
setToolbarShowEditLink(false);
|
|
12285
11920
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
12286
11921
|
}, [deactivate, markSelected, postToParent2]);
|
|
12287
|
-
const activate =
|
|
11922
|
+
const activate = useCallback5((el, options) => {
|
|
12288
11923
|
if (activeElRef.current === el) return;
|
|
12289
11924
|
clearSelectedAttr();
|
|
12290
11925
|
selectedElRef.current = null;
|
|
@@ -12345,15 +11980,7 @@ function OhhwellsBridge() {
|
|
|
12345
11980
|
setReorderDragDisabled(reorderDisabled);
|
|
12346
11981
|
}
|
|
12347
11982
|
setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
12348
|
-
|
|
12349
|
-
postToParent2({
|
|
12350
|
-
type: "ow:enter-edit",
|
|
12351
|
-
key: el.dataset.ohwKey,
|
|
12352
|
-
// Section the edited element belongs to, so the editor can scope AI prompts to it.
|
|
12353
|
-
sectionId: sectionEl?.dataset.ohwSection ?? null,
|
|
12354
|
-
sectionLabel: sectionEl?.dataset.ohwSectionLabel ?? null
|
|
12355
|
-
});
|
|
12356
|
-
aiSectionApiRef.current?.selectFromElement(el, { report: false });
|
|
11983
|
+
postToParent2({ type: "ow:enter-edit", key: el.dataset.ohwKey });
|
|
12357
11984
|
requestAnimationFrame(() => refreshActiveCommandsRef.current());
|
|
12358
11985
|
}, [clearSelectedAttr, deactivate, postToParent2]);
|
|
12359
11986
|
activateRef.current = activate;
|
|
@@ -12361,33 +11988,6 @@ function OhhwellsBridge() {
|
|
|
12361
11988
|
selectRef.current = select;
|
|
12362
11989
|
selectFrameRef.current = selectFrame;
|
|
12363
11990
|
deselectRef.current = deselect;
|
|
12364
|
-
const lastSiteWideScopeRef = useRef8(null);
|
|
12365
|
-
useEffect10(() => {
|
|
12366
|
-
if (!isEditMode) {
|
|
12367
|
-
if (lastSiteWideScopeRef.current !== false) {
|
|
12368
|
-
lastSiteWideScopeRef.current = false;
|
|
12369
|
-
postToParent2({ type: "ow:site-wide-scope", active: false });
|
|
12370
|
-
}
|
|
12371
|
-
return;
|
|
12372
|
-
}
|
|
12373
|
-
const active = isSiteWideScopeActive({
|
|
12374
|
-
selected: selectedElRef.current,
|
|
12375
|
-
hoveredItem: hoveredItemElRef.current,
|
|
12376
|
-
hoveredNavContainer: hoveredNavContainerRef.current,
|
|
12377
|
-
active: activeElRef.current
|
|
12378
|
-
});
|
|
12379
|
-
if (lastSiteWideScopeRef.current === active) return;
|
|
12380
|
-
lastSiteWideScopeRef.current = active;
|
|
12381
|
-
postToParent2({ type: "ow:site-wide-scope", active });
|
|
12382
|
-
}, [
|
|
12383
|
-
isEditMode,
|
|
12384
|
-
hoveredItemRect,
|
|
12385
|
-
hoveredNavContainerRect,
|
|
12386
|
-
toolbarVariant,
|
|
12387
|
-
toolbarRect,
|
|
12388
|
-
isFooterFrameSelection,
|
|
12389
|
-
postToParent2
|
|
12390
|
-
]);
|
|
12391
11991
|
useLayoutEffect3(() => {
|
|
12392
11992
|
if (!subdomain || isEditMode) {
|
|
12393
11993
|
setFetchState("done");
|
|
@@ -12459,7 +12059,7 @@ function OhhwellsBridge() {
|
|
|
12459
12059
|
cancelled = true;
|
|
12460
12060
|
};
|
|
12461
12061
|
}, [subdomain, isEditMode]);
|
|
12462
|
-
|
|
12062
|
+
useEffect9(() => {
|
|
12463
12063
|
if (!subdomain || isEditMode) return;
|
|
12464
12064
|
let debounceTimer = null;
|
|
12465
12065
|
let observer = null;
|
|
@@ -12516,10 +12116,10 @@ function OhhwellsBridge() {
|
|
|
12516
12116
|
const visible = Boolean(subdomain) && fetchState !== "done";
|
|
12517
12117
|
el.style.display = visible ? "flex" : "none";
|
|
12518
12118
|
}, [subdomain, fetchState]);
|
|
12519
|
-
|
|
12119
|
+
useEffect9(() => {
|
|
12520
12120
|
postToParent2({ type: "ow:navigation", path: pathname });
|
|
12521
12121
|
}, [pathname, postToParent2]);
|
|
12522
|
-
|
|
12122
|
+
useEffect9(() => {
|
|
12523
12123
|
if (!isEditMode) return;
|
|
12524
12124
|
if (linkPopoverSessionRef.current?.intent === "add-nav") return;
|
|
12525
12125
|
if (document.querySelector("[data-ohw-section-picker]")) return;
|
|
@@ -12527,7 +12127,7 @@ function OhhwellsBridge() {
|
|
|
12527
12127
|
deselectRef.current();
|
|
12528
12128
|
deactivateRef.current();
|
|
12529
12129
|
}, [pathname, isEditMode]);
|
|
12530
|
-
|
|
12130
|
+
useEffect9(() => {
|
|
12531
12131
|
const contentForNav = () => {
|
|
12532
12132
|
if (isEditMode) return editContentRef.current;
|
|
12533
12133
|
if (!subdomain) return {};
|
|
@@ -12592,7 +12192,7 @@ function OhhwellsBridge() {
|
|
|
12592
12192
|
observer?.disconnect();
|
|
12593
12193
|
};
|
|
12594
12194
|
}, [isEditMode, pathname, subdomain, fetchState, resyncSelectedNavigationItem]);
|
|
12595
|
-
|
|
12195
|
+
useEffect9(() => {
|
|
12596
12196
|
if (!isEditMode) return;
|
|
12597
12197
|
const measure = () => {
|
|
12598
12198
|
const h = document.body.scrollHeight;
|
|
@@ -12616,7 +12216,7 @@ function OhhwellsBridge() {
|
|
|
12616
12216
|
window.removeEventListener("resize", handleResize);
|
|
12617
12217
|
};
|
|
12618
12218
|
}, [pathname, isEditMode, postToParent2]);
|
|
12619
|
-
|
|
12219
|
+
useEffect9(() => {
|
|
12620
12220
|
if (!subdomainFromQuery || isEditMode) return;
|
|
12621
12221
|
const handleClick = (e) => {
|
|
12622
12222
|
const anchor = e.target.closest("a");
|
|
@@ -12632,7 +12232,7 @@ function OhhwellsBridge() {
|
|
|
12632
12232
|
document.addEventListener("click", handleClick, true);
|
|
12633
12233
|
return () => document.removeEventListener("click", handleClick, true);
|
|
12634
12234
|
}, [subdomainFromQuery, isEditMode, router]);
|
|
12635
|
-
|
|
12235
|
+
useEffect9(() => {
|
|
12636
12236
|
if (!isEditMode) {
|
|
12637
12237
|
editStylesRef.current?.base.remove();
|
|
12638
12238
|
editStylesRef.current?.forceHover.remove();
|
|
@@ -12684,7 +12284,7 @@ function OhhwellsBridge() {
|
|
|
12684
12284
|
[data-ohw-editable="bg-image"], [data-ohw-editable="bg-image"] * { cursor: pointer !important; }
|
|
12685
12285
|
[data-ohw-editable="link"], [data-ohw-editable="link"] * { cursor: pointer !important; }
|
|
12686
12286
|
[data-ohw-hovered]:not([contenteditable]):not([data-ohw-href-key]) {
|
|
12687
|
-
outline: 2px dashed ${
|
|
12287
|
+
outline: 2px dashed ${PRIMARY2} !important;
|
|
12688
12288
|
outline-offset: 4px;
|
|
12689
12289
|
}
|
|
12690
12290
|
[data-ohw-href-key] [data-ohw-hovered],
|
|
@@ -12719,11 +12319,11 @@ function OhhwellsBridge() {
|
|
|
12719
12319
|
footer [data-ohw-href-key] [data-ohw-editable][contenteditable],
|
|
12720
12320
|
footer [data-ohw-href-key] [data-ohw-editable][contenteditable] * {
|
|
12721
12321
|
outline: none !important;
|
|
12722
|
-
caret-color: ${
|
|
12322
|
+
caret-color: ${PRIMARY2} !important;
|
|
12723
12323
|
cursor: text !important;
|
|
12724
12324
|
}
|
|
12725
12325
|
[data-ohw-editable][contenteditable]::selection,
|
|
12726
|
-
[data-ohw-editable][contenteditable] *::selection { background: ${
|
|
12326
|
+
[data-ohw-editable][contenteditable] *::selection { background: ${PRIMARY2}59 !important; }
|
|
12727
12327
|
[data-ohw-editable-state], [data-ohw-editable-state] * { pointer-events: none !important; }
|
|
12728
12328
|
[data-ohw-editable-state][data-ohw-active-state] [data-ohw-editable] { pointer-events: auto !important; }
|
|
12729
12329
|
[data-ohw-editable-state][data-ohw-active-state][data-ohw-editable] { pointer-events: auto !important; }
|
|
@@ -12738,7 +12338,7 @@ function OhhwellsBridge() {
|
|
|
12738
12338
|
stateViews.textContent = `
|
|
12739
12339
|
[data-ohw-state-view]:not([data-ohw-state-view="default"]) { display: none; }
|
|
12740
12340
|
[data-ohw-state-view="default"] [data-ohw-editable] { pointer-events: auto !important; }
|
|
12741
|
-
[data-ohw-state-hovered] { outline: 2px dashed ${
|
|
12341
|
+
[data-ohw-state-hovered] { outline: 2px dashed ${PRIMARY2} !important; outline-offset: 4px; }
|
|
12742
12342
|
[data-ohw-state-hovered]:has([data-ohw-hovered]) { outline: none !important; }
|
|
12743
12343
|
`;
|
|
12744
12344
|
document.head.appendChild(base);
|
|
@@ -12762,10 +12362,6 @@ function OhhwellsBridge() {
|
|
|
12762
12362
|
if (target.closest("[data-ohw-max-badge]")) return;
|
|
12763
12363
|
if (isInsideLinkEditor(target)) return;
|
|
12764
12364
|
if (target.closest('[data-ohw-edit-chrome], [data-ohw-item-interaction], [data-ohw-drag-handle-container], [data-slot="drag-handle"]')) {
|
|
12765
|
-
const beneath = document.elementsFromPoint(e.clientX, e.clientY).find(
|
|
12766
|
-
(el) => el instanceof HTMLElement && !el.closest("[data-ohw-bridge-root]") && el.closest("[data-ohw-section]") != null
|
|
12767
|
-
);
|
|
12768
|
-
if (beneath) aiSectionApiRef.current?.selectFromElement(beneath);
|
|
12769
12365
|
if (target.closest("[data-ohw-item-drag-surface]")) {
|
|
12770
12366
|
e.preventDefault();
|
|
12771
12367
|
e.stopPropagation();
|
|
@@ -12824,21 +12420,11 @@ function OhhwellsBridge() {
|
|
|
12824
12420
|
return;
|
|
12825
12421
|
}
|
|
12826
12422
|
}
|
|
12827
|
-
const logoEl = getLogoElement(target);
|
|
12828
|
-
if (logoEl) {
|
|
12829
|
-
e.preventDefault();
|
|
12830
|
-
e.stopPropagation();
|
|
12831
|
-
deselectRef.current();
|
|
12832
|
-
deactivateRef.current();
|
|
12833
|
-
postToParentRef.current({ type: "ow:open-logo-settings" });
|
|
12834
|
-
return;
|
|
12835
|
-
}
|
|
12836
12423
|
const editable = target.closest("[data-ohw-editable]");
|
|
12837
12424
|
if (editable) {
|
|
12838
12425
|
if (editable.dataset.ohwEditable === "link") {
|
|
12839
12426
|
e.preventDefault();
|
|
12840
12427
|
e.stopPropagation();
|
|
12841
|
-
aiSectionApiRef.current?.selectFromElement(editable);
|
|
12842
12428
|
deselectRef.current();
|
|
12843
12429
|
deactivateRef.current();
|
|
12844
12430
|
bumpLinkPopoverGrace();
|
|
@@ -12852,7 +12438,6 @@ function OhhwellsBridge() {
|
|
|
12852
12438
|
if (isMediaEditable(editable)) {
|
|
12853
12439
|
e.preventDefault();
|
|
12854
12440
|
e.stopPropagation();
|
|
12855
|
-
aiSectionApiRef.current?.selectFromElement(editable);
|
|
12856
12441
|
postToParentRef.current({ type: "ow:image-pick", key: editable.dataset.ohwKey ?? "", elementType: editable.dataset.ohwEditable ?? "image" });
|
|
12857
12442
|
return;
|
|
12858
12443
|
}
|
|
@@ -12955,7 +12540,6 @@ function OhhwellsBridge() {
|
|
|
12955
12540
|
closeLinkPopoverRef.current();
|
|
12956
12541
|
return;
|
|
12957
12542
|
}
|
|
12958
|
-
aiSectionApiRef.current?.handleBackgroundClick(target, e.clientX, e.clientY);
|
|
12959
12543
|
deselectRef.current();
|
|
12960
12544
|
deactivateRef.current();
|
|
12961
12545
|
};
|
|
@@ -12998,7 +12582,7 @@ function OhhwellsBridge() {
|
|
|
12998
12582
|
const allowFooterLinksHover = toolbarVariantRef.current !== "select-frame" || selectedIsFooterColumn;
|
|
12999
12583
|
if (allowNavContainerHover) {
|
|
13000
12584
|
const navContainer = target.closest("[data-ohw-nav-container]");
|
|
13001
|
-
if (navContainer && !getNavigationItemAnchor(target)
|
|
12585
|
+
if (navContainer && !getNavigationItemAnchor(target)) {
|
|
13002
12586
|
hoveredNavContainerRef.current = navContainer;
|
|
13003
12587
|
setHoveredNavContainerRect(navContainer.getBoundingClientRect());
|
|
13004
12588
|
hoveredItemElRef.current = null;
|
|
@@ -13027,15 +12611,6 @@ function OhhwellsBridge() {
|
|
|
13027
12611
|
setHoveredNavContainerRect(null);
|
|
13028
12612
|
}
|
|
13029
12613
|
}
|
|
13030
|
-
const logoEl = getLogoElement(target);
|
|
13031
|
-
if (logoEl) {
|
|
13032
|
-
hoveredNavContainerRef.current = null;
|
|
13033
|
-
setHoveredNavContainerRect(null);
|
|
13034
|
-
if (selectedElRef.current === logoEl) return;
|
|
13035
|
-
hoveredItemElRef.current = logoEl;
|
|
13036
|
-
setHoveredItemRect(logoEl.getBoundingClientRect());
|
|
13037
|
-
return;
|
|
13038
|
-
}
|
|
13039
12614
|
const navAnchor = getNavigationItemAnchor(target);
|
|
13040
12615
|
if (navAnchor) {
|
|
13041
12616
|
hoveredNavContainerRef.current = null;
|
|
@@ -13068,12 +12643,6 @@ function OhhwellsBridge() {
|
|
|
13068
12643
|
setHoveredItemRect(hoverTarget.getBoundingClientRect());
|
|
13069
12644
|
} else if (!isInsideNavigationItem(editable)) {
|
|
13070
12645
|
hoverTarget.setAttribute("data-ohw-hovered", "");
|
|
13071
|
-
if (editable.closest("footer") || editable.closest('[data-ohw-section="footer"]')) {
|
|
13072
|
-
hoveredNavContainerRef.current = null;
|
|
13073
|
-
setHoveredNavContainerRect(null);
|
|
13074
|
-
hoveredItemElRef.current = editable;
|
|
13075
|
-
setHoveredItemRect(editable.getBoundingClientRect());
|
|
13076
|
-
}
|
|
13077
12646
|
}
|
|
13078
12647
|
}
|
|
13079
12648
|
};
|
|
@@ -13109,18 +12678,6 @@ function OhhwellsBridge() {
|
|
|
13109
12678
|
}
|
|
13110
12679
|
return;
|
|
13111
12680
|
}
|
|
13112
|
-
const logoEl = getLogoElement(target);
|
|
13113
|
-
if (logoEl) {
|
|
13114
|
-
const related2 = e.relatedTarget instanceof Element ? e.relatedTarget : null;
|
|
13115
|
-
if (related2 && (logoEl === related2 || logoEl.contains(related2) || related2.closest?.('[data-ohw-role="logo"], [data-ohw-logo]'))) {
|
|
13116
|
-
return;
|
|
13117
|
-
}
|
|
13118
|
-
if (hoveredItemElRef.current === logoEl) {
|
|
13119
|
-
hoveredItemElRef.current = null;
|
|
13120
|
-
setHoveredItemRect(null);
|
|
13121
|
-
}
|
|
13122
|
-
return;
|
|
13123
|
-
}
|
|
13124
12681
|
const editable = target.closest("[data-ohw-editable]");
|
|
13125
12682
|
if (!editable) return;
|
|
13126
12683
|
const related = e.relatedTarget instanceof Element ? e.relatedTarget : null;
|
|
@@ -13134,13 +12691,6 @@ function OhhwellsBridge() {
|
|
|
13134
12691
|
}
|
|
13135
12692
|
} else {
|
|
13136
12693
|
hoverTarget.removeAttribute("data-ohw-hovered");
|
|
13137
|
-
if (hoveredItemElRef.current === editable) {
|
|
13138
|
-
const stillOnEditable = related instanceof Element && related.closest("[data-ohw-editable]") === editable;
|
|
13139
|
-
if (!stillOnEditable) {
|
|
13140
|
-
hoveredItemElRef.current = null;
|
|
13141
|
-
setHoveredItemRect(null);
|
|
13142
|
-
}
|
|
13143
|
-
}
|
|
13144
12694
|
}
|
|
13145
12695
|
}
|
|
13146
12696
|
};
|
|
@@ -13257,26 +12807,6 @@ function OhhwellsBridge() {
|
|
|
13257
12807
|
hoveredNavContainerRef.current = null;
|
|
13258
12808
|
setHoveredNavContainerRect(null);
|
|
13259
12809
|
}
|
|
13260
|
-
const logoCandidates = [
|
|
13261
|
-
...document.querySelectorAll('[data-ohw-role="logo"], [data-ohw-logo]'),
|
|
13262
|
-
...document.querySelectorAll("nav a:not([data-ohw-href-key]), [data-ohw-nav-root] a:not([data-ohw-href-key])"),
|
|
13263
|
-
...document.querySelectorAll("footer img")
|
|
13264
|
-
];
|
|
13265
|
-
const seenLogos = /* @__PURE__ */ new Set();
|
|
13266
|
-
for (const candidate of logoCandidates) {
|
|
13267
|
-
const logo = getLogoElement(candidate);
|
|
13268
|
-
if (!logo || seenLogos.has(logo)) continue;
|
|
13269
|
-
seenLogos.add(logo);
|
|
13270
|
-
const r2 = logo.getBoundingClientRect();
|
|
13271
|
-
if (x < r2.left || x > r2.right || y < r2.top || y > r2.bottom) continue;
|
|
13272
|
-
hoveredNavContainerRef.current = null;
|
|
13273
|
-
setHoveredNavContainerRect(null);
|
|
13274
|
-
if (selectedElRef.current !== logo) {
|
|
13275
|
-
hoveredItemElRef.current = logo;
|
|
13276
|
-
setHoveredItemRect(logo.getBoundingClientRect());
|
|
13277
|
-
}
|
|
13278
|
-
return;
|
|
13279
|
-
}
|
|
13280
12810
|
const navContainers = Array.from(
|
|
13281
12811
|
document.querySelectorAll("[data-ohw-nav-container]")
|
|
13282
12812
|
);
|
|
@@ -14177,25 +13707,6 @@ function OhhwellsBridge() {
|
|
|
14177
13707
|
const h = document.documentElement.scrollHeight;
|
|
14178
13708
|
if (h > 50) postToParentRef.current({ type: "ow:height", height: h });
|
|
14179
13709
|
};
|
|
14180
|
-
const handleCollectSection = (e) => {
|
|
14181
|
-
if (e.data?.type !== "ow:collect-section") return;
|
|
14182
|
-
const sectionId = e.data.sectionId;
|
|
14183
|
-
if (typeof sectionId !== "string" || !sectionId) return;
|
|
14184
|
-
const sectionEl = document.querySelector(
|
|
14185
|
-
`[data-ohw-section="${CSS.escape(sectionId)}"]`
|
|
14186
|
-
);
|
|
14187
|
-
const nodes = sectionEl ? collectEditableNodes(void 0, sectionEl).filter(
|
|
14188
|
-
(n) => n.key && !n.key.startsWith("__ohw_") && !["meta", "sections", "carousel", "video-setting"].includes(n.type)
|
|
14189
|
-
).map((n) => ({ ...n, text: n.text ?? "", type: normalizeAiNodeType(n.type) })) : [];
|
|
14190
|
-
const box = sectionEl?.getBoundingClientRect();
|
|
14191
|
-
const rect = box ? {
|
|
14192
|
-
top: box.top + window.scrollY,
|
|
14193
|
-
left: box.left + window.scrollX,
|
|
14194
|
-
width: box.width,
|
|
14195
|
-
height: box.height
|
|
14196
|
-
} : null;
|
|
14197
|
-
postToParentRef.current({ type: "ow:section-nodes", sectionId, found: !!sectionEl, nodes, rect });
|
|
14198
|
-
};
|
|
14199
13710
|
let selectionChangeRaf = null;
|
|
14200
13711
|
const runSelectionChange = () => {
|
|
14201
13712
|
selectionChangeRaf = null;
|
|
@@ -14357,19 +13868,6 @@ function OhhwellsBridge() {
|
|
|
14357
13868
|
postToParentRef.current({ type: "ow:image-pick", key: stateCardImage.dataset.ohwKey ?? "", elementType: stateCardImage.dataset.ohwEditable ?? "image" });
|
|
14358
13869
|
return;
|
|
14359
13870
|
}
|
|
14360
|
-
const logoAtPoint = Array.from(
|
|
14361
|
-
document.querySelectorAll('[data-ohw-role="logo"], [data-ohw-logo]')
|
|
14362
|
-
).map((el) => getLogoElement(el)).find((logo) => {
|
|
14363
|
-
if (!logo) return false;
|
|
14364
|
-
const r2 = logo.getBoundingClientRect();
|
|
14365
|
-
return clientX >= r2.left && clientX <= r2.right && clientY >= r2.top && clientY <= r2.bottom;
|
|
14366
|
-
});
|
|
14367
|
-
if (logoAtPoint) {
|
|
14368
|
-
deselectRef.current();
|
|
14369
|
-
deactivateRef.current();
|
|
14370
|
-
postToParentRef.current({ type: "ow:open-logo-settings" });
|
|
14371
|
-
return;
|
|
14372
|
-
}
|
|
14373
13871
|
const textEditable = Array.from(
|
|
14374
13872
|
document.querySelectorAll(NON_MEDIA_SELECTOR)
|
|
14375
13873
|
).find((el) => {
|
|
@@ -14421,7 +13919,6 @@ function OhhwellsBridge() {
|
|
|
14421
13919
|
selectFrameRef.current(footerColumn);
|
|
14422
13920
|
return;
|
|
14423
13921
|
}
|
|
14424
|
-
aiSectionApiRef.current?.handleBackgroundClick(e.target, clientX, clientY);
|
|
14425
13922
|
deactivateRef.current();
|
|
14426
13923
|
};
|
|
14427
13924
|
window.addEventListener("message", handleSave);
|
|
@@ -14430,7 +13927,6 @@ function OhhwellsBridge() {
|
|
|
14430
13927
|
window.addEventListener("message", handleScheduleLinked);
|
|
14431
13928
|
window.addEventListener("message", handleClearSchedulingWidget);
|
|
14432
13929
|
window.addEventListener("message", handleRemoveSchedulingSection);
|
|
14433
|
-
window.addEventListener("message", handleCollectSection);
|
|
14434
13930
|
window.addEventListener("message", handleImageUrl);
|
|
14435
13931
|
window.addEventListener("message", handleImageUploading);
|
|
14436
13932
|
window.addEventListener("message", handleCarouselChange);
|
|
@@ -14481,7 +13977,6 @@ function OhhwellsBridge() {
|
|
|
14481
13977
|
window.removeEventListener("message", handleScheduleLinked);
|
|
14482
13978
|
window.removeEventListener("message", handleClearSchedulingWidget);
|
|
14483
13979
|
window.removeEventListener("message", handleRemoveSchedulingSection);
|
|
14484
|
-
window.removeEventListener("message", handleCollectSection);
|
|
14485
13980
|
window.removeEventListener("message", handleImageUrl);
|
|
14486
13981
|
window.removeEventListener("message", handleImageUploading);
|
|
14487
13982
|
window.removeEventListener("message", handleCarouselChange);
|
|
@@ -14500,7 +13995,7 @@ function OhhwellsBridge() {
|
|
|
14500
13995
|
if (imageShowTimerRef.current) clearTimeout(imageShowTimerRef.current);
|
|
14501
13996
|
};
|
|
14502
13997
|
}, [isEditMode, refreshStateRules]);
|
|
14503
|
-
|
|
13998
|
+
useEffect9(() => {
|
|
14504
13999
|
if (!isEditMode) return;
|
|
14505
14000
|
const THRESHOLD = 10;
|
|
14506
14001
|
const resolveWasSelected = (el) => {
|
|
@@ -14654,7 +14149,7 @@ function OhhwellsBridge() {
|
|
|
14654
14149
|
unlockFooterDragInteraction();
|
|
14655
14150
|
};
|
|
14656
14151
|
}, [isEditMode]);
|
|
14657
|
-
|
|
14152
|
+
useEffect9(() => {
|
|
14658
14153
|
const handler = (e) => {
|
|
14659
14154
|
if (e.data?.type !== "ow:request-schedule-config") return;
|
|
14660
14155
|
const insertAfterVal = e.data.insertAfter;
|
|
@@ -14670,7 +14165,7 @@ function OhhwellsBridge() {
|
|
|
14670
14165
|
window.addEventListener("message", handler);
|
|
14671
14166
|
return () => window.removeEventListener("message", handler);
|
|
14672
14167
|
}, [processConfigRequest]);
|
|
14673
|
-
|
|
14168
|
+
useEffect9(() => {
|
|
14674
14169
|
if (!isEditMode) return;
|
|
14675
14170
|
document.querySelectorAll("[data-ohw-active-state]").forEach((el) => {
|
|
14676
14171
|
el.removeAttribute("data-ohw-active-state");
|
|
@@ -14694,7 +14189,6 @@ function OhhwellsBridge() {
|
|
|
14694
14189
|
postToParent2({
|
|
14695
14190
|
type: "ow:ready",
|
|
14696
14191
|
version: "1",
|
|
14697
|
-
bridgeVersion: "0.1.51",
|
|
14698
14192
|
path: pathname,
|
|
14699
14193
|
nodes: collectEditableNodes(editContentRef.current),
|
|
14700
14194
|
sections
|
|
@@ -14706,13 +14200,13 @@ function OhhwellsBridge() {
|
|
|
14706
14200
|
clearTimeout(timer);
|
|
14707
14201
|
};
|
|
14708
14202
|
}, [pathname, isEditMode, refreshStateRules, postToParent2]);
|
|
14709
|
-
|
|
14203
|
+
useEffect9(() => {
|
|
14710
14204
|
scrollToHashSectionWhenReady();
|
|
14711
14205
|
const onHashChange = () => scrollToHashSectionWhenReady();
|
|
14712
14206
|
window.addEventListener("hashchange", onHashChange);
|
|
14713
14207
|
return () => window.removeEventListener("hashchange", onHashChange);
|
|
14714
14208
|
}, [pathname]);
|
|
14715
|
-
const handleCommand =
|
|
14209
|
+
const handleCommand = useCallback5((cmd) => {
|
|
14716
14210
|
const el = activeElRef.current;
|
|
14717
14211
|
const selBefore = window.getSelection();
|
|
14718
14212
|
let savedOffsets = null;
|
|
@@ -14748,7 +14242,7 @@ function OhhwellsBridge() {
|
|
|
14748
14242
|
if (el) setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
14749
14243
|
refreshActiveCommandsRef.current();
|
|
14750
14244
|
}, []);
|
|
14751
|
-
const handleStateChange =
|
|
14245
|
+
const handleStateChange = useCallback5((state) => {
|
|
14752
14246
|
if (!activeStateElRef.current) return;
|
|
14753
14247
|
const el = activeStateElRef.current;
|
|
14754
14248
|
if (state === "Default") {
|
|
@@ -14761,7 +14255,7 @@ function OhhwellsBridge() {
|
|
|
14761
14255
|
}
|
|
14762
14256
|
setToggleState((prev) => prev ? { ...prev, activeState: state } : null);
|
|
14763
14257
|
}, [deactivate]);
|
|
14764
|
-
const reselectAfterLinkPopover =
|
|
14258
|
+
const reselectAfterLinkPopover = useCallback5(
|
|
14765
14259
|
(hrefKey) => {
|
|
14766
14260
|
requestAnimationFrame(() => {
|
|
14767
14261
|
const el = resolveHrefKeyElement(hrefKey);
|
|
@@ -14770,7 +14264,7 @@ function OhhwellsBridge() {
|
|
|
14770
14264
|
},
|
|
14771
14265
|
[resolveHrefKeyElement]
|
|
14772
14266
|
);
|
|
14773
|
-
const closeLinkPopover =
|
|
14267
|
+
const closeLinkPopover = useCallback5(() => {
|
|
14774
14268
|
const session = linkPopoverSessionRef.current;
|
|
14775
14269
|
addNavAfterAnchorRef.current = null;
|
|
14776
14270
|
setLinkPopover(null);
|
|
@@ -14778,9 +14272,9 @@ function OhhwellsBridge() {
|
|
|
14778
14272
|
reselectAfterLinkPopover(session.key);
|
|
14779
14273
|
}
|
|
14780
14274
|
}, [reselectAfterLinkPopover]);
|
|
14781
|
-
const closeLinkPopoverRef =
|
|
14275
|
+
const closeLinkPopoverRef = useRef7(closeLinkPopover);
|
|
14782
14276
|
closeLinkPopoverRef.current = closeLinkPopover;
|
|
14783
|
-
const openLinkPopoverForActive =
|
|
14277
|
+
const openLinkPopoverForActive = useCallback5(() => {
|
|
14784
14278
|
const hrefCtx = getHrefKeyFromElement(activeElRef.current);
|
|
14785
14279
|
if (!hrefCtx) return;
|
|
14786
14280
|
bumpLinkPopoverGrace();
|
|
@@ -14791,7 +14285,7 @@ function OhhwellsBridge() {
|
|
|
14791
14285
|
});
|
|
14792
14286
|
deactivate();
|
|
14793
14287
|
}, [deactivate]);
|
|
14794
|
-
const openLinkPopoverForSelected =
|
|
14288
|
+
const openLinkPopoverForSelected = useCallback5(() => {
|
|
14795
14289
|
const anchor = selectedElRef.current;
|
|
14796
14290
|
if (!anchor) return;
|
|
14797
14291
|
const key = anchor.getAttribute("data-ohw-href-key");
|
|
@@ -14804,7 +14298,7 @@ function OhhwellsBridge() {
|
|
|
14804
14298
|
});
|
|
14805
14299
|
deselect();
|
|
14806
14300
|
}, [deselect]);
|
|
14807
|
-
const handleSelectParent =
|
|
14301
|
+
const handleSelectParent = useCallback5(() => {
|
|
14808
14302
|
const selected = selectedElRef.current;
|
|
14809
14303
|
if (!selected) return;
|
|
14810
14304
|
if (toolbarVariantRef.current === "select-frame") {
|
|
@@ -14831,7 +14325,7 @@ function OhhwellsBridge() {
|
|
|
14831
14325
|
}
|
|
14832
14326
|
deselectRef.current();
|
|
14833
14327
|
}, []);
|
|
14834
|
-
const handleDuplicateSelected =
|
|
14328
|
+
const handleDuplicateSelected = useCallback5(() => {
|
|
14835
14329
|
const selected = selectedElRef.current;
|
|
14836
14330
|
if (!selected || !isNavigationItem2(selected)) return;
|
|
14837
14331
|
const hrefKey = selected.getAttribute("data-ohw-href-key");
|
|
@@ -14921,7 +14415,7 @@ function OhhwellsBridge() {
|
|
|
14921
14415
|
});
|
|
14922
14416
|
}
|
|
14923
14417
|
}, [postToParent2]);
|
|
14924
|
-
const runPendingDeleteUndo =
|
|
14418
|
+
const runPendingDeleteUndo = useCallback5(() => {
|
|
14925
14419
|
const pending = pendingDeleteUndoRef.current;
|
|
14926
14420
|
if (!pending) return false;
|
|
14927
14421
|
pendingDeleteUndoRef.current = null;
|
|
@@ -14929,7 +14423,7 @@ function OhhwellsBridge() {
|
|
|
14929
14423
|
enforceLinkHrefs();
|
|
14930
14424
|
return true;
|
|
14931
14425
|
}, []);
|
|
14932
|
-
const handleDeleteSelected =
|
|
14426
|
+
const handleDeleteSelected = useCallback5(() => {
|
|
14933
14427
|
const selected = selectedElRef.current;
|
|
14934
14428
|
if (!selected) return false;
|
|
14935
14429
|
return deleteSelectedNavFooterItem({
|
|
@@ -14950,7 +14444,7 @@ function OhhwellsBridge() {
|
|
|
14950
14444
|
}, [postToParent2]);
|
|
14951
14445
|
handleDeleteSelectedRef.current = handleDeleteSelected;
|
|
14952
14446
|
runPendingDeleteUndoRef.current = runPendingDeleteUndo;
|
|
14953
|
-
const handleLinkPopoverSubmit =
|
|
14447
|
+
const handleLinkPopoverSubmit = useCallback5(
|
|
14954
14448
|
(target) => {
|
|
14955
14449
|
const session = linkPopoverSessionRef.current;
|
|
14956
14450
|
if (!session) return;
|
|
@@ -15015,19 +14509,19 @@ function OhhwellsBridge() {
|
|
|
15015
14509
|
const showEditLink = toolbarShowEditLink;
|
|
15016
14510
|
const currentSections = sectionsByPath[pathname] ?? [];
|
|
15017
14511
|
linkPopoverOpenRef.current = linkPopover !== null;
|
|
15018
|
-
const handleMediaReplace =
|
|
14512
|
+
const handleMediaReplace = useCallback5(
|
|
15019
14513
|
(key) => {
|
|
15020
14514
|
postToParent2({ type: "ow:image-pick", key, elementType: mediaHover?.elementType ?? "image" });
|
|
15021
14515
|
},
|
|
15022
14516
|
[postToParent2, mediaHover?.elementType]
|
|
15023
14517
|
);
|
|
15024
|
-
const handleEditCarousel =
|
|
14518
|
+
const handleEditCarousel = useCallback5(
|
|
15025
14519
|
(key) => {
|
|
15026
14520
|
postToParent2({ type: "ow:carousel-open", key, images: readCarouselValue(key) });
|
|
15027
14521
|
},
|
|
15028
14522
|
[postToParent2]
|
|
15029
14523
|
);
|
|
15030
|
-
const handleMediaFadeOutComplete =
|
|
14524
|
+
const handleMediaFadeOutComplete = useCallback5((key) => {
|
|
15031
14525
|
setUploadingRects((prev) => {
|
|
15032
14526
|
if (!(key in prev)) return prev;
|
|
15033
14527
|
const next = { ...prev };
|
|
@@ -15035,7 +14529,7 @@ function OhhwellsBridge() {
|
|
|
15035
14529
|
return next;
|
|
15036
14530
|
});
|
|
15037
14531
|
}, []);
|
|
15038
|
-
const handleVideoSettingsChange =
|
|
14532
|
+
const handleVideoSettingsChange = useCallback5(
|
|
15039
14533
|
(key, settings) => {
|
|
15040
14534
|
document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
|
|
15041
14535
|
const video = getVideoEl2(el);
|
|
@@ -15058,10 +14552,9 @@ function OhhwellsBridge() {
|
|
|
15058
14552
|
[postToParent2]
|
|
15059
14553
|
);
|
|
15060
14554
|
return bridgeRoot ? createPortal2(
|
|
15061
|
-
/* @__PURE__ */
|
|
15062
|
-
/* @__PURE__ */
|
|
15063
|
-
|
|
15064
|
-
Object.entries(uploadingRects).map(([key, { rect, fadingOut }]) => /* @__PURE__ */ jsx28(
|
|
14555
|
+
/* @__PURE__ */ jsxs15(Fragment6, { children: [
|
|
14556
|
+
/* @__PURE__ */ jsx27("div", { ref: attachVisibleViewport, "data-ohw-visible-viewport": "", "aria-hidden": true }),
|
|
14557
|
+
Object.entries(uploadingRects).map(([key, { rect, fadingOut }]) => /* @__PURE__ */ jsx27(
|
|
15065
14558
|
MediaOverlay,
|
|
15066
14559
|
{
|
|
15067
14560
|
hover: { key, rect, elementType: "image", isDragOver: false, hasTextOverlap: false },
|
|
@@ -15072,7 +14565,7 @@ function OhhwellsBridge() {
|
|
|
15072
14565
|
},
|
|
15073
14566
|
`uploading-${key}`
|
|
15074
14567
|
)),
|
|
15075
|
-
mediaHover && !(mediaHover.key in uploadingRects) && /* @__PURE__ */
|
|
14568
|
+
mediaHover && !(mediaHover.key in uploadingRects) && /* @__PURE__ */ jsx27(
|
|
15076
14569
|
MediaOverlay,
|
|
15077
14570
|
{
|
|
15078
14571
|
hover: mediaHover,
|
|
@@ -15081,11 +14574,11 @@ function OhhwellsBridge() {
|
|
|
15081
14574
|
onVideoSettingsChange: handleVideoSettingsChange
|
|
15082
14575
|
}
|
|
15083
14576
|
),
|
|
15084
|
-
carouselHover && !linkPopover && !isItemDragging && /* @__PURE__ */
|
|
15085
|
-
siblingHintRect && !linkPopover && !isItemDragging && siblingHintRects.length === 0 && /* @__PURE__ */
|
|
15086
|
-
siblingHintRects.length > 0 && !linkPopover && !isItemDragging && siblingHintRects.map((rect, i) => /* @__PURE__ */
|
|
15087
|
-
isItemDragging && draggedItemRect && selectedElRef.current !== footerDragRef.current?.draggedEl && selectedElRef.current !== navDragRef.current?.draggedEl && /* @__PURE__ */
|
|
15088
|
-
isItemDragging && footerDropSlots.map((slot, i) => /* @__PURE__ */
|
|
14577
|
+
carouselHover && !linkPopover && !isItemDragging && /* @__PURE__ */ jsx27(CarouselOverlay, { hover: carouselHover, onEdit: handleEditCarousel }),
|
|
14578
|
+
siblingHintRect && !linkPopover && !isItemDragging && siblingHintRects.length === 0 && /* @__PURE__ */ jsx27(ItemInteractionLayer, { rect: siblingHintRect, state: "sibling-hint" }),
|
|
14579
|
+
siblingHintRects.length > 0 && !linkPopover && !isItemDragging && siblingHintRects.map((rect, i) => /* @__PURE__ */ jsx27(ItemInteractionLayer, { rect, state: "sibling-hint" }, `sibling-hint-${i}`)),
|
|
14580
|
+
isItemDragging && draggedItemRect && selectedElRef.current !== footerDragRef.current?.draggedEl && selectedElRef.current !== navDragRef.current?.draggedEl && /* @__PURE__ */ jsx27(ItemInteractionLayer, { rect: draggedItemRect, state: "dragging" }),
|
|
14581
|
+
isItemDragging && footerDropSlots.map((slot, i) => /* @__PURE__ */ jsx27(
|
|
15089
14582
|
"div",
|
|
15090
14583
|
{
|
|
15091
14584
|
className: "pointer-events-none fixed z-2147483646",
|
|
@@ -15095,7 +14588,7 @@ function OhhwellsBridge() {
|
|
|
15095
14588
|
width: slot.width,
|
|
15096
14589
|
height: slot.height
|
|
15097
14590
|
},
|
|
15098
|
-
children: /* @__PURE__ */
|
|
14591
|
+
children: /* @__PURE__ */ jsx27(
|
|
15099
14592
|
DropIndicator,
|
|
15100
14593
|
{
|
|
15101
14594
|
direction: slot.direction,
|
|
@@ -15106,7 +14599,7 @@ function OhhwellsBridge() {
|
|
|
15106
14599
|
},
|
|
15107
14600
|
`footer-drop-${slot.direction}-${slot.columnIndex}-${slot.insertIndex}-${i}`
|
|
15108
14601
|
)),
|
|
15109
|
-
isItemDragging && navDropSlots.map((slot, i) => /* @__PURE__ */
|
|
14602
|
+
isItemDragging && navDropSlots.map((slot, i) => /* @__PURE__ */ jsx27(
|
|
15110
14603
|
"div",
|
|
15111
14604
|
{
|
|
15112
14605
|
className: "pointer-events-none fixed z-2147483646",
|
|
@@ -15116,7 +14609,7 @@ function OhhwellsBridge() {
|
|
|
15116
14609
|
width: slot.width,
|
|
15117
14610
|
height: slot.height
|
|
15118
14611
|
},
|
|
15119
|
-
children: /* @__PURE__ */
|
|
14612
|
+
children: /* @__PURE__ */ jsx27(
|
|
15120
14613
|
DropIndicator,
|
|
15121
14614
|
{
|
|
15122
14615
|
direction: slot.direction,
|
|
@@ -15127,10 +14620,10 @@ function OhhwellsBridge() {
|
|
|
15127
14620
|
},
|
|
15128
14621
|
`nav-drop-${slot.direction}-${slot.parentId ?? "root"}-${slot.insertIndex}-${i}`
|
|
15129
14622
|
)),
|
|
15130
|
-
hoveredNavContainerRect && (toolbarVariant !== "select-frame" || isFooterFrameSelection) && !linkPopover && !isItemDragging && /* @__PURE__ */
|
|
15131
|
-
hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */
|
|
15132
|
-
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isNavbarLinksContainer2(selectedElRef.current) && /* @__PURE__ */
|
|
15133
|
-
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isFooterLinksContainer(selectedElRef.current) && /* @__PURE__ */
|
|
14623
|
+
hoveredNavContainerRect && (toolbarVariant !== "select-frame" || isFooterFrameSelection) && !linkPopover && !isItemDragging && /* @__PURE__ */ jsx27(ItemInteractionLayer, { rect: hoveredNavContainerRect, state: "hover" }),
|
|
14624
|
+
hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */ jsx27(ItemInteractionLayer, { rect: hoveredItemRect, state: "hover" }),
|
|
14625
|
+
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isNavbarLinksContainer2(selectedElRef.current) && /* @__PURE__ */ jsx27(NavbarContainerChrome, { rect: toolbarRect, onAdd: handleAddTopLevelNavItem }),
|
|
14626
|
+
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isFooterLinksContainer(selectedElRef.current) && /* @__PURE__ */ jsx27(
|
|
15134
14627
|
FooterContainerChrome,
|
|
15135
14628
|
{
|
|
15136
14629
|
rect: toolbarRect,
|
|
@@ -15138,7 +14631,7 @@ function OhhwellsBridge() {
|
|
|
15138
14631
|
addDisabled: !canAddFooterColumn()
|
|
15139
14632
|
}
|
|
15140
14633
|
),
|
|
15141
|
-
toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame") && /* @__PURE__ */
|
|
14634
|
+
toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame") && /* @__PURE__ */ jsx27(
|
|
15142
14635
|
ItemInteractionLayer,
|
|
15143
14636
|
{
|
|
15144
14637
|
rect: isItemDragging && draggedItemRect && (footerDragRef.current?.wasSelected || navDragRef.current?.wasSelected) ? draggedItemRect : toolbarRect,
|
|
@@ -15153,7 +14646,7 @@ function OhhwellsBridge() {
|
|
|
15153
14646
|
onItemPointerDown: handleItemChromePointerDown,
|
|
15154
14647
|
onItemClick: handleItemChromeClick,
|
|
15155
14648
|
itemDragSurface: !isFooterFrameSelection,
|
|
15156
|
-
toolbar: toolbarVariant === "link-action" && !isItemDragging || toolbarVariant === "select-frame" && isFooterFrameSelection && !isItemDragging ? /* @__PURE__ */
|
|
14649
|
+
toolbar: toolbarVariant === "link-action" && !isItemDragging || toolbarVariant === "select-frame" && isFooterFrameSelection && !isItemDragging ? /* @__PURE__ */ jsx27(
|
|
15157
14650
|
ItemActionToolbar,
|
|
15158
14651
|
{
|
|
15159
14652
|
onEditLink: openLinkPopoverForSelected,
|
|
@@ -15178,8 +14671,8 @@ function OhhwellsBridge() {
|
|
|
15178
14671
|
) : void 0
|
|
15179
14672
|
}
|
|
15180
14673
|
),
|
|
15181
|
-
toolbarRect && toolbarVariant === "rich-text" && !linkPopover && /* @__PURE__ */
|
|
15182
|
-
/* @__PURE__ */
|
|
14674
|
+
toolbarRect && toolbarVariant === "rich-text" && !linkPopover && /* @__PURE__ */ jsxs15(Fragment6, { children: [
|
|
14675
|
+
/* @__PURE__ */ jsx27(
|
|
15183
14676
|
EditGlowChrome,
|
|
15184
14677
|
{
|
|
15185
14678
|
rect: toolbarRect,
|
|
@@ -15189,7 +14682,7 @@ function OhhwellsBridge() {
|
|
|
15189
14682
|
hideHandle: isItemDragging
|
|
15190
14683
|
}
|
|
15191
14684
|
),
|
|
15192
|
-
/* @__PURE__ */
|
|
14685
|
+
/* @__PURE__ */ jsx27(
|
|
15193
14686
|
FloatingToolbar,
|
|
15194
14687
|
{
|
|
15195
14688
|
rect: toolbarRect,
|
|
@@ -15202,7 +14695,7 @@ function OhhwellsBridge() {
|
|
|
15202
14695
|
}
|
|
15203
14696
|
)
|
|
15204
14697
|
] }),
|
|
15205
|
-
maxBadge && /* @__PURE__ */
|
|
14698
|
+
maxBadge && /* @__PURE__ */ jsxs15(
|
|
15206
14699
|
"div",
|
|
15207
14700
|
{
|
|
15208
14701
|
"data-ohw-max-badge": "",
|
|
@@ -15228,7 +14721,7 @@ function OhhwellsBridge() {
|
|
|
15228
14721
|
]
|
|
15229
14722
|
}
|
|
15230
14723
|
),
|
|
15231
|
-
toggleState && !linkPopover && /* @__PURE__ */
|
|
14724
|
+
toggleState && !linkPopover && /* @__PURE__ */ jsx27(
|
|
15232
14725
|
StateToggle,
|
|
15233
14726
|
{
|
|
15234
14727
|
rect: toggleState.rect,
|
|
@@ -15237,15 +14730,15 @@ function OhhwellsBridge() {
|
|
|
15237
14730
|
onStateChange: handleStateChange
|
|
15238
14731
|
}
|
|
15239
14732
|
),
|
|
15240
|
-
sectionGap && !linkPopover && /* @__PURE__ */
|
|
14733
|
+
sectionGap && !linkPopover && /* @__PURE__ */ jsxs15(
|
|
15241
14734
|
"div",
|
|
15242
14735
|
{
|
|
15243
14736
|
"data-ohw-section-insert-line": "",
|
|
15244
14737
|
className: "fixed left-0 w-full z-2147483646 flex items-center pointer-events-none",
|
|
15245
14738
|
style: { top: sectionGap.y, transform: "translateY(-50%)" },
|
|
15246
14739
|
children: [
|
|
15247
|
-
/* @__PURE__ */
|
|
15248
|
-
/* @__PURE__ */
|
|
14740
|
+
/* @__PURE__ */ jsx27("div", { className: "flex-1 bg-primary", style: { height: 3 } }),
|
|
14741
|
+
/* @__PURE__ */ jsx27(
|
|
15249
14742
|
Badge,
|
|
15250
14743
|
{
|
|
15251
14744
|
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",
|
|
@@ -15262,11 +14755,11 @@ function OhhwellsBridge() {
|
|
|
15262
14755
|
children: "Add Section"
|
|
15263
14756
|
}
|
|
15264
14757
|
),
|
|
15265
|
-
/* @__PURE__ */
|
|
14758
|
+
/* @__PURE__ */ jsx27("div", { className: "flex-1 bg-primary", style: { height: 3 } })
|
|
15266
14759
|
]
|
|
15267
14760
|
}
|
|
15268
14761
|
),
|
|
15269
|
-
linkPopover && dialogPortalContainer ? /* @__PURE__ */
|
|
14762
|
+
linkPopover && dialogPortalContainer ? /* @__PURE__ */ jsx27(
|
|
15270
14763
|
LinkPopover,
|
|
15271
14764
|
{
|
|
15272
14765
|
panelRef: linkPopoverPanelRef,
|