@ohhwells/bridge 0.1.52-next.140 → 0.1.52-next.141
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 +857 -252
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +857 -246
- package/dist/index.js.map +1 -1
- package/dist/styles.css +80 -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,292 @@ 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
|
+
"fixed z-[2147483645] flex w-64 flex-col overflow-hidden rounded-xl border border-border bg-background font-sans shadow-lg outline-none",
|
|
9501
|
+
className
|
|
9502
|
+
),
|
|
9503
|
+
style: { left: clamped.x, top: clamped.y },
|
|
9504
|
+
onMouseDown: (e) => e.stopPropagation(),
|
|
9505
|
+
onPointerDown: (e) => e.stopPropagation(),
|
|
9506
|
+
onClick: (e) => e.stopPropagation(),
|
|
9507
|
+
children: [
|
|
9508
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
|
|
9509
|
+
"div",
|
|
9510
|
+
{
|
|
9511
|
+
"data-ohw-floating-panel-header": "",
|
|
9512
|
+
className: "relative flex cursor-grab items-start gap-2 border-b border-border py-5 pl-5 pr-11 active:cursor-grabbing",
|
|
9513
|
+
onPointerDown: onHeaderPointerDown,
|
|
9514
|
+
onPointerMove: onHeaderPointerMove,
|
|
9515
|
+
onPointerUp: endDrag,
|
|
9516
|
+
onPointerCancel: endDrag,
|
|
9517
|
+
children: [
|
|
9518
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col gap-1.5", children: [
|
|
9519
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
9520
|
+
icon ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "shrink-0 text-foreground", children: icon }) : null,
|
|
9521
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "min-w-0 flex-1 text-lg font-semibold leading-7 text-foreground", children: title })
|
|
9522
|
+
] }),
|
|
9523
|
+
context ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "w-full text-sm leading-5 text-muted-foreground", children: context }) : null
|
|
9524
|
+
] }),
|
|
9525
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
9526
|
+
"button",
|
|
9527
|
+
{
|
|
9528
|
+
type: "button",
|
|
9529
|
+
"data-ohw-floating-panel-close": "",
|
|
9530
|
+
"aria-label": "Close",
|
|
9531
|
+
className: "absolute right-2.5 top-2.5 rounded-sm p-1.5 text-foreground hover:bg-muted/50",
|
|
9532
|
+
onClick: (e) => {
|
|
9533
|
+
e.stopPropagation();
|
|
9534
|
+
onClose();
|
|
9535
|
+
},
|
|
9536
|
+
onPointerDown: (e) => e.stopPropagation(),
|
|
9537
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react12.X, { size: 16, "aria-hidden": true })
|
|
9538
|
+
}
|
|
9539
|
+
)
|
|
9540
|
+
]
|
|
9541
|
+
}
|
|
9542
|
+
),
|
|
9543
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
9544
|
+
"div",
|
|
9545
|
+
{
|
|
9546
|
+
"data-ohw-floating-panel-body": "",
|
|
9547
|
+
className: cn("flex w-full flex-col gap-4 p-5", bodyClassName),
|
|
9548
|
+
children
|
|
9549
|
+
}
|
|
9550
|
+
)
|
|
9551
|
+
]
|
|
9552
|
+
}
|
|
9553
|
+
);
|
|
9554
|
+
}
|
|
9555
|
+
|
|
9556
|
+
// src/ui/logo-size-panel.tsx
|
|
9557
|
+
var import_lucide_react13 = require("lucide-react");
|
|
9558
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
9559
|
+
function SizeSlider({
|
|
9560
|
+
value,
|
|
9561
|
+
onChange
|
|
9562
|
+
}) {
|
|
9563
|
+
const pct = (value - LOGO_SIZE_MIN) / (LOGO_SIZE_MAX - LOGO_SIZE_MIN) * 100;
|
|
9564
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex w-full flex-col gap-3", children: [
|
|
9565
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex w-full items-center gap-2 text-sm font-medium leading-5", children: [
|
|
9566
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "min-w-0 flex-1 text-foreground", children: "Size" }),
|
|
9567
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("span", { className: "shrink-0 whitespace-nowrap text-muted-foreground", children: [
|
|
9568
|
+
value,
|
|
9569
|
+
" px"
|
|
9570
|
+
] })
|
|
9571
|
+
] }),
|
|
9572
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "relative h-2 w-full rounded-full bg-primary-50", children: [
|
|
9573
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
9574
|
+
"div",
|
|
9575
|
+
{
|
|
9576
|
+
className: "absolute inset-y-0 left-0 rounded-full bg-primary",
|
|
9577
|
+
style: { width: `${pct}%` }
|
|
9578
|
+
}
|
|
9579
|
+
),
|
|
9580
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
9581
|
+
"input",
|
|
9582
|
+
{
|
|
9583
|
+
type: "range",
|
|
9584
|
+
min: LOGO_SIZE_MIN,
|
|
9585
|
+
max: LOGO_SIZE_MAX,
|
|
9586
|
+
step: 1,
|
|
9587
|
+
value,
|
|
9588
|
+
"aria-label": "Logo size",
|
|
9589
|
+
className: cn(
|
|
9590
|
+
"absolute inset-0 h-full w-full cursor-pointer appearance-none bg-transparent",
|
|
9591
|
+
"[&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:size-5",
|
|
9592
|
+
"[&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-2",
|
|
9593
|
+
"[&::-webkit-slider-thumb]:border-primary [&::-webkit-slider-thumb]:bg-background",
|
|
9594
|
+
"[&::-moz-range-thumb]:size-5 [&::-moz-range-thumb]:rounded-full",
|
|
9595
|
+
"[&::-moz-range-thumb]:border-2 [&::-moz-range-thumb]:border-primary",
|
|
9596
|
+
"[&::-moz-range-thumb]:bg-background"
|
|
9597
|
+
),
|
|
9598
|
+
onChange: (e) => onChange(Number(e.target.value))
|
|
9599
|
+
}
|
|
9600
|
+
)
|
|
9601
|
+
] })
|
|
9602
|
+
] });
|
|
9603
|
+
}
|
|
9604
|
+
function LogoSizePanel({
|
|
9605
|
+
viewport,
|
|
9606
|
+
sizePx,
|
|
9607
|
+
mobileFollowing = true,
|
|
9608
|
+
onSizeChange,
|
|
9609
|
+
onCustomizeMobile,
|
|
9610
|
+
onResetMobile,
|
|
9611
|
+
onUpdateEverywhere,
|
|
9612
|
+
className
|
|
9613
|
+
}) {
|
|
9614
|
+
const showFollowing = viewport === "mobile" && mobileFollowing;
|
|
9615
|
+
const showMobileSlider = viewport === "mobile" && !mobileFollowing;
|
|
9616
|
+
const showDesktopSlider = viewport === "desktop";
|
|
9617
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: cn("flex w-full flex-col gap-4", className), children: [
|
|
9618
|
+
showFollowing ? /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex w-full flex-col gap-2", children: [
|
|
9619
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex items-start gap-1", children: [
|
|
9620
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react13.Link, { size: 16, className: "mt-0.5 shrink-0 text-foreground", "aria-hidden": true }),
|
|
9621
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("p", { className: "text-sm font-semibold leading-5 text-foreground", children: "Following desktop size" })
|
|
9622
|
+
] }),
|
|
9623
|
+
/* @__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." }),
|
|
9624
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
9625
|
+
Button,
|
|
9626
|
+
{
|
|
9627
|
+
type: "button",
|
|
9628
|
+
variant: "outline",
|
|
9629
|
+
size: "sm",
|
|
9630
|
+
className: "h-9 w-full min-w-0 cursor-pointer",
|
|
9631
|
+
onClick: onCustomizeMobile,
|
|
9632
|
+
children: "Customize for mobile"
|
|
9633
|
+
}
|
|
9634
|
+
)
|
|
9635
|
+
] }) : null,
|
|
9636
|
+
showDesktopSlider || showMobileSlider ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SizeSlider, { value: sizePx, onChange: onSizeChange }) : null,
|
|
9637
|
+
showMobileSlider ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
9638
|
+
Button,
|
|
9639
|
+
{
|
|
9640
|
+
type: "button",
|
|
9641
|
+
variant: "outline",
|
|
9642
|
+
size: "sm",
|
|
9643
|
+
className: "h-9 w-full min-w-0 cursor-pointer",
|
|
9644
|
+
onClick: onResetMobile,
|
|
9645
|
+
children: "Reset to desktop size"
|
|
9646
|
+
}
|
|
9647
|
+
) : null,
|
|
9648
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "h-px w-full bg-border", role: "separator" }),
|
|
9649
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
|
|
9650
|
+
Button,
|
|
9651
|
+
{
|
|
9652
|
+
type: "button",
|
|
9653
|
+
variant: "outline",
|
|
9654
|
+
size: "sm",
|
|
9655
|
+
className: "h-9 w-full min-w-0 cursor-pointer gap-1",
|
|
9656
|
+
onClick: onUpdateEverywhere,
|
|
9657
|
+
children: [
|
|
9658
|
+
"Update logo everywhere",
|
|
9659
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react13.ArrowUpRight, { size: 16, "aria-hidden": true })
|
|
9660
|
+
]
|
|
9661
|
+
}
|
|
9662
|
+
),
|
|
9663
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("p", { className: "text-sm leading-5 text-muted-foreground", children: "Matches the right version to your background." })
|
|
9664
|
+
] });
|
|
9665
|
+
}
|
|
9666
|
+
|
|
9286
9667
|
// src/lib/item-drag-interaction.ts
|
|
9287
9668
|
function disableNativeHrefDrag(el) {
|
|
9288
9669
|
if (el.draggable) el.draggable = false;
|
|
@@ -9481,7 +9862,7 @@ function hitTestNavDropSlot(clientX, clientY, draggedHrefKey) {
|
|
|
9481
9862
|
}
|
|
9482
9863
|
|
|
9483
9864
|
// src/useNavItemDrag.ts
|
|
9484
|
-
var
|
|
9865
|
+
var import_react13 = require("react");
|
|
9485
9866
|
function useNavItemDrag({
|
|
9486
9867
|
isEditMode,
|
|
9487
9868
|
editContentRef,
|
|
@@ -9505,11 +9886,11 @@ function useNavItemDrag({
|
|
|
9505
9886
|
getNavigationItemAnchor: getNavigationItemAnchor2,
|
|
9506
9887
|
isDragHandleDisabled: isDragHandleDisabled2
|
|
9507
9888
|
}) {
|
|
9508
|
-
const navDragRef = (0,
|
|
9509
|
-
const [navDropSlots, setNavDropSlots] = (0,
|
|
9510
|
-
const [activeNavDropIndex, setActiveNavDropIndex] = (0,
|
|
9511
|
-
const navPointerDragRef = (0,
|
|
9512
|
-
const clearNavDragVisuals = (0,
|
|
9889
|
+
const navDragRef = (0, import_react13.useRef)(null);
|
|
9890
|
+
const [navDropSlots, setNavDropSlots] = (0, import_react13.useState)([]);
|
|
9891
|
+
const [activeNavDropIndex, setActiveNavDropIndex] = (0, import_react13.useState)(null);
|
|
9892
|
+
const navPointerDragRef = (0, import_react13.useRef)(null);
|
|
9893
|
+
const clearNavDragVisuals = (0, import_react13.useCallback)(() => {
|
|
9513
9894
|
const session = navDragRef.current;
|
|
9514
9895
|
const keepOpenEl = session?.draggedEl?.closest("[data-ohw-nav-children]") != null ? session.draggedEl : null;
|
|
9515
9896
|
navDragRef.current = null;
|
|
@@ -9526,7 +9907,7 @@ function useNavItemDrag({
|
|
|
9526
9907
|
document.documentElement.removeAttribute("data-ohw-nav-dragging-root");
|
|
9527
9908
|
unlockItemDragInteraction();
|
|
9528
9909
|
}, [setDraggedItemRect, setIsItemDragging, setSiblingHintRects]);
|
|
9529
|
-
const refreshNavDragVisuals = (0,
|
|
9910
|
+
const refreshNavDragVisuals = (0, import_react13.useCallback)(
|
|
9530
9911
|
(session, activeSlot, clientX, clientY) => {
|
|
9531
9912
|
setDraggedItemRect(session.draggedEl.getBoundingClientRect());
|
|
9532
9913
|
if (typeof clientX === "number" && typeof clientY === "number") {
|
|
@@ -9544,13 +9925,13 @@ function useNavItemDrag({
|
|
|
9544
9925
|
},
|
|
9545
9926
|
[setDraggedItemRect, setSiblingHintRects]
|
|
9546
9927
|
);
|
|
9547
|
-
const refreshNavDragVisualsRef = (0,
|
|
9928
|
+
const refreshNavDragVisualsRef = (0, import_react13.useRef)(refreshNavDragVisuals);
|
|
9548
9929
|
refreshNavDragVisualsRef.current = refreshNavDragVisuals;
|
|
9549
|
-
const commitNavDragRef = (0,
|
|
9930
|
+
const commitNavDragRef = (0, import_react13.useRef)(() => {
|
|
9550
9931
|
});
|
|
9551
|
-
const beginNavDragRef = (0,
|
|
9932
|
+
const beginNavDragRef = (0, import_react13.useRef)(() => {
|
|
9552
9933
|
});
|
|
9553
|
-
const beginNavDrag = (0,
|
|
9934
|
+
const beginNavDrag = (0, import_react13.useCallback)(
|
|
9554
9935
|
(session) => {
|
|
9555
9936
|
const rect = session.draggedEl.getBoundingClientRect();
|
|
9556
9937
|
session.lastClientX = session.lastClientX || rect.left + rect.width / 2;
|
|
@@ -9584,7 +9965,7 @@ function useNavItemDrag({
|
|
|
9584
9965
|
]
|
|
9585
9966
|
);
|
|
9586
9967
|
beginNavDragRef.current = beginNavDrag;
|
|
9587
|
-
const commitNavDrag = (0,
|
|
9968
|
+
const commitNavDrag = (0, import_react13.useCallback)(
|
|
9588
9969
|
(clientX, clientY) => {
|
|
9589
9970
|
const session = navDragRef.current;
|
|
9590
9971
|
if (!session) {
|
|
@@ -9645,7 +10026,7 @@ function useNavItemDrag({
|
|
|
9645
10026
|
[clearNavDragVisuals, deselectRef, editContentRef, postToParentRef, selectRef]
|
|
9646
10027
|
);
|
|
9647
10028
|
commitNavDragRef.current = commitNavDrag;
|
|
9648
|
-
const startNavLinkDrag = (0,
|
|
10029
|
+
const startNavLinkDrag = (0, import_react13.useCallback)(
|
|
9649
10030
|
(anchor, clientX, clientY, wasSelected) => {
|
|
9650
10031
|
if (footerDragRef.current) return false;
|
|
9651
10032
|
const hrefKey = anchor.getAttribute("data-ohw-href-key");
|
|
@@ -9663,7 +10044,7 @@ function useNavItemDrag({
|
|
|
9663
10044
|
},
|
|
9664
10045
|
[beginNavDrag, footerDragRef, isDragHandleDisabled2, isCtaButton]
|
|
9665
10046
|
);
|
|
9666
|
-
const onNavDragOver = (0,
|
|
10047
|
+
const onNavDragOver = (0, import_react13.useCallback)(
|
|
9667
10048
|
(e) => {
|
|
9668
10049
|
const session = navDragRef.current;
|
|
9669
10050
|
if (!session) return false;
|
|
@@ -9675,7 +10056,7 @@ function useNavItemDrag({
|
|
|
9675
10056
|
},
|
|
9676
10057
|
[]
|
|
9677
10058
|
);
|
|
9678
|
-
(0,
|
|
10059
|
+
(0, import_react13.useEffect)(() => {
|
|
9679
10060
|
if (!isEditMode) return;
|
|
9680
10061
|
const THRESHOLD = 10;
|
|
9681
10062
|
const resolveWasSelected = (el) => {
|
|
@@ -9800,7 +10181,7 @@ function useNavItemDrag({
|
|
|
9800
10181
|
setLinkPopover,
|
|
9801
10182
|
suppressNextClickRef
|
|
9802
10183
|
]);
|
|
9803
|
-
const armNavPressFromChrome = (0,
|
|
10184
|
+
const armNavPressFromChrome = (0, import_react13.useCallback)(
|
|
9804
10185
|
(selected, clientX, clientY, pointerId) => {
|
|
9805
10186
|
const hrefKey = selected.getAttribute("data-ohw-href-key");
|
|
9806
10187
|
if (!hrefKey || !isNavbarHrefKey(hrefKey)) return false;
|
|
@@ -9831,8 +10212,8 @@ function useNavItemDrag({
|
|
|
9831
10212
|
}
|
|
9832
10213
|
|
|
9833
10214
|
// src/ui/footer-container-chrome.tsx
|
|
9834
|
-
var
|
|
9835
|
-
var
|
|
10215
|
+
var import_lucide_react14 = require("lucide-react");
|
|
10216
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
9836
10217
|
function FooterContainerChrome({
|
|
9837
10218
|
rect,
|
|
9838
10219
|
onAdd,
|
|
@@ -9840,7 +10221,7 @@ function FooterContainerChrome({
|
|
|
9840
10221
|
}) {
|
|
9841
10222
|
const chromeGap = 6;
|
|
9842
10223
|
const buttonMargin = 7;
|
|
9843
|
-
return /* @__PURE__ */ (0,
|
|
10224
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
9844
10225
|
"div",
|
|
9845
10226
|
{
|
|
9846
10227
|
"data-ohw-footer-container-chrome": "",
|
|
@@ -9852,8 +10233,8 @@ function FooterContainerChrome({
|
|
|
9852
10233
|
width: rect.width + chromeGap * 2,
|
|
9853
10234
|
height: rect.height + chromeGap * 2
|
|
9854
10235
|
},
|
|
9855
|
-
children: /* @__PURE__ */ (0,
|
|
9856
|
-
/* @__PURE__ */ (0,
|
|
10236
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(Tooltip, { children: [
|
|
10237
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
9857
10238
|
"button",
|
|
9858
10239
|
{
|
|
9859
10240
|
type: "button",
|
|
@@ -9872,17 +10253,17 @@ function FooterContainerChrome({
|
|
|
9872
10253
|
if (addDisabled) return;
|
|
9873
10254
|
onAdd();
|
|
9874
10255
|
},
|
|
9875
|
-
children: /* @__PURE__ */ (0,
|
|
10256
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_lucide_react14.Plus, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
|
|
9876
10257
|
}
|
|
9877
10258
|
) }),
|
|
9878
|
-
/* @__PURE__ */ (0,
|
|
10259
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(TooltipContent, { side: "bottom", sideOffset: 9, children: addDisabled ? "Maximum columns reached" : "Add item" })
|
|
9879
10260
|
] })
|
|
9880
10261
|
}
|
|
9881
10262
|
) });
|
|
9882
10263
|
}
|
|
9883
10264
|
|
|
9884
10265
|
// src/lib/carousel.ts
|
|
9885
|
-
var
|
|
10266
|
+
var import_react14 = require("react");
|
|
9886
10267
|
var CAROUSEL_ATTR = "data-ohw-carousel";
|
|
9887
10268
|
var CAROUSEL_VALUE_ATTR = "data-ohw-carousel-value";
|
|
9888
10269
|
var CAROUSEL_SLIDE_ATTR = "data-ohw-carousel-slide";
|
|
@@ -9944,8 +10325,8 @@ function applyCarouselNode(key, val) {
|
|
|
9944
10325
|
return true;
|
|
9945
10326
|
}
|
|
9946
10327
|
function useOhwCarousel(key, initial) {
|
|
9947
|
-
const [images, setImages] = (0,
|
|
9948
|
-
(0,
|
|
10328
|
+
const [images, setImages] = (0, import_react14.useState)(initial);
|
|
10329
|
+
(0, import_react14.useEffect)(() => {
|
|
9949
10330
|
const el = document.querySelector(
|
|
9950
10331
|
`[${CAROUSEL_ATTR}][data-ohw-key="${CSS.escape(key)}"]`
|
|
9951
10332
|
);
|
|
@@ -10055,6 +10436,18 @@ function collectEditableNodes(extraContent, root = document) {
|
|
|
10055
10436
|
}
|
|
10056
10437
|
if (extraContent && !isScoped) {
|
|
10057
10438
|
applyNavFooterDeleteOverrides(byKey, extraContent);
|
|
10439
|
+
for (const key of LOGO_IMAGE_KEYS) {
|
|
10440
|
+
if (!(key in extraContent)) continue;
|
|
10441
|
+
byKey.set(key, { key, type: "image", text: extraContent[key] ?? "" });
|
|
10442
|
+
}
|
|
10443
|
+
for (const key of [LOGO_PLACEHOLDER_KEY, LOGO_ALT_KEY]) {
|
|
10444
|
+
if (!(key in extraContent)) continue;
|
|
10445
|
+
byKey.set(key, { key, type: "meta", text: extraContent[key] ?? "" });
|
|
10446
|
+
}
|
|
10447
|
+
for (const key of LOGO_SIZE_KEYS) {
|
|
10448
|
+
if (!(key in extraContent)) continue;
|
|
10449
|
+
byKey.set(key, { key, type: "meta", text: extraContent[key] ?? "" });
|
|
10450
|
+
}
|
|
10058
10451
|
}
|
|
10059
10452
|
return Array.from(byKey.values());
|
|
10060
10453
|
}
|
|
@@ -10303,14 +10696,14 @@ function deleteSelectedNavFooterItem(deps) {
|
|
|
10303
10696
|
}
|
|
10304
10697
|
|
|
10305
10698
|
// src/ui/navbar-container-chrome.tsx
|
|
10306
|
-
var
|
|
10307
|
-
var
|
|
10699
|
+
var import_lucide_react15 = require("lucide-react");
|
|
10700
|
+
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
10308
10701
|
function NavbarContainerChrome({
|
|
10309
10702
|
rect,
|
|
10310
10703
|
onAdd
|
|
10311
10704
|
}) {
|
|
10312
10705
|
const chromeGap = 6;
|
|
10313
|
-
return /* @__PURE__ */ (0,
|
|
10706
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
10314
10707
|
"div",
|
|
10315
10708
|
{
|
|
10316
10709
|
"data-ohw-navbar-container-chrome": "",
|
|
@@ -10322,7 +10715,7 @@ function NavbarContainerChrome({
|
|
|
10322
10715
|
width: rect.width + chromeGap * 2,
|
|
10323
10716
|
height: rect.height + chromeGap * 2
|
|
10324
10717
|
},
|
|
10325
|
-
children: /* @__PURE__ */ (0,
|
|
10718
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
10326
10719
|
"button",
|
|
10327
10720
|
{
|
|
10328
10721
|
type: "button",
|
|
@@ -10339,7 +10732,7 @@ function NavbarContainerChrome({
|
|
|
10339
10732
|
e.stopPropagation();
|
|
10340
10733
|
onAdd();
|
|
10341
10734
|
},
|
|
10342
|
-
children: /* @__PURE__ */ (0,
|
|
10735
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_lucide_react15.Plus, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
|
|
10343
10736
|
}
|
|
10344
10737
|
)
|
|
10345
10738
|
}
|
|
@@ -10348,7 +10741,7 @@ function NavbarContainerChrome({
|
|
|
10348
10741
|
|
|
10349
10742
|
// src/ui/drop-indicator.tsx
|
|
10350
10743
|
var React9 = __toESM(require("react"), 1);
|
|
10351
|
-
var
|
|
10744
|
+
var import_jsx_runtime28 = require("react/jsx-runtime");
|
|
10352
10745
|
var dropIndicatorVariants = cva(
|
|
10353
10746
|
"ov-gap-line pointer-events-none shrink-0 transition-opacity duration-150",
|
|
10354
10747
|
{
|
|
@@ -10372,7 +10765,7 @@ var dropIndicatorVariants = cva(
|
|
|
10372
10765
|
);
|
|
10373
10766
|
var DropIndicator = React9.forwardRef(
|
|
10374
10767
|
({ className, direction, state, ...props }, ref) => {
|
|
10375
|
-
return /* @__PURE__ */ (0,
|
|
10768
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
10376
10769
|
"div",
|
|
10377
10770
|
{
|
|
10378
10771
|
ref,
|
|
@@ -10389,7 +10782,7 @@ var DropIndicator = React9.forwardRef(
|
|
|
10389
10782
|
DropIndicator.displayName = "DropIndicator";
|
|
10390
10783
|
|
|
10391
10784
|
// src/ui/badge.tsx
|
|
10392
|
-
var
|
|
10785
|
+
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
10393
10786
|
var badgeVariants = cva(
|
|
10394
10787
|
"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
10788
|
{
|
|
@@ -10407,12 +10800,12 @@ var badgeVariants = cva(
|
|
|
10407
10800
|
}
|
|
10408
10801
|
);
|
|
10409
10802
|
function Badge({ className, variant, ...props }) {
|
|
10410
|
-
return /* @__PURE__ */ (0,
|
|
10803
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: cn(badgeVariants({ variant }), className), ...props });
|
|
10411
10804
|
}
|
|
10412
10805
|
|
|
10413
10806
|
// src/OhhwellsBridge.tsx
|
|
10414
|
-
var
|
|
10415
|
-
var
|
|
10807
|
+
var import_lucide_react16 = require("lucide-react");
|
|
10808
|
+
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
10416
10809
|
var PRIMARY3 = "#0885FE";
|
|
10417
10810
|
var IMAGE_FADE_MS = 300;
|
|
10418
10811
|
function runOpacityFade(el, onDone) {
|
|
@@ -10591,7 +10984,7 @@ function mountSchedulingWidget(insertAfter, notifyOnConnect = false, scheduleId,
|
|
|
10591
10984
|
const root = (0, import_client.createRoot)(container);
|
|
10592
10985
|
(0, import_react_dom2.flushSync)(() => {
|
|
10593
10986
|
root.render(
|
|
10594
|
-
/* @__PURE__ */ (0,
|
|
10987
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
10595
10988
|
SchedulingWidget,
|
|
10596
10989
|
{
|
|
10597
10990
|
notifyOnConnect,
|
|
@@ -10746,6 +11139,9 @@ function isInsideLinkEditor(target) {
|
|
|
10746
11139
|
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
11140
|
);
|
|
10748
11141
|
}
|
|
11142
|
+
function isInsideFloatingPanel(target) {
|
|
11143
|
+
return Boolean(target.closest("[data-ohw-floating-panel]"));
|
|
11144
|
+
}
|
|
10749
11145
|
function getHrefKeyFromElement(el) {
|
|
10750
11146
|
if (!el) return null;
|
|
10751
11147
|
const anchor = el.closest("[data-ohw-href-key]");
|
|
@@ -11198,7 +11594,7 @@ function EditGlowChrome({
|
|
|
11198
11594
|
hideHandle = false
|
|
11199
11595
|
}) {
|
|
11200
11596
|
const GAP = SELECTION_CHROME_GAP2;
|
|
11201
|
-
return /* @__PURE__ */ (0,
|
|
11597
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
|
|
11202
11598
|
"div",
|
|
11203
11599
|
{
|
|
11204
11600
|
ref: elRef,
|
|
@@ -11213,7 +11609,7 @@ function EditGlowChrome({
|
|
|
11213
11609
|
zIndex: 2147483646
|
|
11214
11610
|
},
|
|
11215
11611
|
children: [
|
|
11216
|
-
/* @__PURE__ */ (0,
|
|
11612
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
11217
11613
|
"div",
|
|
11218
11614
|
{
|
|
11219
11615
|
style: {
|
|
@@ -11226,7 +11622,7 @@ function EditGlowChrome({
|
|
|
11226
11622
|
}
|
|
11227
11623
|
}
|
|
11228
11624
|
),
|
|
11229
|
-
reorderHrefKey && !hideHandle && /* @__PURE__ */ (0,
|
|
11625
|
+
reorderHrefKey && !hideHandle && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
11230
11626
|
"div",
|
|
11231
11627
|
{
|
|
11232
11628
|
"data-ohw-drag-handle-container": "",
|
|
@@ -11238,7 +11634,7 @@ function EditGlowChrome({
|
|
|
11238
11634
|
transform: "translate(calc(-100% - 7px), -50%)",
|
|
11239
11635
|
pointerEvents: dragDisabled ? "none" : "auto"
|
|
11240
11636
|
},
|
|
11241
|
-
children: /* @__PURE__ */ (0,
|
|
11637
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
11242
11638
|
DragHandle,
|
|
11243
11639
|
{
|
|
11244
11640
|
"aria-label": `Reorder ${reorderHrefKey}`,
|
|
@@ -11421,9 +11817,9 @@ function FloatingToolbar({
|
|
|
11421
11817
|
showEditLink,
|
|
11422
11818
|
onEditLink
|
|
11423
11819
|
}) {
|
|
11424
|
-
const localRef =
|
|
11425
|
-
const [measuredW, setMeasuredW] =
|
|
11426
|
-
const setRefs =
|
|
11820
|
+
const localRef = import_react15.default.useRef(null);
|
|
11821
|
+
const [measuredW, setMeasuredW] = import_react15.default.useState(330);
|
|
11822
|
+
const setRefs = import_react15.default.useCallback(
|
|
11427
11823
|
(node) => {
|
|
11428
11824
|
localRef.current = node;
|
|
11429
11825
|
if (typeof elRef === "function") elRef(node);
|
|
@@ -11435,7 +11831,7 @@ function FloatingToolbar({
|
|
|
11435
11831
|
},
|
|
11436
11832
|
[elRef]
|
|
11437
11833
|
);
|
|
11438
|
-
|
|
11834
|
+
import_react15.default.useLayoutEffect(() => {
|
|
11439
11835
|
const node = localRef.current;
|
|
11440
11836
|
if (!node) return;
|
|
11441
11837
|
const update = () => {
|
|
@@ -11448,7 +11844,7 @@ function FloatingToolbar({
|
|
|
11448
11844
|
return () => ro.disconnect();
|
|
11449
11845
|
}, [showEditLink, activeCommands]);
|
|
11450
11846
|
const { top, left, transform } = calcToolbarPos(rect, parentScroll, measuredW);
|
|
11451
|
-
return /* @__PURE__ */ (0,
|
|
11847
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
11452
11848
|
"div",
|
|
11453
11849
|
{
|
|
11454
11850
|
ref: setRefs,
|
|
@@ -11460,12 +11856,12 @@ function FloatingToolbar({
|
|
|
11460
11856
|
zIndex: 2147483647,
|
|
11461
11857
|
pointerEvents: "auto"
|
|
11462
11858
|
},
|
|
11463
|
-
children: /* @__PURE__ */ (0,
|
|
11464
|
-
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ (0,
|
|
11465
|
-
gi > 0 && /* @__PURE__ */ (0,
|
|
11859
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(CustomToolbar, { children: [
|
|
11860
|
+
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react15.default.Fragment, { children: [
|
|
11861
|
+
gi > 0 && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(CustomToolbarDivider, {}),
|
|
11466
11862
|
btns.map((btn) => {
|
|
11467
11863
|
const isActive = activeCommands.has(btn.cmd);
|
|
11468
|
-
return /* @__PURE__ */ (0,
|
|
11864
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
11469
11865
|
CustomToolbarButton,
|
|
11470
11866
|
{
|
|
11471
11867
|
title: btn.title,
|
|
@@ -11474,7 +11870,7 @@ function FloatingToolbar({
|
|
|
11474
11870
|
e.preventDefault();
|
|
11475
11871
|
onCommand(btn.cmd);
|
|
11476
11872
|
},
|
|
11477
|
-
children: /* @__PURE__ */ (0,
|
|
11873
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
11478
11874
|
"svg",
|
|
11479
11875
|
{
|
|
11480
11876
|
width: "16",
|
|
@@ -11495,7 +11891,7 @@ function FloatingToolbar({
|
|
|
11495
11891
|
);
|
|
11496
11892
|
})
|
|
11497
11893
|
] }, gi)),
|
|
11498
|
-
showEditLink ? /* @__PURE__ */ (0,
|
|
11894
|
+
showEditLink ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
11499
11895
|
CustomToolbarButton,
|
|
11500
11896
|
{
|
|
11501
11897
|
type: "button",
|
|
@@ -11509,7 +11905,7 @@ function FloatingToolbar({
|
|
|
11509
11905
|
e.preventDefault();
|
|
11510
11906
|
e.stopPropagation();
|
|
11511
11907
|
},
|
|
11512
|
-
children: /* @__PURE__ */ (0,
|
|
11908
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_lucide_react16.Link, { className: "size-4 shrink-0", "aria-hidden": true })
|
|
11513
11909
|
}
|
|
11514
11910
|
) : null
|
|
11515
11911
|
] })
|
|
@@ -11526,7 +11922,7 @@ function StateToggle({
|
|
|
11526
11922
|
states,
|
|
11527
11923
|
onStateChange
|
|
11528
11924
|
}) {
|
|
11529
|
-
return /* @__PURE__ */ (0,
|
|
11925
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
11530
11926
|
ToggleGroup,
|
|
11531
11927
|
{
|
|
11532
11928
|
"data-ohw-state-toggle": "",
|
|
@@ -11540,7 +11936,7 @@ function StateToggle({
|
|
|
11540
11936
|
left: rect.right - 8,
|
|
11541
11937
|
transform: "translateX(-100%)"
|
|
11542
11938
|
},
|
|
11543
|
-
children: states.map((state) => /* @__PURE__ */ (0,
|
|
11939
|
+
children: states.map((state) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ToggleGroupItem, { value: state, size: "sm", children: state }, state))
|
|
11544
11940
|
}
|
|
11545
11941
|
);
|
|
11546
11942
|
}
|
|
@@ -11567,8 +11963,8 @@ function OhhwellsBridge() {
|
|
|
11567
11963
|
const router = (0, import_navigation3.useRouter)();
|
|
11568
11964
|
const searchParams = (0, import_navigation3.useSearchParams)();
|
|
11569
11965
|
const isEditMode = isEditSessionActive();
|
|
11570
|
-
const [bridgeRoot, setBridgeRoot] = (0,
|
|
11571
|
-
(0,
|
|
11966
|
+
const [bridgeRoot, setBridgeRoot] = (0, import_react15.useState)(null);
|
|
11967
|
+
(0, import_react15.useEffect)(() => {
|
|
11572
11968
|
const figtreeFontId = "ohw-figtree-font";
|
|
11573
11969
|
if (!document.getElementById(figtreeFontId)) {
|
|
11574
11970
|
const preconnect1 = Object.assign(document.createElement("link"), { rel: "preconnect", href: "https://fonts.googleapis.com" });
|
|
@@ -11597,109 +11993,133 @@ function OhhwellsBridge() {
|
|
|
11597
11993
|
const subdomain = resolveSubdomain(subdomainFromQuery);
|
|
11598
11994
|
useLinkHrefGuardian(pathname, subdomain, isEditMode);
|
|
11599
11995
|
useSavedLinkNavigation(isEditMode);
|
|
11600
|
-
const postToParent2 = (0,
|
|
11996
|
+
const postToParent2 = (0, import_react15.useCallback)((data) => {
|
|
11601
11997
|
if (typeof window !== "undefined" && window.parent !== window) {
|
|
11602
11998
|
window.parent.postMessage(data, "*");
|
|
11603
11999
|
}
|
|
11604
12000
|
}, []);
|
|
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,
|
|
12001
|
+
const [fetchState, setFetchState] = (0, import_react15.useState)("idle");
|
|
12002
|
+
const autoSaveTimers = (0, import_react15.useRef)(/* @__PURE__ */ new Map());
|
|
12003
|
+
const activeElRef = (0, import_react15.useRef)(null);
|
|
12004
|
+
const pointerHeldRef = (0, import_react15.useRef)(false);
|
|
12005
|
+
const selectedElRef = (0, import_react15.useRef)(null);
|
|
12006
|
+
const selectedHrefKeyRef = (0, import_react15.useRef)(null);
|
|
12007
|
+
const selectedFooterColAttrRef = (0, import_react15.useRef)(null);
|
|
12008
|
+
const originalContentRef = (0, import_react15.useRef)(null);
|
|
12009
|
+
const activeStateElRef = (0, import_react15.useRef)(null);
|
|
12010
|
+
const parentScrollRef = (0, import_react15.useRef)(null);
|
|
12011
|
+
const visibleViewportRef = (0, import_react15.useRef)(null);
|
|
12012
|
+
const [dialogPortalContainer, setDialogPortalContainer] = (0, import_react15.useState)(null);
|
|
12013
|
+
const attachVisibleViewport = (0, import_react15.useCallback)((node) => {
|
|
11618
12014
|
visibleViewportRef.current = node;
|
|
11619
12015
|
setDialogPortalContainer(node);
|
|
11620
12016
|
if (node) applyVisibleViewport(node, parentScrollRef.current);
|
|
11621
12017
|
}, []);
|
|
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,
|
|
12018
|
+
const toolbarElRef = (0, import_react15.useRef)(null);
|
|
12019
|
+
const glowElRef = (0, import_react15.useRef)(null);
|
|
12020
|
+
const hoveredImageRef = (0, import_react15.useRef)(null);
|
|
12021
|
+
const hoveredImageHasTextOverlapRef = (0, import_react15.useRef)(false);
|
|
12022
|
+
const dragOverElRef = (0, import_react15.useRef)(null);
|
|
12023
|
+
const [mediaHover, setMediaHover] = (0, import_react15.useState)(null);
|
|
12024
|
+
const [carouselHover, setCarouselHover] = (0, import_react15.useState)(null);
|
|
12025
|
+
const [uploadingRects, setUploadingRects] = (0, import_react15.useState)({});
|
|
12026
|
+
const hoveredGapRef = (0, import_react15.useRef)(null);
|
|
12027
|
+
const imageUnhoverTimerRef = (0, import_react15.useRef)(null);
|
|
12028
|
+
const imageShowTimerRef = (0, import_react15.useRef)(null);
|
|
12029
|
+
const editStylesRef = (0, import_react15.useRef)(null);
|
|
12030
|
+
const activateRef = (0, import_react15.useRef)(() => {
|
|
12031
|
+
});
|
|
12032
|
+
const deactivateRef = (0, import_react15.useRef)(() => {
|
|
12033
|
+
});
|
|
12034
|
+
const selectRef = (0, import_react15.useRef)(() => {
|
|
11635
12035
|
});
|
|
11636
|
-
const
|
|
12036
|
+
const selectFrameRef = (0, import_react15.useRef)(() => {
|
|
11637
12037
|
});
|
|
11638
|
-
const
|
|
12038
|
+
const selectLogoRef = (0, import_react15.useRef)(() => {
|
|
11639
12039
|
});
|
|
11640
|
-
const
|
|
12040
|
+
const openLogoSizePanelRef = (0, import_react15.useRef)(() => {
|
|
11641
12041
|
});
|
|
11642
|
-
const deselectRef = (0,
|
|
12042
|
+
const deselectRef = (0, import_react15.useRef)(() => {
|
|
11643
12043
|
});
|
|
11644
|
-
const
|
|
12044
|
+
const closeFloatingPanelOnlyRef = (0, import_react15.useRef)(() => {
|
|
11645
12045
|
});
|
|
11646
|
-
const
|
|
12046
|
+
const reselectNavigationItemRef = (0, import_react15.useRef)(() => {
|
|
11647
12047
|
});
|
|
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)(() => {
|
|
12048
|
+
const commitNavigationTextEditRef = (0, import_react15.useRef)(() => {
|
|
11652
12049
|
});
|
|
11653
|
-
const
|
|
12050
|
+
const handleDeleteSelectedRef = (0, import_react15.useRef)(() => false);
|
|
12051
|
+
const runPendingDeleteUndoRef = (0, import_react15.useRef)(() => false);
|
|
12052
|
+
const isFooterFrameSelectionRef = (0, import_react15.useRef)(false);
|
|
12053
|
+
const refreshActiveCommandsRef = (0, import_react15.useRef)(() => {
|
|
12054
|
+
});
|
|
12055
|
+
const postToParentRef = (0, import_react15.useRef)(postToParent2);
|
|
11654
12056
|
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,
|
|
12057
|
+
const aiSectionApiRef = (0, import_react15.useRef)(null);
|
|
12058
|
+
const sectionsLoadedRef = (0, import_react15.useRef)(false);
|
|
12059
|
+
const pendingScheduleConfigRequests = (0, import_react15.useRef)([]);
|
|
12060
|
+
const [toolbarRect, setToolbarRect] = (0, import_react15.useState)(null);
|
|
12061
|
+
const [toolbarVariant, setToolbarVariant] = (0, import_react15.useState)("none");
|
|
12062
|
+
const toolbarVariantRef = (0, import_react15.useRef)("none");
|
|
11661
12063
|
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,
|
|
12064
|
+
const [selectedIsCta, setSelectedIsCta] = (0, import_react15.useState)(false);
|
|
12065
|
+
const [reorderHrefKey, setReorderHrefKey] = (0, import_react15.useState)(null);
|
|
12066
|
+
const [reorderDragDisabled, setReorderDragDisabled] = (0, import_react15.useState)(false);
|
|
12067
|
+
const [toggleState, setToggleState] = (0, import_react15.useState)(null);
|
|
12068
|
+
const [maxBadge, setMaxBadge] = (0, import_react15.useState)(null);
|
|
12069
|
+
const [activeCommands, setActiveCommands] = (0, import_react15.useState)(/* @__PURE__ */ new Set());
|
|
12070
|
+
const [sectionGap, setSectionGap] = (0, import_react15.useState)(null);
|
|
12071
|
+
const [toolbarShowEditLink, setToolbarShowEditLink] = (0, import_react15.useState)(false);
|
|
12072
|
+
const hoveredNavContainerRef = (0, import_react15.useRef)(null);
|
|
12073
|
+
const [hoveredNavContainerRect, setHoveredNavContainerRect] = (0, import_react15.useState)(null);
|
|
12074
|
+
const hoveredItemElRef = (0, import_react15.useRef)(null);
|
|
12075
|
+
const [hoveredItemRect, setHoveredItemRect] = (0, import_react15.useState)(null);
|
|
12076
|
+
const siblingHintElRef = (0, import_react15.useRef)(null);
|
|
12077
|
+
const [siblingHintRect, setSiblingHintRect] = (0, import_react15.useState)(null);
|
|
12078
|
+
const [siblingHintRects, setSiblingHintRects] = (0, import_react15.useState)([]);
|
|
12079
|
+
const [isItemDragging, setIsItemDragging] = (0, import_react15.useState)(false);
|
|
12080
|
+
const [isFooterFrameSelection, setIsFooterFrameSelection] = (0, import_react15.useState)(false);
|
|
11679
12081
|
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
|
|
12082
|
+
const [navDropdownPreviewOpen, setNavDropdownPreviewOpen] = (0, import_react15.useState)(null);
|
|
12083
|
+
const [footerHeadingVisible, setFooterHeadingVisible] = (0, import_react15.useState)(null);
|
|
12084
|
+
const footerDragRef = (0, import_react15.useRef)(null);
|
|
12085
|
+
const [footerDropSlots, setFooterDropSlots] = (0, import_react15.useState)([]);
|
|
12086
|
+
const [activeFooterDropIndex, setActiveFooterDropIndex] = (0, import_react15.useState)(null);
|
|
12087
|
+
const [draggedItemRect, setDraggedItemRect] = (0, import_react15.useState)(null);
|
|
12088
|
+
const footerPointerDragRef = (0, import_react15.useRef)(null);
|
|
12089
|
+
const suppressNextClickRef = (0, import_react15.useRef)(false);
|
|
12090
|
+
const suppressClickUntilRef = (0, import_react15.useRef)(0);
|
|
12091
|
+
const [linkPopover, setLinkPopover] = (0, import_react15.useState)(null);
|
|
12092
|
+
const linkPopoverSessionRef = (0, import_react15.useRef)(null);
|
|
12093
|
+
const addNavAfterAnchorRef = (0, import_react15.useRef)(null);
|
|
12094
|
+
const editContentRef = (0, import_react15.useRef)({});
|
|
12095
|
+
const pendingDeleteUndoRef = (0, import_react15.useRef)(null);
|
|
12096
|
+
const [floatingPanel, setFloatingPanel] = (0, import_react15.useState)(null);
|
|
12097
|
+
const floatingPanelOpenRef = (0, import_react15.useRef)(false);
|
|
12098
|
+
const setFloatingPanelRef = (0, import_react15.useRef)(setFloatingPanel);
|
|
12099
|
+
const [floatingPanelPos, setFloatingPanelPos] = (0, import_react15.useState)(null);
|
|
12100
|
+
const [logoSizeDraft, setLogoSizeDraft] = (0, import_react15.useState)(null);
|
|
12101
|
+
const [editorViewport, setEditorViewport] = (0, import_react15.useState)("desktop");
|
|
12102
|
+
const [parentScrollSnap, setParentScrollSnap] = (0, import_react15.useState)(null);
|
|
12103
|
+
const [sitePages, setSitePages] = (0, import_react15.useState)([]);
|
|
12104
|
+
const [sectionsByPath, setSectionsByPath] = (0, import_react15.useState)({});
|
|
12105
|
+
const sectionsPrefetchGenRef = (0, import_react15.useRef)(0);
|
|
12106
|
+
const setLinkPopoverRef = (0, import_react15.useRef)(setLinkPopover);
|
|
12107
|
+
const linkPopoverPanelRef = (0, import_react15.useRef)(null);
|
|
12108
|
+
const linkPopoverOpenRef = (0, import_react15.useRef)(false);
|
|
12109
|
+
const linkPopoverGraceUntilRef = (0, import_react15.useRef)(0);
|
|
11701
12110
|
setLinkPopoverRef.current = setLinkPopover;
|
|
12111
|
+
setFloatingPanelRef.current = setFloatingPanel;
|
|
11702
12112
|
linkPopoverSessionRef.current = linkPopover;
|
|
12113
|
+
floatingPanelOpenRef.current = Boolean(floatingPanel);
|
|
12114
|
+
(0, import_react15.useEffect)(() => {
|
|
12115
|
+
const syncViewport = () => {
|
|
12116
|
+
const next = window.innerWidth <= 480 ? "mobile" : "desktop";
|
|
12117
|
+
setEditorViewport((prev) => prev === next ? prev : next);
|
|
12118
|
+
};
|
|
12119
|
+
syncViewport();
|
|
12120
|
+
window.addEventListener("resize", syncViewport);
|
|
12121
|
+
return () => window.removeEventListener("resize", syncViewport);
|
|
12122
|
+
}, []);
|
|
11703
12123
|
const {
|
|
11704
12124
|
navDragRef,
|
|
11705
12125
|
navDropSlots,
|
|
@@ -11735,7 +12155,7 @@ function OhhwellsBridge() {
|
|
|
11735
12155
|
const bumpLinkPopoverGrace = () => {
|
|
11736
12156
|
linkPopoverGraceUntilRef.current = Date.now() + 350;
|
|
11737
12157
|
};
|
|
11738
|
-
const runSectionsPrefetch = (0,
|
|
12158
|
+
const runSectionsPrefetch = (0, import_react15.useCallback)((pages) => {
|
|
11739
12159
|
if (!isEditMode || shouldUseDevFixtures() || pages.length === 0) return;
|
|
11740
12160
|
const gen = ++sectionsPrefetchGenRef.current;
|
|
11741
12161
|
const paths = pages.map((p) => p.path);
|
|
@@ -11754,9 +12174,9 @@ function OhhwellsBridge() {
|
|
|
11754
12174
|
);
|
|
11755
12175
|
});
|
|
11756
12176
|
}, [isEditMode, pathname]);
|
|
11757
|
-
const runSectionsPrefetchRef = (0,
|
|
12177
|
+
const runSectionsPrefetchRef = (0, import_react15.useRef)(runSectionsPrefetch);
|
|
11758
12178
|
runSectionsPrefetchRef.current = runSectionsPrefetch;
|
|
11759
|
-
(0,
|
|
12179
|
+
(0, import_react15.useEffect)(() => {
|
|
11760
12180
|
if (!linkPopover) {
|
|
11761
12181
|
document.documentElement.removeAttribute("data-ohw-link-popover-open");
|
|
11762
12182
|
return;
|
|
@@ -11784,7 +12204,7 @@ function OhhwellsBridge() {
|
|
|
11784
12204
|
document.documentElement.removeAttribute("data-ohw-link-popover-open");
|
|
11785
12205
|
};
|
|
11786
12206
|
}, [linkPopover, postToParent2]);
|
|
11787
|
-
(0,
|
|
12207
|
+
(0, import_react15.useEffect)(() => {
|
|
11788
12208
|
if (!isEditMode) return;
|
|
11789
12209
|
const useFixtures = shouldUseDevFixtures();
|
|
11790
12210
|
if (useFixtures) {
|
|
@@ -11808,14 +12228,14 @@ function OhhwellsBridge() {
|
|
|
11808
12228
|
if (!useFixtures) postToParent2({ type: "ow:request-site-pages" });
|
|
11809
12229
|
return () => window.removeEventListener("message", onSitePages);
|
|
11810
12230
|
}, [isEditMode, postToParent2]);
|
|
11811
|
-
(0,
|
|
12231
|
+
(0, import_react15.useEffect)(() => {
|
|
11812
12232
|
if (!isEditMode || shouldUseDevFixtures()) return;
|
|
11813
12233
|
void loadAllSectionsManifest().then((manifest) => {
|
|
11814
12234
|
if (Object.keys(manifest).length === 0) return;
|
|
11815
12235
|
setSectionsByPath((prev) => ({ ...manifest, ...prev }));
|
|
11816
12236
|
});
|
|
11817
12237
|
}, [isEditMode]);
|
|
11818
|
-
(0,
|
|
12238
|
+
(0, import_react15.useEffect)(() => {
|
|
11819
12239
|
const update = () => {
|
|
11820
12240
|
const el = activeElRef.current ?? selectedElRef.current;
|
|
11821
12241
|
if (el) setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
@@ -11839,10 +12259,10 @@ function OhhwellsBridge() {
|
|
|
11839
12259
|
vvp.removeEventListener("resize", update);
|
|
11840
12260
|
};
|
|
11841
12261
|
}, []);
|
|
11842
|
-
const refreshStateRules = (0,
|
|
12262
|
+
const refreshStateRules = (0, import_react15.useCallback)(() => {
|
|
11843
12263
|
editStylesRef.current?.forceHover && (editStylesRef.current.forceHover.textContent = collectStateRules());
|
|
11844
12264
|
}, []);
|
|
11845
|
-
const processConfigRequest = (0,
|
|
12265
|
+
const processConfigRequest = (0, import_react15.useCallback)((insertAfterVal) => {
|
|
11846
12266
|
const tracker = getSectionsTracker();
|
|
11847
12267
|
let entries = [];
|
|
11848
12268
|
try {
|
|
@@ -11865,7 +12285,7 @@ function OhhwellsBridge() {
|
|
|
11865
12285
|
}
|
|
11866
12286
|
window.postMessage({ type: "ow:schedule-config", insertAfter: insertAfterVal, scheduleId: null }, "*");
|
|
11867
12287
|
}, [isEditMode]);
|
|
11868
|
-
const deactivate = (0,
|
|
12288
|
+
const deactivate = (0, import_react15.useCallback)(() => {
|
|
11869
12289
|
const el = activeElRef.current;
|
|
11870
12290
|
if (!el) return;
|
|
11871
12291
|
const key = el.dataset.ohwKey;
|
|
@@ -11898,12 +12318,12 @@ function OhhwellsBridge() {
|
|
|
11898
12318
|
setToolbarShowEditLink(false);
|
|
11899
12319
|
postToParent2({ type: "ow:exit-edit" });
|
|
11900
12320
|
}, [postToParent2]);
|
|
11901
|
-
const clearSelectedAttr = (0,
|
|
12321
|
+
const clearSelectedAttr = (0, import_react15.useCallback)(() => {
|
|
11902
12322
|
document.querySelectorAll("[data-ohw-selected]").forEach((el) => {
|
|
11903
12323
|
el.removeAttribute("data-ohw-selected");
|
|
11904
12324
|
});
|
|
11905
12325
|
}, []);
|
|
11906
|
-
const deselect = (0,
|
|
12326
|
+
const deselect = (0, import_react15.useCallback)(() => {
|
|
11907
12327
|
clearSelectedAttr();
|
|
11908
12328
|
selectedElRef.current = null;
|
|
11909
12329
|
selectedHrefKeyRef.current = null;
|
|
@@ -11922,17 +12342,19 @@ function OhhwellsBridge() {
|
|
|
11922
12342
|
setHoveredNavContainerRect(null);
|
|
11923
12343
|
hoveredItemElRef.current = null;
|
|
11924
12344
|
setHoveredItemRect(null);
|
|
12345
|
+
setFloatingPanel(null);
|
|
12346
|
+
setLogoSizeDraft(null);
|
|
11925
12347
|
if (!activeElRef.current) {
|
|
11926
12348
|
setNavGroupForceOpen(null, false);
|
|
11927
12349
|
setToolbarRect(null);
|
|
11928
12350
|
setToolbarVariant("none");
|
|
11929
12351
|
}
|
|
11930
12352
|
}, [clearSelectedAttr]);
|
|
11931
|
-
const markSelected = (0,
|
|
12353
|
+
const markSelected = (0, import_react15.useCallback)((el) => {
|
|
11932
12354
|
clearSelectedAttr();
|
|
11933
12355
|
el.setAttribute("data-ohw-selected", "");
|
|
11934
12356
|
}, [clearSelectedAttr]);
|
|
11935
|
-
const resolveHrefKeyElement = (0,
|
|
12357
|
+
const resolveHrefKeyElement = (0, import_react15.useCallback)((hrefKey) => {
|
|
11936
12358
|
if (isFooterHrefKey(hrefKey)) {
|
|
11937
12359
|
return document.querySelector(
|
|
11938
12360
|
`footer [data-ohw-href-key="${CSS.escape(hrefKey)}"]`
|
|
@@ -11947,7 +12369,7 @@ function OhhwellsBridge() {
|
|
|
11947
12369
|
`[data-ohw-href-key="${CSS.escape(hrefKey)}"]`
|
|
11948
12370
|
);
|
|
11949
12371
|
}, []);
|
|
11950
|
-
const resyncSelectedNavigationItem = (0,
|
|
12372
|
+
const resyncSelectedNavigationItem = (0, import_react15.useCallback)(() => {
|
|
11951
12373
|
const hrefKey = selectedHrefKeyRef.current;
|
|
11952
12374
|
if (hrefKey) {
|
|
11953
12375
|
const link = resolveHrefKeyElement(hrefKey);
|
|
@@ -11985,7 +12407,7 @@ function OhhwellsBridge() {
|
|
|
11985
12407
|
);
|
|
11986
12408
|
}
|
|
11987
12409
|
}, [resolveHrefKeyElement]);
|
|
11988
|
-
const reselectNavigationItem = (0,
|
|
12410
|
+
const reselectNavigationItem = (0, import_react15.useCallback)((navAnchor) => {
|
|
11989
12411
|
selectedElRef.current = navAnchor;
|
|
11990
12412
|
selectedHrefKeyRef.current = navAnchor.getAttribute("data-ohw-href-key");
|
|
11991
12413
|
selectedFooterColAttrRef.current = null;
|
|
@@ -12014,7 +12436,7 @@ function OhhwellsBridge() {
|
|
|
12014
12436
|
setToolbarShowEditLink(false);
|
|
12015
12437
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
12016
12438
|
}, [markSelected]);
|
|
12017
|
-
const commitNavigationTextEdit = (0,
|
|
12439
|
+
const commitNavigationTextEdit = (0, import_react15.useCallback)((navAnchor) => {
|
|
12018
12440
|
const el = activeElRef.current;
|
|
12019
12441
|
if (!el) return;
|
|
12020
12442
|
const key = el.dataset.ohwKey;
|
|
@@ -12041,7 +12463,7 @@ function OhhwellsBridge() {
|
|
|
12041
12463
|
postToParent2({ type: "ow:exit-edit" });
|
|
12042
12464
|
reselectNavigationItem(navAnchor);
|
|
12043
12465
|
}, [postToParent2, reselectNavigationItem]);
|
|
12044
|
-
const handleAddTopLevelNavItem = (0,
|
|
12466
|
+
const handleAddTopLevelNavItem = (0, import_react15.useCallback)(() => {
|
|
12045
12467
|
const items = listNavbarRootItems();
|
|
12046
12468
|
addNavAfterAnchorRef.current = items[items.length - 1] ?? null;
|
|
12047
12469
|
deselectRef.current();
|
|
@@ -12053,7 +12475,7 @@ function OhhwellsBridge() {
|
|
|
12053
12475
|
intent: "add-nav"
|
|
12054
12476
|
});
|
|
12055
12477
|
}, []);
|
|
12056
|
-
const maybeWarnNavLinkDropdownConflict = (0,
|
|
12478
|
+
const maybeWarnNavLinkDropdownConflict = (0, import_react15.useCallback)(
|
|
12057
12479
|
(anchor) => {
|
|
12058
12480
|
if (!isNavbarHrefKey(anchor.getAttribute("data-ohw-href-key"))) return;
|
|
12059
12481
|
if (!navDropdownsOpenOnClick()) return;
|
|
@@ -12066,7 +12488,7 @@ function OhhwellsBridge() {
|
|
|
12066
12488
|
},
|
|
12067
12489
|
[postToParent2]
|
|
12068
12490
|
);
|
|
12069
|
-
const handleNavDropdownOpenChange = (0,
|
|
12491
|
+
const handleNavDropdownOpenChange = (0, import_react15.useCallback)((open) => {
|
|
12070
12492
|
const selected = selectedElRef.current;
|
|
12071
12493
|
if (!selected || !isNavigationItem2(selected)) return;
|
|
12072
12494
|
setNavGroupForceOpen(selected, open);
|
|
@@ -12078,7 +12500,7 @@ function OhhwellsBridge() {
|
|
|
12078
12500
|
}
|
|
12079
12501
|
});
|
|
12080
12502
|
}, []);
|
|
12081
|
-
const handleFooterHeadingVisibleChange = (0,
|
|
12503
|
+
const handleFooterHeadingVisibleChange = (0, import_react15.useCallback)(
|
|
12082
12504
|
(visible) => {
|
|
12083
12505
|
const selected = selectedElRef.current;
|
|
12084
12506
|
if (!selected || !isFooterFrameSelectionRef.current) return;
|
|
@@ -12102,7 +12524,7 @@ function OhhwellsBridge() {
|
|
|
12102
12524
|
},
|
|
12103
12525
|
[postToParent2]
|
|
12104
12526
|
);
|
|
12105
|
-
const enterEditOnNewItem = (0,
|
|
12527
|
+
const enterEditOnNewItem = (0, import_react15.useCallback)((anchor) => {
|
|
12106
12528
|
const label = anchor.querySelector('[data-ohw-editable="text"]');
|
|
12107
12529
|
if (!label) {
|
|
12108
12530
|
selectRef.current(anchor);
|
|
@@ -12111,7 +12533,7 @@ function OhhwellsBridge() {
|
|
|
12111
12533
|
setNavGroupForceOpen(anchor, true);
|
|
12112
12534
|
activateRef.current(label);
|
|
12113
12535
|
}, []);
|
|
12114
|
-
const handleAddChildItem = (0,
|
|
12536
|
+
const handleAddChildItem = (0, import_react15.useCallback)(() => {
|
|
12115
12537
|
const selected = selectedElRef.current;
|
|
12116
12538
|
if (!selected) return;
|
|
12117
12539
|
if (toolbarVariantRef.current === "select-frame" && isFooterFrameSelection) {
|
|
@@ -12187,7 +12609,7 @@ function OhhwellsBridge() {
|
|
|
12187
12609
|
enterEditOnNewItem(result.anchor);
|
|
12188
12610
|
});
|
|
12189
12611
|
}, [enterEditOnNewItem, isFooterFrameSelection, maybeWarnNavLinkDropdownConflict, postToParent2]);
|
|
12190
|
-
const handleAddFooterColumn = (0,
|
|
12612
|
+
const handleAddFooterColumn = (0, import_react15.useCallback)(() => {
|
|
12191
12613
|
if (!canAddFooterColumn()) {
|
|
12192
12614
|
postToParent2({
|
|
12193
12615
|
type: "ow:toast",
|
|
@@ -12208,7 +12630,7 @@ function OhhwellsBridge() {
|
|
|
12208
12630
|
selectRef.current(result.firstLink);
|
|
12209
12631
|
});
|
|
12210
12632
|
}, [postToParent2]);
|
|
12211
|
-
const clearFooterDragVisuals = (0,
|
|
12633
|
+
const clearFooterDragVisuals = (0, import_react15.useCallback)(() => {
|
|
12212
12634
|
footerDragRef.current = null;
|
|
12213
12635
|
setSiblingHintRects([]);
|
|
12214
12636
|
setFooterDropSlots([]);
|
|
@@ -12217,7 +12639,7 @@ function OhhwellsBridge() {
|
|
|
12217
12639
|
setIsItemDragging(false);
|
|
12218
12640
|
unlockFooterDragInteraction();
|
|
12219
12641
|
}, []);
|
|
12220
|
-
const refreshFooterDragVisuals = (0,
|
|
12642
|
+
const refreshFooterDragVisuals = (0, import_react15.useCallback)((session, activeSlot, clientX, clientY) => {
|
|
12221
12643
|
const dragged = session.draggedEl;
|
|
12222
12644
|
setDraggedItemRect(dragged.getBoundingClientRect());
|
|
12223
12645
|
if (typeof clientX === "number" && typeof clientY === "number") {
|
|
@@ -12242,13 +12664,13 @@ function OhhwellsBridge() {
|
|
|
12242
12664
|
const activeIdx = activeSlot ? slots.findIndex((s) => s.insertIndex === activeSlot.insertIndex) : -1;
|
|
12243
12665
|
setActiveFooterDropIndex(activeIdx >= 0 ? activeIdx : null);
|
|
12244
12666
|
}, []);
|
|
12245
|
-
const refreshFooterDragVisualsRef = (0,
|
|
12667
|
+
const refreshFooterDragVisualsRef = (0, import_react15.useRef)(refreshFooterDragVisuals);
|
|
12246
12668
|
refreshFooterDragVisualsRef.current = refreshFooterDragVisuals;
|
|
12247
|
-
const commitFooterDragRef = (0,
|
|
12669
|
+
const commitFooterDragRef = (0, import_react15.useRef)(() => {
|
|
12248
12670
|
});
|
|
12249
|
-
const beginFooterDragRef = (0,
|
|
12671
|
+
const beginFooterDragRef = (0, import_react15.useRef)(() => {
|
|
12250
12672
|
});
|
|
12251
|
-
const beginFooterDrag = (0,
|
|
12673
|
+
const beginFooterDrag = (0, import_react15.useCallback)(
|
|
12252
12674
|
(session) => {
|
|
12253
12675
|
const rect = session.draggedEl.getBoundingClientRect();
|
|
12254
12676
|
session.lastClientX = session.lastClientX || rect.left + rect.width / 2;
|
|
@@ -12268,7 +12690,7 @@ function OhhwellsBridge() {
|
|
|
12268
12690
|
[refreshFooterDragVisuals]
|
|
12269
12691
|
);
|
|
12270
12692
|
beginFooterDragRef.current = beginFooterDrag;
|
|
12271
|
-
const commitFooterDrag = (0,
|
|
12693
|
+
const commitFooterDrag = (0, import_react15.useCallback)(
|
|
12272
12694
|
(clientX, clientY) => {
|
|
12273
12695
|
const session = footerDragRef.current;
|
|
12274
12696
|
if (!session) {
|
|
@@ -12372,7 +12794,7 @@ function OhhwellsBridge() {
|
|
|
12372
12794
|
[clearFooterDragVisuals, resolveHrefKeyElement, resyncSelectedNavigationItem]
|
|
12373
12795
|
);
|
|
12374
12796
|
commitFooterDragRef.current = commitFooterDrag;
|
|
12375
|
-
const startFooterLinkDrag = (0,
|
|
12797
|
+
const startFooterLinkDrag = (0, import_react15.useCallback)(
|
|
12376
12798
|
(anchor, clientX, clientY, wasSelected) => {
|
|
12377
12799
|
const hrefKey = anchor.getAttribute("data-ohw-href-key");
|
|
12378
12800
|
if (!hrefKey || !isFooterHrefKey(hrefKey)) return false;
|
|
@@ -12393,7 +12815,7 @@ function OhhwellsBridge() {
|
|
|
12393
12815
|
},
|
|
12394
12816
|
[beginFooterDrag]
|
|
12395
12817
|
);
|
|
12396
|
-
const startFooterColumnDrag = (0,
|
|
12818
|
+
const startFooterColumnDrag = (0, import_react15.useCallback)(
|
|
12397
12819
|
(columnEl, clientX, clientY, wasSelected) => {
|
|
12398
12820
|
const columns = listFooterColumns();
|
|
12399
12821
|
const idx = columns.indexOf(columnEl);
|
|
@@ -12413,7 +12835,7 @@ function OhhwellsBridge() {
|
|
|
12413
12835
|
},
|
|
12414
12836
|
[beginFooterDrag]
|
|
12415
12837
|
);
|
|
12416
|
-
const handleItemDragStart = (0,
|
|
12838
|
+
const handleItemDragStart = (0, import_react15.useCallback)(
|
|
12417
12839
|
(e) => {
|
|
12418
12840
|
const selected = selectedElRef.current;
|
|
12419
12841
|
if (!selected) {
|
|
@@ -12433,7 +12855,7 @@ function OhhwellsBridge() {
|
|
|
12433
12855
|
},
|
|
12434
12856
|
[startFooterColumnDrag, startFooterLinkDrag, startNavLinkDrag]
|
|
12435
12857
|
);
|
|
12436
|
-
const handleItemDragEnd = (0,
|
|
12858
|
+
const handleItemDragEnd = (0, import_react15.useCallback)(
|
|
12437
12859
|
(e) => {
|
|
12438
12860
|
if (footerDragRef.current) {
|
|
12439
12861
|
const x = e?.clientX;
|
|
@@ -12459,7 +12881,7 @@ function OhhwellsBridge() {
|
|
|
12459
12881
|
},
|
|
12460
12882
|
[commitFooterDrag, commitNavDrag, navDragRef]
|
|
12461
12883
|
);
|
|
12462
|
-
const handleItemChromePointerDown = (0,
|
|
12884
|
+
const handleItemChromePointerDown = (0, import_react15.useCallback)((e) => {
|
|
12463
12885
|
if (e.button !== 0) return;
|
|
12464
12886
|
const selected = selectedElRef.current;
|
|
12465
12887
|
if (!selected) return;
|
|
@@ -12490,7 +12912,7 @@ function OhhwellsBridge() {
|
|
|
12490
12912
|
}
|
|
12491
12913
|
if (armNavPressFromChrome(selected, e.clientX, e.clientY, e.pointerId)) return;
|
|
12492
12914
|
}, [armNavPressFromChrome]);
|
|
12493
|
-
const handleItemChromeClick = (0,
|
|
12915
|
+
const handleItemChromeClick = (0, import_react15.useCallback)((clientX, clientY) => {
|
|
12494
12916
|
if (suppressNextClickRef.current || Date.now() < suppressClickUntilRef.current) {
|
|
12495
12917
|
suppressNextClickRef.current = false;
|
|
12496
12918
|
return;
|
|
@@ -12503,7 +12925,7 @@ function OhhwellsBridge() {
|
|
|
12503
12925
|
}, []);
|
|
12504
12926
|
reselectNavigationItemRef.current = reselectNavigationItem;
|
|
12505
12927
|
commitNavigationTextEditRef.current = commitNavigationTextEdit;
|
|
12506
|
-
const select = (0,
|
|
12928
|
+
const select = (0, import_react15.useCallback)((anchor) => {
|
|
12507
12929
|
if (!isNavigationItem2(anchor)) return;
|
|
12508
12930
|
if (activeElRef.current) deactivate();
|
|
12509
12931
|
aiSectionApiRef.current?.selectFromElement(anchor);
|
|
@@ -12541,8 +12963,10 @@ function OhhwellsBridge() {
|
|
|
12541
12963
|
setToolbarRect(anchor.getBoundingClientRect());
|
|
12542
12964
|
setToolbarShowEditLink(false);
|
|
12543
12965
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
12966
|
+
setFloatingPanel(null);
|
|
12967
|
+
setLogoSizeDraft(null);
|
|
12544
12968
|
}, [deactivate, markSelected]);
|
|
12545
|
-
const selectFrame = (0,
|
|
12969
|
+
const selectFrame = (0, import_react15.useCallback)((el) => {
|
|
12546
12970
|
if (!isNavigationContainer(el)) return;
|
|
12547
12971
|
if (activeElRef.current) deactivate();
|
|
12548
12972
|
aiSectionApiRef.current?.selectFromElement(el);
|
|
@@ -12588,8 +13012,86 @@ function OhhwellsBridge() {
|
|
|
12588
13012
|
setToolbarRect(el.getBoundingClientRect());
|
|
12589
13013
|
setToolbarShowEditLink(false);
|
|
12590
13014
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
13015
|
+
setFloatingPanel(null);
|
|
13016
|
+
setLogoSizeDraft(null);
|
|
12591
13017
|
}, [deactivate, markSelected, postToParent2]);
|
|
12592
|
-
const
|
|
13018
|
+
const selectLogo = (0, import_react15.useCallback)(
|
|
13019
|
+
(logoEl) => {
|
|
13020
|
+
if (activeElRef.current) deactivate();
|
|
13021
|
+
selectedElRef.current = logoEl;
|
|
13022
|
+
selectedHrefKeyRef.current = null;
|
|
13023
|
+
selectedFooterColAttrRef.current = null;
|
|
13024
|
+
markSelected(logoEl);
|
|
13025
|
+
setSelectedIsCta(false);
|
|
13026
|
+
clearHrefKeyHover(logoEl);
|
|
13027
|
+
hoveredNavContainerRef.current = null;
|
|
13028
|
+
setHoveredNavContainerRect(null);
|
|
13029
|
+
setHoveredItemRect(null);
|
|
13030
|
+
hoveredItemElRef.current = null;
|
|
13031
|
+
siblingHintElRef.current = null;
|
|
13032
|
+
setSiblingHintRect(null);
|
|
13033
|
+
setSiblingHintRects([]);
|
|
13034
|
+
setIsItemDragging(false);
|
|
13035
|
+
setReorderHrefKey(null);
|
|
13036
|
+
setReorderDragDisabled(false);
|
|
13037
|
+
setIsFooterFrameSelection(false);
|
|
13038
|
+
setToolbarVariant("logo");
|
|
13039
|
+
setToolbarRect(logoEl.getBoundingClientRect());
|
|
13040
|
+
setToolbarShowEditLink(false);
|
|
13041
|
+
setActiveCommands(/* @__PURE__ */ new Set());
|
|
13042
|
+
},
|
|
13043
|
+
[deactivate, markSelected]
|
|
13044
|
+
);
|
|
13045
|
+
const openLogoSizePanel = (0, import_react15.useCallback)((logoEl) => {
|
|
13046
|
+
const placement = getLogoPlacement(logoEl);
|
|
13047
|
+
const draft = readLogoSizeState(editContentRef.current, placement);
|
|
13048
|
+
setLogoSizeDraft(draft);
|
|
13049
|
+
setParentScrollSnap(parentScrollRef.current);
|
|
13050
|
+
setFloatingPanel({
|
|
13051
|
+
key: `logo-size:${placement}`,
|
|
13052
|
+
title: "Logo",
|
|
13053
|
+
context: placement === "navbar" ? "Navbar" : "Footer",
|
|
13054
|
+
kind: "logo-size",
|
|
13055
|
+
placement
|
|
13056
|
+
});
|
|
13057
|
+
}, []);
|
|
13058
|
+
const closeFloatingPanelOnly = (0, import_react15.useCallback)(() => {
|
|
13059
|
+
setFloatingPanel(null);
|
|
13060
|
+
setLogoSizeDraft(null);
|
|
13061
|
+
}, []);
|
|
13062
|
+
const closeFloatingPanelAndDeselect = (0, import_react15.useCallback)(() => {
|
|
13063
|
+
setFloatingPanel(null);
|
|
13064
|
+
setLogoSizeDraft(null);
|
|
13065
|
+
deselectRef.current();
|
|
13066
|
+
}, []);
|
|
13067
|
+
const persistLogoSizeDraft = (0, import_react15.useCallback)(
|
|
13068
|
+
(placement, draft) => {
|
|
13069
|
+
const desktopKey = LOGO_SIZE_DESKTOP_KEYS[placement];
|
|
13070
|
+
const mobileKey = LOGO_SIZE_MOBILE_KEYS[placement];
|
|
13071
|
+
const nodes = [
|
|
13072
|
+
{ key: desktopKey, text: String(draft.desktopPx) }
|
|
13073
|
+
];
|
|
13074
|
+
if (draft.mobileFollowing) {
|
|
13075
|
+
nodes.push({ key: mobileKey, text: "" });
|
|
13076
|
+
} else {
|
|
13077
|
+
nodes.push({ key: mobileKey, text: String(draft.mobilePx) });
|
|
13078
|
+
}
|
|
13079
|
+
editContentRef.current = {
|
|
13080
|
+
...editContentRef.current,
|
|
13081
|
+
[desktopKey]: String(draft.desktopPx),
|
|
13082
|
+
[mobileKey]: draft.mobileFollowing ? "" : String(draft.mobilePx)
|
|
13083
|
+
};
|
|
13084
|
+
applyLogoSizeToPlacement(
|
|
13085
|
+
placement,
|
|
13086
|
+
draft.desktopPx,
|
|
13087
|
+
draft.mobileFollowing ? draft.desktopPx : draft.mobilePx,
|
|
13088
|
+
draft.mobileFollowing
|
|
13089
|
+
);
|
|
13090
|
+
postToParent2({ type: "ow:change", nodes });
|
|
13091
|
+
},
|
|
13092
|
+
[postToParent2]
|
|
13093
|
+
);
|
|
13094
|
+
const activate = (0, import_react15.useCallback)((el, options) => {
|
|
12593
13095
|
if (activeElRef.current === el) return;
|
|
12594
13096
|
clearSelectedAttr();
|
|
12595
13097
|
selectedElRef.current = null;
|
|
@@ -12665,9 +13167,12 @@ function OhhwellsBridge() {
|
|
|
12665
13167
|
deactivateRef.current = deactivate;
|
|
12666
13168
|
selectRef.current = select;
|
|
12667
13169
|
selectFrameRef.current = selectFrame;
|
|
13170
|
+
selectLogoRef.current = selectLogo;
|
|
13171
|
+
openLogoSizePanelRef.current = openLogoSizePanel;
|
|
12668
13172
|
deselectRef.current = deselect;
|
|
12669
|
-
|
|
12670
|
-
(0,
|
|
13173
|
+
closeFloatingPanelOnlyRef.current = closeFloatingPanelOnly;
|
|
13174
|
+
const lastSiteWideScopeRef = (0, import_react15.useRef)(null);
|
|
13175
|
+
(0, import_react15.useEffect)(() => {
|
|
12671
13176
|
if (!isEditMode) {
|
|
12672
13177
|
if (lastSiteWideScopeRef.current !== false) {
|
|
12673
13178
|
lastSiteWideScopeRef.current = false;
|
|
@@ -12693,7 +13198,7 @@ function OhhwellsBridge() {
|
|
|
12693
13198
|
isFooterFrameSelection,
|
|
12694
13199
|
postToParent2
|
|
12695
13200
|
]);
|
|
12696
|
-
(0,
|
|
13201
|
+
(0, import_react15.useLayoutEffect)(() => {
|
|
12697
13202
|
if (!subdomain || isEditMode) {
|
|
12698
13203
|
setFetchState("done");
|
|
12699
13204
|
return;
|
|
@@ -12737,6 +13242,7 @@ function OhhwellsBridge() {
|
|
|
12737
13242
|
applyLinkByKey(key, val);
|
|
12738
13243
|
}
|
|
12739
13244
|
applyLogoFromContent(content);
|
|
13245
|
+
applyLogoSizes(content);
|
|
12740
13246
|
reconcileNavbarItemsFromContent(content);
|
|
12741
13247
|
reconcileFooterOrderFromContent(content);
|
|
12742
13248
|
enforceLinkHrefs();
|
|
@@ -12767,7 +13273,7 @@ function OhhwellsBridge() {
|
|
|
12767
13273
|
cancelled = true;
|
|
12768
13274
|
};
|
|
12769
13275
|
}, [subdomain, isEditMode]);
|
|
12770
|
-
(0,
|
|
13276
|
+
(0, import_react15.useEffect)(() => {
|
|
12771
13277
|
if (!subdomain || isEditMode) return;
|
|
12772
13278
|
let debounceTimer = null;
|
|
12773
13279
|
let observer = null;
|
|
@@ -12821,16 +13327,16 @@ function OhhwellsBridge() {
|
|
|
12821
13327
|
if (debounceTimer) clearTimeout(debounceTimer);
|
|
12822
13328
|
};
|
|
12823
13329
|
}, [subdomain, isEditMode, pathname]);
|
|
12824
|
-
(0,
|
|
13330
|
+
(0, import_react15.useLayoutEffect)(() => {
|
|
12825
13331
|
const el = document.getElementById("ohw-loader");
|
|
12826
13332
|
if (!el) return;
|
|
12827
13333
|
const visible = Boolean(subdomain) && fetchState !== "done";
|
|
12828
13334
|
el.style.display = visible ? "flex" : "none";
|
|
12829
13335
|
}, [subdomain, fetchState]);
|
|
12830
|
-
(0,
|
|
13336
|
+
(0, import_react15.useEffect)(() => {
|
|
12831
13337
|
postToParent2({ type: "ow:navigation", path: pathname });
|
|
12832
13338
|
}, [pathname, postToParent2]);
|
|
12833
|
-
(0,
|
|
13339
|
+
(0, import_react15.useEffect)(() => {
|
|
12834
13340
|
if (!isEditMode) return;
|
|
12835
13341
|
if (linkPopoverSessionRef.current?.intent === "add-nav") return;
|
|
12836
13342
|
if (document.querySelector("[data-ohw-section-picker]")) return;
|
|
@@ -12838,7 +13344,7 @@ function OhhwellsBridge() {
|
|
|
12838
13344
|
deselectRef.current();
|
|
12839
13345
|
deactivateRef.current();
|
|
12840
13346
|
}, [pathname, isEditMode]);
|
|
12841
|
-
(0,
|
|
13347
|
+
(0, import_react15.useEffect)(() => {
|
|
12842
13348
|
const contentForNav = () => {
|
|
12843
13349
|
if (isEditMode) return editContentRef.current;
|
|
12844
13350
|
if (!subdomain) return {};
|
|
@@ -12903,7 +13409,7 @@ function OhhwellsBridge() {
|
|
|
12903
13409
|
observer?.disconnect();
|
|
12904
13410
|
};
|
|
12905
13411
|
}, [isEditMode, pathname, subdomain, fetchState, resyncSelectedNavigationItem]);
|
|
12906
|
-
(0,
|
|
13412
|
+
(0, import_react15.useEffect)(() => {
|
|
12907
13413
|
if (!isEditMode) return;
|
|
12908
13414
|
const measure = () => {
|
|
12909
13415
|
const h = document.body.scrollHeight;
|
|
@@ -12927,7 +13433,7 @@ function OhhwellsBridge() {
|
|
|
12927
13433
|
window.removeEventListener("resize", handleResize);
|
|
12928
13434
|
};
|
|
12929
13435
|
}, [pathname, isEditMode, postToParent2]);
|
|
12930
|
-
(0,
|
|
13436
|
+
(0, import_react15.useEffect)(() => {
|
|
12931
13437
|
if (!subdomainFromQuery || isEditMode) return;
|
|
12932
13438
|
const handleClick = (e) => {
|
|
12933
13439
|
const anchor = e.target.closest("a");
|
|
@@ -12943,7 +13449,7 @@ function OhhwellsBridge() {
|
|
|
12943
13449
|
document.addEventListener("click", handleClick, true);
|
|
12944
13450
|
return () => document.removeEventListener("click", handleClick, true);
|
|
12945
13451
|
}, [subdomainFromQuery, isEditMode, router]);
|
|
12946
|
-
(0,
|
|
13452
|
+
(0, import_react15.useEffect)(() => {
|
|
12947
13453
|
if (!isEditMode) {
|
|
12948
13454
|
editStylesRef.current?.base.remove();
|
|
12949
13455
|
editStylesRef.current?.forceHover.remove();
|
|
@@ -13072,6 +13578,7 @@ function OhhwellsBridge() {
|
|
|
13072
13578
|
if (target.closest("[data-ohw-state-toggle]")) return;
|
|
13073
13579
|
if (target.closest("[data-ohw-max-badge]")) return;
|
|
13074
13580
|
if (isInsideLinkEditor(target)) return;
|
|
13581
|
+
if (isInsideFloatingPanel(target)) return;
|
|
13075
13582
|
if (target.closest('[data-ohw-edit-chrome], [data-ohw-item-interaction], [data-ohw-drag-handle-container], [data-slot="drag-handle"]')) {
|
|
13076
13583
|
const beneath = document.elementsFromPoint(e.clientX, e.clientY).find(
|
|
13077
13584
|
(el) => el instanceof HTMLElement && !el.closest("[data-ohw-bridge-root]") && el.closest("[data-ohw-section]") != null
|
|
@@ -13139,10 +13646,15 @@ function OhhwellsBridge() {
|
|
|
13139
13646
|
if (logoEl) {
|
|
13140
13647
|
e.preventDefault();
|
|
13141
13648
|
e.stopPropagation();
|
|
13142
|
-
|
|
13143
|
-
|
|
13144
|
-
|
|
13145
|
-
|
|
13649
|
+
if (!logoHasUploadedImage(logoEl)) {
|
|
13650
|
+
deselectRef.current();
|
|
13651
|
+
deactivateRef.current();
|
|
13652
|
+
const identity = readLogoIdentityFromDom();
|
|
13653
|
+
postToParentRef.current({ type: "ow:open-logo-settings", ...identity });
|
|
13654
|
+
return;
|
|
13655
|
+
}
|
|
13656
|
+
selectLogoRef.current(logoEl);
|
|
13657
|
+
openLogoSizePanelRef.current(logoEl);
|
|
13146
13658
|
return;
|
|
13147
13659
|
}
|
|
13148
13660
|
const editable = target.closest("[data-ohw-editable]");
|
|
@@ -13277,6 +13789,7 @@ function OhhwellsBridge() {
|
|
|
13277
13789
|
if (target.closest("[data-ohw-state-toggle]")) return;
|
|
13278
13790
|
if (target.closest("[data-ohw-max-badge]")) return;
|
|
13279
13791
|
if (isInsideLinkEditor(target)) return;
|
|
13792
|
+
if (isInsideFloatingPanel(target)) return;
|
|
13280
13793
|
if (target.closest('[data-ohw-edit-chrome], [data-ohw-item-interaction], [data-ohw-drag-handle-container], [data-slot="drag-handle"]')) {
|
|
13281
13794
|
return;
|
|
13282
13795
|
}
|
|
@@ -14221,6 +14734,7 @@ function OhhwellsBridge() {
|
|
|
14221
14734
|
applyLinkByKey(key, val);
|
|
14222
14735
|
}
|
|
14223
14736
|
applyLogoFromContent(content);
|
|
14737
|
+
applyLogoSizes(content);
|
|
14224
14738
|
if (sectionsJson) {
|
|
14225
14739
|
initSectionsFromContent({ __ohw_sections: sectionsJson }, true);
|
|
14226
14740
|
sectionsLoadedRef.current = true;
|
|
@@ -14282,6 +14796,7 @@ function OhhwellsBridge() {
|
|
|
14282
14796
|
...editContentRef.current,
|
|
14283
14797
|
...Object.fromEntries(nodes.map(({ key, text }) => [key, text]))
|
|
14284
14798
|
};
|
|
14799
|
+
applyLogoSizes(editContentRef.current);
|
|
14285
14800
|
postToParentRef.current({ type: "ow:change", nodes });
|
|
14286
14801
|
};
|
|
14287
14802
|
window.addEventListener("message", handleHydrate);
|
|
@@ -14293,6 +14808,12 @@ function OhhwellsBridge() {
|
|
|
14293
14808
|
closeLinkPopoverRef.current();
|
|
14294
14809
|
return;
|
|
14295
14810
|
}
|
|
14811
|
+
if (floatingPanelOpenRef.current) {
|
|
14812
|
+
setFloatingPanelRef.current(null);
|
|
14813
|
+
deselectRef.current();
|
|
14814
|
+
deactivateRef.current();
|
|
14815
|
+
return;
|
|
14816
|
+
}
|
|
14296
14817
|
deselectRef.current();
|
|
14297
14818
|
deactivateRef.current();
|
|
14298
14819
|
};
|
|
@@ -14312,6 +14833,10 @@ function OhhwellsBridge() {
|
|
|
14312
14833
|
closeLinkPopoverRef.current();
|
|
14313
14834
|
return;
|
|
14314
14835
|
}
|
|
14836
|
+
if (floatingPanelOpenRef.current) {
|
|
14837
|
+
closeFloatingPanelOnlyRef.current();
|
|
14838
|
+
return;
|
|
14839
|
+
}
|
|
14315
14840
|
if (activeElRef.current) {
|
|
14316
14841
|
const hrefCtx = getHrefKeyFromElement(activeElRef.current);
|
|
14317
14842
|
const navAnchor = hrefCtx ? getNavigationItemAnchor(hrefCtx.anchor) : null;
|
|
@@ -14342,6 +14867,10 @@ function OhhwellsBridge() {
|
|
|
14342
14867
|
return;
|
|
14343
14868
|
}
|
|
14344
14869
|
if (selectedElRef.current) {
|
|
14870
|
+
if (toolbarVariantRef.current === "logo") {
|
|
14871
|
+
deselectRef.current();
|
|
14872
|
+
return;
|
|
14873
|
+
}
|
|
14345
14874
|
if (toolbarVariantRef.current === "select-frame") {
|
|
14346
14875
|
const parent2 = getNavigationSelectionParent(selectedElRef.current);
|
|
14347
14876
|
if (parent2 && isNavigationContainer(parent2) && isFooterLinksContainer(parent2) && !isFooterLinksContainer(selectedElRef.current)) {
|
|
@@ -14375,7 +14904,16 @@ function OhhwellsBridge() {
|
|
|
14375
14904
|
closeLinkPopoverRef.current();
|
|
14376
14905
|
return;
|
|
14377
14906
|
}
|
|
14907
|
+
if (e.key === "Escape" && floatingPanelOpenRef.current) {
|
|
14908
|
+
e.preventDefault();
|
|
14909
|
+
closeFloatingPanelOnlyRef.current();
|
|
14910
|
+
return;
|
|
14911
|
+
}
|
|
14378
14912
|
if (e.key === "Escape" && selectedElRef.current && !activeElRef.current) {
|
|
14913
|
+
if (toolbarVariantRef.current === "logo") {
|
|
14914
|
+
deselectRef.current();
|
|
14915
|
+
return;
|
|
14916
|
+
}
|
|
14379
14917
|
if (toolbarVariantRef.current === "select-frame") {
|
|
14380
14918
|
const parent2 = getNavigationSelectionParent(selectedElRef.current);
|
|
14381
14919
|
if (parent2 && isNavigationContainer(parent2) && isFooterLinksContainer(parent2) && !isFooterLinksContainer(selectedElRef.current)) {
|
|
@@ -14708,6 +15246,9 @@ function OhhwellsBridge() {
|
|
|
14708
15246
|
if (e.data?.type !== "ow:parent-scroll") return;
|
|
14709
15247
|
const { iframeOffsetTop, headerH, canvasH } = e.data;
|
|
14710
15248
|
parentScrollRef.current = { iframeOffsetTop, headerH, canvasH };
|
|
15249
|
+
if (floatingPanelOpenRef.current) {
|
|
15250
|
+
setParentScrollSnap({ iframeOffsetTop, headerH, canvasH });
|
|
15251
|
+
}
|
|
14711
15252
|
if (visibleViewportRef.current) {
|
|
14712
15253
|
applyVisibleViewport(visibleViewportRef.current, parentScrollRef.current);
|
|
14713
15254
|
}
|
|
@@ -14747,10 +15288,15 @@ function OhhwellsBridge() {
|
|
|
14747
15288
|
return clientX >= r2.left && clientX <= r2.right && clientY >= r2.top && clientY <= r2.bottom;
|
|
14748
15289
|
});
|
|
14749
15290
|
if (logoAtPoint) {
|
|
14750
|
-
|
|
14751
|
-
|
|
14752
|
-
|
|
14753
|
-
|
|
15291
|
+
if (!logoHasUploadedImage(logoAtPoint)) {
|
|
15292
|
+
deselectRef.current();
|
|
15293
|
+
deactivateRef.current();
|
|
15294
|
+
const identity = readLogoIdentityFromDom();
|
|
15295
|
+
postToParentRef.current({ type: "ow:open-logo-settings", ...identity });
|
|
15296
|
+
return;
|
|
15297
|
+
}
|
|
15298
|
+
selectLogoRef.current(logoAtPoint);
|
|
15299
|
+
openLogoSizePanelRef.current(logoAtPoint);
|
|
14754
15300
|
return;
|
|
14755
15301
|
}
|
|
14756
15302
|
const textEditable = Array.from(
|
|
@@ -14822,6 +15368,13 @@ function OhhwellsBridge() {
|
|
|
14822
15368
|
window.addEventListener("message", handlePointerSync);
|
|
14823
15369
|
window.addEventListener("message", handleClickAt);
|
|
14824
15370
|
window.addEventListener("message", handleUpdateLogoIdentity);
|
|
15371
|
+
const handleViewMode = (e) => {
|
|
15372
|
+
if (e.data?.type !== "ow:view-mode") return;
|
|
15373
|
+
const mode = e.data.mode === "Mobile" || e.data.mode === "mobile" ? "mobile" : "desktop";
|
|
15374
|
+
setEditorViewport(mode);
|
|
15375
|
+
applyLogoSizes(editContentRef.current);
|
|
15376
|
+
};
|
|
15377
|
+
window.addEventListener("message", handleViewMode);
|
|
14825
15378
|
const handleViewportResize = () => {
|
|
14826
15379
|
if (visibleViewportRef.current) {
|
|
14827
15380
|
applyVisibleViewport(visibleViewportRef.current, parentScrollRef.current);
|
|
@@ -14875,6 +15428,7 @@ function OhhwellsBridge() {
|
|
|
14875
15428
|
window.removeEventListener("message", handlePointerSync);
|
|
14876
15429
|
window.removeEventListener("message", handleClickAt);
|
|
14877
15430
|
window.removeEventListener("message", handleUpdateLogoIdentity);
|
|
15431
|
+
window.removeEventListener("message", handleViewMode);
|
|
14878
15432
|
window.removeEventListener("message", handleHydrate);
|
|
14879
15433
|
window.removeEventListener("message", handleDeactivate);
|
|
14880
15434
|
window.removeEventListener("message", handleToastAction);
|
|
@@ -14885,7 +15439,7 @@ function OhhwellsBridge() {
|
|
|
14885
15439
|
if (imageShowTimerRef.current) clearTimeout(imageShowTimerRef.current);
|
|
14886
15440
|
};
|
|
14887
15441
|
}, [isEditMode, refreshStateRules]);
|
|
14888
|
-
(0,
|
|
15442
|
+
(0, import_react15.useEffect)(() => {
|
|
14889
15443
|
if (!isEditMode) return;
|
|
14890
15444
|
const THRESHOLD = 10;
|
|
14891
15445
|
const resolveWasSelected = (el) => {
|
|
@@ -15039,7 +15593,7 @@ function OhhwellsBridge() {
|
|
|
15039
15593
|
unlockFooterDragInteraction();
|
|
15040
15594
|
};
|
|
15041
15595
|
}, [isEditMode]);
|
|
15042
|
-
(0,
|
|
15596
|
+
(0, import_react15.useEffect)(() => {
|
|
15043
15597
|
const handler = (e) => {
|
|
15044
15598
|
if (e.data?.type !== "ow:request-schedule-config") return;
|
|
15045
15599
|
const insertAfterVal = e.data.insertAfter;
|
|
@@ -15055,7 +15609,7 @@ function OhhwellsBridge() {
|
|
|
15055
15609
|
window.addEventListener("message", handler);
|
|
15056
15610
|
return () => window.removeEventListener("message", handler);
|
|
15057
15611
|
}, [processConfigRequest]);
|
|
15058
|
-
(0,
|
|
15612
|
+
(0, import_react15.useEffect)(() => {
|
|
15059
15613
|
if (!isEditMode) return;
|
|
15060
15614
|
document.querySelectorAll("[data-ohw-active-state]").forEach((el) => {
|
|
15061
15615
|
el.removeAttribute("data-ohw-active-state");
|
|
@@ -15091,13 +15645,13 @@ function OhhwellsBridge() {
|
|
|
15091
15645
|
clearTimeout(timer);
|
|
15092
15646
|
};
|
|
15093
15647
|
}, [pathname, isEditMode, refreshStateRules, postToParent2]);
|
|
15094
|
-
(0,
|
|
15648
|
+
(0, import_react15.useEffect)(() => {
|
|
15095
15649
|
scrollToHashSectionWhenReady();
|
|
15096
15650
|
const onHashChange = () => scrollToHashSectionWhenReady();
|
|
15097
15651
|
window.addEventListener("hashchange", onHashChange);
|
|
15098
15652
|
return () => window.removeEventListener("hashchange", onHashChange);
|
|
15099
15653
|
}, [pathname]);
|
|
15100
|
-
const handleCommand = (0,
|
|
15654
|
+
const handleCommand = (0, import_react15.useCallback)((cmd) => {
|
|
15101
15655
|
const el = activeElRef.current;
|
|
15102
15656
|
const selBefore = window.getSelection();
|
|
15103
15657
|
let savedOffsets = null;
|
|
@@ -15133,7 +15687,7 @@ function OhhwellsBridge() {
|
|
|
15133
15687
|
if (el) setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
15134
15688
|
refreshActiveCommandsRef.current();
|
|
15135
15689
|
}, []);
|
|
15136
|
-
const handleStateChange = (0,
|
|
15690
|
+
const handleStateChange = (0, import_react15.useCallback)((state) => {
|
|
15137
15691
|
if (!activeStateElRef.current) return;
|
|
15138
15692
|
const el = activeStateElRef.current;
|
|
15139
15693
|
if (state === "Default") {
|
|
@@ -15146,7 +15700,7 @@ function OhhwellsBridge() {
|
|
|
15146
15700
|
}
|
|
15147
15701
|
setToggleState((prev) => prev ? { ...prev, activeState: state } : null);
|
|
15148
15702
|
}, [deactivate]);
|
|
15149
|
-
const reselectAfterLinkPopover = (0,
|
|
15703
|
+
const reselectAfterLinkPopover = (0, import_react15.useCallback)(
|
|
15150
15704
|
(hrefKey) => {
|
|
15151
15705
|
requestAnimationFrame(() => {
|
|
15152
15706
|
const el = resolveHrefKeyElement(hrefKey);
|
|
@@ -15155,7 +15709,7 @@ function OhhwellsBridge() {
|
|
|
15155
15709
|
},
|
|
15156
15710
|
[resolveHrefKeyElement]
|
|
15157
15711
|
);
|
|
15158
|
-
const closeLinkPopover = (0,
|
|
15712
|
+
const closeLinkPopover = (0, import_react15.useCallback)(() => {
|
|
15159
15713
|
const session = linkPopoverSessionRef.current;
|
|
15160
15714
|
addNavAfterAnchorRef.current = null;
|
|
15161
15715
|
setLinkPopover(null);
|
|
@@ -15163,9 +15717,9 @@ function OhhwellsBridge() {
|
|
|
15163
15717
|
reselectAfterLinkPopover(session.key);
|
|
15164
15718
|
}
|
|
15165
15719
|
}, [reselectAfterLinkPopover]);
|
|
15166
|
-
const closeLinkPopoverRef = (0,
|
|
15720
|
+
const closeLinkPopoverRef = (0, import_react15.useRef)(closeLinkPopover);
|
|
15167
15721
|
closeLinkPopoverRef.current = closeLinkPopover;
|
|
15168
|
-
const openLinkPopoverForActive = (0,
|
|
15722
|
+
const openLinkPopoverForActive = (0, import_react15.useCallback)(() => {
|
|
15169
15723
|
const hrefCtx = getHrefKeyFromElement(activeElRef.current);
|
|
15170
15724
|
if (!hrefCtx) return;
|
|
15171
15725
|
bumpLinkPopoverGrace();
|
|
@@ -15176,7 +15730,7 @@ function OhhwellsBridge() {
|
|
|
15176
15730
|
});
|
|
15177
15731
|
deactivate();
|
|
15178
15732
|
}, [deactivate]);
|
|
15179
|
-
const openLinkPopoverForSelected = (0,
|
|
15733
|
+
const openLinkPopoverForSelected = (0, import_react15.useCallback)(() => {
|
|
15180
15734
|
const anchor = selectedElRef.current;
|
|
15181
15735
|
if (!anchor) return;
|
|
15182
15736
|
const key = anchor.getAttribute("data-ohw-href-key");
|
|
@@ -15189,7 +15743,7 @@ function OhhwellsBridge() {
|
|
|
15189
15743
|
});
|
|
15190
15744
|
deselect();
|
|
15191
15745
|
}, [deselect]);
|
|
15192
|
-
const handleSelectParent = (0,
|
|
15746
|
+
const handleSelectParent = (0, import_react15.useCallback)(() => {
|
|
15193
15747
|
const selected = selectedElRef.current;
|
|
15194
15748
|
if (!selected) return;
|
|
15195
15749
|
if (toolbarVariantRef.current === "select-frame") {
|
|
@@ -15216,7 +15770,7 @@ function OhhwellsBridge() {
|
|
|
15216
15770
|
}
|
|
15217
15771
|
deselectRef.current();
|
|
15218
15772
|
}, []);
|
|
15219
|
-
const handleDuplicateSelected = (0,
|
|
15773
|
+
const handleDuplicateSelected = (0, import_react15.useCallback)(() => {
|
|
15220
15774
|
const selected = selectedElRef.current;
|
|
15221
15775
|
if (!selected || !isNavigationItem2(selected)) return;
|
|
15222
15776
|
const hrefKey = selected.getAttribute("data-ohw-href-key");
|
|
@@ -15306,7 +15860,7 @@ function OhhwellsBridge() {
|
|
|
15306
15860
|
});
|
|
15307
15861
|
}
|
|
15308
15862
|
}, [postToParent2]);
|
|
15309
|
-
const runPendingDeleteUndo = (0,
|
|
15863
|
+
const runPendingDeleteUndo = (0, import_react15.useCallback)(() => {
|
|
15310
15864
|
const pending = pendingDeleteUndoRef.current;
|
|
15311
15865
|
if (!pending) return false;
|
|
15312
15866
|
pendingDeleteUndoRef.current = null;
|
|
@@ -15314,7 +15868,7 @@ function OhhwellsBridge() {
|
|
|
15314
15868
|
enforceLinkHrefs();
|
|
15315
15869
|
return true;
|
|
15316
15870
|
}, []);
|
|
15317
|
-
const handleDeleteSelected = (0,
|
|
15871
|
+
const handleDeleteSelected = (0, import_react15.useCallback)(() => {
|
|
15318
15872
|
const selected = selectedElRef.current;
|
|
15319
15873
|
if (!selected) return false;
|
|
15320
15874
|
return deleteSelectedNavFooterItem({
|
|
@@ -15335,7 +15889,7 @@ function OhhwellsBridge() {
|
|
|
15335
15889
|
}, [postToParent2]);
|
|
15336
15890
|
handleDeleteSelectedRef.current = handleDeleteSelected;
|
|
15337
15891
|
runPendingDeleteUndoRef.current = runPendingDeleteUndo;
|
|
15338
|
-
const handleLinkPopoverSubmit = (0,
|
|
15892
|
+
const handleLinkPopoverSubmit = (0, import_react15.useCallback)(
|
|
15339
15893
|
(target) => {
|
|
15340
15894
|
const session = linkPopoverSessionRef.current;
|
|
15341
15895
|
if (!session) return;
|
|
@@ -15401,19 +15955,19 @@ function OhhwellsBridge() {
|
|
|
15401
15955
|
const showEditLink = toolbarShowEditLink;
|
|
15402
15956
|
const currentSections = sectionsByPath[pathname] ?? [];
|
|
15403
15957
|
linkPopoverOpenRef.current = linkPopover !== null;
|
|
15404
|
-
const handleMediaReplace = (0,
|
|
15958
|
+
const handleMediaReplace = (0, import_react15.useCallback)(
|
|
15405
15959
|
(key) => {
|
|
15406
15960
|
postToParent2({ type: "ow:image-pick", key, elementType: mediaHover?.elementType ?? "image" });
|
|
15407
15961
|
},
|
|
15408
15962
|
[postToParent2, mediaHover?.elementType]
|
|
15409
15963
|
);
|
|
15410
|
-
const handleEditCarousel = (0,
|
|
15964
|
+
const handleEditCarousel = (0, import_react15.useCallback)(
|
|
15411
15965
|
(key) => {
|
|
15412
15966
|
postToParent2({ type: "ow:carousel-open", key, images: readCarouselValue(key) });
|
|
15413
15967
|
},
|
|
15414
15968
|
[postToParent2]
|
|
15415
15969
|
);
|
|
15416
|
-
const handleMediaFadeOutComplete = (0,
|
|
15970
|
+
const handleMediaFadeOutComplete = (0, import_react15.useCallback)((key) => {
|
|
15417
15971
|
setUploadingRects((prev) => {
|
|
15418
15972
|
if (!(key in prev)) return prev;
|
|
15419
15973
|
const next = { ...prev };
|
|
@@ -15421,7 +15975,7 @@ function OhhwellsBridge() {
|
|
|
15421
15975
|
return next;
|
|
15422
15976
|
});
|
|
15423
15977
|
}, []);
|
|
15424
|
-
const handleVideoSettingsChange = (0,
|
|
15978
|
+
const handleVideoSettingsChange = (0, import_react15.useCallback)(
|
|
15425
15979
|
(key, settings) => {
|
|
15426
15980
|
document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
|
|
15427
15981
|
const video = getVideoEl2(el);
|
|
@@ -15444,10 +15998,10 @@ function OhhwellsBridge() {
|
|
|
15444
15998
|
[postToParent2]
|
|
15445
15999
|
);
|
|
15446
16000
|
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,
|
|
16001
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
|
|
16002
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { ref: attachVisibleViewport, "data-ohw-visible-viewport": "", "aria-hidden": true }),
|
|
16003
|
+
isEditMode && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(AiSectionOverlay, { postToParent: postToParent2, apiRef: aiSectionApiRef }),
|
|
16004
|
+
Object.entries(uploadingRects).map(([key, { rect, fadingOut }]) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15451
16005
|
MediaOverlay,
|
|
15452
16006
|
{
|
|
15453
16007
|
hover: { key, rect, elementType: "image", isDragOver: false, hasTextOverlap: false },
|
|
@@ -15458,7 +16012,7 @@ function OhhwellsBridge() {
|
|
|
15458
16012
|
},
|
|
15459
16013
|
`uploading-${key}`
|
|
15460
16014
|
)),
|
|
15461
|
-
mediaHover && !(mediaHover.key in uploadingRects) && /* @__PURE__ */ (0,
|
|
16015
|
+
mediaHover && !(mediaHover.key in uploadingRects) && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15462
16016
|
MediaOverlay,
|
|
15463
16017
|
{
|
|
15464
16018
|
hover: mediaHover,
|
|
@@ -15467,11 +16021,11 @@ function OhhwellsBridge() {
|
|
|
15467
16021
|
onVideoSettingsChange: handleVideoSettingsChange
|
|
15468
16022
|
}
|
|
15469
16023
|
),
|
|
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,
|
|
16024
|
+
carouselHover && !linkPopover && !isItemDragging && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(CarouselOverlay, { hover: carouselHover, onEdit: handleEditCarousel }),
|
|
16025
|
+
siblingHintRect && !linkPopover && !isItemDragging && siblingHintRects.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ItemInteractionLayer, { rect: siblingHintRect, state: "sibling-hint" }),
|
|
16026
|
+
siblingHintRects.length > 0 && !linkPopover && !isItemDragging && siblingHintRects.map((rect, i) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ItemInteractionLayer, { rect, state: "sibling-hint" }, `sibling-hint-${i}`)),
|
|
16027
|
+
isItemDragging && draggedItemRect && selectedElRef.current !== footerDragRef.current?.draggedEl && selectedElRef.current !== navDragRef.current?.draggedEl && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ItemInteractionLayer, { rect: draggedItemRect, state: "dragging" }),
|
|
16028
|
+
isItemDragging && footerDropSlots.map((slot, i) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15475
16029
|
"div",
|
|
15476
16030
|
{
|
|
15477
16031
|
className: "pointer-events-none fixed z-2147483646",
|
|
@@ -15481,7 +16035,7 @@ function OhhwellsBridge() {
|
|
|
15481
16035
|
width: slot.width,
|
|
15482
16036
|
height: slot.height
|
|
15483
16037
|
},
|
|
15484
|
-
children: /* @__PURE__ */ (0,
|
|
16038
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15485
16039
|
DropIndicator,
|
|
15486
16040
|
{
|
|
15487
16041
|
direction: slot.direction,
|
|
@@ -15492,7 +16046,7 @@ function OhhwellsBridge() {
|
|
|
15492
16046
|
},
|
|
15493
16047
|
`footer-drop-${slot.direction}-${slot.columnIndex}-${slot.insertIndex}-${i}`
|
|
15494
16048
|
)),
|
|
15495
|
-
isItemDragging && navDropSlots.map((slot, i) => /* @__PURE__ */ (0,
|
|
16049
|
+
isItemDragging && navDropSlots.map((slot, i) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15496
16050
|
"div",
|
|
15497
16051
|
{
|
|
15498
16052
|
className: "pointer-events-none fixed z-2147483646",
|
|
@@ -15502,7 +16056,7 @@ function OhhwellsBridge() {
|
|
|
15502
16056
|
width: slot.width,
|
|
15503
16057
|
height: slot.height
|
|
15504
16058
|
},
|
|
15505
|
-
children: /* @__PURE__ */ (0,
|
|
16059
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15506
16060
|
DropIndicator,
|
|
15507
16061
|
{
|
|
15508
16062
|
direction: slot.direction,
|
|
@@ -15513,10 +16067,10 @@ function OhhwellsBridge() {
|
|
|
15513
16067
|
},
|
|
15514
16068
|
`nav-drop-${slot.direction}-${slot.parentId ?? "root"}-${slot.insertIndex}-${i}`
|
|
15515
16069
|
)),
|
|
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,
|
|
16070
|
+
hoveredNavContainerRect && (toolbarVariant !== "select-frame" || isFooterFrameSelection) && !linkPopover && !isItemDragging && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ItemInteractionLayer, { rect: hoveredNavContainerRect, state: "hover" }),
|
|
16071
|
+
hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ItemInteractionLayer, { rect: hoveredItemRect, state: "hover" }),
|
|
16072
|
+
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isNavbarLinksContainer2(selectedElRef.current) && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(NavbarContainerChrome, { rect: toolbarRect, onAdd: handleAddTopLevelNavItem }),
|
|
16073
|
+
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isFooterLinksContainer(selectedElRef.current) && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15520
16074
|
FooterContainerChrome,
|
|
15521
16075
|
{
|
|
15522
16076
|
rect: toolbarRect,
|
|
@@ -15524,7 +16078,7 @@ function OhhwellsBridge() {
|
|
|
15524
16078
|
addDisabled: !canAddFooterColumn()
|
|
15525
16079
|
}
|
|
15526
16080
|
),
|
|
15527
|
-
toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame") && /* @__PURE__ */ (0,
|
|
16081
|
+
toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame" || toolbarVariant === "logo") && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15528
16082
|
ItemInteractionLayer,
|
|
15529
16083
|
{
|
|
15530
16084
|
rect: isItemDragging && draggedItemRect && (footerDragRef.current?.wasSelected || navDragRef.current?.wasSelected) ? draggedItemRect : toolbarRect,
|
|
@@ -15536,10 +16090,10 @@ function OhhwellsBridge() {
|
|
|
15536
16090
|
dragHandleLabel: reorderHrefKey ? `Reorder ${reorderHrefKey}` : "Reorder item",
|
|
15537
16091
|
onDragHandleDragStart: handleItemDragStart,
|
|
15538
16092
|
onDragHandleDragEnd: handleItemDragEnd,
|
|
15539
|
-
onItemPointerDown: handleItemChromePointerDown,
|
|
15540
|
-
onItemClick: handleItemChromeClick,
|
|
15541
|
-
itemDragSurface: !isFooterFrameSelection,
|
|
15542
|
-
toolbar: toolbarVariant === "link-action" && !isItemDragging || toolbarVariant === "select-frame" && isFooterFrameSelection && !isItemDragging ? /* @__PURE__ */ (0,
|
|
16093
|
+
onItemPointerDown: toolbarVariant === "logo" ? void 0 : handleItemChromePointerDown,
|
|
16094
|
+
onItemClick: toolbarVariant === "logo" ? void 0 : handleItemChromeClick,
|
|
16095
|
+
itemDragSurface: toolbarVariant !== "logo" && !isFooterFrameSelection,
|
|
16096
|
+
toolbar: toolbarVariant === "link-action" && !isItemDragging || toolbarVariant === "select-frame" && isFooterFrameSelection && !isItemDragging ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15543
16097
|
ItemActionToolbar,
|
|
15544
16098
|
{
|
|
15545
16099
|
onEditLink: openLinkPopoverForSelected,
|
|
@@ -15564,8 +16118,8 @@ function OhhwellsBridge() {
|
|
|
15564
16118
|
) : void 0
|
|
15565
16119
|
}
|
|
15566
16120
|
),
|
|
15567
|
-
toolbarRect && toolbarVariant === "rich-text" && !linkPopover && /* @__PURE__ */ (0,
|
|
15568
|
-
/* @__PURE__ */ (0,
|
|
16121
|
+
toolbarRect && toolbarVariant === "rich-text" && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
|
|
16122
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15569
16123
|
EditGlowChrome,
|
|
15570
16124
|
{
|
|
15571
16125
|
rect: toolbarRect,
|
|
@@ -15575,7 +16129,7 @@ function OhhwellsBridge() {
|
|
|
15575
16129
|
hideHandle: isItemDragging
|
|
15576
16130
|
}
|
|
15577
16131
|
),
|
|
15578
|
-
/* @__PURE__ */ (0,
|
|
16132
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15579
16133
|
FloatingToolbar,
|
|
15580
16134
|
{
|
|
15581
16135
|
rect: toolbarRect,
|
|
@@ -15588,7 +16142,7 @@ function OhhwellsBridge() {
|
|
|
15588
16142
|
}
|
|
15589
16143
|
)
|
|
15590
16144
|
] }),
|
|
15591
|
-
maxBadge && /* @__PURE__ */ (0,
|
|
16145
|
+
maxBadge && /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
|
|
15592
16146
|
"div",
|
|
15593
16147
|
{
|
|
15594
16148
|
"data-ohw-max-badge": "",
|
|
@@ -15614,7 +16168,7 @@ function OhhwellsBridge() {
|
|
|
15614
16168
|
]
|
|
15615
16169
|
}
|
|
15616
16170
|
),
|
|
15617
|
-
toggleState && !linkPopover && /* @__PURE__ */ (0,
|
|
16171
|
+
toggleState && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15618
16172
|
StateToggle,
|
|
15619
16173
|
{
|
|
15620
16174
|
rect: toggleState.rect,
|
|
@@ -15623,15 +16177,15 @@ function OhhwellsBridge() {
|
|
|
15623
16177
|
onStateChange: handleStateChange
|
|
15624
16178
|
}
|
|
15625
16179
|
),
|
|
15626
|
-
sectionGap && !linkPopover && /* @__PURE__ */ (0,
|
|
16180
|
+
sectionGap && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
|
|
15627
16181
|
"div",
|
|
15628
16182
|
{
|
|
15629
16183
|
"data-ohw-section-insert-line": "",
|
|
15630
16184
|
className: "fixed left-0 w-full z-2147483646 flex items-center pointer-events-none",
|
|
15631
16185
|
style: { top: sectionGap.y, transform: "translateY(-50%)" },
|
|
15632
16186
|
children: [
|
|
15633
|
-
/* @__PURE__ */ (0,
|
|
15634
|
-
/* @__PURE__ */ (0,
|
|
16187
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } }),
|
|
16188
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15635
16189
|
Badge,
|
|
15636
16190
|
{
|
|
15637
16191
|
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 +16202,11 @@ function OhhwellsBridge() {
|
|
|
15648
16202
|
children: "Add Section"
|
|
15649
16203
|
}
|
|
15650
16204
|
),
|
|
15651
|
-
/* @__PURE__ */ (0,
|
|
16205
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } })
|
|
15652
16206
|
]
|
|
15653
16207
|
}
|
|
15654
16208
|
),
|
|
15655
|
-
linkPopover && dialogPortalContainer ? /* @__PURE__ */ (0,
|
|
16209
|
+
linkPopover && dialogPortalContainer ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
15656
16210
|
LinkPopover,
|
|
15657
16211
|
{
|
|
15658
16212
|
panelRef: linkPopoverPanelRef,
|
|
@@ -15668,6 +16222,57 @@ function OhhwellsBridge() {
|
|
|
15668
16222
|
onSubmit: handleLinkPopoverSubmit
|
|
15669
16223
|
},
|
|
15670
16224
|
linkPopover.key
|
|
16225
|
+
) : null,
|
|
16226
|
+
floatingPanel && floatingPanel.kind === "logo-size" && logoSizeDraft ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
16227
|
+
FloatingPanel,
|
|
16228
|
+
{
|
|
16229
|
+
open: true,
|
|
16230
|
+
title: floatingPanel.title,
|
|
16231
|
+
context: floatingPanel.context,
|
|
16232
|
+
position: floatingPanelPos,
|
|
16233
|
+
onPositionChange: setFloatingPanelPos,
|
|
16234
|
+
parentScroll: parentScrollSnap ?? parentScrollRef.current,
|
|
16235
|
+
onClose: closeFloatingPanelAndDeselect,
|
|
16236
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
16237
|
+
LogoSizePanel,
|
|
16238
|
+
{
|
|
16239
|
+
viewport: editorViewport,
|
|
16240
|
+
sizePx: editorViewport === "mobile" && !logoSizeDraft.mobileFollowing ? logoSizeDraft.mobilePx : logoSizeDraft.desktopPx,
|
|
16241
|
+
mobileFollowing: logoSizeDraft.mobileFollowing,
|
|
16242
|
+
onSizeChange: (px) => {
|
|
16243
|
+
const next = editorViewport === "mobile" ? { ...logoSizeDraft, mobilePx: px, mobileFollowing: false } : {
|
|
16244
|
+
...logoSizeDraft,
|
|
16245
|
+
desktopPx: px,
|
|
16246
|
+
mobilePx: logoSizeDraft.mobileFollowing ? px : logoSizeDraft.mobilePx
|
|
16247
|
+
};
|
|
16248
|
+
setLogoSizeDraft(next);
|
|
16249
|
+
persistLogoSizeDraft(floatingPanel.placement, next);
|
|
16250
|
+
},
|
|
16251
|
+
onCustomizeMobile: () => {
|
|
16252
|
+
const next = {
|
|
16253
|
+
...logoSizeDraft,
|
|
16254
|
+
mobileFollowing: false,
|
|
16255
|
+
mobilePx: logoSizeDraft.desktopPx
|
|
16256
|
+
};
|
|
16257
|
+
setLogoSizeDraft(next);
|
|
16258
|
+
persistLogoSizeDraft(floatingPanel.placement, next);
|
|
16259
|
+
},
|
|
16260
|
+
onResetMobile: () => {
|
|
16261
|
+
const next = {
|
|
16262
|
+
...logoSizeDraft,
|
|
16263
|
+
mobileFollowing: true,
|
|
16264
|
+
mobilePx: logoSizeDraft.desktopPx
|
|
16265
|
+
};
|
|
16266
|
+
setLogoSizeDraft(next);
|
|
16267
|
+
persistLogoSizeDraft(floatingPanel.placement, next);
|
|
16268
|
+
},
|
|
16269
|
+
onUpdateEverywhere: () => {
|
|
16270
|
+
const identity = readLogoIdentityFromDom();
|
|
16271
|
+
postToParent2({ type: "ow:open-logo-settings", ...identity });
|
|
16272
|
+
}
|
|
16273
|
+
}
|
|
16274
|
+
)
|
|
16275
|
+
}
|
|
15671
16276
|
) : null
|
|
15672
16277
|
] }),
|
|
15673
16278
|
bridgeRoot
|