@ohhwells/bridge 0.1.52-next.140 → 0.1.52-next.142
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +892 -254
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +892 -248
- package/dist/index.js.map +1 -1
- package/dist/styles.css +77 -0
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -69,7 +69,7 @@ __export(index_exports, {
|
|
|
69
69
|
module.exports = __toCommonJS(index_exports);
|
|
70
70
|
|
|
71
71
|
// src/OhhwellsBridge.tsx
|
|
72
|
-
var
|
|
72
|
+
var import_react15 = __toESM(require("react"), 1);
|
|
73
73
|
var import_client = require("react-dom/client");
|
|
74
74
|
var import_react_dom2 = require("react-dom");
|
|
75
75
|
|
|
@@ -9104,7 +9104,8 @@ function applyLogoImage(url, alt) {
|
|
|
9104
9104
|
img.setAttribute("data-ohw-editable", "image");
|
|
9105
9105
|
img.setAttribute("data-ohw-key", imageKey);
|
|
9106
9106
|
img.alt = displayAlt;
|
|
9107
|
-
img.style.
|
|
9107
|
+
img.style.height = "";
|
|
9108
|
+
img.style.maxHeight = "none";
|
|
9108
9109
|
img.style.width = "auto";
|
|
9109
9110
|
img.style.display = "block";
|
|
9110
9111
|
img.style.objectFit = "contain";
|
|
@@ -9214,6 +9215,100 @@ function applyLogoFromContent(content) {
|
|
|
9214
9215
|
return true;
|
|
9215
9216
|
}
|
|
9216
9217
|
|
|
9218
|
+
// src/lib/logo-size.ts
|
|
9219
|
+
var LOGO_SIZE_DEFAULTS = {
|
|
9220
|
+
navbar: 28,
|
|
9221
|
+
footer: 32
|
|
9222
|
+
};
|
|
9223
|
+
var LOGO_SIZE_MIN = 16;
|
|
9224
|
+
var LOGO_SIZE_MAX = 80;
|
|
9225
|
+
var LOGO_SIZE_DESKTOP_KEYS = {
|
|
9226
|
+
navbar: "nav-logo-size",
|
|
9227
|
+
footer: "footer-logo-size"
|
|
9228
|
+
};
|
|
9229
|
+
var LOGO_SIZE_MOBILE_KEYS = {
|
|
9230
|
+
navbar: "nav-logo-size-mobile",
|
|
9231
|
+
footer: "footer-logo-size-mobile"
|
|
9232
|
+
};
|
|
9233
|
+
var LOGO_SIZE_KEYS = [
|
|
9234
|
+
LOGO_SIZE_DESKTOP_KEYS.navbar,
|
|
9235
|
+
LOGO_SIZE_DESKTOP_KEYS.footer,
|
|
9236
|
+
LOGO_SIZE_MOBILE_KEYS.navbar,
|
|
9237
|
+
LOGO_SIZE_MOBILE_KEYS.footer
|
|
9238
|
+
];
|
|
9239
|
+
function isFooterLogoRoot2(root) {
|
|
9240
|
+
return Boolean(root.closest("footer") || root.closest('[data-ohw-section="footer"]'));
|
|
9241
|
+
}
|
|
9242
|
+
function getLogoPlacement(root) {
|
|
9243
|
+
return isFooterLogoRoot2(root) ? "footer" : "navbar";
|
|
9244
|
+
}
|
|
9245
|
+
function parseLogoSizePx(raw, fallback) {
|
|
9246
|
+
if (raw == null || raw === "") return fallback;
|
|
9247
|
+
const n = Number.parseFloat(raw);
|
|
9248
|
+
if (!Number.isFinite(n)) return fallback;
|
|
9249
|
+
return Math.min(LOGO_SIZE_MAX, Math.max(LOGO_SIZE_MIN, Math.round(n)));
|
|
9250
|
+
}
|
|
9251
|
+
function isMobileLogoSizeFollowing(content, placement) {
|
|
9252
|
+
const raw = content[LOGO_SIZE_MOBILE_KEYS[placement]];
|
|
9253
|
+
return raw == null || raw.trim() === "";
|
|
9254
|
+
}
|
|
9255
|
+
function resolveDesktopLogoSize(content, placement) {
|
|
9256
|
+
return parseLogoSizePx(content[LOGO_SIZE_DESKTOP_KEYS[placement]], LOGO_SIZE_DEFAULTS[placement]);
|
|
9257
|
+
}
|
|
9258
|
+
function resolveMobileLogoSize(content, placement) {
|
|
9259
|
+
if (isMobileLogoSizeFollowing(content, placement)) {
|
|
9260
|
+
return resolveDesktopLogoSize(content, placement);
|
|
9261
|
+
}
|
|
9262
|
+
return parseLogoSizePx(
|
|
9263
|
+
content[LOGO_SIZE_MOBILE_KEYS[placement]],
|
|
9264
|
+
resolveDesktopLogoSize(content, placement)
|
|
9265
|
+
);
|
|
9266
|
+
}
|
|
9267
|
+
function setRootSizeVars(root, desktopPx, mobilePx, following) {
|
|
9268
|
+
root.style.setProperty("--ohw-logo-size", `${desktopPx}px`);
|
|
9269
|
+
if (following) {
|
|
9270
|
+
root.style.removeProperty("--ohw-logo-size-mobile");
|
|
9271
|
+
} else {
|
|
9272
|
+
root.style.setProperty("--ohw-logo-size-mobile", `${mobilePx}px`);
|
|
9273
|
+
}
|
|
9274
|
+
root.querySelectorAll("img").forEach((img) => {
|
|
9275
|
+
img.style.height = "";
|
|
9276
|
+
img.style.maxHeight = "none";
|
|
9277
|
+
img.style.width = "auto";
|
|
9278
|
+
img.style.objectFit = "contain";
|
|
9279
|
+
});
|
|
9280
|
+
}
|
|
9281
|
+
function applyLogoSizes(content) {
|
|
9282
|
+
document.querySelectorAll('[data-ohw-role="logo"], [data-ohw-logo]').forEach((root) => {
|
|
9283
|
+
const placement = getLogoPlacement(root);
|
|
9284
|
+
const desktop = resolveDesktopLogoSize(content, placement);
|
|
9285
|
+
const following = isMobileLogoSizeFollowing(content, placement);
|
|
9286
|
+
const mobile = following ? desktop : resolveMobileLogoSize(content, placement);
|
|
9287
|
+
setRootSizeVars(root, desktop, mobile, following);
|
|
9288
|
+
});
|
|
9289
|
+
}
|
|
9290
|
+
function applyLogoSizeToPlacement(placement, desktopPx, mobilePx, following) {
|
|
9291
|
+
document.querySelectorAll('[data-ohw-role="logo"], [data-ohw-logo]').forEach((root) => {
|
|
9292
|
+
if (getLogoPlacement(root) !== placement) return;
|
|
9293
|
+
setRootSizeVars(root, desktopPx, mobilePx, following);
|
|
9294
|
+
});
|
|
9295
|
+
}
|
|
9296
|
+
function logoHasUploadedImage(logoEl) {
|
|
9297
|
+
if (logoEl.hasAttribute("data-ohw-placeholder")) return false;
|
|
9298
|
+
const img = logoEl.querySelector('img[data-ohw-key="nav-logo-image"], img[data-ohw-key="footer-logo"], img[data-ohw-key="footer-logo-image"]') ?? logoEl.querySelector("img");
|
|
9299
|
+
if (!img) return false;
|
|
9300
|
+
const src = img.getAttribute("src")?.trim() ?? "";
|
|
9301
|
+
if (!src || src.startsWith("data:")) return false;
|
|
9302
|
+
if (img.style.display === "none") return false;
|
|
9303
|
+
return true;
|
|
9304
|
+
}
|
|
9305
|
+
function readLogoSizeState(content, placement) {
|
|
9306
|
+
const desktopPx = resolveDesktopLogoSize(content, placement);
|
|
9307
|
+
const mobileFollowing = isMobileLogoSizeFollowing(content, placement);
|
|
9308
|
+
const mobilePx = mobileFollowing ? desktopPx : resolveMobileLogoSize(content, placement);
|
|
9309
|
+
return { desktopPx, mobilePx, mobileFollowing };
|
|
9310
|
+
}
|
|
9311
|
+
|
|
9217
9312
|
// src/lib/site-wide-scope.ts
|
|
9218
9313
|
function getLogoElement(el) {
|
|
9219
9314
|
const marked = el.closest('[data-ohw-role="logo"], [data-ohw-logo]');
|
|
@@ -9283,6 +9378,293 @@ function addFooterColumnWithPersist({
|
|
|
9283
9378
|
return result;
|
|
9284
9379
|
}
|
|
9285
9380
|
|
|
9381
|
+
// src/ui/FloatingPanel.tsx
|
|
9382
|
+
var import_react12 = require("react");
|
|
9383
|
+
var import_lucide_react12 = require("lucide-react");
|
|
9384
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
9385
|
+
var PANEL_WIDTH = 256;
|
|
9386
|
+
var EDGE_MARGIN = 16;
|
|
9387
|
+
function getVisibleClip(parentScroll) {
|
|
9388
|
+
const left = 0;
|
|
9389
|
+
const right = window.innerWidth;
|
|
9390
|
+
if (!parentScroll) {
|
|
9391
|
+
return { top: 0, bottom: window.innerHeight, left, right };
|
|
9392
|
+
}
|
|
9393
|
+
const { iframeOffsetTop, headerH: visibleCanvasTop, canvasH } = parentScroll;
|
|
9394
|
+
const top = Math.max(0, visibleCanvasTop - iframeOffsetTop);
|
|
9395
|
+
const bottom = Math.min(window.innerHeight, visibleCanvasTop + canvasH - iframeOffsetTop);
|
|
9396
|
+
return { top, bottom: Math.max(top, bottom), left, right };
|
|
9397
|
+
}
|
|
9398
|
+
function defaultFloatingPanelPosition(parentScroll, panelHeight = 280) {
|
|
9399
|
+
const clip = getVisibleClip(parentScroll);
|
|
9400
|
+
return {
|
|
9401
|
+
x: Math.max(EDGE_MARGIN, clip.right - PANEL_WIDTH - EDGE_MARGIN),
|
|
9402
|
+
y: Math.min(
|
|
9403
|
+
Math.max(clip.top + EDGE_MARGIN, EDGE_MARGIN),
|
|
9404
|
+
Math.max(clip.top + EDGE_MARGIN, clip.bottom - panelHeight - EDGE_MARGIN)
|
|
9405
|
+
)
|
|
9406
|
+
};
|
|
9407
|
+
}
|
|
9408
|
+
function clampPosition(pos, parentScroll, panelW, panelH) {
|
|
9409
|
+
const clip = getVisibleClip(parentScroll);
|
|
9410
|
+
const maxX = Math.max(clip.left + EDGE_MARGIN, clip.right - panelW - EDGE_MARGIN);
|
|
9411
|
+
const maxY = Math.max(clip.top + EDGE_MARGIN, clip.bottom - panelH - EDGE_MARGIN);
|
|
9412
|
+
return {
|
|
9413
|
+
x: Math.min(Math.max(pos.x, clip.left + EDGE_MARGIN), maxX),
|
|
9414
|
+
y: Math.min(Math.max(pos.y, clip.top + EDGE_MARGIN), maxY)
|
|
9415
|
+
};
|
|
9416
|
+
}
|
|
9417
|
+
function FloatingPanel({
|
|
9418
|
+
open,
|
|
9419
|
+
title,
|
|
9420
|
+
context,
|
|
9421
|
+
icon,
|
|
9422
|
+
onClose,
|
|
9423
|
+
children,
|
|
9424
|
+
position,
|
|
9425
|
+
onPositionChange,
|
|
9426
|
+
parentScroll = null,
|
|
9427
|
+
className,
|
|
9428
|
+
bodyClassName
|
|
9429
|
+
}) {
|
|
9430
|
+
const panelRef = (0, import_react12.useRef)(null);
|
|
9431
|
+
const [measured, setMeasured] = (0, import_react12.useState)({ w: PANEL_WIDTH, h: 280 });
|
|
9432
|
+
const dragRef = (0, import_react12.useRef)(null);
|
|
9433
|
+
const resolved = position ?? defaultFloatingPanelPosition(parentScroll, measured.h);
|
|
9434
|
+
const clamped = clampPosition(resolved, parentScroll, measured.w, measured.h);
|
|
9435
|
+
(0, import_react12.useLayoutEffect)(() => {
|
|
9436
|
+
if (!open || !panelRef.current) return;
|
|
9437
|
+
const el = panelRef.current;
|
|
9438
|
+
const next = { w: el.offsetWidth || PANEL_WIDTH, h: el.offsetHeight || 280 };
|
|
9439
|
+
setMeasured((prev) => prev.w === next.w && prev.h === next.h ? prev : next);
|
|
9440
|
+
}, [open, children, title, context]);
|
|
9441
|
+
(0, import_react12.useEffect)(() => {
|
|
9442
|
+
if (!open || !position || !onPositionChange) return;
|
|
9443
|
+
const next = clampPosition(position, parentScroll, measured.w, measured.h);
|
|
9444
|
+
if (next.x !== position.x || next.y !== position.y) onPositionChange(next);
|
|
9445
|
+
}, [open, parentScroll, measured.w, measured.h, position, onPositionChange]);
|
|
9446
|
+
const onHeaderPointerDown = (0, import_react12.useCallback)(
|
|
9447
|
+
(e) => {
|
|
9448
|
+
if (e.button !== 0) return;
|
|
9449
|
+
if (e.target.closest("[data-ohw-floating-panel-close]")) return;
|
|
9450
|
+
e.preventDefault();
|
|
9451
|
+
e.stopPropagation();
|
|
9452
|
+
const el = e.currentTarget;
|
|
9453
|
+
el.setPointerCapture(e.pointerId);
|
|
9454
|
+
dragRef.current = {
|
|
9455
|
+
pointerId: e.pointerId,
|
|
9456
|
+
startX: e.clientX,
|
|
9457
|
+
startY: e.clientY,
|
|
9458
|
+
originX: clamped.x,
|
|
9459
|
+
originY: clamped.y
|
|
9460
|
+
};
|
|
9461
|
+
},
|
|
9462
|
+
[clamped.x, clamped.y]
|
|
9463
|
+
);
|
|
9464
|
+
const onHeaderPointerMove = (0, import_react12.useCallback)(
|
|
9465
|
+
(e) => {
|
|
9466
|
+
const drag = dragRef.current;
|
|
9467
|
+
if (!drag || drag.pointerId !== e.pointerId) return;
|
|
9468
|
+
e.preventDefault();
|
|
9469
|
+
const next = clampPosition(
|
|
9470
|
+
{
|
|
9471
|
+
x: drag.originX + (e.clientX - drag.startX),
|
|
9472
|
+
y: drag.originY + (e.clientY - drag.startY)
|
|
9473
|
+
},
|
|
9474
|
+
parentScroll,
|
|
9475
|
+
measured.w,
|
|
9476
|
+
measured.h
|
|
9477
|
+
);
|
|
9478
|
+
onPositionChange?.(next);
|
|
9479
|
+
},
|
|
9480
|
+
[measured.h, measured.w, onPositionChange, parentScroll]
|
|
9481
|
+
);
|
|
9482
|
+
const endDrag = (0, import_react12.useCallback)((e) => {
|
|
9483
|
+
const drag = dragRef.current;
|
|
9484
|
+
if (!drag || drag.pointerId !== e.pointerId) return;
|
|
9485
|
+
dragRef.current = null;
|
|
9486
|
+
try {
|
|
9487
|
+
e.currentTarget.releasePointerCapture(e.pointerId);
|
|
9488
|
+
} catch {
|
|
9489
|
+
}
|
|
9490
|
+
}, []);
|
|
9491
|
+
if (!open) return null;
|
|
9492
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
|
|
9493
|
+
"div",
|
|
9494
|
+
{
|
|
9495
|
+
ref: panelRef,
|
|
9496
|
+
"data-ohw-floating-panel": "",
|
|
9497
|
+
role: "dialog",
|
|
9498
|
+
"aria-label": title,
|
|
9499
|
+
className: cn(
|
|
9500
|
+
// Above MediaOverlay / item chrome (2147483646); link-modal content shares this tier.
|
|
9501
|
+
"fixed z-[2147483647] flex w-64 flex-col overflow-hidden rounded-xl border border-border bg-background font-sans shadow-lg outline-none",
|
|
9502
|
+
className
|
|
9503
|
+
),
|
|
9504
|
+
style: { left: clamped.x, top: clamped.y },
|
|
9505
|
+
onMouseDown: (e) => e.stopPropagation(),
|
|
9506
|
+
onPointerDown: (e) => e.stopPropagation(),
|
|
9507
|
+
onClick: (e) => e.stopPropagation(),
|
|
9508
|
+
children: [
|
|
9509
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
|
|
9510
|
+
"div",
|
|
9511
|
+
{
|
|
9512
|
+
"data-ohw-floating-panel-header": "",
|
|
9513
|
+
className: "relative flex cursor-grab items-start gap-2 border-b border-border py-5 pl-5 pr-11 active:cursor-grabbing",
|
|
9514
|
+
onPointerDown: onHeaderPointerDown,
|
|
9515
|
+
onPointerMove: onHeaderPointerMove,
|
|
9516
|
+
onPointerUp: endDrag,
|
|
9517
|
+
onPointerCancel: endDrag,
|
|
9518
|
+
children: [
|
|
9519
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col gap-1.5", children: [
|
|
9520
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
9521
|
+
icon ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "shrink-0 text-foreground", children: icon }) : null,
|
|
9522
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "min-w-0 flex-1 text-lg font-semibold leading-7 text-foreground", children: title })
|
|
9523
|
+
] }),
|
|
9524
|
+
context ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "w-full text-sm leading-5 text-muted-foreground", children: context }) : null
|
|
9525
|
+
] }),
|
|
9526
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
9527
|
+
"button",
|
|
9528
|
+
{
|
|
9529
|
+
type: "button",
|
|
9530
|
+
"data-ohw-floating-panel-close": "",
|
|
9531
|
+
"aria-label": "Close",
|
|
9532
|
+
className: "absolute right-2.5 top-2.5 rounded-sm p-1.5 text-foreground hover:bg-muted/50",
|
|
9533
|
+
onClick: (e) => {
|
|
9534
|
+
e.stopPropagation();
|
|
9535
|
+
onClose();
|
|
9536
|
+
},
|
|
9537
|
+
onPointerDown: (e) => e.stopPropagation(),
|
|
9538
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react12.X, { size: 16, "aria-hidden": true })
|
|
9539
|
+
}
|
|
9540
|
+
)
|
|
9541
|
+
]
|
|
9542
|
+
}
|
|
9543
|
+
),
|
|
9544
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
9545
|
+
"div",
|
|
9546
|
+
{
|
|
9547
|
+
"data-ohw-floating-panel-body": "",
|
|
9548
|
+
className: cn("flex w-full flex-col gap-4 p-5", bodyClassName),
|
|
9549
|
+
children
|
|
9550
|
+
}
|
|
9551
|
+
)
|
|
9552
|
+
]
|
|
9553
|
+
}
|
|
9554
|
+
);
|
|
9555
|
+
}
|
|
9556
|
+
|
|
9557
|
+
// src/ui/logo-size-panel.tsx
|
|
9558
|
+
var import_lucide_react13 = require("lucide-react");
|
|
9559
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
9560
|
+
function SizeSlider({
|
|
9561
|
+
value,
|
|
9562
|
+
onChange
|
|
9563
|
+
}) {
|
|
9564
|
+
const pct = (value - LOGO_SIZE_MIN) / (LOGO_SIZE_MAX - LOGO_SIZE_MIN) * 100;
|
|
9565
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex w-full flex-col gap-3", children: [
|
|
9566
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex w-full items-center gap-2 text-sm font-medium leading-5", children: [
|
|
9567
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "min-w-0 flex-1 text-foreground", children: "Size" }),
|
|
9568
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("span", { className: "shrink-0 whitespace-nowrap text-muted-foreground", children: [
|
|
9569
|
+
value,
|
|
9570
|
+
" px"
|
|
9571
|
+
] })
|
|
9572
|
+
] }),
|
|
9573
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "relative h-2 w-full rounded-full bg-primary-50", children: [
|
|
9574
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
9575
|
+
"div",
|
|
9576
|
+
{
|
|
9577
|
+
className: "absolute inset-y-0 left-0 rounded-full bg-primary",
|
|
9578
|
+
style: { width: `${pct}%` }
|
|
9579
|
+
}
|
|
9580
|
+
),
|
|
9581
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
9582
|
+
"input",
|
|
9583
|
+
{
|
|
9584
|
+
type: "range",
|
|
9585
|
+
min: LOGO_SIZE_MIN,
|
|
9586
|
+
max: LOGO_SIZE_MAX,
|
|
9587
|
+
step: 1,
|
|
9588
|
+
value,
|
|
9589
|
+
"aria-label": "Logo size",
|
|
9590
|
+
className: cn(
|
|
9591
|
+
"absolute inset-0 h-full w-full cursor-pointer appearance-none bg-transparent",
|
|
9592
|
+
"[&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:size-5",
|
|
9593
|
+
"[&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-2",
|
|
9594
|
+
"[&::-webkit-slider-thumb]:border-primary [&::-webkit-slider-thumb]:bg-background",
|
|
9595
|
+
"[&::-moz-range-thumb]:size-5 [&::-moz-range-thumb]:rounded-full",
|
|
9596
|
+
"[&::-moz-range-thumb]:border-2 [&::-moz-range-thumb]:border-primary",
|
|
9597
|
+
"[&::-moz-range-thumb]:bg-background"
|
|
9598
|
+
),
|
|
9599
|
+
onChange: (e) => onChange(Number(e.target.value))
|
|
9600
|
+
}
|
|
9601
|
+
)
|
|
9602
|
+
] })
|
|
9603
|
+
] });
|
|
9604
|
+
}
|
|
9605
|
+
function LogoSizePanel({
|
|
9606
|
+
viewport,
|
|
9607
|
+
sizePx,
|
|
9608
|
+
mobileFollowing = true,
|
|
9609
|
+
onSizeChange,
|
|
9610
|
+
onCustomizeMobile,
|
|
9611
|
+
onResetMobile,
|
|
9612
|
+
onUpdateEverywhere,
|
|
9613
|
+
className
|
|
9614
|
+
}) {
|
|
9615
|
+
const showFollowing = viewport === "mobile" && mobileFollowing;
|
|
9616
|
+
const showMobileSlider = viewport === "mobile" && !mobileFollowing;
|
|
9617
|
+
const showDesktopSlider = viewport === "desktop";
|
|
9618
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: cn("flex w-full flex-col gap-4", className), children: [
|
|
9619
|
+
showFollowing ? /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex w-full flex-col gap-2", children: [
|
|
9620
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex items-start gap-1", children: [
|
|
9621
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react13.Link, { size: 16, className: "mt-0.5 shrink-0 text-foreground", "aria-hidden": true }),
|
|
9622
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("p", { className: "text-sm font-semibold leading-5 text-foreground", children: "Following desktop size" })
|
|
9623
|
+
] }),
|
|
9624
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("p", { className: "text-sm leading-5 text-muted-foreground", children: "Mobile uses the desktop size until you customize it. Change the desktop size and it follows automatically." }),
|
|
9625
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
9626
|
+
Button,
|
|
9627
|
+
{
|
|
9628
|
+
type: "button",
|
|
9629
|
+
variant: "outline",
|
|
9630
|
+
size: "sm",
|
|
9631
|
+
className: "h-9 w-full min-w-0 cursor-pointer",
|
|
9632
|
+
onClick: onCustomizeMobile,
|
|
9633
|
+
children: "Customize for mobile"
|
|
9634
|
+
}
|
|
9635
|
+
)
|
|
9636
|
+
] }) : null,
|
|
9637
|
+
showDesktopSlider || showMobileSlider ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SizeSlider, { value: sizePx, onChange: onSizeChange }) : null,
|
|
9638
|
+
showMobileSlider ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
9639
|
+
Button,
|
|
9640
|
+
{
|
|
9641
|
+
type: "button",
|
|
9642
|
+
variant: "outline",
|
|
9643
|
+
size: "sm",
|
|
9644
|
+
className: "h-9 w-full min-w-0 cursor-pointer",
|
|
9645
|
+
onClick: onResetMobile,
|
|
9646
|
+
children: "Reset to desktop size"
|
|
9647
|
+
}
|
|
9648
|
+
) : null,
|
|
9649
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "h-px w-full bg-border", role: "separator" }),
|
|
9650
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
|
|
9651
|
+
Button,
|
|
9652
|
+
{
|
|
9653
|
+
type: "button",
|
|
9654
|
+
variant: "outline",
|
|
9655
|
+
size: "sm",
|
|
9656
|
+
className: "h-9 w-full min-w-0 cursor-pointer gap-1",
|
|
9657
|
+
onClick: onUpdateEverywhere,
|
|
9658
|
+
children: [
|
|
9659
|
+
"Update logo everywhere",
|
|
9660
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react13.ArrowUpRight, { size: 16, "aria-hidden": true })
|
|
9661
|
+
]
|
|
9662
|
+
}
|
|
9663
|
+
),
|
|
9664
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("p", { className: "text-sm leading-5 text-muted-foreground", children: "Matches the right version to your background." })
|
|
9665
|
+
] });
|
|
9666
|
+
}
|
|
9667
|
+
|
|
9286
9668
|
// src/lib/item-drag-interaction.ts
|
|
9287
9669
|
function disableNativeHrefDrag(el) {
|
|
9288
9670
|
if (el.draggable) el.draggable = false;
|
|
@@ -9481,7 +9863,7 @@ function hitTestNavDropSlot(clientX, clientY, draggedHrefKey) {
|
|
|
9481
9863
|
}
|
|
9482
9864
|
|
|
9483
9865
|
// src/useNavItemDrag.ts
|
|
9484
|
-
var
|
|
9866
|
+
var import_react13 = require("react");
|
|
9485
9867
|
function useNavItemDrag({
|
|
9486
9868
|
isEditMode,
|
|
9487
9869
|
editContentRef,
|
|
@@ -9505,11 +9887,11 @@ function useNavItemDrag({
|
|
|
9505
9887
|
getNavigationItemAnchor: getNavigationItemAnchor2,
|
|
9506
9888
|
isDragHandleDisabled: isDragHandleDisabled2
|
|
9507
9889
|
}) {
|
|
9508
|
-
const navDragRef = (0,
|
|
9509
|
-
const [navDropSlots, setNavDropSlots] = (0,
|
|
9510
|
-
const [activeNavDropIndex, setActiveNavDropIndex] = (0,
|
|
9511
|
-
const navPointerDragRef = (0,
|
|
9512
|
-
const clearNavDragVisuals = (0,
|
|
9890
|
+
const navDragRef = (0, import_react13.useRef)(null);
|
|
9891
|
+
const [navDropSlots, setNavDropSlots] = (0, import_react13.useState)([]);
|
|
9892
|
+
const [activeNavDropIndex, setActiveNavDropIndex] = (0, import_react13.useState)(null);
|
|
9893
|
+
const navPointerDragRef = (0, import_react13.useRef)(null);
|
|
9894
|
+
const clearNavDragVisuals = (0, import_react13.useCallback)(() => {
|
|
9513
9895
|
const session = navDragRef.current;
|
|
9514
9896
|
const keepOpenEl = session?.draggedEl?.closest("[data-ohw-nav-children]") != null ? session.draggedEl : null;
|
|
9515
9897
|
navDragRef.current = null;
|
|
@@ -9526,7 +9908,7 @@ function useNavItemDrag({
|
|
|
9526
9908
|
document.documentElement.removeAttribute("data-ohw-nav-dragging-root");
|
|
9527
9909
|
unlockItemDragInteraction();
|
|
9528
9910
|
}, [setDraggedItemRect, setIsItemDragging, setSiblingHintRects]);
|
|
9529
|
-
const refreshNavDragVisuals = (0,
|
|
9911
|
+
const refreshNavDragVisuals = (0, import_react13.useCallback)(
|
|
9530
9912
|
(session, activeSlot, clientX, clientY) => {
|
|
9531
9913
|
setDraggedItemRect(session.draggedEl.getBoundingClientRect());
|
|
9532
9914
|
if (typeof clientX === "number" && typeof clientY === "number") {
|
|
@@ -9544,13 +9926,13 @@ function useNavItemDrag({
|
|
|
9544
9926
|
},
|
|
9545
9927
|
[setDraggedItemRect, setSiblingHintRects]
|
|
9546
9928
|
);
|
|
9547
|
-
const refreshNavDragVisualsRef = (0,
|
|
9929
|
+
const refreshNavDragVisualsRef = (0, import_react13.useRef)(refreshNavDragVisuals);
|
|
9548
9930
|
refreshNavDragVisualsRef.current = refreshNavDragVisuals;
|
|
9549
|
-
const commitNavDragRef = (0,
|
|
9931
|
+
const commitNavDragRef = (0, import_react13.useRef)(() => {
|
|
9550
9932
|
});
|
|
9551
|
-
const beginNavDragRef = (0,
|
|
9933
|
+
const beginNavDragRef = (0, import_react13.useRef)(() => {
|
|
9552
9934
|
});
|
|
9553
|
-
const beginNavDrag = (0,
|
|
9935
|
+
const beginNavDrag = (0, import_react13.useCallback)(
|
|
9554
9936
|
(session) => {
|
|
9555
9937
|
const rect = session.draggedEl.getBoundingClientRect();
|
|
9556
9938
|
session.lastClientX = session.lastClientX || rect.left + rect.width / 2;
|
|
@@ -9584,7 +9966,7 @@ function useNavItemDrag({
|
|
|
9584
9966
|
]
|
|
9585
9967
|
);
|
|
9586
9968
|
beginNavDragRef.current = beginNavDrag;
|
|
9587
|
-
const commitNavDrag = (0,
|
|
9969
|
+
const commitNavDrag = (0, import_react13.useCallback)(
|
|
9588
9970
|
(clientX, clientY) => {
|
|
9589
9971
|
const session = navDragRef.current;
|
|
9590
9972
|
if (!session) {
|
|
@@ -9645,7 +10027,7 @@ function useNavItemDrag({
|
|
|
9645
10027
|
[clearNavDragVisuals, deselectRef, editContentRef, postToParentRef, selectRef]
|
|
9646
10028
|
);
|
|
9647
10029
|
commitNavDragRef.current = commitNavDrag;
|
|
9648
|
-
const startNavLinkDrag = (0,
|
|
10030
|
+
const startNavLinkDrag = (0, import_react13.useCallback)(
|
|
9649
10031
|
(anchor, clientX, clientY, wasSelected) => {
|
|
9650
10032
|
if (footerDragRef.current) return false;
|
|
9651
10033
|
const hrefKey = anchor.getAttribute("data-ohw-href-key");
|
|
@@ -9663,7 +10045,7 @@ function useNavItemDrag({
|
|
|
9663
10045
|
},
|
|
9664
10046
|
[beginNavDrag, footerDragRef, isDragHandleDisabled2, isCtaButton]
|
|
9665
10047
|
);
|
|
9666
|
-
const onNavDragOver = (0,
|
|
10048
|
+
const onNavDragOver = (0, import_react13.useCallback)(
|
|
9667
10049
|
(e) => {
|
|
9668
10050
|
const session = navDragRef.current;
|
|
9669
10051
|
if (!session) return false;
|
|
@@ -9675,7 +10057,7 @@ function useNavItemDrag({
|
|
|
9675
10057
|
},
|
|
9676
10058
|
[]
|
|
9677
10059
|
);
|
|
9678
|
-
(0,
|
|
10060
|
+
(0, import_react13.useEffect)(() => {
|
|
9679
10061
|
if (!isEditMode) return;
|
|
9680
10062
|
const THRESHOLD = 10;
|
|
9681
10063
|
const resolveWasSelected = (el) => {
|
|
@@ -9800,7 +10182,7 @@ function useNavItemDrag({
|
|
|
9800
10182
|
setLinkPopover,
|
|
9801
10183
|
suppressNextClickRef
|
|
9802
10184
|
]);
|
|
9803
|
-
const armNavPressFromChrome = (0,
|
|
10185
|
+
const armNavPressFromChrome = (0, import_react13.useCallback)(
|
|
9804
10186
|
(selected, clientX, clientY, pointerId) => {
|
|
9805
10187
|
const hrefKey = selected.getAttribute("data-ohw-href-key");
|
|
9806
10188
|
if (!hrefKey || !isNavbarHrefKey(hrefKey)) return false;
|
|
@@ -9831,8 +10213,8 @@ function useNavItemDrag({
|
|
|
9831
10213
|
}
|
|
9832
10214
|
|
|
9833
10215
|
// src/ui/footer-container-chrome.tsx
|
|
9834
|
-
var
|
|
9835
|
-
var
|
|
10216
|
+
var import_lucide_react14 = require("lucide-react");
|
|
10217
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
9836
10218
|
function FooterContainerChrome({
|
|
9837
10219
|
rect,
|
|
9838
10220
|
onAdd,
|
|
@@ -9840,7 +10222,7 @@ function FooterContainerChrome({
|
|
|
9840
10222
|
}) {
|
|
9841
10223
|
const chromeGap = 6;
|
|
9842
10224
|
const buttonMargin = 7;
|
|
9843
|
-
return /* @__PURE__ */ (0,
|
|
10225
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
9844
10226
|
"div",
|
|
9845
10227
|
{
|
|
9846
10228
|
"data-ohw-footer-container-chrome": "",
|
|
@@ -9852,8 +10234,8 @@ function FooterContainerChrome({
|
|
|
9852
10234
|
width: rect.width + chromeGap * 2,
|
|
9853
10235
|
height: rect.height + chromeGap * 2
|
|
9854
10236
|
},
|
|
9855
|
-
children: /* @__PURE__ */ (0,
|
|
9856
|
-
/* @__PURE__ */ (0,
|
|
10237
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(Tooltip, { children: [
|
|
10238
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
9857
10239
|
"button",
|
|
9858
10240
|
{
|
|
9859
10241
|
type: "button",
|
|
@@ -9872,17 +10254,17 @@ function FooterContainerChrome({
|
|
|
9872
10254
|
if (addDisabled) return;
|
|
9873
10255
|
onAdd();
|
|
9874
10256
|
},
|
|
9875
|
-
children: /* @__PURE__ */ (0,
|
|
10257
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_lucide_react14.Plus, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
|
|
9876
10258
|
}
|
|
9877
10259
|
) }),
|
|
9878
|
-
/* @__PURE__ */ (0,
|
|
10260
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(TooltipContent, { side: "bottom", sideOffset: 9, children: addDisabled ? "Maximum columns reached" : "Add item" })
|
|
9879
10261
|
] })
|
|
9880
10262
|
}
|
|
9881
10263
|
) });
|
|
9882
10264
|
}
|
|
9883
10265
|
|
|
9884
10266
|
// src/lib/carousel.ts
|
|
9885
|
-
var
|
|
10267
|
+
var import_react14 = require("react");
|
|
9886
10268
|
var CAROUSEL_ATTR = "data-ohw-carousel";
|
|
9887
10269
|
var CAROUSEL_VALUE_ATTR = "data-ohw-carousel-value";
|
|
9888
10270
|
var CAROUSEL_SLIDE_ATTR = "data-ohw-carousel-slide";
|
|
@@ -9944,8 +10326,8 @@ function applyCarouselNode(key, val) {
|
|
|
9944
10326
|
return true;
|
|
9945
10327
|
}
|
|
9946
10328
|
function useOhwCarousel(key, initial) {
|
|
9947
|
-
const [images, setImages] = (0,
|
|
9948
|
-
(0,
|
|
10329
|
+
const [images, setImages] = (0, import_react14.useState)(initial);
|
|
10330
|
+
(0, import_react14.useEffect)(() => {
|
|
9949
10331
|
const el = document.querySelector(
|
|
9950
10332
|
`[${CAROUSEL_ATTR}][data-ohw-key="${CSS.escape(key)}"]`
|
|
9951
10333
|
);
|
|
@@ -10055,6 +10437,18 @@ function collectEditableNodes(extraContent, root = document) {
|
|
|
10055
10437
|
}
|
|
10056
10438
|
if (extraContent && !isScoped) {
|
|
10057
10439
|
applyNavFooterDeleteOverrides(byKey, extraContent);
|
|
10440
|
+
for (const key of LOGO_IMAGE_KEYS) {
|
|
10441
|
+
if (!(key in extraContent)) continue;
|
|
10442
|
+
byKey.set(key, { key, type: "image", text: extraContent[key] ?? "" });
|
|
10443
|
+
}
|
|
10444
|
+
for (const key of [LOGO_PLACEHOLDER_KEY, LOGO_ALT_KEY]) {
|
|
10445
|
+
if (!(key in extraContent)) continue;
|
|
10446
|
+
byKey.set(key, { key, type: "meta", text: extraContent[key] ?? "" });
|
|
10447
|
+
}
|
|
10448
|
+
for (const key of LOGO_SIZE_KEYS) {
|
|
10449
|
+
if (!(key in extraContent)) continue;
|
|
10450
|
+
byKey.set(key, { key, type: "meta", text: extraContent[key] ?? "" });
|
|
10451
|
+
}
|
|
10058
10452
|
}
|
|
10059
10453
|
return Array.from(byKey.values());
|
|
10060
10454
|
}
|
|
@@ -10303,14 +10697,14 @@ function deleteSelectedNavFooterItem(deps) {
|
|
|
10303
10697
|
}
|
|
10304
10698
|
|
|
10305
10699
|
// src/ui/navbar-container-chrome.tsx
|
|
10306
|
-
var
|
|
10307
|
-
var
|
|
10700
|
+
var import_lucide_react15 = require("lucide-react");
|
|
10701
|
+
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
10308
10702
|
function NavbarContainerChrome({
|
|
10309
10703
|
rect,
|
|
10310
10704
|
onAdd
|
|
10311
10705
|
}) {
|
|
10312
10706
|
const chromeGap = 6;
|
|
10313
|
-
return /* @__PURE__ */ (0,
|
|
10707
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
10314
10708
|
"div",
|
|
10315
10709
|
{
|
|
10316
10710
|
"data-ohw-navbar-container-chrome": "",
|
|
@@ -10322,7 +10716,7 @@ function NavbarContainerChrome({
|
|
|
10322
10716
|
width: rect.width + chromeGap * 2,
|
|
10323
10717
|
height: rect.height + chromeGap * 2
|
|
10324
10718
|
},
|
|
10325
|
-
children: /* @__PURE__ */ (0,
|
|
10719
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
10326
10720
|
"button",
|
|
10327
10721
|
{
|
|
10328
10722
|
type: "button",
|
|
@@ -10339,7 +10733,7 @@ function NavbarContainerChrome({
|
|
|
10339
10733
|
e.stopPropagation();
|
|
10340
10734
|
onAdd();
|
|
10341
10735
|
},
|
|
10342
|
-
children: /* @__PURE__ */ (0,
|
|
10736
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_lucide_react15.Plus, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
|
|
10343
10737
|
}
|
|
10344
10738
|
)
|
|
10345
10739
|
}
|
|
@@ -10348,7 +10742,7 @@ function NavbarContainerChrome({
|
|
|
10348
10742
|
|
|
10349
10743
|
// src/ui/drop-indicator.tsx
|
|
10350
10744
|
var React9 = __toESM(require("react"), 1);
|
|
10351
|
-
var
|
|
10745
|
+
var import_jsx_runtime28 = require("react/jsx-runtime");
|
|
10352
10746
|
var dropIndicatorVariants = cva(
|
|
10353
10747
|
"ov-gap-line pointer-events-none shrink-0 transition-opacity duration-150",
|
|
10354
10748
|
{
|
|
@@ -10372,7 +10766,7 @@ var dropIndicatorVariants = cva(
|
|
|
10372
10766
|
);
|
|
10373
10767
|
var DropIndicator = React9.forwardRef(
|
|
10374
10768
|
({ className, direction, state, ...props }, ref) => {
|
|
10375
|
-
return /* @__PURE__ */ (0,
|
|
10769
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
10376
10770
|
"div",
|
|
10377
10771
|
{
|
|
10378
10772
|
ref,
|
|
@@ -10389,7 +10783,7 @@ var DropIndicator = React9.forwardRef(
|
|
|
10389
10783
|
DropIndicator.displayName = "DropIndicator";
|
|
10390
10784
|
|
|
10391
10785
|
// src/ui/badge.tsx
|
|
10392
|
-
var
|
|
10786
|
+
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
10393
10787
|
var badgeVariants = cva(
|
|
10394
10788
|
"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",
|
|
10395
10789
|
{
|
|
@@ -10407,12 +10801,12 @@ var badgeVariants = cva(
|
|
|
10407
10801
|
}
|
|
10408
10802
|
);
|
|
10409
10803
|
function Badge({ className, variant, ...props }) {
|
|
10410
|
-
return /* @__PURE__ */ (0,
|
|
10804
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: cn(badgeVariants({ variant }), className), ...props });
|
|
10411
10805
|
}
|
|
10412
10806
|
|
|
10413
10807
|
// src/OhhwellsBridge.tsx
|
|
10414
|
-
var
|
|
10415
|
-
var
|
|
10808
|
+
var import_lucide_react16 = require("lucide-react");
|
|
10809
|
+
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
10416
10810
|
var PRIMARY3 = "#0885FE";
|
|
10417
10811
|
var IMAGE_FADE_MS = 300;
|
|
10418
10812
|
function runOpacityFade(el, onDone) {
|
|
@@ -10591,7 +10985,7 @@ function mountSchedulingWidget(insertAfter, notifyOnConnect = false, scheduleId,
|
|
|
10591
10985
|
const root = (0, import_client.createRoot)(container);
|
|
10592
10986
|
(0, import_react_dom2.flushSync)(() => {
|
|
10593
10987
|
root.render(
|
|
10594
|
-
/* @__PURE__ */ (0,
|
|
10988
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
10595
10989
|
SchedulingWidget,
|
|
10596
10990
|
{
|
|
10597
10991
|
notifyOnConnect,
|
|
@@ -10746,6 +11140,13 @@ function isInsideLinkEditor(target) {
|
|
|
10746
11140
|
target.closest("[data-ohw-link-popover-root]") || target.closest("[data-ohw-link-modal-root]") || target.closest("[data-ohw-link-page-dropdown]") || target.closest("[data-ohw-section-picker]") || target.closest("[data-ohw-navbar-container-chrome]") || target.closest("[data-ohw-navbar-add-button]") || target.closest("[data-ohw-footer-container-chrome]") || target.closest("[data-ohw-footer-add-button]") || target.closest("[data-ohw-more-menu]") || target.closest('[data-slot="dropdown-menu-content"]') || target.closest('[data-slot="popover-content"]') || target.closest('[data-slot="dialog-content"]') || target.closest('[data-slot="dialog-overlay"]')
|
|
10747
11141
|
);
|
|
10748
11142
|
}
|
|
11143
|
+
function isInsideFloatingPanel(target) {
|
|
11144
|
+
return Boolean(target.closest("[data-ohw-floating-panel]"));
|
|
11145
|
+
}
|
|
11146
|
+
function isPointOverFloatingPanel(clientX, clientY) {
|
|
11147
|
+
const el = document.elementFromPoint(clientX, clientY);
|
|
11148
|
+
return Boolean(el instanceof Element && el.closest("[data-ohw-floating-panel]"));
|
|
11149
|
+
}
|
|
10749
11150
|
function getHrefKeyFromElement(el) {
|
|
10750
11151
|
if (!el) return null;
|
|
10751
11152
|
const anchor = el.closest("[data-ohw-href-key]");
|
|
@@ -11198,7 +11599,7 @@ function EditGlowChrome({
|
|
|
11198
11599
|
hideHandle = false
|
|
11199
11600
|
}) {
|
|
11200
11601
|
const GAP = SELECTION_CHROME_GAP2;
|
|
11201
|
-
return /* @__PURE__ */ (0,
|
|
11602
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
|
|
11202
11603
|
"div",
|
|
11203
11604
|
{
|
|
11204
11605
|
ref: elRef,
|
|
@@ -11213,7 +11614,7 @@ function EditGlowChrome({
|
|
|
11213
11614
|
zIndex: 2147483646
|
|
11214
11615
|
},
|
|
11215
11616
|
children: [
|
|
11216
|
-
/* @__PURE__ */ (0,
|
|
11617
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
11217
11618
|
"div",
|
|
11218
11619
|
{
|
|
11219
11620
|
style: {
|
|
@@ -11226,7 +11627,7 @@ function EditGlowChrome({
|
|
|
11226
11627
|
}
|
|
11227
11628
|
}
|
|
11228
11629
|
),
|
|
11229
|
-
reorderHrefKey && !hideHandle && /* @__PURE__ */ (0,
|
|
11630
|
+
reorderHrefKey && !hideHandle && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
11230
11631
|
"div",
|
|
11231
11632
|
{
|
|
11232
11633
|
"data-ohw-drag-handle-container": "",
|
|
@@ -11238,7 +11639,7 @@ function EditGlowChrome({
|
|
|
11238
11639
|
transform: "translate(calc(-100% - 7px), -50%)",
|
|
11239
11640
|
pointerEvents: dragDisabled ? "none" : "auto"
|
|
11240
11641
|
},
|
|
11241
|
-
children: /* @__PURE__ */ (0,
|
|
11642
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
11242
11643
|
DragHandle,
|
|
11243
11644
|
{
|
|
11244
11645
|
"aria-label": `Reorder ${reorderHrefKey}`,
|
|
@@ -11421,9 +11822,9 @@ function FloatingToolbar({
|
|
|
11421
11822
|
showEditLink,
|
|
11422
11823
|
onEditLink
|
|
11423
11824
|
}) {
|
|
11424
|
-
const localRef =
|
|
11425
|
-
const [measuredW, setMeasuredW] =
|
|
11426
|
-
const setRefs =
|
|
11825
|
+
const localRef = import_react15.default.useRef(null);
|
|
11826
|
+
const [measuredW, setMeasuredW] = import_react15.default.useState(330);
|
|
11827
|
+
const setRefs = import_react15.default.useCallback(
|
|
11427
11828
|
(node) => {
|
|
11428
11829
|
localRef.current = node;
|
|
11429
11830
|
if (typeof elRef === "function") elRef(node);
|
|
@@ -11435,7 +11836,7 @@ function FloatingToolbar({
|
|
|
11435
11836
|
},
|
|
11436
11837
|
[elRef]
|
|
11437
11838
|
);
|
|
11438
|
-
|
|
11839
|
+
import_react15.default.useLayoutEffect(() => {
|
|
11439
11840
|
const node = localRef.current;
|
|
11440
11841
|
if (!node) return;
|
|
11441
11842
|
const update = () => {
|
|
@@ -11448,7 +11849,7 @@ function FloatingToolbar({
|
|
|
11448
11849
|
return () => ro.disconnect();
|
|
11449
11850
|
}, [showEditLink, activeCommands]);
|
|
11450
11851
|
const { top, left, transform } = calcToolbarPos(rect, parentScroll, measuredW);
|
|
11451
|
-
return /* @__PURE__ */ (0,
|
|
11852
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
11452
11853
|
"div",
|
|
11453
11854
|
{
|
|
11454
11855
|
ref: setRefs,
|
|
@@ -11460,12 +11861,12 @@ function FloatingToolbar({
|
|
|
11460
11861
|
zIndex: 2147483647,
|
|
11461
11862
|
pointerEvents: "auto"
|
|
11462
11863
|
},
|
|
11463
|
-
children: /* @__PURE__ */ (0,
|
|
11464
|
-
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ (0,
|
|
11465
|
-
gi > 0 && /* @__PURE__ */ (0,
|
|
11864
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(CustomToolbar, { children: [
|
|
11865
|
+
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react15.default.Fragment, { children: [
|
|
11866
|
+
gi > 0 && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(CustomToolbarDivider, {}),
|
|
11466
11867
|
btns.map((btn) => {
|
|
11467
11868
|
const isActive = activeCommands.has(btn.cmd);
|
|
11468
|
-
return /* @__PURE__ */ (0,
|
|
11869
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
11469
11870
|
CustomToolbarButton,
|
|
11470
11871
|
{
|
|
11471
11872
|
title: btn.title,
|
|
@@ -11474,7 +11875,7 @@ function FloatingToolbar({
|
|
|
11474
11875
|
e.preventDefault();
|
|
11475
11876
|
onCommand(btn.cmd);
|
|
11476
11877
|
},
|
|
11477
|
-
children: /* @__PURE__ */ (0,
|
|
11878
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
11478
11879
|
"svg",
|
|
11479
11880
|
{
|
|
11480
11881
|
width: "16",
|
|
@@ -11495,7 +11896,7 @@ function FloatingToolbar({
|
|
|
11495
11896
|
);
|
|
11496
11897
|
})
|
|
11497
11898
|
] }, gi)),
|
|
11498
|
-
showEditLink ? /* @__PURE__ */ (0,
|
|
11899
|
+
showEditLink ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
11499
11900
|
CustomToolbarButton,
|
|
11500
11901
|
{
|
|
11501
11902
|
type: "button",
|
|
@@ -11509,7 +11910,7 @@ function FloatingToolbar({
|
|
|
11509
11910
|
e.preventDefault();
|
|
11510
11911
|
e.stopPropagation();
|
|
11511
11912
|
},
|
|
11512
|
-
children: /* @__PURE__ */ (0,
|
|
11913
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_lucide_react16.Link, { className: "size-4 shrink-0", "aria-hidden": true })
|
|
11513
11914
|
}
|
|
11514
11915
|
) : null
|
|
11515
11916
|
] })
|
|
@@ -11526,7 +11927,7 @@ function StateToggle({
|
|
|
11526
11927
|
states,
|
|
11527
11928
|
onStateChange
|
|
11528
11929
|
}) {
|
|
11529
|
-
return /* @__PURE__ */ (0,
|
|
11930
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
11530
11931
|
ToggleGroup,
|
|
11531
11932
|
{
|
|
11532
11933
|
"data-ohw-state-toggle": "",
|
|
@@ -11540,7 +11941,7 @@ function StateToggle({
|
|
|
11540
11941
|
left: rect.right - 8,
|
|
11541
11942
|
transform: "translateX(-100%)"
|
|
11542
11943
|
},
|
|
11543
|
-
children: states.map((state) => /* @__PURE__ */ (0,
|
|
11944
|
+
children: states.map((state) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ToggleGroupItem, { value: state, size: "sm", children: state }, state))
|
|
11544
11945
|
}
|
|
11545
11946
|
);
|
|
11546
11947
|
}
|
|
@@ -11567,8 +11968,8 @@ function OhhwellsBridge() {
|
|
|
11567
11968
|
const router = (0, import_navigation3.useRouter)();
|
|
11568
11969
|
const searchParams = (0, import_navigation3.useSearchParams)();
|
|
11569
11970
|
const isEditMode = isEditSessionActive();
|
|
11570
|
-
const [bridgeRoot, setBridgeRoot] = (0,
|
|
11571
|
-
(0,
|
|
11971
|
+
const [bridgeRoot, setBridgeRoot] = (0, import_react15.useState)(null);
|
|
11972
|
+
(0, import_react15.useEffect)(() => {
|
|
11572
11973
|
const figtreeFontId = "ohw-figtree-font";
|
|
11573
11974
|
if (!document.getElementById(figtreeFontId)) {
|
|
11574
11975
|
const preconnect1 = Object.assign(document.createElement("link"), { rel: "preconnect", href: "https://fonts.googleapis.com" });
|
|
@@ -11597,109 +11998,133 @@ function OhhwellsBridge() {
|
|
|
11597
11998
|
const subdomain = resolveSubdomain(subdomainFromQuery);
|
|
11598
11999
|
useLinkHrefGuardian(pathname, subdomain, isEditMode);
|
|
11599
12000
|
useSavedLinkNavigation(isEditMode);
|
|
11600
|
-
const postToParent2 = (0,
|
|
12001
|
+
const postToParent2 = (0, import_react15.useCallback)((data) => {
|
|
11601
12002
|
if (typeof window !== "undefined" && window.parent !== window) {
|
|
11602
12003
|
window.parent.postMessage(data, "*");
|
|
11603
12004
|
}
|
|
11604
12005
|
}, []);
|
|
11605
|
-
const [fetchState, setFetchState] = (0,
|
|
11606
|
-
const autoSaveTimers = (0,
|
|
11607
|
-
const activeElRef = (0,
|
|
11608
|
-
const pointerHeldRef = (0,
|
|
11609
|
-
const selectedElRef = (0,
|
|
11610
|
-
const selectedHrefKeyRef = (0,
|
|
11611
|
-
const selectedFooterColAttrRef = (0,
|
|
11612
|
-
const originalContentRef = (0,
|
|
11613
|
-
const activeStateElRef = (0,
|
|
11614
|
-
const parentScrollRef = (0,
|
|
11615
|
-
const visibleViewportRef = (0,
|
|
11616
|
-
const [dialogPortalContainer, setDialogPortalContainer] = (0,
|
|
11617
|
-
const attachVisibleViewport = (0,
|
|
12006
|
+
const [fetchState, setFetchState] = (0, import_react15.useState)("idle");
|
|
12007
|
+
const autoSaveTimers = (0, import_react15.useRef)(/* @__PURE__ */ new Map());
|
|
12008
|
+
const activeElRef = (0, import_react15.useRef)(null);
|
|
12009
|
+
const pointerHeldRef = (0, import_react15.useRef)(false);
|
|
12010
|
+
const selectedElRef = (0, import_react15.useRef)(null);
|
|
12011
|
+
const selectedHrefKeyRef = (0, import_react15.useRef)(null);
|
|
12012
|
+
const selectedFooterColAttrRef = (0, import_react15.useRef)(null);
|
|
12013
|
+
const originalContentRef = (0, import_react15.useRef)(null);
|
|
12014
|
+
const activeStateElRef = (0, import_react15.useRef)(null);
|
|
12015
|
+
const parentScrollRef = (0, import_react15.useRef)(null);
|
|
12016
|
+
const visibleViewportRef = (0, import_react15.useRef)(null);
|
|
12017
|
+
const [dialogPortalContainer, setDialogPortalContainer] = (0, import_react15.useState)(null);
|
|
12018
|
+
const attachVisibleViewport = (0, import_react15.useCallback)((node) => {
|
|
11618
12019
|
visibleViewportRef.current = node;
|
|
11619
12020
|
setDialogPortalContainer(node);
|
|
11620
12021
|
if (node) applyVisibleViewport(node, parentScrollRef.current);
|
|
11621
12022
|
}, []);
|
|
11622
|
-
const toolbarElRef = (0,
|
|
11623
|
-
const glowElRef = (0,
|
|
11624
|
-
const hoveredImageRef = (0,
|
|
11625
|
-
const hoveredImageHasTextOverlapRef = (0,
|
|
11626
|
-
const dragOverElRef = (0,
|
|
11627
|
-
const [mediaHover, setMediaHover] = (0,
|
|
11628
|
-
const [carouselHover, setCarouselHover] = (0,
|
|
11629
|
-
const [uploadingRects, setUploadingRects] = (0,
|
|
11630
|
-
const hoveredGapRef = (0,
|
|
11631
|
-
const imageUnhoverTimerRef = (0,
|
|
11632
|
-
const imageShowTimerRef = (0,
|
|
11633
|
-
const editStylesRef = (0,
|
|
11634
|
-
const activateRef = (0,
|
|
12023
|
+
const toolbarElRef = (0, import_react15.useRef)(null);
|
|
12024
|
+
const glowElRef = (0, import_react15.useRef)(null);
|
|
12025
|
+
const hoveredImageRef = (0, import_react15.useRef)(null);
|
|
12026
|
+
const hoveredImageHasTextOverlapRef = (0, import_react15.useRef)(false);
|
|
12027
|
+
const dragOverElRef = (0, import_react15.useRef)(null);
|
|
12028
|
+
const [mediaHover, setMediaHover] = (0, import_react15.useState)(null);
|
|
12029
|
+
const [carouselHover, setCarouselHover] = (0, import_react15.useState)(null);
|
|
12030
|
+
const [uploadingRects, setUploadingRects] = (0, import_react15.useState)({});
|
|
12031
|
+
const hoveredGapRef = (0, import_react15.useRef)(null);
|
|
12032
|
+
const imageUnhoverTimerRef = (0, import_react15.useRef)(null);
|
|
12033
|
+
const imageShowTimerRef = (0, import_react15.useRef)(null);
|
|
12034
|
+
const editStylesRef = (0, import_react15.useRef)(null);
|
|
12035
|
+
const activateRef = (0, import_react15.useRef)(() => {
|
|
12036
|
+
});
|
|
12037
|
+
const deactivateRef = (0, import_react15.useRef)(() => {
|
|
11635
12038
|
});
|
|
11636
|
-
const
|
|
12039
|
+
const selectRef = (0, import_react15.useRef)(() => {
|
|
11637
12040
|
});
|
|
11638
|
-
const
|
|
12041
|
+
const selectFrameRef = (0, import_react15.useRef)(() => {
|
|
11639
12042
|
});
|
|
11640
|
-
const
|
|
12043
|
+
const selectLogoRef = (0, import_react15.useRef)(() => {
|
|
11641
12044
|
});
|
|
11642
|
-
const
|
|
12045
|
+
const openLogoSizePanelRef = (0, import_react15.useRef)(() => {
|
|
11643
12046
|
});
|
|
11644
|
-
const
|
|
12047
|
+
const deselectRef = (0, import_react15.useRef)(() => {
|
|
11645
12048
|
});
|
|
11646
|
-
const
|
|
12049
|
+
const closeFloatingPanelOnlyRef = (0, import_react15.useRef)(() => {
|
|
11647
12050
|
});
|
|
11648
|
-
const
|
|
11649
|
-
const runPendingDeleteUndoRef = (0, import_react14.useRef)(() => false);
|
|
11650
|
-
const isFooterFrameSelectionRef = (0, import_react14.useRef)(false);
|
|
11651
|
-
const refreshActiveCommandsRef = (0, import_react14.useRef)(() => {
|
|
12051
|
+
const reselectNavigationItemRef = (0, import_react15.useRef)(() => {
|
|
11652
12052
|
});
|
|
11653
|
-
const
|
|
12053
|
+
const commitNavigationTextEditRef = (0, import_react15.useRef)(() => {
|
|
12054
|
+
});
|
|
12055
|
+
const handleDeleteSelectedRef = (0, import_react15.useRef)(() => false);
|
|
12056
|
+
const runPendingDeleteUndoRef = (0, import_react15.useRef)(() => false);
|
|
12057
|
+
const isFooterFrameSelectionRef = (0, import_react15.useRef)(false);
|
|
12058
|
+
const refreshActiveCommandsRef = (0, import_react15.useRef)(() => {
|
|
12059
|
+
});
|
|
12060
|
+
const postToParentRef = (0, import_react15.useRef)(postToParent2);
|
|
11654
12061
|
postToParentRef.current = postToParent2;
|
|
11655
|
-
const aiSectionApiRef = (0,
|
|
11656
|
-
const sectionsLoadedRef = (0,
|
|
11657
|
-
const pendingScheduleConfigRequests = (0,
|
|
11658
|
-
const [toolbarRect, setToolbarRect] = (0,
|
|
11659
|
-
const [toolbarVariant, setToolbarVariant] = (0,
|
|
11660
|
-
const toolbarVariantRef = (0,
|
|
12062
|
+
const aiSectionApiRef = (0, import_react15.useRef)(null);
|
|
12063
|
+
const sectionsLoadedRef = (0, import_react15.useRef)(false);
|
|
12064
|
+
const pendingScheduleConfigRequests = (0, import_react15.useRef)([]);
|
|
12065
|
+
const [toolbarRect, setToolbarRect] = (0, import_react15.useState)(null);
|
|
12066
|
+
const [toolbarVariant, setToolbarVariant] = (0, import_react15.useState)("none");
|
|
12067
|
+
const toolbarVariantRef = (0, import_react15.useRef)("none");
|
|
11661
12068
|
toolbarVariantRef.current = toolbarVariant;
|
|
11662
|
-
const [selectedIsCta, setSelectedIsCta] = (0,
|
|
11663
|
-
const [reorderHrefKey, setReorderHrefKey] = (0,
|
|
11664
|
-
const [reorderDragDisabled, setReorderDragDisabled] = (0,
|
|
11665
|
-
const [toggleState, setToggleState] = (0,
|
|
11666
|
-
const [maxBadge, setMaxBadge] = (0,
|
|
11667
|
-
const [activeCommands, setActiveCommands] = (0,
|
|
11668
|
-
const [sectionGap, setSectionGap] = (0,
|
|
11669
|
-
const [toolbarShowEditLink, setToolbarShowEditLink] = (0,
|
|
11670
|
-
const hoveredNavContainerRef = (0,
|
|
11671
|
-
const [hoveredNavContainerRect, setHoveredNavContainerRect] = (0,
|
|
11672
|
-
const hoveredItemElRef = (0,
|
|
11673
|
-
const [hoveredItemRect, setHoveredItemRect] = (0,
|
|
11674
|
-
const siblingHintElRef = (0,
|
|
11675
|
-
const [siblingHintRect, setSiblingHintRect] = (0,
|
|
11676
|
-
const [siblingHintRects, setSiblingHintRects] = (0,
|
|
11677
|
-
const [isItemDragging, setIsItemDragging] = (0,
|
|
11678
|
-
const [isFooterFrameSelection, setIsFooterFrameSelection] = (0,
|
|
12069
|
+
const [selectedIsCta, setSelectedIsCta] = (0, import_react15.useState)(false);
|
|
12070
|
+
const [reorderHrefKey, setReorderHrefKey] = (0, import_react15.useState)(null);
|
|
12071
|
+
const [reorderDragDisabled, setReorderDragDisabled] = (0, import_react15.useState)(false);
|
|
12072
|
+
const [toggleState, setToggleState] = (0, import_react15.useState)(null);
|
|
12073
|
+
const [maxBadge, setMaxBadge] = (0, import_react15.useState)(null);
|
|
12074
|
+
const [activeCommands, setActiveCommands] = (0, import_react15.useState)(/* @__PURE__ */ new Set());
|
|
12075
|
+
const [sectionGap, setSectionGap] = (0, import_react15.useState)(null);
|
|
12076
|
+
const [toolbarShowEditLink, setToolbarShowEditLink] = (0, import_react15.useState)(false);
|
|
12077
|
+
const hoveredNavContainerRef = (0, import_react15.useRef)(null);
|
|
12078
|
+
const [hoveredNavContainerRect, setHoveredNavContainerRect] = (0, import_react15.useState)(null);
|
|
12079
|
+
const hoveredItemElRef = (0, import_react15.useRef)(null);
|
|
12080
|
+
const [hoveredItemRect, setHoveredItemRect] = (0, import_react15.useState)(null);
|
|
12081
|
+
const siblingHintElRef = (0, import_react15.useRef)(null);
|
|
12082
|
+
const [siblingHintRect, setSiblingHintRect] = (0, import_react15.useState)(null);
|
|
12083
|
+
const [siblingHintRects, setSiblingHintRects] = (0, import_react15.useState)([]);
|
|
12084
|
+
const [isItemDragging, setIsItemDragging] = (0, import_react15.useState)(false);
|
|
12085
|
+
const [isFooterFrameSelection, setIsFooterFrameSelection] = (0, import_react15.useState)(false);
|
|
11679
12086
|
isFooterFrameSelectionRef.current = isFooterFrameSelection;
|
|
11680
|
-
const [navDropdownPreviewOpen, setNavDropdownPreviewOpen] = (0,
|
|
11681
|
-
const [footerHeadingVisible, setFooterHeadingVisible] = (0,
|
|
11682
|
-
const footerDragRef = (0,
|
|
11683
|
-
const [footerDropSlots, setFooterDropSlots] = (0,
|
|
11684
|
-
const [activeFooterDropIndex, setActiveFooterDropIndex] = (0,
|
|
11685
|
-
const [draggedItemRect, setDraggedItemRect] = (0,
|
|
11686
|
-
const footerPointerDragRef = (0,
|
|
11687
|
-
const suppressNextClickRef = (0,
|
|
11688
|
-
const suppressClickUntilRef = (0,
|
|
11689
|
-
const [linkPopover, setLinkPopover] = (0,
|
|
11690
|
-
const linkPopoverSessionRef = (0,
|
|
11691
|
-
const addNavAfterAnchorRef = (0,
|
|
11692
|
-
const editContentRef = (0,
|
|
11693
|
-
const pendingDeleteUndoRef = (0,
|
|
11694
|
-
const [
|
|
11695
|
-
const
|
|
11696
|
-
const
|
|
11697
|
-
const
|
|
11698
|
-
const
|
|
11699
|
-
const
|
|
11700
|
-
const
|
|
12087
|
+
const [navDropdownPreviewOpen, setNavDropdownPreviewOpen] = (0, import_react15.useState)(null);
|
|
12088
|
+
const [footerHeadingVisible, setFooterHeadingVisible] = (0, import_react15.useState)(null);
|
|
12089
|
+
const footerDragRef = (0, import_react15.useRef)(null);
|
|
12090
|
+
const [footerDropSlots, setFooterDropSlots] = (0, import_react15.useState)([]);
|
|
12091
|
+
const [activeFooterDropIndex, setActiveFooterDropIndex] = (0, import_react15.useState)(null);
|
|
12092
|
+
const [draggedItemRect, setDraggedItemRect] = (0, import_react15.useState)(null);
|
|
12093
|
+
const footerPointerDragRef = (0, import_react15.useRef)(null);
|
|
12094
|
+
const suppressNextClickRef = (0, import_react15.useRef)(false);
|
|
12095
|
+
const suppressClickUntilRef = (0, import_react15.useRef)(0);
|
|
12096
|
+
const [linkPopover, setLinkPopover] = (0, import_react15.useState)(null);
|
|
12097
|
+
const linkPopoverSessionRef = (0, import_react15.useRef)(null);
|
|
12098
|
+
const addNavAfterAnchorRef = (0, import_react15.useRef)(null);
|
|
12099
|
+
const editContentRef = (0, import_react15.useRef)({});
|
|
12100
|
+
const pendingDeleteUndoRef = (0, import_react15.useRef)(null);
|
|
12101
|
+
const [floatingPanel, setFloatingPanel] = (0, import_react15.useState)(null);
|
|
12102
|
+
const floatingPanelOpenRef = (0, import_react15.useRef)(false);
|
|
12103
|
+
const setFloatingPanelRef = (0, import_react15.useRef)(setFloatingPanel);
|
|
12104
|
+
const [floatingPanelPos, setFloatingPanelPos] = (0, import_react15.useState)(null);
|
|
12105
|
+
const [logoSizeDraft, setLogoSizeDraft] = (0, import_react15.useState)(null);
|
|
12106
|
+
const [editorViewport, setEditorViewport] = (0, import_react15.useState)("desktop");
|
|
12107
|
+
const [parentScrollSnap, setParentScrollSnap] = (0, import_react15.useState)(null);
|
|
12108
|
+
const [sitePages, setSitePages] = (0, import_react15.useState)([]);
|
|
12109
|
+
const [sectionsByPath, setSectionsByPath] = (0, import_react15.useState)({});
|
|
12110
|
+
const sectionsPrefetchGenRef = (0, import_react15.useRef)(0);
|
|
12111
|
+
const setLinkPopoverRef = (0, import_react15.useRef)(setLinkPopover);
|
|
12112
|
+
const linkPopoverPanelRef = (0, import_react15.useRef)(null);
|
|
12113
|
+
const linkPopoverOpenRef = (0, import_react15.useRef)(false);
|
|
12114
|
+
const linkPopoverGraceUntilRef = (0, import_react15.useRef)(0);
|
|
11701
12115
|
setLinkPopoverRef.current = setLinkPopover;
|
|
12116
|
+
setFloatingPanelRef.current = setFloatingPanel;
|
|
11702
12117
|
linkPopoverSessionRef.current = linkPopover;
|
|
12118
|
+
floatingPanelOpenRef.current = Boolean(floatingPanel);
|
|
12119
|
+
(0, import_react15.useEffect)(() => {
|
|
12120
|
+
const syncViewport = () => {
|
|
12121
|
+
const next = window.innerWidth <= 480 ? "mobile" : "desktop";
|
|
12122
|
+
setEditorViewport((prev) => prev === next ? prev : next);
|
|
12123
|
+
};
|
|
12124
|
+
syncViewport();
|
|
12125
|
+
window.addEventListener("resize", syncViewport);
|
|
12126
|
+
return () => window.removeEventListener("resize", syncViewport);
|
|
12127
|
+
}, []);
|
|
11703
12128
|
const {
|
|
11704
12129
|
navDragRef,
|
|
11705
12130
|
navDropSlots,
|
|
@@ -11735,7 +12160,7 @@ function OhhwellsBridge() {
|
|
|
11735
12160
|
const bumpLinkPopoverGrace = () => {
|
|
11736
12161
|
linkPopoverGraceUntilRef.current = Date.now() + 350;
|
|
11737
12162
|
};
|
|
11738
|
-
const runSectionsPrefetch = (0,
|
|
12163
|
+
const runSectionsPrefetch = (0, import_react15.useCallback)((pages) => {
|
|
11739
12164
|
if (!isEditMode || shouldUseDevFixtures() || pages.length === 0) return;
|
|
11740
12165
|
const gen = ++sectionsPrefetchGenRef.current;
|
|
11741
12166
|
const paths = pages.map((p) => p.path);
|
|
@@ -11754,9 +12179,9 @@ function OhhwellsBridge() {
|
|
|
11754
12179
|
);
|
|
11755
12180
|
});
|
|
11756
12181
|
}, [isEditMode, pathname]);
|
|
11757
|
-
const runSectionsPrefetchRef = (0,
|
|
12182
|
+
const runSectionsPrefetchRef = (0, import_react15.useRef)(runSectionsPrefetch);
|
|
11758
12183
|
runSectionsPrefetchRef.current = runSectionsPrefetch;
|
|
11759
|
-
(0,
|
|
12184
|
+
(0, import_react15.useEffect)(() => {
|
|
11760
12185
|
if (!linkPopover) {
|
|
11761
12186
|
document.documentElement.removeAttribute("data-ohw-link-popover-open");
|
|
11762
12187
|
return;
|
|
@@ -11784,7 +12209,7 @@ function OhhwellsBridge() {
|
|
|
11784
12209
|
document.documentElement.removeAttribute("data-ohw-link-popover-open");
|
|
11785
12210
|
};
|
|
11786
12211
|
}, [linkPopover, postToParent2]);
|
|
11787
|
-
(0,
|
|
12212
|
+
(0, import_react15.useEffect)(() => {
|
|
11788
12213
|
if (!isEditMode) return;
|
|
11789
12214
|
const useFixtures = shouldUseDevFixtures();
|
|
11790
12215
|
if (useFixtures) {
|
|
@@ -11808,14 +12233,14 @@ function OhhwellsBridge() {
|
|
|
11808
12233
|
if (!useFixtures) postToParent2({ type: "ow:request-site-pages" });
|
|
11809
12234
|
return () => window.removeEventListener("message", onSitePages);
|
|
11810
12235
|
}, [isEditMode, postToParent2]);
|
|
11811
|
-
(0,
|
|
12236
|
+
(0, import_react15.useEffect)(() => {
|
|
11812
12237
|
if (!isEditMode || shouldUseDevFixtures()) return;
|
|
11813
12238
|
void loadAllSectionsManifest().then((manifest) => {
|
|
11814
12239
|
if (Object.keys(manifest).length === 0) return;
|
|
11815
12240
|
setSectionsByPath((prev) => ({ ...manifest, ...prev }));
|
|
11816
12241
|
});
|
|
11817
12242
|
}, [isEditMode]);
|
|
11818
|
-
(0,
|
|
12243
|
+
(0, import_react15.useEffect)(() => {
|
|
11819
12244
|
const update = () => {
|
|
11820
12245
|
const el = activeElRef.current ?? selectedElRef.current;
|
|
11821
12246
|
if (el) setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
@@ -11839,10 +12264,10 @@ function OhhwellsBridge() {
|
|
|
11839
12264
|
vvp.removeEventListener("resize", update);
|
|
11840
12265
|
};
|
|
11841
12266
|
}, []);
|
|
11842
|
-
const refreshStateRules = (0,
|
|
12267
|
+
const refreshStateRules = (0, import_react15.useCallback)(() => {
|
|
11843
12268
|
editStylesRef.current?.forceHover && (editStylesRef.current.forceHover.textContent = collectStateRules());
|
|
11844
12269
|
}, []);
|
|
11845
|
-
const processConfigRequest = (0,
|
|
12270
|
+
const processConfigRequest = (0, import_react15.useCallback)((insertAfterVal) => {
|
|
11846
12271
|
const tracker = getSectionsTracker();
|
|
11847
12272
|
let entries = [];
|
|
11848
12273
|
try {
|
|
@@ -11865,7 +12290,7 @@ function OhhwellsBridge() {
|
|
|
11865
12290
|
}
|
|
11866
12291
|
window.postMessage({ type: "ow:schedule-config", insertAfter: insertAfterVal, scheduleId: null }, "*");
|
|
11867
12292
|
}, [isEditMode]);
|
|
11868
|
-
const deactivate = (0,
|
|
12293
|
+
const deactivate = (0, import_react15.useCallback)(() => {
|
|
11869
12294
|
const el = activeElRef.current;
|
|
11870
12295
|
if (!el) return;
|
|
11871
12296
|
const key = el.dataset.ohwKey;
|
|
@@ -11898,12 +12323,12 @@ function OhhwellsBridge() {
|
|
|
11898
12323
|
setToolbarShowEditLink(false);
|
|
11899
12324
|
postToParent2({ type: "ow:exit-edit" });
|
|
11900
12325
|
}, [postToParent2]);
|
|
11901
|
-
const clearSelectedAttr = (0,
|
|
12326
|
+
const clearSelectedAttr = (0, import_react15.useCallback)(() => {
|
|
11902
12327
|
document.querySelectorAll("[data-ohw-selected]").forEach((el) => {
|
|
11903
12328
|
el.removeAttribute("data-ohw-selected");
|
|
11904
12329
|
});
|
|
11905
12330
|
}, []);
|
|
11906
|
-
const deselect = (0,
|
|
12331
|
+
const deselect = (0, import_react15.useCallback)(() => {
|
|
11907
12332
|
clearSelectedAttr();
|
|
11908
12333
|
selectedElRef.current = null;
|
|
11909
12334
|
selectedHrefKeyRef.current = null;
|
|
@@ -11922,17 +12347,19 @@ function OhhwellsBridge() {
|
|
|
11922
12347
|
setHoveredNavContainerRect(null);
|
|
11923
12348
|
hoveredItemElRef.current = null;
|
|
11924
12349
|
setHoveredItemRect(null);
|
|
12350
|
+
setFloatingPanel(null);
|
|
12351
|
+
setLogoSizeDraft(null);
|
|
11925
12352
|
if (!activeElRef.current) {
|
|
11926
12353
|
setNavGroupForceOpen(null, false);
|
|
11927
12354
|
setToolbarRect(null);
|
|
11928
12355
|
setToolbarVariant("none");
|
|
11929
12356
|
}
|
|
11930
12357
|
}, [clearSelectedAttr]);
|
|
11931
|
-
const markSelected = (0,
|
|
12358
|
+
const markSelected = (0, import_react15.useCallback)((el) => {
|
|
11932
12359
|
clearSelectedAttr();
|
|
11933
12360
|
el.setAttribute("data-ohw-selected", "");
|
|
11934
12361
|
}, [clearSelectedAttr]);
|
|
11935
|
-
const resolveHrefKeyElement = (0,
|
|
12362
|
+
const resolveHrefKeyElement = (0, import_react15.useCallback)((hrefKey) => {
|
|
11936
12363
|
if (isFooterHrefKey(hrefKey)) {
|
|
11937
12364
|
return document.querySelector(
|
|
11938
12365
|
`footer [data-ohw-href-key="${CSS.escape(hrefKey)}"]`
|
|
@@ -11947,7 +12374,7 @@ function OhhwellsBridge() {
|
|
|
11947
12374
|
`[data-ohw-href-key="${CSS.escape(hrefKey)}"]`
|
|
11948
12375
|
);
|
|
11949
12376
|
}, []);
|
|
11950
|
-
const resyncSelectedNavigationItem = (0,
|
|
12377
|
+
const resyncSelectedNavigationItem = (0, import_react15.useCallback)(() => {
|
|
11951
12378
|
const hrefKey = selectedHrefKeyRef.current;
|
|
11952
12379
|
if (hrefKey) {
|
|
11953
12380
|
const link = resolveHrefKeyElement(hrefKey);
|
|
@@ -11985,7 +12412,7 @@ function OhhwellsBridge() {
|
|
|
11985
12412
|
);
|
|
11986
12413
|
}
|
|
11987
12414
|
}, [resolveHrefKeyElement]);
|
|
11988
|
-
const reselectNavigationItem = (0,
|
|
12415
|
+
const reselectNavigationItem = (0, import_react15.useCallback)((navAnchor) => {
|
|
11989
12416
|
selectedElRef.current = navAnchor;
|
|
11990
12417
|
selectedHrefKeyRef.current = navAnchor.getAttribute("data-ohw-href-key");
|
|
11991
12418
|
selectedFooterColAttrRef.current = null;
|
|
@@ -12014,7 +12441,7 @@ function OhhwellsBridge() {
|
|
|
12014
12441
|
setToolbarShowEditLink(false);
|
|
12015
12442
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
12016
12443
|
}, [markSelected]);
|
|
12017
|
-
const commitNavigationTextEdit = (0,
|
|
12444
|
+
const commitNavigationTextEdit = (0, import_react15.useCallback)((navAnchor) => {
|
|
12018
12445
|
const el = activeElRef.current;
|
|
12019
12446
|
if (!el) return;
|
|
12020
12447
|
const key = el.dataset.ohwKey;
|
|
@@ -12041,7 +12468,7 @@ function OhhwellsBridge() {
|
|
|
12041
12468
|
postToParent2({ type: "ow:exit-edit" });
|
|
12042
12469
|
reselectNavigationItem(navAnchor);
|
|
12043
12470
|
}, [postToParent2, reselectNavigationItem]);
|
|
12044
|
-
const handleAddTopLevelNavItem = (0,
|
|
12471
|
+
const handleAddTopLevelNavItem = (0, import_react15.useCallback)(() => {
|
|
12045
12472
|
const items = listNavbarRootItems();
|
|
12046
12473
|
addNavAfterAnchorRef.current = items[items.length - 1] ?? null;
|
|
12047
12474
|
deselectRef.current();
|
|
@@ -12053,7 +12480,7 @@ function OhhwellsBridge() {
|
|
|
12053
12480
|
intent: "add-nav"
|
|
12054
12481
|
});
|
|
12055
12482
|
}, []);
|
|
12056
|
-
const maybeWarnNavLinkDropdownConflict = (0,
|
|
12483
|
+
const maybeWarnNavLinkDropdownConflict = (0, import_react15.useCallback)(
|
|
12057
12484
|
(anchor) => {
|
|
12058
12485
|
if (!isNavbarHrefKey(anchor.getAttribute("data-ohw-href-key"))) return;
|
|
12059
12486
|
if (!navDropdownsOpenOnClick()) return;
|
|
@@ -12066,7 +12493,7 @@ function OhhwellsBridge() {
|
|
|
12066
12493
|
},
|
|
12067
12494
|
[postToParent2]
|
|
12068
12495
|
);
|
|
12069
|
-
const handleNavDropdownOpenChange = (0,
|
|
12496
|
+
const handleNavDropdownOpenChange = (0, import_react15.useCallback)((open) => {
|
|
12070
12497
|
const selected = selectedElRef.current;
|
|
12071
12498
|
if (!selected || !isNavigationItem2(selected)) return;
|
|
12072
12499
|
setNavGroupForceOpen(selected, open);
|
|
@@ -12078,7 +12505,7 @@ function OhhwellsBridge() {
|
|
|
12078
12505
|
}
|
|
12079
12506
|
});
|
|
12080
12507
|
}, []);
|
|
12081
|
-
const handleFooterHeadingVisibleChange = (0,
|
|
12508
|
+
const handleFooterHeadingVisibleChange = (0, import_react15.useCallback)(
|
|
12082
12509
|
(visible) => {
|
|
12083
12510
|
const selected = selectedElRef.current;
|
|
12084
12511
|
if (!selected || !isFooterFrameSelectionRef.current) return;
|
|
@@ -12102,7 +12529,7 @@ function OhhwellsBridge() {
|
|
|
12102
12529
|
},
|
|
12103
12530
|
[postToParent2]
|
|
12104
12531
|
);
|
|
12105
|
-
const enterEditOnNewItem = (0,
|
|
12532
|
+
const enterEditOnNewItem = (0, import_react15.useCallback)((anchor) => {
|
|
12106
12533
|
const label = anchor.querySelector('[data-ohw-editable="text"]');
|
|
12107
12534
|
if (!label) {
|
|
12108
12535
|
selectRef.current(anchor);
|
|
@@ -12111,7 +12538,7 @@ function OhhwellsBridge() {
|
|
|
12111
12538
|
setNavGroupForceOpen(anchor, true);
|
|
12112
12539
|
activateRef.current(label);
|
|
12113
12540
|
}, []);
|
|
12114
|
-
const handleAddChildItem = (0,
|
|
12541
|
+
const handleAddChildItem = (0, import_react15.useCallback)(() => {
|
|
12115
12542
|
const selected = selectedElRef.current;
|
|
12116
12543
|
if (!selected) return;
|
|
12117
12544
|
if (toolbarVariantRef.current === "select-frame" && isFooterFrameSelection) {
|
|
@@ -12187,7 +12614,7 @@ function OhhwellsBridge() {
|
|
|
12187
12614
|
enterEditOnNewItem(result.anchor);
|
|
12188
12615
|
});
|
|
12189
12616
|
}, [enterEditOnNewItem, isFooterFrameSelection, maybeWarnNavLinkDropdownConflict, postToParent2]);
|
|
12190
|
-
const handleAddFooterColumn = (0,
|
|
12617
|
+
const handleAddFooterColumn = (0, import_react15.useCallback)(() => {
|
|
12191
12618
|
if (!canAddFooterColumn()) {
|
|
12192
12619
|
postToParent2({
|
|
12193
12620
|
type: "ow:toast",
|
|
@@ -12208,7 +12635,7 @@ function OhhwellsBridge() {
|
|
|
12208
12635
|
selectRef.current(result.firstLink);
|
|
12209
12636
|
});
|
|
12210
12637
|
}, [postToParent2]);
|
|
12211
|
-
const clearFooterDragVisuals = (0,
|
|
12638
|
+
const clearFooterDragVisuals = (0, import_react15.useCallback)(() => {
|
|
12212
12639
|
footerDragRef.current = null;
|
|
12213
12640
|
setSiblingHintRects([]);
|
|
12214
12641
|
setFooterDropSlots([]);
|
|
@@ -12217,7 +12644,7 @@ function OhhwellsBridge() {
|
|
|
12217
12644
|
setIsItemDragging(false);
|
|
12218
12645
|
unlockFooterDragInteraction();
|
|
12219
12646
|
}, []);
|
|
12220
|
-
const refreshFooterDragVisuals = (0,
|
|
12647
|
+
const refreshFooterDragVisuals = (0, import_react15.useCallback)((session, activeSlot, clientX, clientY) => {
|
|
12221
12648
|
const dragged = session.draggedEl;
|
|
12222
12649
|
setDraggedItemRect(dragged.getBoundingClientRect());
|
|
12223
12650
|
if (typeof clientX === "number" && typeof clientY === "number") {
|
|
@@ -12242,13 +12669,13 @@ function OhhwellsBridge() {
|
|
|
12242
12669
|
const activeIdx = activeSlot ? slots.findIndex((s) => s.insertIndex === activeSlot.insertIndex) : -1;
|
|
12243
12670
|
setActiveFooterDropIndex(activeIdx >= 0 ? activeIdx : null);
|
|
12244
12671
|
}, []);
|
|
12245
|
-
const refreshFooterDragVisualsRef = (0,
|
|
12672
|
+
const refreshFooterDragVisualsRef = (0, import_react15.useRef)(refreshFooterDragVisuals);
|
|
12246
12673
|
refreshFooterDragVisualsRef.current = refreshFooterDragVisuals;
|
|
12247
|
-
const commitFooterDragRef = (0,
|
|
12674
|
+
const commitFooterDragRef = (0, import_react15.useRef)(() => {
|
|
12248
12675
|
});
|
|
12249
|
-
const beginFooterDragRef = (0,
|
|
12676
|
+
const beginFooterDragRef = (0, import_react15.useRef)(() => {
|
|
12250
12677
|
});
|
|
12251
|
-
const beginFooterDrag = (0,
|
|
12678
|
+
const beginFooterDrag = (0, import_react15.useCallback)(
|
|
12252
12679
|
(session) => {
|
|
12253
12680
|
const rect = session.draggedEl.getBoundingClientRect();
|
|
12254
12681
|
session.lastClientX = session.lastClientX || rect.left + rect.width / 2;
|
|
@@ -12268,7 +12695,7 @@ function OhhwellsBridge() {
|
|
|
12268
12695
|
[refreshFooterDragVisuals]
|
|
12269
12696
|
);
|
|
12270
12697
|
beginFooterDragRef.current = beginFooterDrag;
|
|
12271
|
-
const commitFooterDrag = (0,
|
|
12698
|
+
const commitFooterDrag = (0, import_react15.useCallback)(
|
|
12272
12699
|
(clientX, clientY) => {
|
|
12273
12700
|
const session = footerDragRef.current;
|
|
12274
12701
|
if (!session) {
|
|
@@ -12372,7 +12799,7 @@ function OhhwellsBridge() {
|
|
|
12372
12799
|
[clearFooterDragVisuals, resolveHrefKeyElement, resyncSelectedNavigationItem]
|
|
12373
12800
|
);
|
|
12374
12801
|
commitFooterDragRef.current = commitFooterDrag;
|
|
12375
|
-
const startFooterLinkDrag = (0,
|
|
12802
|
+
const startFooterLinkDrag = (0, import_react15.useCallback)(
|
|
12376
12803
|
(anchor, clientX, clientY, wasSelected) => {
|
|
12377
12804
|
const hrefKey = anchor.getAttribute("data-ohw-href-key");
|
|
12378
12805
|
if (!hrefKey || !isFooterHrefKey(hrefKey)) return false;
|
|
@@ -12393,7 +12820,7 @@ function OhhwellsBridge() {
|
|
|
12393
12820
|
},
|
|
12394
12821
|
[beginFooterDrag]
|
|
12395
12822
|
);
|
|
12396
|
-
const startFooterColumnDrag = (0,
|
|
12823
|
+
const startFooterColumnDrag = (0, import_react15.useCallback)(
|
|
12397
12824
|
(columnEl, clientX, clientY, wasSelected) => {
|
|
12398
12825
|
const columns = listFooterColumns();
|
|
12399
12826
|
const idx = columns.indexOf(columnEl);
|
|
@@ -12413,7 +12840,7 @@ function OhhwellsBridge() {
|
|
|
12413
12840
|
},
|
|
12414
12841
|
[beginFooterDrag]
|
|
12415
12842
|
);
|
|
12416
|
-
const handleItemDragStart = (0,
|
|
12843
|
+
const handleItemDragStart = (0, import_react15.useCallback)(
|
|
12417
12844
|
(e) => {
|
|
12418
12845
|
const selected = selectedElRef.current;
|
|
12419
12846
|
if (!selected) {
|
|
@@ -12433,7 +12860,7 @@ function OhhwellsBridge() {
|
|
|
12433
12860
|
},
|
|
12434
12861
|
[startFooterColumnDrag, startFooterLinkDrag, startNavLinkDrag]
|
|
12435
12862
|
);
|
|
12436
|
-
const handleItemDragEnd = (0,
|
|
12863
|
+
const handleItemDragEnd = (0, import_react15.useCallback)(
|
|
12437
12864
|
(e) => {
|
|
12438
12865
|
if (footerDragRef.current) {
|
|
12439
12866
|
const x = e?.clientX;
|
|
@@ -12459,7 +12886,7 @@ function OhhwellsBridge() {
|
|
|
12459
12886
|
},
|
|
12460
12887
|
[commitFooterDrag, commitNavDrag, navDragRef]
|
|
12461
12888
|
);
|
|
12462
|
-
const handleItemChromePointerDown = (0,
|
|
12889
|
+
const handleItemChromePointerDown = (0, import_react15.useCallback)((e) => {
|
|
12463
12890
|
if (e.button !== 0) return;
|
|
12464
12891
|
const selected = selectedElRef.current;
|
|
12465
12892
|
if (!selected) return;
|
|
@@ -12490,7 +12917,7 @@ function OhhwellsBridge() {
|
|
|
12490
12917
|
}
|
|
12491
12918
|
if (armNavPressFromChrome(selected, e.clientX, e.clientY, e.pointerId)) return;
|
|
12492
12919
|
}, [armNavPressFromChrome]);
|
|
12493
|
-
const handleItemChromeClick = (0,
|
|
12920
|
+
const handleItemChromeClick = (0, import_react15.useCallback)((clientX, clientY) => {
|
|
12494
12921
|
if (suppressNextClickRef.current || Date.now() < suppressClickUntilRef.current) {
|
|
12495
12922
|
suppressNextClickRef.current = false;
|
|
12496
12923
|
return;
|
|
@@ -12503,7 +12930,7 @@ function OhhwellsBridge() {
|
|
|
12503
12930
|
}, []);
|
|
12504
12931
|
reselectNavigationItemRef.current = reselectNavigationItem;
|
|
12505
12932
|
commitNavigationTextEditRef.current = commitNavigationTextEdit;
|
|
12506
|
-
const select = (0,
|
|
12933
|
+
const select = (0, import_react15.useCallback)((anchor) => {
|
|
12507
12934
|
if (!isNavigationItem2(anchor)) return;
|
|
12508
12935
|
if (activeElRef.current) deactivate();
|
|
12509
12936
|
aiSectionApiRef.current?.selectFromElement(anchor);
|
|
@@ -12541,8 +12968,10 @@ function OhhwellsBridge() {
|
|
|
12541
12968
|
setToolbarRect(anchor.getBoundingClientRect());
|
|
12542
12969
|
setToolbarShowEditLink(false);
|
|
12543
12970
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
12971
|
+
setFloatingPanel(null);
|
|
12972
|
+
setLogoSizeDraft(null);
|
|
12544
12973
|
}, [deactivate, markSelected]);
|
|
12545
|
-
const selectFrame = (0,
|
|
12974
|
+
const selectFrame = (0, import_react15.useCallback)((el) => {
|
|
12546
12975
|
if (!isNavigationContainer(el)) return;
|
|
12547
12976
|
if (activeElRef.current) deactivate();
|
|
12548
12977
|
aiSectionApiRef.current?.selectFromElement(el);
|
|
@@ -12588,8 +13017,86 @@ function OhhwellsBridge() {
|
|
|
12588
13017
|
setToolbarRect(el.getBoundingClientRect());
|
|
12589
13018
|
setToolbarShowEditLink(false);
|
|
12590
13019
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
13020
|
+
setFloatingPanel(null);
|
|
13021
|
+
setLogoSizeDraft(null);
|
|
12591
13022
|
}, [deactivate, markSelected, postToParent2]);
|
|
12592
|
-
const
|
|
13023
|
+
const selectLogo = (0, import_react15.useCallback)(
|
|
13024
|
+
(logoEl) => {
|
|
13025
|
+
if (activeElRef.current) deactivate();
|
|
13026
|
+
selectedElRef.current = logoEl;
|
|
13027
|
+
selectedHrefKeyRef.current = null;
|
|
13028
|
+
selectedFooterColAttrRef.current = null;
|
|
13029
|
+
markSelected(logoEl);
|
|
13030
|
+
setSelectedIsCta(false);
|
|
13031
|
+
clearHrefKeyHover(logoEl);
|
|
13032
|
+
hoveredNavContainerRef.current = null;
|
|
13033
|
+
setHoveredNavContainerRect(null);
|
|
13034
|
+
setHoveredItemRect(null);
|
|
13035
|
+
hoveredItemElRef.current = null;
|
|
13036
|
+
siblingHintElRef.current = null;
|
|
13037
|
+
setSiblingHintRect(null);
|
|
13038
|
+
setSiblingHintRects([]);
|
|
13039
|
+
setIsItemDragging(false);
|
|
13040
|
+
setReorderHrefKey(null);
|
|
13041
|
+
setReorderDragDisabled(false);
|
|
13042
|
+
setIsFooterFrameSelection(false);
|
|
13043
|
+
setToolbarVariant("logo");
|
|
13044
|
+
setToolbarRect(logoEl.getBoundingClientRect());
|
|
13045
|
+
setToolbarShowEditLink(false);
|
|
13046
|
+
setActiveCommands(/* @__PURE__ */ new Set());
|
|
13047
|
+
},
|
|
13048
|
+
[deactivate, markSelected]
|
|
13049
|
+
);
|
|
13050
|
+
const openLogoSizePanel = (0, import_react15.useCallback)((logoEl) => {
|
|
13051
|
+
const placement = getLogoPlacement(logoEl);
|
|
13052
|
+
const draft = readLogoSizeState(editContentRef.current, placement);
|
|
13053
|
+
setLogoSizeDraft(draft);
|
|
13054
|
+
setParentScrollSnap(parentScrollRef.current);
|
|
13055
|
+
setFloatingPanel({
|
|
13056
|
+
key: `logo-size:${placement}`,
|
|
13057
|
+
title: "Logo",
|
|
13058
|
+
context: placement === "navbar" ? "Navbar" : "Footer",
|
|
13059
|
+
kind: "logo-size",
|
|
13060
|
+
placement
|
|
13061
|
+
});
|
|
13062
|
+
}, []);
|
|
13063
|
+
const closeFloatingPanelOnly = (0, import_react15.useCallback)(() => {
|
|
13064
|
+
setFloatingPanel(null);
|
|
13065
|
+
setLogoSizeDraft(null);
|
|
13066
|
+
}, []);
|
|
13067
|
+
const closeFloatingPanelAndDeselect = (0, import_react15.useCallback)(() => {
|
|
13068
|
+
setFloatingPanel(null);
|
|
13069
|
+
setLogoSizeDraft(null);
|
|
13070
|
+
deselectRef.current();
|
|
13071
|
+
}, []);
|
|
13072
|
+
const persistLogoSizeDraft = (0, import_react15.useCallback)(
|
|
13073
|
+
(placement, draft) => {
|
|
13074
|
+
const desktopKey = LOGO_SIZE_DESKTOP_KEYS[placement];
|
|
13075
|
+
const mobileKey = LOGO_SIZE_MOBILE_KEYS[placement];
|
|
13076
|
+
const nodes = [
|
|
13077
|
+
{ key: desktopKey, text: String(draft.desktopPx) }
|
|
13078
|
+
];
|
|
13079
|
+
if (draft.mobileFollowing) {
|
|
13080
|
+
nodes.push({ key: mobileKey, text: "" });
|
|
13081
|
+
} else {
|
|
13082
|
+
nodes.push({ key: mobileKey, text: String(draft.mobilePx) });
|
|
13083
|
+
}
|
|
13084
|
+
editContentRef.current = {
|
|
13085
|
+
...editContentRef.current,
|
|
13086
|
+
[desktopKey]: String(draft.desktopPx),
|
|
13087
|
+
[mobileKey]: draft.mobileFollowing ? "" : String(draft.mobilePx)
|
|
13088
|
+
};
|
|
13089
|
+
applyLogoSizeToPlacement(
|
|
13090
|
+
placement,
|
|
13091
|
+
draft.desktopPx,
|
|
13092
|
+
draft.mobileFollowing ? draft.desktopPx : draft.mobilePx,
|
|
13093
|
+
draft.mobileFollowing
|
|
13094
|
+
);
|
|
13095
|
+
postToParent2({ type: "ow:change", nodes });
|
|
13096
|
+
},
|
|
13097
|
+
[postToParent2]
|
|
13098
|
+
);
|
|
13099
|
+
const activate = (0, import_react15.useCallback)((el, options) => {
|
|
12593
13100
|
if (activeElRef.current === el) return;
|
|
12594
13101
|
clearSelectedAttr();
|
|
12595
13102
|
selectedElRef.current = null;
|
|
@@ -12665,9 +13172,12 @@ function OhhwellsBridge() {
|
|
|
12665
13172
|
deactivateRef.current = deactivate;
|
|
12666
13173
|
selectRef.current = select;
|
|
12667
13174
|
selectFrameRef.current = selectFrame;
|
|
13175
|
+
selectLogoRef.current = selectLogo;
|
|
13176
|
+
openLogoSizePanelRef.current = openLogoSizePanel;
|
|
12668
13177
|
deselectRef.current = deselect;
|
|
12669
|
-
|
|
12670
|
-
(0,
|
|
13178
|
+
closeFloatingPanelOnlyRef.current = closeFloatingPanelOnly;
|
|
13179
|
+
const lastSiteWideScopeRef = (0, import_react15.useRef)(null);
|
|
13180
|
+
(0, import_react15.useEffect)(() => {
|
|
12671
13181
|
if (!isEditMode) {
|
|
12672
13182
|
if (lastSiteWideScopeRef.current !== false) {
|
|
12673
13183
|
lastSiteWideScopeRef.current = false;
|
|
@@ -12693,7 +13203,7 @@ function OhhwellsBridge() {
|
|
|
12693
13203
|
isFooterFrameSelection,
|
|
12694
13204
|
postToParent2
|
|
12695
13205
|
]);
|
|
12696
|
-
(0,
|
|
13206
|
+
(0, import_react15.useLayoutEffect)(() => {
|
|
12697
13207
|
if (!subdomain || isEditMode) {
|
|
12698
13208
|
setFetchState("done");
|
|
12699
13209
|
return;
|
|
@@ -12737,6 +13247,7 @@ function OhhwellsBridge() {
|
|
|
12737
13247
|
applyLinkByKey(key, val);
|
|
12738
13248
|
}
|
|
12739
13249
|
applyLogoFromContent(content);
|
|
13250
|
+
applyLogoSizes(content);
|
|
12740
13251
|
reconcileNavbarItemsFromContent(content);
|
|
12741
13252
|
reconcileFooterOrderFromContent(content);
|
|
12742
13253
|
enforceLinkHrefs();
|
|
@@ -12767,7 +13278,7 @@ function OhhwellsBridge() {
|
|
|
12767
13278
|
cancelled = true;
|
|
12768
13279
|
};
|
|
12769
13280
|
}, [subdomain, isEditMode]);
|
|
12770
|
-
(0,
|
|
13281
|
+
(0, import_react15.useEffect)(() => {
|
|
12771
13282
|
if (!subdomain || isEditMode) return;
|
|
12772
13283
|
let debounceTimer = null;
|
|
12773
13284
|
let observer = null;
|
|
@@ -12821,16 +13332,16 @@ function OhhwellsBridge() {
|
|
|
12821
13332
|
if (debounceTimer) clearTimeout(debounceTimer);
|
|
12822
13333
|
};
|
|
12823
13334
|
}, [subdomain, isEditMode, pathname]);
|
|
12824
|
-
(0,
|
|
13335
|
+
(0, import_react15.useLayoutEffect)(() => {
|
|
12825
13336
|
const el = document.getElementById("ohw-loader");
|
|
12826
13337
|
if (!el) return;
|
|
12827
13338
|
const visible = Boolean(subdomain) && fetchState !== "done";
|
|
12828
13339
|
el.style.display = visible ? "flex" : "none";
|
|
12829
13340
|
}, [subdomain, fetchState]);
|
|
12830
|
-
(0,
|
|
13341
|
+
(0, import_react15.useEffect)(() => {
|
|
12831
13342
|
postToParent2({ type: "ow:navigation", path: pathname });
|
|
12832
13343
|
}, [pathname, postToParent2]);
|
|
12833
|
-
(0,
|
|
13344
|
+
(0, import_react15.useEffect)(() => {
|
|
12834
13345
|
if (!isEditMode) return;
|
|
12835
13346
|
if (linkPopoverSessionRef.current?.intent === "add-nav") return;
|
|
12836
13347
|
if (document.querySelector("[data-ohw-section-picker]")) return;
|
|
@@ -12838,7 +13349,7 @@ function OhhwellsBridge() {
|
|
|
12838
13349
|
deselectRef.current();
|
|
12839
13350
|
deactivateRef.current();
|
|
12840
13351
|
}, [pathname, isEditMode]);
|
|
12841
|
-
(0,
|
|
13352
|
+
(0, import_react15.useEffect)(() => {
|
|
12842
13353
|
const contentForNav = () => {
|
|
12843
13354
|
if (isEditMode) return editContentRef.current;
|
|
12844
13355
|
if (!subdomain) return {};
|
|
@@ -12903,7 +13414,7 @@ function OhhwellsBridge() {
|
|
|
12903
13414
|
observer?.disconnect();
|
|
12904
13415
|
};
|
|
12905
13416
|
}, [isEditMode, pathname, subdomain, fetchState, resyncSelectedNavigationItem]);
|
|
12906
|
-
(0,
|
|
13417
|
+
(0, import_react15.useEffect)(() => {
|
|
12907
13418
|
if (!isEditMode) return;
|
|
12908
13419
|
const measure = () => {
|
|
12909
13420
|
const h = document.body.scrollHeight;
|
|
@@ -12927,7 +13438,7 @@ function OhhwellsBridge() {
|
|
|
12927
13438
|
window.removeEventListener("resize", handleResize);
|
|
12928
13439
|
};
|
|
12929
13440
|
}, [pathname, isEditMode, postToParent2]);
|
|
12930
|
-
(0,
|
|
13441
|
+
(0, import_react15.useEffect)(() => {
|
|
12931
13442
|
if (!subdomainFromQuery || isEditMode) return;
|
|
12932
13443
|
const handleClick = (e) => {
|
|
12933
13444
|
const anchor = e.target.closest("a");
|
|
@@ -12943,7 +13454,7 @@ function OhhwellsBridge() {
|
|
|
12943
13454
|
document.addEventListener("click", handleClick, true);
|
|
12944
13455
|
return () => document.removeEventListener("click", handleClick, true);
|
|
12945
13456
|
}, [subdomainFromQuery, isEditMode, router]);
|
|
12946
|
-
(0,
|
|
13457
|
+
(0, import_react15.useEffect)(() => {
|
|
12947
13458
|
if (!isEditMode) {
|
|
12948
13459
|
editStylesRef.current?.base.remove();
|
|
12949
13460
|
editStylesRef.current?.forceHover.remove();
|
|
@@ -13072,6 +13583,7 @@ function OhhwellsBridge() {
|
|
|
13072
13583
|
if (target.closest("[data-ohw-state-toggle]")) return;
|
|
13073
13584
|
if (target.closest("[data-ohw-max-badge]")) return;
|
|
13074
13585
|
if (isInsideLinkEditor(target)) return;
|
|
13586
|
+
if (isInsideFloatingPanel(target)) return;
|
|
13075
13587
|
if (target.closest('[data-ohw-edit-chrome], [data-ohw-item-interaction], [data-ohw-drag-handle-container], [data-slot="drag-handle"]')) {
|
|
13076
13588
|
const beneath = document.elementsFromPoint(e.clientX, e.clientY).find(
|
|
13077
13589
|
(el) => el instanceof HTMLElement && !el.closest("[data-ohw-bridge-root]") && el.closest("[data-ohw-section]") != null
|
|
@@ -13139,10 +13651,15 @@ function OhhwellsBridge() {
|
|
|
13139
13651
|
if (logoEl) {
|
|
13140
13652
|
e.preventDefault();
|
|
13141
13653
|
e.stopPropagation();
|
|
13142
|
-
|
|
13143
|
-
|
|
13144
|
-
|
|
13145
|
-
|
|
13654
|
+
if (!logoHasUploadedImage(logoEl)) {
|
|
13655
|
+
deselectRef.current();
|
|
13656
|
+
deactivateRef.current();
|
|
13657
|
+
const identity = readLogoIdentityFromDom();
|
|
13658
|
+
postToParentRef.current({ type: "ow:open-logo-settings", ...identity });
|
|
13659
|
+
return;
|
|
13660
|
+
}
|
|
13661
|
+
selectLogoRef.current(logoEl);
|
|
13662
|
+
openLogoSizePanelRef.current(logoEl);
|
|
13146
13663
|
return;
|
|
13147
13664
|
}
|
|
13148
13665
|
const editable = target.closest("[data-ohw-editable]");
|
|
@@ -13277,6 +13794,7 @@ function OhhwellsBridge() {
|
|
|
13277
13794
|
if (target.closest("[data-ohw-state-toggle]")) return;
|
|
13278
13795
|
if (target.closest("[data-ohw-max-badge]")) return;
|
|
13279
13796
|
if (isInsideLinkEditor(target)) return;
|
|
13797
|
+
if (isInsideFloatingPanel(target)) return;
|
|
13280
13798
|
if (target.closest('[data-ohw-edit-chrome], [data-ohw-item-interaction], [data-ohw-drag-handle-container], [data-slot="drag-handle"]')) {
|
|
13281
13799
|
return;
|
|
13282
13800
|
}
|
|
@@ -13303,6 +13821,16 @@ function OhhwellsBridge() {
|
|
|
13303
13821
|
setHoveredNavContainerRect(null);
|
|
13304
13822
|
return;
|
|
13305
13823
|
}
|
|
13824
|
+
if (isInsideFloatingPanel(target) || isPointOverFloatingPanel(e.clientX, e.clientY)) {
|
|
13825
|
+
hoveredItemElRef.current = null;
|
|
13826
|
+
setHoveredItemRect(null);
|
|
13827
|
+
hoveredNavContainerRef.current = null;
|
|
13828
|
+
setHoveredNavContainerRect(null);
|
|
13829
|
+
siblingHintElRef.current = null;
|
|
13830
|
+
setSiblingHintRect(null);
|
|
13831
|
+
setSiblingHintRects([]);
|
|
13832
|
+
return;
|
|
13833
|
+
}
|
|
13306
13834
|
{
|
|
13307
13835
|
const selected2 = selectedElRef.current;
|
|
13308
13836
|
const selectedIsFooterColumn = Boolean(selected2) && !isFooterLinksContainer(selected2) && (selected2.hasAttribute("data-ohw-footer-col") || selected2.hasAttribute("data-ohw-footer-column") || Boolean(selected2.closest("footer") && isInferredFooterGroup2(selected2)));
|
|
@@ -13674,7 +14202,7 @@ function OhhwellsBridge() {
|
|
|
13674
14202
|
}
|
|
13675
14203
|
};
|
|
13676
14204
|
const probeImageAt = (clientX, clientY, isDragOver = false, fromParentViewport = false) => {
|
|
13677
|
-
if (linkPopoverOpenRef.current) {
|
|
14205
|
+
if (linkPopoverOpenRef.current || floatingPanelOpenRef.current && isPointOverFloatingPanel(clientX, clientY)) {
|
|
13678
14206
|
if (hoveredImageRef.current) {
|
|
13679
14207
|
hoveredImageRef.current = null;
|
|
13680
14208
|
hoveredImageHasTextOverlapRef.current = false;
|
|
@@ -13928,7 +14456,7 @@ function OhhwellsBridge() {
|
|
|
13928
14456
|
}
|
|
13929
14457
|
};
|
|
13930
14458
|
const probeHoverCardsAt = (clientX, clientY, fromParentViewport = false) => {
|
|
13931
|
-
if (linkPopoverOpenRef.current || document.documentElement.hasAttribute("data-ohw-section-picking")) {
|
|
14459
|
+
if (linkPopoverOpenRef.current || floatingPanelOpenRef.current && isPointOverFloatingPanel(clientX, clientY) || document.documentElement.hasAttribute("data-ohw-section-picking")) {
|
|
13932
14460
|
if (activeStateElRef.current) {
|
|
13933
14461
|
activeStateElRef.current.removeAttribute("data-ohw-state-hovered");
|
|
13934
14462
|
activeStateElRef.current = null;
|
|
@@ -13996,6 +14524,19 @@ function OhhwellsBridge() {
|
|
|
13996
14524
|
};
|
|
13997
14525
|
const handleMouseMove = (e) => {
|
|
13998
14526
|
const { clientX, clientY } = e;
|
|
14527
|
+
if (floatingPanelOpenRef.current && isPointOverFloatingPanel(clientX, clientY)) {
|
|
14528
|
+
hoveredItemElRef.current = null;
|
|
14529
|
+
setHoveredItemRect(null);
|
|
14530
|
+
hoveredNavContainerRef.current = null;
|
|
14531
|
+
setHoveredNavContainerRect(null);
|
|
14532
|
+
siblingHintElRef.current = null;
|
|
14533
|
+
setSiblingHintRect(null);
|
|
14534
|
+
setSiblingHintRects([]);
|
|
14535
|
+
dismissImageHover();
|
|
14536
|
+
clearImageHover();
|
|
14537
|
+
setSectionGap(null);
|
|
14538
|
+
return;
|
|
14539
|
+
}
|
|
13999
14540
|
probeSectionGapAt(clientX, clientY);
|
|
14000
14541
|
probeImageAt(clientX, clientY);
|
|
14001
14542
|
probeHoverCardsAt(clientX, clientY);
|
|
@@ -14004,6 +14545,11 @@ function OhhwellsBridge() {
|
|
|
14004
14545
|
if (e.data?.type !== "ow:pointer-sync") return;
|
|
14005
14546
|
const { clientX, clientY } = e.data;
|
|
14006
14547
|
if (typeof clientX !== "number" || typeof clientY !== "number") return;
|
|
14548
|
+
if (floatingPanelOpenRef.current && isPointOverFloatingPanel(clientX, clientY)) {
|
|
14549
|
+
dismissImageHover();
|
|
14550
|
+
clearImageHover();
|
|
14551
|
+
return;
|
|
14552
|
+
}
|
|
14007
14553
|
probeSectionGapAt(clientX, clientY);
|
|
14008
14554
|
probeImageAt(clientX, clientY);
|
|
14009
14555
|
probeHoverCardsAt(clientX, clientY);
|
|
@@ -14221,6 +14767,7 @@ function OhhwellsBridge() {
|
|
|
14221
14767
|
applyLinkByKey(key, val);
|
|
14222
14768
|
}
|
|
14223
14769
|
applyLogoFromContent(content);
|
|
14770
|
+
applyLogoSizes(content);
|
|
14224
14771
|
if (sectionsJson) {
|
|
14225
14772
|
initSectionsFromContent({ __ohw_sections: sectionsJson }, true);
|
|
14226
14773
|
sectionsLoadedRef.current = true;
|
|
@@ -14282,6 +14829,7 @@ function OhhwellsBridge() {
|
|
|
14282
14829
|
...editContentRef.current,
|
|
14283
14830
|
...Object.fromEntries(nodes.map(({ key, text }) => [key, text]))
|
|
14284
14831
|
};
|
|
14832
|
+
applyLogoSizes(editContentRef.current);
|
|
14285
14833
|
postToParentRef.current({ type: "ow:change", nodes });
|
|
14286
14834
|
};
|
|
14287
14835
|
window.addEventListener("message", handleHydrate);
|
|
@@ -14293,6 +14841,12 @@ function OhhwellsBridge() {
|
|
|
14293
14841
|
closeLinkPopoverRef.current();
|
|
14294
14842
|
return;
|
|
14295
14843
|
}
|
|
14844
|
+
if (floatingPanelOpenRef.current) {
|
|
14845
|
+
setFloatingPanelRef.current(null);
|
|
14846
|
+
deselectRef.current();
|
|
14847
|
+
deactivateRef.current();
|
|
14848
|
+
return;
|
|
14849
|
+
}
|
|
14296
14850
|
deselectRef.current();
|
|
14297
14851
|
deactivateRef.current();
|
|
14298
14852
|
};
|
|
@@ -14312,6 +14866,10 @@ function OhhwellsBridge() {
|
|
|
14312
14866
|
closeLinkPopoverRef.current();
|
|
14313
14867
|
return;
|
|
14314
14868
|
}
|
|
14869
|
+
if (floatingPanelOpenRef.current) {
|
|
14870
|
+
closeFloatingPanelOnlyRef.current();
|
|
14871
|
+
return;
|
|
14872
|
+
}
|
|
14315
14873
|
if (activeElRef.current) {
|
|
14316
14874
|
const hrefCtx = getHrefKeyFromElement(activeElRef.current);
|
|
14317
14875
|
const navAnchor = hrefCtx ? getNavigationItemAnchor(hrefCtx.anchor) : null;
|
|
@@ -14342,6 +14900,10 @@ function OhhwellsBridge() {
|
|
|
14342
14900
|
return;
|
|
14343
14901
|
}
|
|
14344
14902
|
if (selectedElRef.current) {
|
|
14903
|
+
if (toolbarVariantRef.current === "logo") {
|
|
14904
|
+
deselectRef.current();
|
|
14905
|
+
return;
|
|
14906
|
+
}
|
|
14345
14907
|
if (toolbarVariantRef.current === "select-frame") {
|
|
14346
14908
|
const parent2 = getNavigationSelectionParent(selectedElRef.current);
|
|
14347
14909
|
if (parent2 && isNavigationContainer(parent2) && isFooterLinksContainer(parent2) && !isFooterLinksContainer(selectedElRef.current)) {
|
|
@@ -14375,7 +14937,16 @@ function OhhwellsBridge() {
|
|
|
14375
14937
|
closeLinkPopoverRef.current();
|
|
14376
14938
|
return;
|
|
14377
14939
|
}
|
|
14940
|
+
if (e.key === "Escape" && floatingPanelOpenRef.current) {
|
|
14941
|
+
e.preventDefault();
|
|
14942
|
+
closeFloatingPanelOnlyRef.current();
|
|
14943
|
+
return;
|
|
14944
|
+
}
|
|
14378
14945
|
if (e.key === "Escape" && selectedElRef.current && !activeElRef.current) {
|
|
14946
|
+
if (toolbarVariantRef.current === "logo") {
|
|
14947
|
+
deselectRef.current();
|
|
14948
|
+
return;
|
|
14949
|
+
}
|
|
14379
14950
|
if (toolbarVariantRef.current === "select-frame") {
|
|
14380
14951
|
const parent2 = getNavigationSelectionParent(selectedElRef.current);
|
|
14381
14952
|
if (parent2 && isNavigationContainer(parent2) && isFooterLinksContainer(parent2) && !isFooterLinksContainer(selectedElRef.current)) {
|
|
@@ -14708,6 +15279,9 @@ function OhhwellsBridge() {
|
|
|
14708
15279
|
if (e.data?.type !== "ow:parent-scroll") return;
|
|
14709
15280
|
const { iframeOffsetTop, headerH, canvasH } = e.data;
|
|
14710
15281
|
parentScrollRef.current = { iframeOffsetTop, headerH, canvasH };
|
|
15282
|
+
if (floatingPanelOpenRef.current) {
|
|
15283
|
+
setParentScrollSnap({ iframeOffsetTop, headerH, canvasH });
|
|
15284
|
+
}
|
|
14711
15285
|
if (visibleViewportRef.current) {
|
|
14712
15286
|
applyVisibleViewport(visibleViewportRef.current, parentScrollRef.current);
|
|
14713
15287
|
}
|
|
@@ -14747,10 +15321,15 @@ function OhhwellsBridge() {
|
|
|
14747
15321
|
return clientX >= r2.left && clientX <= r2.right && clientY >= r2.top && clientY <= r2.bottom;
|
|
14748
15322
|
});
|
|
14749
15323
|
if (logoAtPoint) {
|
|
14750
|
-
|
|
14751
|
-
|
|
14752
|
-
|
|
14753
|
-
|
|
15324
|
+
if (!logoHasUploadedImage(logoAtPoint)) {
|
|
15325
|
+
deselectRef.current();
|
|
15326
|
+
deactivateRef.current();
|
|
15327
|
+
const identity = readLogoIdentityFromDom();
|
|
15328
|
+
postToParentRef.current({ type: "ow:open-logo-settings", ...identity });
|
|
15329
|
+
return;
|
|
15330
|
+
}
|
|
15331
|
+
selectLogoRef.current(logoAtPoint);
|
|
15332
|
+
openLogoSizePanelRef.current(logoAtPoint);
|
|
14754
15333
|
return;
|
|
14755
15334
|
}
|
|
14756
15335
|
const textEditable = Array.from(
|
|
@@ -14822,6 +15401,13 @@ function OhhwellsBridge() {
|
|
|
14822
15401
|
window.addEventListener("message", handlePointerSync);
|
|
14823
15402
|
window.addEventListener("message", handleClickAt);
|
|
14824
15403
|
window.addEventListener("message", handleUpdateLogoIdentity);
|
|
15404
|
+
const handleViewMode = (e) => {
|
|
15405
|
+
if (e.data?.type !== "ow:view-mode") return;
|
|
15406
|
+
const mode = e.data.mode === "Mobile" || e.data.mode === "mobile" ? "mobile" : "desktop";
|
|
15407
|
+
setEditorViewport(mode);
|
|
15408
|
+
applyLogoSizes(editContentRef.current);
|
|
15409
|
+
};
|
|
15410
|
+
window.addEventListener("message", handleViewMode);
|
|
14825
15411
|
const handleViewportResize = () => {
|
|
14826
15412
|
if (visibleViewportRef.current) {
|
|
14827
15413
|
applyVisibleViewport(visibleViewportRef.current, parentScrollRef.current);
|
|
@@ -14875,6 +15461,7 @@ function OhhwellsBridge() {
|
|
|
14875
15461
|
window.removeEventListener("message", handlePointerSync);
|
|
14876
15462
|
window.removeEventListener("message", handleClickAt);
|
|
14877
15463
|
window.removeEventListener("message", handleUpdateLogoIdentity);
|
|
15464
|
+
window.removeEventListener("message", handleViewMode);
|
|
14878
15465
|
window.removeEventListener("message", handleHydrate);
|
|
14879
15466
|
window.removeEventListener("message", handleDeactivate);
|
|
14880
15467
|
window.removeEventListener("message", handleToastAction);
|
|
@@ -14885,7 +15472,7 @@ function OhhwellsBridge() {
|
|
|
14885
15472
|
if (imageShowTimerRef.current) clearTimeout(imageShowTimerRef.current);
|
|
14886
15473
|
};
|
|
14887
15474
|
}, [isEditMode, refreshStateRules]);
|
|
14888
|
-
(0,
|
|
15475
|
+
(0, import_react15.useEffect)(() => {
|
|
14889
15476
|
if (!isEditMode) return;
|
|
14890
15477
|
const THRESHOLD = 10;
|
|
14891
15478
|
const resolveWasSelected = (el) => {
|
|
@@ -15039,7 +15626,7 @@ function OhhwellsBridge() {
|
|
|
15039
15626
|
unlockFooterDragInteraction();
|
|
15040
15627
|
};
|
|
15041
15628
|
}, [isEditMode]);
|
|
15042
|
-
(0,
|
|
15629
|
+
(0, import_react15.useEffect)(() => {
|
|
15043
15630
|
const handler = (e) => {
|
|
15044
15631
|
if (e.data?.type !== "ow:request-schedule-config") return;
|
|
15045
15632
|
const insertAfterVal = e.data.insertAfter;
|
|
@@ -15055,7 +15642,7 @@ function OhhwellsBridge() {
|
|
|
15055
15642
|
window.addEventListener("message", handler);
|
|
15056
15643
|
return () => window.removeEventListener("message", handler);
|
|
15057
15644
|
}, [processConfigRequest]);
|
|
15058
|
-
(0,
|
|
15645
|
+
(0, import_react15.useEffect)(() => {
|
|
15059
15646
|
if (!isEditMode) return;
|
|
15060
15647
|
document.querySelectorAll("[data-ohw-active-state]").forEach((el) => {
|
|
15061
15648
|
el.removeAttribute("data-ohw-active-state");
|
|
@@ -15091,13 +15678,13 @@ function OhhwellsBridge() {
|
|
|
15091
15678
|
clearTimeout(timer);
|
|
15092
15679
|
};
|
|
15093
15680
|
}, [pathname, isEditMode, refreshStateRules, postToParent2]);
|
|
15094
|
-
(0,
|
|
15681
|
+
(0, import_react15.useEffect)(() => {
|
|
15095
15682
|
scrollToHashSectionWhenReady();
|
|
15096
15683
|
const onHashChange = () => scrollToHashSectionWhenReady();
|
|
15097
15684
|
window.addEventListener("hashchange", onHashChange);
|
|
15098
15685
|
return () => window.removeEventListener("hashchange", onHashChange);
|
|
15099
15686
|
}, [pathname]);
|
|
15100
|
-
const handleCommand = (0,
|
|
15687
|
+
const handleCommand = (0, import_react15.useCallback)((cmd) => {
|
|
15101
15688
|
const el = activeElRef.current;
|
|
15102
15689
|
const selBefore = window.getSelection();
|
|
15103
15690
|
let savedOffsets = null;
|
|
@@ -15133,7 +15720,7 @@ function OhhwellsBridge() {
|
|
|
15133
15720
|
if (el) setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
15134
15721
|
refreshActiveCommandsRef.current();
|
|
15135
15722
|
}, []);
|
|
15136
|
-
const handleStateChange = (0,
|
|
15723
|
+
const handleStateChange = (0, import_react15.useCallback)((state) => {
|
|
15137
15724
|
if (!activeStateElRef.current) return;
|
|
15138
15725
|
const el = activeStateElRef.current;
|
|
15139
15726
|
if (state === "Default") {
|
|
@@ -15146,7 +15733,7 @@ function OhhwellsBridge() {
|
|
|
15146
15733
|
}
|
|
15147
15734
|
setToggleState((prev) => prev ? { ...prev, activeState: state } : null);
|
|
15148
15735
|
}, [deactivate]);
|
|
15149
|
-
const reselectAfterLinkPopover = (0,
|
|
15736
|
+
const reselectAfterLinkPopover = (0, import_react15.useCallback)(
|
|
15150
15737
|
(hrefKey) => {
|
|
15151
15738
|
requestAnimationFrame(() => {
|
|
15152
15739
|
const el = resolveHrefKeyElement(hrefKey);
|
|
@@ -15155,7 +15742,7 @@ function OhhwellsBridge() {
|
|
|
15155
15742
|
},
|
|
15156
15743
|
[resolveHrefKeyElement]
|
|
15157
15744
|
);
|
|
15158
|
-
const closeLinkPopover = (0,
|
|
15745
|
+
const closeLinkPopover = (0, import_react15.useCallback)(() => {
|
|
15159
15746
|
const session = linkPopoverSessionRef.current;
|
|
15160
15747
|
addNavAfterAnchorRef.current = null;
|
|
15161
15748
|
setLinkPopover(null);
|
|
@@ -15163,9 +15750,9 @@ function OhhwellsBridge() {
|
|
|
15163
15750
|
reselectAfterLinkPopover(session.key);
|
|
15164
15751
|
}
|
|
15165
15752
|
}, [reselectAfterLinkPopover]);
|
|
15166
|
-
const closeLinkPopoverRef = (0,
|
|
15753
|
+
const closeLinkPopoverRef = (0, import_react15.useRef)(closeLinkPopover);
|
|
15167
15754
|
closeLinkPopoverRef.current = closeLinkPopover;
|
|
15168
|
-
const openLinkPopoverForActive = (0,
|
|
15755
|
+
const openLinkPopoverForActive = (0, import_react15.useCallback)(() => {
|
|
15169
15756
|
const hrefCtx = getHrefKeyFromElement(activeElRef.current);
|
|
15170
15757
|
if (!hrefCtx) return;
|
|
15171
15758
|
bumpLinkPopoverGrace();
|
|
@@ -15176,7 +15763,7 @@ function OhhwellsBridge() {
|
|
|
15176
15763
|
});
|
|
15177
15764
|
deactivate();
|
|
15178
15765
|
}, [deactivate]);
|
|
15179
|
-
const openLinkPopoverForSelected = (0,
|
|
15766
|
+
const openLinkPopoverForSelected = (0, import_react15.useCallback)(() => {
|
|
15180
15767
|
const anchor = selectedElRef.current;
|
|
15181
15768
|
if (!anchor) return;
|
|
15182
15769
|
const key = anchor.getAttribute("data-ohw-href-key");
|
|
@@ -15189,7 +15776,7 @@ function OhhwellsBridge() {
|
|
|
15189
15776
|
});
|
|
15190
15777
|
deselect();
|
|
15191
15778
|
}, [deselect]);
|
|
15192
|
-
const handleSelectParent = (0,
|
|
15779
|
+
const handleSelectParent = (0, import_react15.useCallback)(() => {
|
|
15193
15780
|
const selected = selectedElRef.current;
|
|
15194
15781
|
if (!selected) return;
|
|
15195
15782
|
if (toolbarVariantRef.current === "select-frame") {
|
|
@@ -15216,7 +15803,7 @@ function OhhwellsBridge() {
|
|
|
15216
15803
|
}
|
|
15217
15804
|
deselectRef.current();
|
|
15218
15805
|
}, []);
|
|
15219
|
-
const handleDuplicateSelected = (0,
|
|
15806
|
+
const handleDuplicateSelected = (0, import_react15.useCallback)(() => {
|
|
15220
15807
|
const selected = selectedElRef.current;
|
|
15221
15808
|
if (!selected || !isNavigationItem2(selected)) return;
|
|
15222
15809
|
const hrefKey = selected.getAttribute("data-ohw-href-key");
|
|
@@ -15306,7 +15893,7 @@ function OhhwellsBridge() {
|
|
|
15306
15893
|
});
|
|
15307
15894
|
}
|
|
15308
15895
|
}, [postToParent2]);
|
|
15309
|
-
const runPendingDeleteUndo = (0,
|
|
15896
|
+
const runPendingDeleteUndo = (0, import_react15.useCallback)(() => {
|
|
15310
15897
|
const pending = pendingDeleteUndoRef.current;
|
|
15311
15898
|
if (!pending) return false;
|
|
15312
15899
|
pendingDeleteUndoRef.current = null;
|
|
@@ -15314,7 +15901,7 @@ function OhhwellsBridge() {
|
|
|
15314
15901
|
enforceLinkHrefs();
|
|
15315
15902
|
return true;
|
|
15316
15903
|
}, []);
|
|
15317
|
-
const handleDeleteSelected = (0,
|
|
15904
|
+
const handleDeleteSelected = (0, import_react15.useCallback)(() => {
|
|
15318
15905
|
const selected = selectedElRef.current;
|
|
15319
15906
|
if (!selected) return false;
|
|
15320
15907
|
return deleteSelectedNavFooterItem({
|
|
@@ -15335,7 +15922,7 @@ function OhhwellsBridge() {
|
|
|
15335
15922
|
}, [postToParent2]);
|
|
15336
15923
|
handleDeleteSelectedRef.current = handleDeleteSelected;
|
|
15337
15924
|
runPendingDeleteUndoRef.current = runPendingDeleteUndo;
|
|
15338
|
-
const handleLinkPopoverSubmit = (0,
|
|
15925
|
+
const handleLinkPopoverSubmit = (0, import_react15.useCallback)(
|
|
15339
15926
|
(target) => {
|
|
15340
15927
|
const session = linkPopoverSessionRef.current;
|
|
15341
15928
|
if (!session) return;
|
|
@@ -15401,19 +15988,19 @@ function OhhwellsBridge() {
|
|
|
15401
15988
|
const showEditLink = toolbarShowEditLink;
|
|
15402
15989
|
const currentSections = sectionsByPath[pathname] ?? [];
|
|
15403
15990
|
linkPopoverOpenRef.current = linkPopover !== null;
|
|
15404
|
-
const handleMediaReplace = (0,
|
|
15991
|
+
const handleMediaReplace = (0, import_react15.useCallback)(
|
|
15405
15992
|
(key) => {
|
|
15406
15993
|
postToParent2({ type: "ow:image-pick", key, elementType: mediaHover?.elementType ?? "image" });
|
|
15407
15994
|
},
|
|
15408
15995
|
[postToParent2, mediaHover?.elementType]
|
|
15409
15996
|
);
|
|
15410
|
-
const handleEditCarousel = (0,
|
|
15997
|
+
const handleEditCarousel = (0, import_react15.useCallback)(
|
|
15411
15998
|
(key) => {
|
|
15412
15999
|
postToParent2({ type: "ow:carousel-open", key, images: readCarouselValue(key) });
|
|
15413
16000
|
},
|
|
15414
16001
|
[postToParent2]
|
|
15415
16002
|
);
|
|
15416
|
-
const handleMediaFadeOutComplete = (0,
|
|
16003
|
+
const handleMediaFadeOutComplete = (0, import_react15.useCallback)((key) => {
|
|
15417
16004
|
setUploadingRects((prev) => {
|
|
15418
16005
|
if (!(key in prev)) return prev;
|
|
15419
16006
|
const next = { ...prev };
|
|
@@ -15421,7 +16008,7 @@ function OhhwellsBridge() {
|
|
|
15421
16008
|
return next;
|
|
15422
16009
|
});
|
|
15423
16010
|
}, []);
|
|
15424
|
-
const handleVideoSettingsChange = (0,
|
|
16011
|
+
const handleVideoSettingsChange = (0, import_react15.useCallback)(
|
|
15425
16012
|
(key, settings) => {
|
|
15426
16013
|
document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
|
|
15427
16014
|
const video = getVideoEl2(el);
|
|
@@ -15444,10 +16031,10 @@ function OhhwellsBridge() {
|
|
|
15444
16031
|
[postToParent2]
|
|
15445
16032
|
);
|
|
15446
16033
|
return bridgeRoot ? (0, import_react_dom3.createPortal)(
|
|
15447
|
-
/* @__PURE__ */ (0,
|
|
15448
|
-
/* @__PURE__ */ (0,
|
|
15449
|
-
isEditMode && /* @__PURE__ */ (0,
|
|
15450
|
-
Object.entries(uploadingRects).map(([key, { rect, fadingOut }]) => /* @__PURE__ */ (0,
|
|
16034
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
|
|
16035
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { ref: attachVisibleViewport, "data-ohw-visible-viewport": "", "aria-hidden": true }),
|
|
16036
|
+
isEditMode && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(AiSectionOverlay, { postToParent: postToParent2, apiRef: aiSectionApiRef }),
|
|
16037
|
+
Object.entries(uploadingRects).map(([key, { rect, fadingOut }]) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15451
16038
|
MediaOverlay,
|
|
15452
16039
|
{
|
|
15453
16040
|
hover: { key, rect, elementType: "image", isDragOver: false, hasTextOverlap: false },
|
|
@@ -15458,7 +16045,7 @@ function OhhwellsBridge() {
|
|
|
15458
16045
|
},
|
|
15459
16046
|
`uploading-${key}`
|
|
15460
16047
|
)),
|
|
15461
|
-
mediaHover && !(mediaHover.key in uploadingRects) && /* @__PURE__ */ (0,
|
|
16048
|
+
mediaHover && !(mediaHover.key in uploadingRects) && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15462
16049
|
MediaOverlay,
|
|
15463
16050
|
{
|
|
15464
16051
|
hover: mediaHover,
|
|
@@ -15467,11 +16054,11 @@ function OhhwellsBridge() {
|
|
|
15467
16054
|
onVideoSettingsChange: handleVideoSettingsChange
|
|
15468
16055
|
}
|
|
15469
16056
|
),
|
|
15470
|
-
carouselHover && !linkPopover && !isItemDragging && /* @__PURE__ */ (0,
|
|
15471
|
-
siblingHintRect && !linkPopover && !isItemDragging && siblingHintRects.length === 0 && /* @__PURE__ */ (0,
|
|
15472
|
-
siblingHintRects.length > 0 && !linkPopover && !isItemDragging && siblingHintRects.map((rect, i) => /* @__PURE__ */ (0,
|
|
15473
|
-
isItemDragging && draggedItemRect && selectedElRef.current !== footerDragRef.current?.draggedEl && selectedElRef.current !== navDragRef.current?.draggedEl && /* @__PURE__ */ (0,
|
|
15474
|
-
isItemDragging && footerDropSlots.map((slot, i) => /* @__PURE__ */ (0,
|
|
16057
|
+
carouselHover && !linkPopover && !isItemDragging && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(CarouselOverlay, { hover: carouselHover, onEdit: handleEditCarousel }),
|
|
16058
|
+
siblingHintRect && !linkPopover && !isItemDragging && siblingHintRects.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ItemInteractionLayer, { rect: siblingHintRect, state: "sibling-hint" }),
|
|
16059
|
+
siblingHintRects.length > 0 && !linkPopover && !isItemDragging && siblingHintRects.map((rect, i) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ItemInteractionLayer, { rect, state: "sibling-hint" }, `sibling-hint-${i}`)),
|
|
16060
|
+
isItemDragging && draggedItemRect && selectedElRef.current !== footerDragRef.current?.draggedEl && selectedElRef.current !== navDragRef.current?.draggedEl && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ItemInteractionLayer, { rect: draggedItemRect, state: "dragging" }),
|
|
16061
|
+
isItemDragging && footerDropSlots.map((slot, i) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15475
16062
|
"div",
|
|
15476
16063
|
{
|
|
15477
16064
|
className: "pointer-events-none fixed z-2147483646",
|
|
@@ -15481,7 +16068,7 @@ function OhhwellsBridge() {
|
|
|
15481
16068
|
width: slot.width,
|
|
15482
16069
|
height: slot.height
|
|
15483
16070
|
},
|
|
15484
|
-
children: /* @__PURE__ */ (0,
|
|
16071
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15485
16072
|
DropIndicator,
|
|
15486
16073
|
{
|
|
15487
16074
|
direction: slot.direction,
|
|
@@ -15492,7 +16079,7 @@ function OhhwellsBridge() {
|
|
|
15492
16079
|
},
|
|
15493
16080
|
`footer-drop-${slot.direction}-${slot.columnIndex}-${slot.insertIndex}-${i}`
|
|
15494
16081
|
)),
|
|
15495
|
-
isItemDragging && navDropSlots.map((slot, i) => /* @__PURE__ */ (0,
|
|
16082
|
+
isItemDragging && navDropSlots.map((slot, i) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15496
16083
|
"div",
|
|
15497
16084
|
{
|
|
15498
16085
|
className: "pointer-events-none fixed z-2147483646",
|
|
@@ -15502,7 +16089,7 @@ function OhhwellsBridge() {
|
|
|
15502
16089
|
width: slot.width,
|
|
15503
16090
|
height: slot.height
|
|
15504
16091
|
},
|
|
15505
|
-
children: /* @__PURE__ */ (0,
|
|
16092
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15506
16093
|
DropIndicator,
|
|
15507
16094
|
{
|
|
15508
16095
|
direction: slot.direction,
|
|
@@ -15513,10 +16100,10 @@ function OhhwellsBridge() {
|
|
|
15513
16100
|
},
|
|
15514
16101
|
`nav-drop-${slot.direction}-${slot.parentId ?? "root"}-${slot.insertIndex}-${i}`
|
|
15515
16102
|
)),
|
|
15516
|
-
hoveredNavContainerRect && (toolbarVariant !== "select-frame" || isFooterFrameSelection) && !linkPopover && !isItemDragging && /* @__PURE__ */ (0,
|
|
15517
|
-
hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */ (0,
|
|
15518
|
-
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isNavbarLinksContainer2(selectedElRef.current) && /* @__PURE__ */ (0,
|
|
15519
|
-
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isFooterLinksContainer(selectedElRef.current) && /* @__PURE__ */ (0,
|
|
16103
|
+
hoveredNavContainerRect && (toolbarVariant !== "select-frame" || isFooterFrameSelection) && !linkPopover && !isItemDragging && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ItemInteractionLayer, { rect: hoveredNavContainerRect, state: "hover" }),
|
|
16104
|
+
hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ItemInteractionLayer, { rect: hoveredItemRect, state: "hover" }),
|
|
16105
|
+
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isNavbarLinksContainer2(selectedElRef.current) && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(NavbarContainerChrome, { rect: toolbarRect, onAdd: handleAddTopLevelNavItem }),
|
|
16106
|
+
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isFooterLinksContainer(selectedElRef.current) && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15520
16107
|
FooterContainerChrome,
|
|
15521
16108
|
{
|
|
15522
16109
|
rect: toolbarRect,
|
|
@@ -15524,7 +16111,7 @@ function OhhwellsBridge() {
|
|
|
15524
16111
|
addDisabled: !canAddFooterColumn()
|
|
15525
16112
|
}
|
|
15526
16113
|
),
|
|
15527
|
-
toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame") && /* @__PURE__ */ (0,
|
|
16114
|
+
toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame" || toolbarVariant === "logo") && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15528
16115
|
ItemInteractionLayer,
|
|
15529
16116
|
{
|
|
15530
16117
|
rect: isItemDragging && draggedItemRect && (footerDragRef.current?.wasSelected || navDragRef.current?.wasSelected) ? draggedItemRect : toolbarRect,
|
|
@@ -15536,10 +16123,10 @@ function OhhwellsBridge() {
|
|
|
15536
16123
|
dragHandleLabel: reorderHrefKey ? `Reorder ${reorderHrefKey}` : "Reorder item",
|
|
15537
16124
|
onDragHandleDragStart: handleItemDragStart,
|
|
15538
16125
|
onDragHandleDragEnd: handleItemDragEnd,
|
|
15539
|
-
onItemPointerDown: handleItemChromePointerDown,
|
|
15540
|
-
onItemClick: handleItemChromeClick,
|
|
15541
|
-
itemDragSurface: !isFooterFrameSelection,
|
|
15542
|
-
toolbar: toolbarVariant === "link-action" && !isItemDragging || toolbarVariant === "select-frame" && isFooterFrameSelection && !isItemDragging ? /* @__PURE__ */ (0,
|
|
16126
|
+
onItemPointerDown: toolbarVariant === "logo" ? void 0 : handleItemChromePointerDown,
|
|
16127
|
+
onItemClick: toolbarVariant === "logo" ? void 0 : handleItemChromeClick,
|
|
16128
|
+
itemDragSurface: toolbarVariant !== "logo" && !isFooterFrameSelection,
|
|
16129
|
+
toolbar: toolbarVariant === "link-action" && !isItemDragging || toolbarVariant === "select-frame" && isFooterFrameSelection && !isItemDragging ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15543
16130
|
ItemActionToolbar,
|
|
15544
16131
|
{
|
|
15545
16132
|
onEditLink: openLinkPopoverForSelected,
|
|
@@ -15564,8 +16151,8 @@ function OhhwellsBridge() {
|
|
|
15564
16151
|
) : void 0
|
|
15565
16152
|
}
|
|
15566
16153
|
),
|
|
15567
|
-
toolbarRect && toolbarVariant === "rich-text" && !linkPopover && /* @__PURE__ */ (0,
|
|
15568
|
-
/* @__PURE__ */ (0,
|
|
16154
|
+
toolbarRect && toolbarVariant === "rich-text" && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
|
|
16155
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15569
16156
|
EditGlowChrome,
|
|
15570
16157
|
{
|
|
15571
16158
|
rect: toolbarRect,
|
|
@@ -15575,7 +16162,7 @@ function OhhwellsBridge() {
|
|
|
15575
16162
|
hideHandle: isItemDragging
|
|
15576
16163
|
}
|
|
15577
16164
|
),
|
|
15578
|
-
/* @__PURE__ */ (0,
|
|
16165
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15579
16166
|
FloatingToolbar,
|
|
15580
16167
|
{
|
|
15581
16168
|
rect: toolbarRect,
|
|
@@ -15588,7 +16175,7 @@ function OhhwellsBridge() {
|
|
|
15588
16175
|
}
|
|
15589
16176
|
)
|
|
15590
16177
|
] }),
|
|
15591
|
-
maxBadge && /* @__PURE__ */ (0,
|
|
16178
|
+
maxBadge && /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
|
|
15592
16179
|
"div",
|
|
15593
16180
|
{
|
|
15594
16181
|
"data-ohw-max-badge": "",
|
|
@@ -15614,7 +16201,7 @@ function OhhwellsBridge() {
|
|
|
15614
16201
|
]
|
|
15615
16202
|
}
|
|
15616
16203
|
),
|
|
15617
|
-
toggleState && !linkPopover && /* @__PURE__ */ (0,
|
|
16204
|
+
toggleState && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15618
16205
|
StateToggle,
|
|
15619
16206
|
{
|
|
15620
16207
|
rect: toggleState.rect,
|
|
@@ -15623,15 +16210,15 @@ function OhhwellsBridge() {
|
|
|
15623
16210
|
onStateChange: handleStateChange
|
|
15624
16211
|
}
|
|
15625
16212
|
),
|
|
15626
|
-
sectionGap && !linkPopover && /* @__PURE__ */ (0,
|
|
16213
|
+
sectionGap && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
|
|
15627
16214
|
"div",
|
|
15628
16215
|
{
|
|
15629
16216
|
"data-ohw-section-insert-line": "",
|
|
15630
16217
|
className: "fixed left-0 w-full z-2147483646 flex items-center pointer-events-none",
|
|
15631
16218
|
style: { top: sectionGap.y, transform: "translateY(-50%)" },
|
|
15632
16219
|
children: [
|
|
15633
|
-
/* @__PURE__ */ (0,
|
|
15634
|
-
/* @__PURE__ */ (0,
|
|
16220
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } }),
|
|
16221
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15635
16222
|
Badge,
|
|
15636
16223
|
{
|
|
15637
16224
|
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",
|
|
@@ -15648,11 +16235,11 @@ function OhhwellsBridge() {
|
|
|
15648
16235
|
children: "Add Section"
|
|
15649
16236
|
}
|
|
15650
16237
|
),
|
|
15651
|
-
/* @__PURE__ */ (0,
|
|
16238
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } })
|
|
15652
16239
|
]
|
|
15653
16240
|
}
|
|
15654
16241
|
),
|
|
15655
|
-
linkPopover && dialogPortalContainer ? /* @__PURE__ */ (0,
|
|
16242
|
+
linkPopover && dialogPortalContainer ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15656
16243
|
LinkPopover,
|
|
15657
16244
|
{
|
|
15658
16245
|
panelRef: linkPopoverPanelRef,
|
|
@@ -15668,6 +16255,57 @@ function OhhwellsBridge() {
|
|
|
15668
16255
|
onSubmit: handleLinkPopoverSubmit
|
|
15669
16256
|
},
|
|
15670
16257
|
linkPopover.key
|
|
16258
|
+
) : null,
|
|
16259
|
+
floatingPanel && floatingPanel.kind === "logo-size" && logoSizeDraft ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
16260
|
+
FloatingPanel,
|
|
16261
|
+
{
|
|
16262
|
+
open: true,
|
|
16263
|
+
title: floatingPanel.title,
|
|
16264
|
+
context: floatingPanel.context,
|
|
16265
|
+
position: floatingPanelPos,
|
|
16266
|
+
onPositionChange: setFloatingPanelPos,
|
|
16267
|
+
parentScroll: parentScrollSnap ?? parentScrollRef.current,
|
|
16268
|
+
onClose: closeFloatingPanelAndDeselect,
|
|
16269
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
16270
|
+
LogoSizePanel,
|
|
16271
|
+
{
|
|
16272
|
+
viewport: editorViewport,
|
|
16273
|
+
sizePx: editorViewport === "mobile" && !logoSizeDraft.mobileFollowing ? logoSizeDraft.mobilePx : logoSizeDraft.desktopPx,
|
|
16274
|
+
mobileFollowing: logoSizeDraft.mobileFollowing,
|
|
16275
|
+
onSizeChange: (px) => {
|
|
16276
|
+
const next = editorViewport === "mobile" ? { ...logoSizeDraft, mobilePx: px, mobileFollowing: false } : {
|
|
16277
|
+
...logoSizeDraft,
|
|
16278
|
+
desktopPx: px,
|
|
16279
|
+
mobilePx: logoSizeDraft.mobileFollowing ? px : logoSizeDraft.mobilePx
|
|
16280
|
+
};
|
|
16281
|
+
setLogoSizeDraft(next);
|
|
16282
|
+
persistLogoSizeDraft(floatingPanel.placement, next);
|
|
16283
|
+
},
|
|
16284
|
+
onCustomizeMobile: () => {
|
|
16285
|
+
const next = {
|
|
16286
|
+
...logoSizeDraft,
|
|
16287
|
+
mobileFollowing: false,
|
|
16288
|
+
mobilePx: logoSizeDraft.desktopPx
|
|
16289
|
+
};
|
|
16290
|
+
setLogoSizeDraft(next);
|
|
16291
|
+
persistLogoSizeDraft(floatingPanel.placement, next);
|
|
16292
|
+
},
|
|
16293
|
+
onResetMobile: () => {
|
|
16294
|
+
const next = {
|
|
16295
|
+
...logoSizeDraft,
|
|
16296
|
+
mobileFollowing: true,
|
|
16297
|
+
mobilePx: logoSizeDraft.desktopPx
|
|
16298
|
+
};
|
|
16299
|
+
setLogoSizeDraft(next);
|
|
16300
|
+
persistLogoSizeDraft(floatingPanel.placement, next);
|
|
16301
|
+
},
|
|
16302
|
+
onUpdateEverywhere: () => {
|
|
16303
|
+
const identity = readLogoIdentityFromDom();
|
|
16304
|
+
postToParent2({ type: "ow:open-logo-settings", ...identity });
|
|
16305
|
+
}
|
|
16306
|
+
}
|
|
16307
|
+
)
|
|
16308
|
+
}
|
|
15671
16309
|
) : null
|
|
15672
16310
|
] }),
|
|
15673
16311
|
bridgeRoot
|