@ohhwells/bridge 0.1.47 → 0.1.48
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 +486 -284
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +22 -1
- package/dist/index.d.ts +22 -1
- package/dist/index.js +381 -180
- package/dist/index.js.map +1 -1
- package/dist/styles.css +8 -0
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -57,12 +57,13 @@ __export(index_exports, {
|
|
|
57
57
|
isValidUrl: () => isValidUrl,
|
|
58
58
|
parseTarget: () => parseTarget,
|
|
59
59
|
toggleVariants: () => toggleVariants,
|
|
60
|
+
useOhwCarousel: () => useOhwCarousel,
|
|
60
61
|
validateUrlInput: () => validateUrlInput
|
|
61
62
|
});
|
|
62
63
|
module.exports = __toCommonJS(index_exports);
|
|
63
64
|
|
|
64
65
|
// src/OhhwellsBridge.tsx
|
|
65
|
-
var
|
|
66
|
+
var import_react10 = __toESM(require("react"), 1);
|
|
66
67
|
var import_client = require("react-dom/client");
|
|
67
68
|
var import_react_dom2 = require("react-dom");
|
|
68
69
|
|
|
@@ -4904,6 +4905,61 @@ function MediaOverlay({
|
|
|
4904
4905
|
] });
|
|
4905
4906
|
}
|
|
4906
4907
|
|
|
4908
|
+
// src/ui/CarouselOverlay.tsx
|
|
4909
|
+
var import_lucide_react4 = require("lucide-react");
|
|
4910
|
+
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
4911
|
+
var OVERLAY_BUTTON_STYLE2 = {
|
|
4912
|
+
pointerEvents: "auto",
|
|
4913
|
+
fontFamily: "Inter, sans-serif",
|
|
4914
|
+
fontSize: 12,
|
|
4915
|
+
color: "#000"
|
|
4916
|
+
};
|
|
4917
|
+
function CarouselOverlay({
|
|
4918
|
+
hover,
|
|
4919
|
+
onEdit
|
|
4920
|
+
}) {
|
|
4921
|
+
const { rect } = hover;
|
|
4922
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
4923
|
+
"div",
|
|
4924
|
+
{
|
|
4925
|
+
"data-ohw-bridge": "",
|
|
4926
|
+
"data-ohw-carousel-overlay": "",
|
|
4927
|
+
className: "flex cursor-pointer items-center justify-center",
|
|
4928
|
+
style: {
|
|
4929
|
+
position: "fixed",
|
|
4930
|
+
top: rect.top,
|
|
4931
|
+
left: rect.left,
|
|
4932
|
+
width: rect.width,
|
|
4933
|
+
height: rect.height,
|
|
4934
|
+
zIndex: 2147483646,
|
|
4935
|
+
pointerEvents: "auto",
|
|
4936
|
+
boxShadow: "inset 0 0 0 1.5px var(--color-primary)",
|
|
4937
|
+
background: "color-mix(in srgb, var(--color-primary) 20%, transparent)"
|
|
4938
|
+
},
|
|
4939
|
+
onClick: () => onEdit(hover.key),
|
|
4940
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
|
|
4941
|
+
Button,
|
|
4942
|
+
{
|
|
4943
|
+
"data-ohw-carousel-overlay": "",
|
|
4944
|
+
variant: "outline",
|
|
4945
|
+
size: "sm",
|
|
4946
|
+
className: "cursor-pointer gap-1.5 hover:bg-background",
|
|
4947
|
+
style: OVERLAY_BUTTON_STYLE2,
|
|
4948
|
+
onMouseDown: (e) => e.preventDefault(),
|
|
4949
|
+
onClick: (e) => {
|
|
4950
|
+
e.stopPropagation();
|
|
4951
|
+
onEdit(hover.key);
|
|
4952
|
+
},
|
|
4953
|
+
children: [
|
|
4954
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react4.GalleryHorizontal, { size: 14 }),
|
|
4955
|
+
"Edit gallery"
|
|
4956
|
+
]
|
|
4957
|
+
}
|
|
4958
|
+
)
|
|
4959
|
+
}
|
|
4960
|
+
);
|
|
4961
|
+
}
|
|
4962
|
+
|
|
4907
4963
|
// src/OhhwellsBridge.tsx
|
|
4908
4964
|
var import_react_dom3 = require("react-dom");
|
|
4909
4965
|
var import_navigation2 = require("next/navigation");
|
|
@@ -5189,23 +5245,23 @@ var import_react7 = require("react");
|
|
|
5189
5245
|
// src/ui/dialog.tsx
|
|
5190
5246
|
var React8 = __toESM(require("react"), 1);
|
|
5191
5247
|
var import_radix_ui5 = require("radix-ui");
|
|
5192
|
-
var
|
|
5193
|
-
var
|
|
5248
|
+
var import_lucide_react5 = require("lucide-react");
|
|
5249
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
5194
5250
|
function Dialog2({
|
|
5195
5251
|
...props
|
|
5196
5252
|
}) {
|
|
5197
|
-
return /* @__PURE__ */ (0,
|
|
5253
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_radix_ui5.Dialog.Root, { "data-slot": "dialog", ...props });
|
|
5198
5254
|
}
|
|
5199
5255
|
function DialogPortal({
|
|
5200
5256
|
...props
|
|
5201
5257
|
}) {
|
|
5202
|
-
return /* @__PURE__ */ (0,
|
|
5258
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_radix_ui5.Dialog.Portal, { ...props });
|
|
5203
5259
|
}
|
|
5204
5260
|
function DialogOverlay({
|
|
5205
5261
|
className,
|
|
5206
5262
|
...props
|
|
5207
5263
|
}) {
|
|
5208
|
-
return /* @__PURE__ */ (0,
|
|
5264
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
5209
5265
|
import_radix_ui5.Dialog.Overlay,
|
|
5210
5266
|
{
|
|
5211
5267
|
"data-slot": "dialog-overlay",
|
|
@@ -5218,9 +5274,9 @@ function DialogOverlay({
|
|
|
5218
5274
|
var DialogContent = React8.forwardRef(
|
|
5219
5275
|
({ className, children, showCloseButton = true, container, ...props }, ref) => {
|
|
5220
5276
|
const positionMode = container ? "absolute" : "fixed";
|
|
5221
|
-
return /* @__PURE__ */ (0,
|
|
5222
|
-
/* @__PURE__ */ (0,
|
|
5223
|
-
/* @__PURE__ */ (0,
|
|
5277
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(DialogPortal, { container: container ?? void 0, children: [
|
|
5278
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(DialogOverlay, { className: cn(positionMode, "inset-0") }),
|
|
5279
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
|
|
5224
5280
|
import_radix_ui5.Dialog.Content,
|
|
5225
5281
|
{
|
|
5226
5282
|
ref,
|
|
@@ -5236,13 +5292,13 @@ var DialogContent = React8.forwardRef(
|
|
|
5236
5292
|
...props,
|
|
5237
5293
|
children: [
|
|
5238
5294
|
children,
|
|
5239
|
-
showCloseButton ? /* @__PURE__ */ (0,
|
|
5295
|
+
showCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
5240
5296
|
import_radix_ui5.Dialog.Close,
|
|
5241
5297
|
{
|
|
5242
5298
|
type: "button",
|
|
5243
5299
|
className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50",
|
|
5244
5300
|
"aria-label": "Close",
|
|
5245
|
-
children: /* @__PURE__ */ (0,
|
|
5301
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_lucide_react5.X, { size: 16, "aria-hidden": true })
|
|
5246
5302
|
}
|
|
5247
5303
|
) : null
|
|
5248
5304
|
]
|
|
@@ -5256,13 +5312,13 @@ function DialogHeader({
|
|
|
5256
5312
|
className,
|
|
5257
5313
|
...props
|
|
5258
5314
|
}) {
|
|
5259
|
-
return /* @__PURE__ */ (0,
|
|
5315
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: cn("flex flex-col gap-1.5", className), ...props });
|
|
5260
5316
|
}
|
|
5261
5317
|
function DialogFooter({
|
|
5262
5318
|
className,
|
|
5263
5319
|
...props
|
|
5264
5320
|
}) {
|
|
5265
|
-
return /* @__PURE__ */ (0,
|
|
5321
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
5266
5322
|
"div",
|
|
5267
5323
|
{
|
|
5268
5324
|
className: cn("flex items-center justify-end gap-2", className),
|
|
@@ -5270,7 +5326,7 @@ function DialogFooter({
|
|
|
5270
5326
|
}
|
|
5271
5327
|
);
|
|
5272
5328
|
}
|
|
5273
|
-
var DialogTitle = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
5329
|
+
var DialogTitle = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
5274
5330
|
import_radix_ui5.Dialog.Title,
|
|
5275
5331
|
{
|
|
5276
5332
|
ref,
|
|
@@ -5282,7 +5338,7 @@ var DialogTitle = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE
|
|
|
5282
5338
|
}
|
|
5283
5339
|
));
|
|
5284
5340
|
DialogTitle.displayName = import_radix_ui5.Dialog.Title.displayName;
|
|
5285
|
-
var DialogDescription = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
5341
|
+
var DialogDescription = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
5286
5342
|
import_radix_ui5.Dialog.Description,
|
|
5287
5343
|
{
|
|
5288
5344
|
ref,
|
|
@@ -5294,63 +5350,63 @@ DialogDescription.displayName = import_radix_ui5.Dialog.Description.displayName;
|
|
|
5294
5350
|
var DialogClose = import_radix_ui5.Dialog.Close;
|
|
5295
5351
|
|
|
5296
5352
|
// src/ui/link-modal/LinkEditorPanel.tsx
|
|
5297
|
-
var
|
|
5353
|
+
var import_lucide_react9 = require("lucide-react");
|
|
5298
5354
|
|
|
5299
5355
|
// src/ui/link-modal/DestinationBreadcrumb.tsx
|
|
5300
|
-
var
|
|
5301
|
-
var
|
|
5356
|
+
var import_lucide_react6 = require("lucide-react");
|
|
5357
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
5302
5358
|
function DestinationBreadcrumb({
|
|
5303
5359
|
pageTitle,
|
|
5304
5360
|
sectionLabel
|
|
5305
5361
|
}) {
|
|
5306
|
-
return /* @__PURE__ */ (0,
|
|
5307
|
-
/* @__PURE__ */ (0,
|
|
5308
|
-
/* @__PURE__ */ (0,
|
|
5309
|
-
/* @__PURE__ */ (0,
|
|
5310
|
-
/* @__PURE__ */ (0,
|
|
5311
|
-
/* @__PURE__ */ (0,
|
|
5362
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex w-full flex-col gap-2", children: [
|
|
5363
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { className: "text-sm font-medium! text-foreground m-0", children: "Destination" }),
|
|
5364
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex items-center gap-3", children: [
|
|
5365
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
5366
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react6.File, { size: 16, className: "shrink-0 text-foreground", "aria-hidden": true }),
|
|
5367
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "text-sm font-medium leading-none text-foreground!", children: pageTitle })
|
|
5312
5368
|
] }),
|
|
5313
|
-
/* @__PURE__ */ (0,
|
|
5314
|
-
|
|
5369
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5370
|
+
import_lucide_react6.ArrowRight,
|
|
5315
5371
|
{
|
|
5316
5372
|
size: 16,
|
|
5317
5373
|
className: "shrink-0 text-muted-foreground",
|
|
5318
5374
|
"aria-hidden": true
|
|
5319
5375
|
}
|
|
5320
5376
|
),
|
|
5321
|
-
/* @__PURE__ */ (0,
|
|
5322
|
-
/* @__PURE__ */ (0,
|
|
5323
|
-
|
|
5377
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
|
|
5378
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5379
|
+
import_lucide_react6.GalleryVertical,
|
|
5324
5380
|
{
|
|
5325
5381
|
size: 16,
|
|
5326
5382
|
className: "shrink-0 text-foreground",
|
|
5327
5383
|
"aria-hidden": true
|
|
5328
5384
|
}
|
|
5329
5385
|
),
|
|
5330
|
-
/* @__PURE__ */ (0,
|
|
5386
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "truncate text-sm font-medium leading-none text-foreground", children: sectionLabel })
|
|
5331
5387
|
] })
|
|
5332
5388
|
] })
|
|
5333
5389
|
] });
|
|
5334
5390
|
}
|
|
5335
5391
|
|
|
5336
5392
|
// src/ui/link-modal/SectionTreeItem.tsx
|
|
5337
|
-
var
|
|
5338
|
-
var
|
|
5393
|
+
var import_lucide_react7 = require("lucide-react");
|
|
5394
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
5339
5395
|
function SectionTreeItem({
|
|
5340
5396
|
section,
|
|
5341
5397
|
onSelect,
|
|
5342
5398
|
selected
|
|
5343
5399
|
}) {
|
|
5344
5400
|
const interactive = Boolean(onSelect);
|
|
5345
|
-
return /* @__PURE__ */ (0,
|
|
5346
|
-
/* @__PURE__ */ (0,
|
|
5401
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex h-9 w-full items-end pl-3", children: [
|
|
5402
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
5347
5403
|
"div",
|
|
5348
5404
|
{
|
|
5349
5405
|
className: "mr-[-1px] h-9 w-2 shrink-0 rounded-bl-sm border-b border-l border-border mb-4",
|
|
5350
5406
|
"aria-hidden": true
|
|
5351
5407
|
}
|
|
5352
5408
|
),
|
|
5353
|
-
/* @__PURE__ */ (0,
|
|
5409
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
|
|
5354
5410
|
"div",
|
|
5355
5411
|
{
|
|
5356
5412
|
role: interactive ? "button" : void 0,
|
|
@@ -5368,15 +5424,15 @@ function SectionTreeItem({
|
|
|
5368
5424
|
interactive && selected && "border-primary"
|
|
5369
5425
|
),
|
|
5370
5426
|
children: [
|
|
5371
|
-
/* @__PURE__ */ (0,
|
|
5372
|
-
|
|
5427
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
|
5428
|
+
import_lucide_react7.GalleryVertical,
|
|
5373
5429
|
{
|
|
5374
5430
|
size: 16,
|
|
5375
5431
|
className: "shrink-0 text-foreground",
|
|
5376
5432
|
"aria-hidden": true
|
|
5377
5433
|
}
|
|
5378
5434
|
),
|
|
5379
|
-
/* @__PURE__ */ (0,
|
|
5435
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "truncate text-sm font-normal leading-5 text-foreground", children: section.label })
|
|
5380
5436
|
]
|
|
5381
5437
|
}
|
|
5382
5438
|
)
|
|
@@ -5388,10 +5444,10 @@ var import_react4 = require("react");
|
|
|
5388
5444
|
|
|
5389
5445
|
// src/ui/input.tsx
|
|
5390
5446
|
var React9 = __toESM(require("react"), 1);
|
|
5391
|
-
var
|
|
5447
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
5392
5448
|
var Input = React9.forwardRef(
|
|
5393
5449
|
({ className, type, ...props }, ref) => {
|
|
5394
|
-
return /* @__PURE__ */ (0,
|
|
5450
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
5395
5451
|
"input",
|
|
5396
5452
|
{
|
|
5397
5453
|
type,
|
|
@@ -5410,9 +5466,9 @@ Input.displayName = "Input";
|
|
|
5410
5466
|
|
|
5411
5467
|
// src/ui/label.tsx
|
|
5412
5468
|
var import_radix_ui6 = require("radix-ui");
|
|
5413
|
-
var
|
|
5469
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
5414
5470
|
function Label({ className, ...props }) {
|
|
5415
|
-
return /* @__PURE__ */ (0,
|
|
5471
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
5416
5472
|
import_radix_ui6.Label.Root,
|
|
5417
5473
|
{
|
|
5418
5474
|
"data-slot": "label",
|
|
@@ -5423,12 +5479,12 @@ function Label({ className, ...props }) {
|
|
|
5423
5479
|
}
|
|
5424
5480
|
|
|
5425
5481
|
// src/ui/link-modal/UrlOrPageInput.tsx
|
|
5426
|
-
var
|
|
5427
|
-
var
|
|
5482
|
+
var import_lucide_react8 = require("lucide-react");
|
|
5483
|
+
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
5428
5484
|
function FieldChevron({
|
|
5429
5485
|
onClick
|
|
5430
5486
|
}) {
|
|
5431
|
-
return /* @__PURE__ */ (0,
|
|
5487
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
5432
5488
|
"button",
|
|
5433
5489
|
{
|
|
5434
5490
|
type: "button",
|
|
@@ -5436,7 +5492,7 @@ function FieldChevron({
|
|
|
5436
5492
|
onClick,
|
|
5437
5493
|
"aria-label": "Open page list",
|
|
5438
5494
|
tabIndex: -1,
|
|
5439
|
-
children: /* @__PURE__ */ (0,
|
|
5495
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react8.ChevronDown, { size: 16 })
|
|
5440
5496
|
}
|
|
5441
5497
|
);
|
|
5442
5498
|
}
|
|
@@ -5497,19 +5553,19 @@ function UrlOrPageInput({
|
|
|
5497
5553
|
"data-ohw-link-field flex h-[36px] w-full items-center overflow-hidden rounded-md border bg-background pl-3 pr-3 py-2 outline-none transition-[border-color,box-shadow]",
|
|
5498
5554
|
urlError ? "border-destructive shadow-[0_0_0_1px_var(--ohw-destructive)]" : isFocused ? "border-primary shadow-[0_0_0_1px_var(--ohw-primary)]" : "border-input"
|
|
5499
5555
|
);
|
|
5500
|
-
return /* @__PURE__ */ (0,
|
|
5501
|
-
/* @__PURE__ */ (0,
|
|
5502
|
-
/* @__PURE__ */ (0,
|
|
5503
|
-
/* @__PURE__ */ (0,
|
|
5504
|
-
selectedPage ? /* @__PURE__ */ (0,
|
|
5505
|
-
|
|
5556
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex w-full flex-col gap-2 p-0", children: [
|
|
5557
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Label, { htmlFor: inputId, className: cn(urlError && "text-destructive"), children: "Destination" }),
|
|
5558
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { ref: rootRef, className: "relative w-full", children: [
|
|
5559
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { "data-ohw-link-field": true, className: fieldClassName, children: [
|
|
5560
|
+
selectedPage ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex shrink-0 items-center pr-2", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
5561
|
+
import_lucide_react8.File,
|
|
5506
5562
|
{
|
|
5507
5563
|
size: 16,
|
|
5508
5564
|
className: "shrink-0 text-foreground",
|
|
5509
5565
|
"aria-hidden": true
|
|
5510
5566
|
}
|
|
5511
5567
|
) }) : null,
|
|
5512
|
-
readOnly ? /* @__PURE__ */ (0,
|
|
5568
|
+
readOnly ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "min-w-0 flex-1 truncate text-sm leading-5 text-foreground", children: selectedPage?.title ?? value }) : /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
5513
5569
|
Input,
|
|
5514
5570
|
{
|
|
5515
5571
|
ref: inputRef,
|
|
@@ -5535,7 +5591,7 @@ function UrlOrPageInput({
|
|
|
5535
5591
|
)
|
|
5536
5592
|
}
|
|
5537
5593
|
),
|
|
5538
|
-
selectedPage && !readOnly ? /* @__PURE__ */ (0,
|
|
5594
|
+
selectedPage && !readOnly ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
5539
5595
|
"button",
|
|
5540
5596
|
{
|
|
5541
5597
|
type: "button",
|
|
@@ -5543,26 +5599,26 @@ function UrlOrPageInput({
|
|
|
5543
5599
|
onMouseDown: clearSelection,
|
|
5544
5600
|
"aria-label": "Clear selected page",
|
|
5545
5601
|
tabIndex: -1,
|
|
5546
|
-
children: /* @__PURE__ */ (0,
|
|
5602
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react8.X, { size: 16, "aria-hidden": true })
|
|
5547
5603
|
}
|
|
5548
5604
|
) : null,
|
|
5549
|
-
!readOnly ? /* @__PURE__ */ (0,
|
|
5605
|
+
!readOnly ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(FieldChevron, { onClick: toggleDropdown }) : null
|
|
5550
5606
|
] }),
|
|
5551
|
-
dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */ (0,
|
|
5607
|
+
dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
5552
5608
|
"div",
|
|
5553
5609
|
{
|
|
5554
5610
|
"data-ohw-link-page-dropdown": "",
|
|
5555
5611
|
className: "absolute left-0 right-0 top-[calc(100%+4px)] z-50 max-h-48 overflow-auto rounded-lg border border-border bg-popover py-1 shadow-lg",
|
|
5556
5612
|
onMouseDown: (e) => e.preventDefault(),
|
|
5557
|
-
children: filteredPages.map((page) => /* @__PURE__ */ (0,
|
|
5613
|
+
children: filteredPages.map((page) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
|
|
5558
5614
|
"button",
|
|
5559
5615
|
{
|
|
5560
5616
|
type: "button",
|
|
5561
5617
|
className: "flex h-9 w-full items-center gap-2 border-0 bg-transparent px-3 text-left text-sm leading-5 text-foreground outline-none hover:bg-muted",
|
|
5562
5618
|
onClick: () => onPageSelect(page),
|
|
5563
5619
|
children: [
|
|
5564
|
-
/* @__PURE__ */ (0,
|
|
5565
|
-
/* @__PURE__ */ (0,
|
|
5620
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react8.File, { size: 16, className: "shrink-0", "aria-hidden": true }),
|
|
5621
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "truncate", children: page.title })
|
|
5566
5622
|
]
|
|
5567
5623
|
},
|
|
5568
5624
|
page.path
|
|
@@ -5570,34 +5626,34 @@ function UrlOrPageInput({
|
|
|
5570
5626
|
}
|
|
5571
5627
|
) : null
|
|
5572
5628
|
] }),
|
|
5573
|
-
urlError ? /* @__PURE__ */ (0,
|
|
5629
|
+
urlError ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("p", { className: "text-sm font-medium text-destructive", children: urlError }) : null
|
|
5574
5630
|
] });
|
|
5575
5631
|
}
|
|
5576
5632
|
|
|
5577
5633
|
// src/ui/link-modal/LinkEditorPanel.tsx
|
|
5578
|
-
var
|
|
5634
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
5579
5635
|
function LinkEditorPanel({ state, onClose }) {
|
|
5580
5636
|
const isCancel = state.secondaryLabel === "Cancel" || state.secondaryLabel === "Back to sections";
|
|
5581
|
-
return /* @__PURE__ */ (0,
|
|
5582
|
-
/* @__PURE__ */ (0,
|
|
5637
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
|
|
5638
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(DialogClose, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
5583
5639
|
"button",
|
|
5584
5640
|
{
|
|
5585
5641
|
type: "button",
|
|
5586
5642
|
className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50 h-7",
|
|
5587
5643
|
"aria-label": "Close",
|
|
5588
5644
|
onClick: onClose,
|
|
5589
|
-
children: /* @__PURE__ */ (0,
|
|
5645
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_lucide_react9.X, { size: 16, "aria-hidden": true })
|
|
5590
5646
|
}
|
|
5591
5647
|
) }),
|
|
5592
|
-
/* @__PURE__ */ (0,
|
|
5593
|
-
/* @__PURE__ */ (0,
|
|
5594
|
-
state.showBreadcrumb && state.selectedPage && state.selectedSection ? /* @__PURE__ */ (0,
|
|
5648
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(DialogHeader, { className: "w-full gap-1.5 p-6 pr-12", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(DialogTitle, { className: "m-0 w-full break-words", children: state.title }) }),
|
|
5649
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex w-full flex-col gap-3 px-6 pb-8 pt-1", children: [
|
|
5650
|
+
state.showBreadcrumb && state.selectedPage && state.selectedSection ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
5595
5651
|
DestinationBreadcrumb,
|
|
5596
5652
|
{
|
|
5597
5653
|
pageTitle: state.selectedPage.title,
|
|
5598
5654
|
sectionLabel: state.selectedSection.label
|
|
5599
5655
|
}
|
|
5600
|
-
) : /* @__PURE__ */ (0,
|
|
5656
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
5601
5657
|
UrlOrPageInput,
|
|
5602
5658
|
{
|
|
5603
5659
|
value: state.searchValue,
|
|
@@ -5610,8 +5666,8 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
5610
5666
|
urlError: state.urlError
|
|
5611
5667
|
}
|
|
5612
5668
|
),
|
|
5613
|
-
state.showChooseSection ? /* @__PURE__ */ (0,
|
|
5614
|
-
/* @__PURE__ */ (0,
|
|
5669
|
+
state.showChooseSection ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex flex-col justify-center gap-2", children: [
|
|
5670
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
5615
5671
|
Button,
|
|
5616
5672
|
{
|
|
5617
5673
|
type: "button",
|
|
@@ -5622,15 +5678,15 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
5622
5678
|
children: "Choose a section"
|
|
5623
5679
|
}
|
|
5624
5680
|
),
|
|
5625
|
-
/* @__PURE__ */ (0,
|
|
5626
|
-
/* @__PURE__ */ (0,
|
|
5627
|
-
/* @__PURE__ */ (0,
|
|
5681
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center gap-1 text-sm text-muted-foreground", children: [
|
|
5682
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_lucide_react9.Info, { size: 16, className: "shrink-0", "aria-hidden": true }),
|
|
5683
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { children: "Pick a section this link should scroll to." })
|
|
5628
5684
|
] })
|
|
5629
5685
|
] }) : null,
|
|
5630
|
-
state.showSectionRow && state.selectedSection ? /* @__PURE__ */ (0,
|
|
5686
|
+
state.showSectionRow && state.selectedSection ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(SectionTreeItem, { section: state.selectedSection, selected: true }) : null
|
|
5631
5687
|
] }),
|
|
5632
|
-
/* @__PURE__ */ (0,
|
|
5633
|
-
/* @__PURE__ */ (0,
|
|
5688
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(DialogFooter, { className: "w-full px-6 pb-6", children: [
|
|
5689
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
5634
5690
|
Button,
|
|
5635
5691
|
{
|
|
5636
5692
|
type: "button",
|
|
@@ -5645,7 +5701,7 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
5645
5701
|
children: state.secondaryLabel
|
|
5646
5702
|
}
|
|
5647
5703
|
),
|
|
5648
|
-
/* @__PURE__ */ (0,
|
|
5704
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
5649
5705
|
Button,
|
|
5650
5706
|
{
|
|
5651
5707
|
type: "button",
|
|
@@ -5666,9 +5722,9 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
5666
5722
|
// src/ui/link-modal/SectionPickerOverlay.tsx
|
|
5667
5723
|
var import_react5 = require("react");
|
|
5668
5724
|
var import_react_dom = require("react-dom");
|
|
5669
|
-
var
|
|
5725
|
+
var import_lucide_react10 = require("lucide-react");
|
|
5670
5726
|
var import_navigation = require("next/navigation");
|
|
5671
|
-
var
|
|
5727
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
5672
5728
|
var DIM_OVERLAY = "rgba(0, 0, 0, 0.45)";
|
|
5673
5729
|
function rectsEqual(a, b) {
|
|
5674
5730
|
if (a.size !== b.size) return false;
|
|
@@ -5897,7 +5953,7 @@ function SectionPickerOverlay({
|
|
|
5897
5953
|
const portalRoot = typeof document !== "undefined" ? document.querySelector("[data-ohw-bridge-root]") ?? document.body : null;
|
|
5898
5954
|
if (!portalRoot) return null;
|
|
5899
5955
|
return (0, import_react_dom.createPortal)(
|
|
5900
|
-
/* @__PURE__ */ (0,
|
|
5956
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
5901
5957
|
"div",
|
|
5902
5958
|
{
|
|
5903
5959
|
"data-ohw-section-picker": "",
|
|
@@ -5907,12 +5963,12 @@ function SectionPickerOverlay({
|
|
|
5907
5963
|
role: "dialog",
|
|
5908
5964
|
"aria-label": "Choose a section",
|
|
5909
5965
|
children: [
|
|
5910
|
-
/* @__PURE__ */ (0,
|
|
5966
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
5911
5967
|
"div",
|
|
5912
5968
|
{
|
|
5913
5969
|
className: "pointer-events-auto fixed left-5 z-[2]",
|
|
5914
5970
|
style: { top: chromeClip.top + 20 },
|
|
5915
|
-
children: /* @__PURE__ */ (0,
|
|
5971
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
5916
5972
|
Button,
|
|
5917
5973
|
{
|
|
5918
5974
|
type: "button",
|
|
@@ -5921,14 +5977,14 @@ function SectionPickerOverlay({
|
|
|
5921
5977
|
className: "h-8 min-w-0 gap-1 border-border bg-background px-2 py-1.5 shadow-sm hover:bg-muted cursor-pointer",
|
|
5922
5978
|
onClick: onBack,
|
|
5923
5979
|
children: [
|
|
5924
|
-
/* @__PURE__ */ (0,
|
|
5980
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react10.ArrowLeft, { className: "size-4 shrink-0", "aria-hidden": true }),
|
|
5925
5981
|
"Back"
|
|
5926
5982
|
]
|
|
5927
5983
|
}
|
|
5928
5984
|
)
|
|
5929
5985
|
}
|
|
5930
5986
|
),
|
|
5931
|
-
/* @__PURE__ */ (0,
|
|
5987
|
+
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
5932
5988
|
"div",
|
|
5933
5989
|
{
|
|
5934
5990
|
className: "pointer-events-none fixed left-1/2 z-[2] rounded-lg px-4 py-3 text-xs leading-4 tracking-[0.18px] text-white shadow-md",
|
|
@@ -5941,7 +5997,7 @@ function SectionPickerOverlay({
|
|
|
5941
5997
|
children: "Click on section to select"
|
|
5942
5998
|
}
|
|
5943
5999
|
),
|
|
5944
|
-
!isOnTargetPage ? /* @__PURE__ */ (0,
|
|
6000
|
+
!isOnTargetPage ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
5945
6001
|
"div",
|
|
5946
6002
|
{
|
|
5947
6003
|
className: "pointer-events-none fixed left-1/2 z-[1] -translate-x-1/2 rounded-md px-3 py-2 text-sm text-muted-foreground shadow-sm",
|
|
@@ -5949,14 +6005,14 @@ function SectionPickerOverlay({
|
|
|
5949
6005
|
children: "Loading page preview\u2026"
|
|
5950
6006
|
}
|
|
5951
6007
|
) : null,
|
|
5952
|
-
isOnTargetPage && liveSections.length === 0 ? /* @__PURE__ */ (0,
|
|
6008
|
+
isOnTargetPage && liveSections.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "pointer-events-auto fixed inset-0 z-[1] flex items-center justify-center bg-muted/40", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-sm text-muted-foreground", children: "No sections found on this page." }) }) : null,
|
|
5953
6009
|
isOnTargetPage ? liveSections.map((section) => {
|
|
5954
6010
|
const rect = rects.get(section.id);
|
|
5955
6011
|
if (!rect || rect.width <= 0 || rect.height <= 0) return null;
|
|
5956
6012
|
const isSelected = selectedId === section.id;
|
|
5957
6013
|
const isHovered = hoveredId === section.id;
|
|
5958
6014
|
const isLit = isSelected || isHovered;
|
|
5959
|
-
return /* @__PURE__ */ (0,
|
|
6015
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
5960
6016
|
"button",
|
|
5961
6017
|
{
|
|
5962
6018
|
type: "button",
|
|
@@ -5971,7 +6027,7 @@ function SectionPickerOverlay({
|
|
|
5971
6027
|
"aria-label": `Select section ${section.label}`,
|
|
5972
6028
|
onClick: () => handleSelect(section),
|
|
5973
6029
|
children: [
|
|
5974
|
-
isLit ? /* @__PURE__ */ (0,
|
|
6030
|
+
isLit ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
5975
6031
|
"span",
|
|
5976
6032
|
{
|
|
5977
6033
|
className: "pointer-events-none absolute",
|
|
@@ -5984,13 +6040,13 @@ function SectionPickerOverlay({
|
|
|
5984
6040
|
"aria-hidden": true
|
|
5985
6041
|
}
|
|
5986
6042
|
) : null,
|
|
5987
|
-
isSelected ? /* @__PURE__ */ (0,
|
|
6043
|
+
isSelected ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
5988
6044
|
"span",
|
|
5989
6045
|
{
|
|
5990
6046
|
className: "absolute right-3 top-3 flex size-8 items-center justify-center rounded-full text-white",
|
|
5991
6047
|
style: { backgroundColor: "var(--ohw-primary, #0885fe)" },
|
|
5992
6048
|
"aria-hidden": true,
|
|
5993
|
-
children: /* @__PURE__ */ (0,
|
|
6049
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react10.Check, { className: "size-5" })
|
|
5994
6050
|
}
|
|
5995
6051
|
) : null
|
|
5996
6052
|
]
|
|
@@ -6170,7 +6226,7 @@ function useLinkModalState({
|
|
|
6170
6226
|
}
|
|
6171
6227
|
|
|
6172
6228
|
// src/ui/link-modal/LinkPopover.tsx
|
|
6173
|
-
var
|
|
6229
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
6174
6230
|
function postToParent(data) {
|
|
6175
6231
|
window.parent?.postMessage(data, "*");
|
|
6176
6232
|
}
|
|
@@ -6266,15 +6322,15 @@ function LinkPopover({
|
|
|
6266
6322
|
);
|
|
6267
6323
|
};
|
|
6268
6324
|
}, [open, sectionPickerActive]);
|
|
6269
|
-
return /* @__PURE__ */ (0,
|
|
6270
|
-
/* @__PURE__ */ (0,
|
|
6325
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
|
|
6326
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
6271
6327
|
Dialog2,
|
|
6272
6328
|
{
|
|
6273
6329
|
open: open && !sectionPickerActive,
|
|
6274
6330
|
onOpenChange: (next) => {
|
|
6275
6331
|
if (!next) onClose?.();
|
|
6276
6332
|
},
|
|
6277
|
-
children: /* @__PURE__ */ (0,
|
|
6333
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
6278
6334
|
DialogContent,
|
|
6279
6335
|
{
|
|
6280
6336
|
ref: panelRef,
|
|
@@ -6284,12 +6340,12 @@ function LinkPopover({
|
|
|
6284
6340
|
"data-ohw-bridge": "",
|
|
6285
6341
|
showCloseButton: false,
|
|
6286
6342
|
className: "gap-0 p-0 w-full max-w-[448px] pointer-events-auto z-[2147483646] overflow-visible",
|
|
6287
|
-
children: /* @__PURE__ */ (0,
|
|
6343
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(LinkEditorPanel, { state, onClose })
|
|
6288
6344
|
}
|
|
6289
6345
|
)
|
|
6290
6346
|
}
|
|
6291
6347
|
),
|
|
6292
|
-
sectionPickerActive && state.selectedPage ? /* @__PURE__ */ (0,
|
|
6348
|
+
sectionPickerActive && state.selectedPage ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
6293
6349
|
SectionPickerOverlay,
|
|
6294
6350
|
{
|
|
6295
6351
|
pagePath: state.selectedPage.path,
|
|
@@ -7708,15 +7764,99 @@ function useNavItemDrag({
|
|
|
7708
7764
|
};
|
|
7709
7765
|
}
|
|
7710
7766
|
|
|
7767
|
+
// src/lib/carousel.ts
|
|
7768
|
+
var import_react9 = require("react");
|
|
7769
|
+
var CAROUSEL_ATTR = "data-ohw-carousel";
|
|
7770
|
+
var CAROUSEL_VALUE_ATTR = "data-ohw-carousel-value";
|
|
7771
|
+
var CAROUSEL_SLIDE_ATTR = "data-ohw-carousel-slide";
|
|
7772
|
+
var CAROUSEL_EVENT = "ohw:carousel-change";
|
|
7773
|
+
function listCarouselKeys() {
|
|
7774
|
+
const keys = /* @__PURE__ */ new Set();
|
|
7775
|
+
document.querySelectorAll(`[${CAROUSEL_ATTR}]`).forEach((el) => {
|
|
7776
|
+
const key = el.getAttribute("data-ohw-key");
|
|
7777
|
+
if (key) keys.add(key);
|
|
7778
|
+
});
|
|
7779
|
+
return [...keys];
|
|
7780
|
+
}
|
|
7781
|
+
function containersForKey(key) {
|
|
7782
|
+
return Array.from(
|
|
7783
|
+
document.querySelectorAll(`[${CAROUSEL_ATTR}][data-ohw-key="${CSS.escape(key)}"]`)
|
|
7784
|
+
);
|
|
7785
|
+
}
|
|
7786
|
+
function isCarouselKey(key) {
|
|
7787
|
+
return containersForKey(key).length > 0;
|
|
7788
|
+
}
|
|
7789
|
+
function parseSlides(raw) {
|
|
7790
|
+
if (!raw) return [];
|
|
7791
|
+
try {
|
|
7792
|
+
const parsed = JSON.parse(raw);
|
|
7793
|
+
if (!Array.isArray(parsed)) return [];
|
|
7794
|
+
return parsed.filter((s) => Boolean(s) && typeof s === "object").map((s) => ({ src: String(s.src ?? ""), alt: String(s.alt ?? "") }));
|
|
7795
|
+
} catch {
|
|
7796
|
+
return [];
|
|
7797
|
+
}
|
|
7798
|
+
}
|
|
7799
|
+
function readCarouselValue(key) {
|
|
7800
|
+
const container = containersForKey(key)[0];
|
|
7801
|
+
if (!container) return [];
|
|
7802
|
+
const fromAttr = parseSlides(container.getAttribute(CAROUSEL_VALUE_ATTR));
|
|
7803
|
+
if (fromAttr.length > 0) return fromAttr;
|
|
7804
|
+
return Array.from(container.querySelectorAll(`[${CAROUSEL_SLIDE_ATTR}]`)).filter((slide) => slide.closest(`[${CAROUSEL_ATTR}]`) === container).sort((a, b) => slideIndex(a) - slideIndex(b)).map((slide) => {
|
|
7805
|
+
const img = slide instanceof HTMLImageElement ? slide : slide.querySelector("img");
|
|
7806
|
+
return { src: img?.src ?? "", alt: img?.alt ?? "" };
|
|
7807
|
+
});
|
|
7808
|
+
}
|
|
7809
|
+
function slideIndex(el) {
|
|
7810
|
+
const raw = el.getAttribute(CAROUSEL_SLIDE_ATTR);
|
|
7811
|
+
const n = raw ? parseInt(raw, 10) : NaN;
|
|
7812
|
+
return Number.isFinite(n) ? n : 0;
|
|
7813
|
+
}
|
|
7814
|
+
function applyCarouselValue(key, slides) {
|
|
7815
|
+
const value = JSON.stringify(slides);
|
|
7816
|
+
for (const container of containersForKey(key)) {
|
|
7817
|
+
if (container.getAttribute(CAROUSEL_VALUE_ATTR) === value) continue;
|
|
7818
|
+
container.setAttribute(CAROUSEL_VALUE_ATTR, value);
|
|
7819
|
+
container.dispatchEvent(
|
|
7820
|
+
new CustomEvent(CAROUSEL_EVENT, { detail: { images: slides } })
|
|
7821
|
+
);
|
|
7822
|
+
}
|
|
7823
|
+
}
|
|
7824
|
+
function applyCarouselNode(key, val) {
|
|
7825
|
+
if (!isCarouselKey(key)) return false;
|
|
7826
|
+
applyCarouselValue(key, parseSlides(val));
|
|
7827
|
+
return true;
|
|
7828
|
+
}
|
|
7829
|
+
function useOhwCarousel(key, initial) {
|
|
7830
|
+
const [images, setImages] = (0, import_react9.useState)(initial);
|
|
7831
|
+
(0, import_react9.useEffect)(() => {
|
|
7832
|
+
const el = document.querySelector(
|
|
7833
|
+
`[${CAROUSEL_ATTR}][data-ohw-key="${CSS.escape(key)}"]`
|
|
7834
|
+
);
|
|
7835
|
+
if (!el) return;
|
|
7836
|
+
const onChange = (e) => {
|
|
7837
|
+
const detail = e.detail;
|
|
7838
|
+
if (Array.isArray(detail?.images)) setImages(detail.images);
|
|
7839
|
+
};
|
|
7840
|
+
el.addEventListener(CAROUSEL_EVENT, onChange);
|
|
7841
|
+
return () => el.removeEventListener(CAROUSEL_EVENT, onChange);
|
|
7842
|
+
}, [key]);
|
|
7843
|
+
const bind = {
|
|
7844
|
+
[CAROUSEL_ATTR]: "",
|
|
7845
|
+
"data-ohw-key": key,
|
|
7846
|
+
[CAROUSEL_VALUE_ATTR]: JSON.stringify(images)
|
|
7847
|
+
};
|
|
7848
|
+
return { images, setImages, bind };
|
|
7849
|
+
}
|
|
7850
|
+
|
|
7711
7851
|
// src/ui/navbar-container-chrome.tsx
|
|
7712
|
-
var
|
|
7713
|
-
var
|
|
7852
|
+
var import_lucide_react11 = require("lucide-react");
|
|
7853
|
+
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
7714
7854
|
function NavbarContainerChrome({
|
|
7715
7855
|
rect,
|
|
7716
7856
|
onAdd
|
|
7717
7857
|
}) {
|
|
7718
7858
|
const chromeGap = 6;
|
|
7719
|
-
return /* @__PURE__ */ (0,
|
|
7859
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
7720
7860
|
"div",
|
|
7721
7861
|
{
|
|
7722
7862
|
"data-ohw-navbar-container-chrome": "",
|
|
@@ -7728,7 +7868,7 @@ function NavbarContainerChrome({
|
|
|
7728
7868
|
width: rect.width + chromeGap * 2,
|
|
7729
7869
|
height: rect.height + chromeGap * 2
|
|
7730
7870
|
},
|
|
7731
|
-
children: /* @__PURE__ */ (0,
|
|
7871
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
7732
7872
|
"button",
|
|
7733
7873
|
{
|
|
7734
7874
|
type: "button",
|
|
@@ -7745,7 +7885,7 @@ function NavbarContainerChrome({
|
|
|
7745
7885
|
e.stopPropagation();
|
|
7746
7886
|
onAdd();
|
|
7747
7887
|
},
|
|
7748
|
-
children: /* @__PURE__ */ (0,
|
|
7888
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react11.Plus, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
|
|
7749
7889
|
}
|
|
7750
7890
|
)
|
|
7751
7891
|
}
|
|
@@ -7754,7 +7894,7 @@ function NavbarContainerChrome({
|
|
|
7754
7894
|
|
|
7755
7895
|
// src/ui/drop-indicator.tsx
|
|
7756
7896
|
var React10 = __toESM(require("react"), 1);
|
|
7757
|
-
var
|
|
7897
|
+
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
7758
7898
|
var dropIndicatorVariants = cva(
|
|
7759
7899
|
"ov-gap-line pointer-events-none shrink-0 transition-opacity duration-150",
|
|
7760
7900
|
{
|
|
@@ -7778,7 +7918,7 @@ var dropIndicatorVariants = cva(
|
|
|
7778
7918
|
);
|
|
7779
7919
|
var DropIndicator = React10.forwardRef(
|
|
7780
7920
|
({ className, direction, state, ...props }, ref) => {
|
|
7781
|
-
return /* @__PURE__ */ (0,
|
|
7921
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
7782
7922
|
"div",
|
|
7783
7923
|
{
|
|
7784
7924
|
ref,
|
|
@@ -7795,7 +7935,7 @@ var DropIndicator = React10.forwardRef(
|
|
|
7795
7935
|
DropIndicator.displayName = "DropIndicator";
|
|
7796
7936
|
|
|
7797
7937
|
// src/ui/badge.tsx
|
|
7798
|
-
var
|
|
7938
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
7799
7939
|
var badgeVariants = cva(
|
|
7800
7940
|
"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",
|
|
7801
7941
|
{
|
|
@@ -7813,12 +7953,12 @@ var badgeVariants = cva(
|
|
|
7813
7953
|
}
|
|
7814
7954
|
);
|
|
7815
7955
|
function Badge({ className, variant, ...props }) {
|
|
7816
|
-
return /* @__PURE__ */ (0,
|
|
7956
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: cn(badgeVariants({ variant }), className), ...props });
|
|
7817
7957
|
}
|
|
7818
7958
|
|
|
7819
7959
|
// src/OhhwellsBridge.tsx
|
|
7820
|
-
var
|
|
7821
|
-
var
|
|
7960
|
+
var import_lucide_react12 = require("lucide-react");
|
|
7961
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
7822
7962
|
var PRIMARY2 = "#0885FE";
|
|
7823
7963
|
var IMAGE_FADE_MS = 300;
|
|
7824
7964
|
function runOpacityFade(el, onDone) {
|
|
@@ -7997,7 +8137,7 @@ function mountSchedulingWidget(insertAfter, notifyOnConnect = false, scheduleId,
|
|
|
7997
8137
|
const root = (0, import_client.createRoot)(container);
|
|
7998
8138
|
(0, import_react_dom2.flushSync)(() => {
|
|
7999
8139
|
root.render(
|
|
8000
|
-
/* @__PURE__ */ (0,
|
|
8140
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
8001
8141
|
SchedulingWidget,
|
|
8002
8142
|
{
|
|
8003
8143
|
notifyOnConnect,
|
|
@@ -8115,6 +8255,9 @@ function collectEditableNodes(extraContent) {
|
|
|
8115
8255
|
nodes.push({ key: `${key}${VIDEO_AUTOPLAY_SUFFIX}`, type: "video-setting", text: String(video.autoplay) });
|
|
8116
8256
|
nodes.push({ key: `${key}${VIDEO_MUTED_SUFFIX}`, type: "video-setting", text: String(video.muted) });
|
|
8117
8257
|
});
|
|
8258
|
+
for (const key of listCarouselKeys()) {
|
|
8259
|
+
nodes.push({ key, type: "carousel", text: JSON.stringify(readCarouselValue(key)) });
|
|
8260
|
+
}
|
|
8118
8261
|
const seen = /* @__PURE__ */ new Set();
|
|
8119
8262
|
return nodes.filter((node) => {
|
|
8120
8263
|
if (!node.key) return true;
|
|
@@ -8583,7 +8726,7 @@ function EditGlowChrome({
|
|
|
8583
8726
|
hideHandle = false
|
|
8584
8727
|
}) {
|
|
8585
8728
|
const GAP = SELECTION_CHROME_GAP2;
|
|
8586
|
-
return /* @__PURE__ */ (0,
|
|
8729
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
|
|
8587
8730
|
"div",
|
|
8588
8731
|
{
|
|
8589
8732
|
ref: elRef,
|
|
@@ -8598,7 +8741,7 @@ function EditGlowChrome({
|
|
|
8598
8741
|
zIndex: 2147483646
|
|
8599
8742
|
},
|
|
8600
8743
|
children: [
|
|
8601
|
-
/* @__PURE__ */ (0,
|
|
8744
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
8602
8745
|
"div",
|
|
8603
8746
|
{
|
|
8604
8747
|
style: {
|
|
@@ -8611,7 +8754,7 @@ function EditGlowChrome({
|
|
|
8611
8754
|
}
|
|
8612
8755
|
}
|
|
8613
8756
|
),
|
|
8614
|
-
reorderHrefKey && !hideHandle && /* @__PURE__ */ (0,
|
|
8757
|
+
reorderHrefKey && !hideHandle && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
8615
8758
|
"div",
|
|
8616
8759
|
{
|
|
8617
8760
|
"data-ohw-drag-handle-container": "",
|
|
@@ -8623,7 +8766,7 @@ function EditGlowChrome({
|
|
|
8623
8766
|
transform: "translate(calc(-100% - 7px), -50%)",
|
|
8624
8767
|
pointerEvents: dragDisabled ? "none" : "auto"
|
|
8625
8768
|
},
|
|
8626
|
-
children: /* @__PURE__ */ (0,
|
|
8769
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
8627
8770
|
DragHandle,
|
|
8628
8771
|
{
|
|
8629
8772
|
"aria-label": `Reorder ${reorderHrefKey}`,
|
|
@@ -8806,9 +8949,9 @@ function FloatingToolbar({
|
|
|
8806
8949
|
showEditLink,
|
|
8807
8950
|
onEditLink
|
|
8808
8951
|
}) {
|
|
8809
|
-
const localRef =
|
|
8810
|
-
const [measuredW, setMeasuredW] =
|
|
8811
|
-
const setRefs =
|
|
8952
|
+
const localRef = import_react10.default.useRef(null);
|
|
8953
|
+
const [measuredW, setMeasuredW] = import_react10.default.useState(330);
|
|
8954
|
+
const setRefs = import_react10.default.useCallback(
|
|
8812
8955
|
(node) => {
|
|
8813
8956
|
localRef.current = node;
|
|
8814
8957
|
if (typeof elRef === "function") elRef(node);
|
|
@@ -8820,7 +8963,7 @@ function FloatingToolbar({
|
|
|
8820
8963
|
},
|
|
8821
8964
|
[elRef]
|
|
8822
8965
|
);
|
|
8823
|
-
|
|
8966
|
+
import_react10.default.useLayoutEffect(() => {
|
|
8824
8967
|
const node = localRef.current;
|
|
8825
8968
|
if (!node) return;
|
|
8826
8969
|
const update = () => {
|
|
@@ -8833,7 +8976,7 @@ function FloatingToolbar({
|
|
|
8833
8976
|
return () => ro.disconnect();
|
|
8834
8977
|
}, [showEditLink, activeCommands]);
|
|
8835
8978
|
const { top, left, transform } = calcToolbarPos(rect, parentScroll, measuredW);
|
|
8836
|
-
return /* @__PURE__ */ (0,
|
|
8979
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
8837
8980
|
"div",
|
|
8838
8981
|
{
|
|
8839
8982
|
ref: setRefs,
|
|
@@ -8845,12 +8988,12 @@ function FloatingToolbar({
|
|
|
8845
8988
|
zIndex: 2147483647,
|
|
8846
8989
|
pointerEvents: "auto"
|
|
8847
8990
|
},
|
|
8848
|
-
children: /* @__PURE__ */ (0,
|
|
8849
|
-
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ (0,
|
|
8850
|
-
gi > 0 && /* @__PURE__ */ (0,
|
|
8991
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(CustomToolbar, { children: [
|
|
8992
|
+
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_react10.default.Fragment, { children: [
|
|
8993
|
+
gi > 0 && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(CustomToolbarDivider, {}),
|
|
8851
8994
|
btns.map((btn) => {
|
|
8852
8995
|
const isActive = activeCommands.has(btn.cmd);
|
|
8853
|
-
return /* @__PURE__ */ (0,
|
|
8996
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
8854
8997
|
CustomToolbarButton,
|
|
8855
8998
|
{
|
|
8856
8999
|
title: btn.title,
|
|
@@ -8859,7 +9002,7 @@ function FloatingToolbar({
|
|
|
8859
9002
|
e.preventDefault();
|
|
8860
9003
|
onCommand(btn.cmd);
|
|
8861
9004
|
},
|
|
8862
|
-
children: /* @__PURE__ */ (0,
|
|
9005
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
8863
9006
|
"svg",
|
|
8864
9007
|
{
|
|
8865
9008
|
width: "16",
|
|
@@ -8880,7 +9023,7 @@ function FloatingToolbar({
|
|
|
8880
9023
|
);
|
|
8881
9024
|
})
|
|
8882
9025
|
] }, gi)),
|
|
8883
|
-
showEditLink ? /* @__PURE__ */ (0,
|
|
9026
|
+
showEditLink ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
8884
9027
|
CustomToolbarButton,
|
|
8885
9028
|
{
|
|
8886
9029
|
type: "button",
|
|
@@ -8894,7 +9037,7 @@ function FloatingToolbar({
|
|
|
8894
9037
|
e.preventDefault();
|
|
8895
9038
|
e.stopPropagation();
|
|
8896
9039
|
},
|
|
8897
|
-
children: /* @__PURE__ */ (0,
|
|
9040
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react12.Link, { className: "size-4 shrink-0", "aria-hidden": true })
|
|
8898
9041
|
}
|
|
8899
9042
|
) : null
|
|
8900
9043
|
] })
|
|
@@ -8911,7 +9054,7 @@ function StateToggle({
|
|
|
8911
9054
|
states,
|
|
8912
9055
|
onStateChange
|
|
8913
9056
|
}) {
|
|
8914
|
-
return /* @__PURE__ */ (0,
|
|
9057
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
8915
9058
|
ToggleGroup,
|
|
8916
9059
|
{
|
|
8917
9060
|
"data-ohw-state-toggle": "",
|
|
@@ -8925,7 +9068,7 @@ function StateToggle({
|
|
|
8925
9068
|
left: rect.right - 8,
|
|
8926
9069
|
transform: "translateX(-100%)"
|
|
8927
9070
|
},
|
|
8928
|
-
children: states.map((state) => /* @__PURE__ */ (0,
|
|
9071
|
+
children: states.map((state) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ToggleGroupItem, { value: state, size: "sm", children: state }, state))
|
|
8929
9072
|
}
|
|
8930
9073
|
);
|
|
8931
9074
|
}
|
|
@@ -8952,8 +9095,8 @@ function OhhwellsBridge() {
|
|
|
8952
9095
|
const router = (0, import_navigation2.useRouter)();
|
|
8953
9096
|
const searchParams = (0, import_navigation2.useSearchParams)();
|
|
8954
9097
|
const isEditMode = isEditSessionActive();
|
|
8955
|
-
const [bridgeRoot, setBridgeRoot] = (0,
|
|
8956
|
-
(0,
|
|
9098
|
+
const [bridgeRoot, setBridgeRoot] = (0, import_react10.useState)(null);
|
|
9099
|
+
(0, import_react10.useEffect)(() => {
|
|
8957
9100
|
const figtreeFontId = "ohw-figtree-font";
|
|
8958
9101
|
if (!document.getElementById(figtreeFontId)) {
|
|
8959
9102
|
const preconnect1 = Object.assign(document.createElement("link"), { rel: "preconnect", href: "https://fonts.googleapis.com" });
|
|
@@ -8981,98 +9124,99 @@ function OhhwellsBridge() {
|
|
|
8981
9124
|
const subdomainFromQuery = searchParams.get("subdomain");
|
|
8982
9125
|
const subdomain = resolveSubdomain(subdomainFromQuery);
|
|
8983
9126
|
useLinkHrefGuardian(pathname, subdomain, isEditMode);
|
|
8984
|
-
const postToParent2 = (0,
|
|
9127
|
+
const postToParent2 = (0, import_react10.useCallback)((data) => {
|
|
8985
9128
|
if (typeof window !== "undefined" && window.parent !== window) {
|
|
8986
9129
|
window.parent.postMessage(data, "*");
|
|
8987
9130
|
}
|
|
8988
9131
|
}, []);
|
|
8989
|
-
const [fetchState, setFetchState] = (0,
|
|
8990
|
-
const autoSaveTimers = (0,
|
|
8991
|
-
const activeElRef = (0,
|
|
8992
|
-
const pointerHeldRef = (0,
|
|
8993
|
-
const selectedElRef = (0,
|
|
8994
|
-
const selectedHrefKeyRef = (0,
|
|
8995
|
-
const selectedFooterColAttrRef = (0,
|
|
8996
|
-
const originalContentRef = (0,
|
|
8997
|
-
const activeStateElRef = (0,
|
|
8998
|
-
const parentScrollRef = (0,
|
|
8999
|
-
const visibleViewportRef = (0,
|
|
9000
|
-
const [dialogPortalContainer, setDialogPortalContainer] = (0,
|
|
9001
|
-
const attachVisibleViewport = (0,
|
|
9132
|
+
const [fetchState, setFetchState] = (0, import_react10.useState)("idle");
|
|
9133
|
+
const autoSaveTimers = (0, import_react10.useRef)(/* @__PURE__ */ new Map());
|
|
9134
|
+
const activeElRef = (0, import_react10.useRef)(null);
|
|
9135
|
+
const pointerHeldRef = (0, import_react10.useRef)(false);
|
|
9136
|
+
const selectedElRef = (0, import_react10.useRef)(null);
|
|
9137
|
+
const selectedHrefKeyRef = (0, import_react10.useRef)(null);
|
|
9138
|
+
const selectedFooterColAttrRef = (0, import_react10.useRef)(null);
|
|
9139
|
+
const originalContentRef = (0, import_react10.useRef)(null);
|
|
9140
|
+
const activeStateElRef = (0, import_react10.useRef)(null);
|
|
9141
|
+
const parentScrollRef = (0, import_react10.useRef)(null);
|
|
9142
|
+
const visibleViewportRef = (0, import_react10.useRef)(null);
|
|
9143
|
+
const [dialogPortalContainer, setDialogPortalContainer] = (0, import_react10.useState)(null);
|
|
9144
|
+
const attachVisibleViewport = (0, import_react10.useCallback)((node) => {
|
|
9002
9145
|
visibleViewportRef.current = node;
|
|
9003
9146
|
setDialogPortalContainer(node);
|
|
9004
9147
|
if (node) applyVisibleViewport(node, parentScrollRef.current);
|
|
9005
9148
|
}, []);
|
|
9006
|
-
const toolbarElRef = (0,
|
|
9007
|
-
const glowElRef = (0,
|
|
9008
|
-
const hoveredImageRef = (0,
|
|
9009
|
-
const hoveredImageHasTextOverlapRef = (0,
|
|
9010
|
-
const dragOverElRef = (0,
|
|
9011
|
-
const [mediaHover, setMediaHover] = (0,
|
|
9012
|
-
const [
|
|
9013
|
-
const
|
|
9014
|
-
const
|
|
9015
|
-
const
|
|
9016
|
-
const
|
|
9017
|
-
const
|
|
9149
|
+
const toolbarElRef = (0, import_react10.useRef)(null);
|
|
9150
|
+
const glowElRef = (0, import_react10.useRef)(null);
|
|
9151
|
+
const hoveredImageRef = (0, import_react10.useRef)(null);
|
|
9152
|
+
const hoveredImageHasTextOverlapRef = (0, import_react10.useRef)(false);
|
|
9153
|
+
const dragOverElRef = (0, import_react10.useRef)(null);
|
|
9154
|
+
const [mediaHover, setMediaHover] = (0, import_react10.useState)(null);
|
|
9155
|
+
const [carouselHover, setCarouselHover] = (0, import_react10.useState)(null);
|
|
9156
|
+
const [uploadingRects, setUploadingRects] = (0, import_react10.useState)({});
|
|
9157
|
+
const hoveredGapRef = (0, import_react10.useRef)(null);
|
|
9158
|
+
const imageUnhoverTimerRef = (0, import_react10.useRef)(null);
|
|
9159
|
+
const imageShowTimerRef = (0, import_react10.useRef)(null);
|
|
9160
|
+
const editStylesRef = (0, import_react10.useRef)(null);
|
|
9161
|
+
const activateRef = (0, import_react10.useRef)(() => {
|
|
9018
9162
|
});
|
|
9019
|
-
const deactivateRef = (0,
|
|
9163
|
+
const deactivateRef = (0, import_react10.useRef)(() => {
|
|
9020
9164
|
});
|
|
9021
|
-
const selectRef = (0,
|
|
9165
|
+
const selectRef = (0, import_react10.useRef)(() => {
|
|
9022
9166
|
});
|
|
9023
|
-
const selectFrameRef = (0,
|
|
9167
|
+
const selectFrameRef = (0, import_react10.useRef)(() => {
|
|
9024
9168
|
});
|
|
9025
|
-
const deselectRef = (0,
|
|
9169
|
+
const deselectRef = (0, import_react10.useRef)(() => {
|
|
9026
9170
|
});
|
|
9027
|
-
const reselectNavigationItemRef = (0,
|
|
9171
|
+
const reselectNavigationItemRef = (0, import_react10.useRef)(() => {
|
|
9028
9172
|
});
|
|
9029
|
-
const commitNavigationTextEditRef = (0,
|
|
9173
|
+
const commitNavigationTextEditRef = (0, import_react10.useRef)(() => {
|
|
9030
9174
|
});
|
|
9031
|
-
const refreshActiveCommandsRef = (0,
|
|
9175
|
+
const refreshActiveCommandsRef = (0, import_react10.useRef)(() => {
|
|
9032
9176
|
});
|
|
9033
|
-
const postToParentRef = (0,
|
|
9177
|
+
const postToParentRef = (0, import_react10.useRef)(postToParent2);
|
|
9034
9178
|
postToParentRef.current = postToParent2;
|
|
9035
|
-
const sectionsLoadedRef = (0,
|
|
9036
|
-
const pendingScheduleConfigRequests = (0,
|
|
9037
|
-
const [toolbarRect, setToolbarRect] = (0,
|
|
9038
|
-
const [toolbarVariant, setToolbarVariant] = (0,
|
|
9039
|
-
const toolbarVariantRef = (0,
|
|
9179
|
+
const sectionsLoadedRef = (0, import_react10.useRef)(false);
|
|
9180
|
+
const pendingScheduleConfigRequests = (0, import_react10.useRef)([]);
|
|
9181
|
+
const [toolbarRect, setToolbarRect] = (0, import_react10.useState)(null);
|
|
9182
|
+
const [toolbarVariant, setToolbarVariant] = (0, import_react10.useState)("none");
|
|
9183
|
+
const toolbarVariantRef = (0, import_react10.useRef)("none");
|
|
9040
9184
|
toolbarVariantRef.current = toolbarVariant;
|
|
9041
|
-
const [selectedIsCta, setSelectedIsCta] = (0,
|
|
9042
|
-
const [reorderHrefKey, setReorderHrefKey] = (0,
|
|
9043
|
-
const [reorderDragDisabled, setReorderDragDisabled] = (0,
|
|
9044
|
-
const [toggleState, setToggleState] = (0,
|
|
9045
|
-
const [maxBadge, setMaxBadge] = (0,
|
|
9046
|
-
const [activeCommands, setActiveCommands] = (0,
|
|
9047
|
-
const [sectionGap, setSectionGap] = (0,
|
|
9048
|
-
const [toolbarShowEditLink, setToolbarShowEditLink] = (0,
|
|
9049
|
-
const hoveredNavContainerRef = (0,
|
|
9050
|
-
const [hoveredNavContainerRect, setHoveredNavContainerRect] = (0,
|
|
9051
|
-
const hoveredItemElRef = (0,
|
|
9052
|
-
const [hoveredItemRect, setHoveredItemRect] = (0,
|
|
9053
|
-
const siblingHintElRef = (0,
|
|
9054
|
-
const [siblingHintRect, setSiblingHintRect] = (0,
|
|
9055
|
-
const [siblingHintRects, setSiblingHintRects] = (0,
|
|
9056
|
-
const [isItemDragging, setIsItemDragging] = (0,
|
|
9057
|
-
const [isFooterFrameSelection, setIsFooterFrameSelection] = (0,
|
|
9058
|
-
const footerDragRef = (0,
|
|
9059
|
-
const [footerDropSlots, setFooterDropSlots] = (0,
|
|
9060
|
-
const [activeFooterDropIndex, setActiveFooterDropIndex] = (0,
|
|
9061
|
-
const [draggedItemRect, setDraggedItemRect] = (0,
|
|
9062
|
-
const footerPointerDragRef = (0,
|
|
9063
|
-
const suppressNextClickRef = (0,
|
|
9064
|
-
const suppressClickUntilRef = (0,
|
|
9065
|
-
const [linkPopover, setLinkPopover] = (0,
|
|
9066
|
-
const linkPopoverSessionRef = (0,
|
|
9067
|
-
const addNavAfterAnchorRef = (0,
|
|
9068
|
-
const editContentRef = (0,
|
|
9069
|
-
const [sitePages, setSitePages] = (0,
|
|
9070
|
-
const [sectionsByPath, setSectionsByPath] = (0,
|
|
9071
|
-
const sectionsPrefetchGenRef = (0,
|
|
9072
|
-
const setLinkPopoverRef = (0,
|
|
9073
|
-
const linkPopoverPanelRef = (0,
|
|
9074
|
-
const linkPopoverOpenRef = (0,
|
|
9075
|
-
const linkPopoverGraceUntilRef = (0,
|
|
9185
|
+
const [selectedIsCta, setSelectedIsCta] = (0, import_react10.useState)(false);
|
|
9186
|
+
const [reorderHrefKey, setReorderHrefKey] = (0, import_react10.useState)(null);
|
|
9187
|
+
const [reorderDragDisabled, setReorderDragDisabled] = (0, import_react10.useState)(false);
|
|
9188
|
+
const [toggleState, setToggleState] = (0, import_react10.useState)(null);
|
|
9189
|
+
const [maxBadge, setMaxBadge] = (0, import_react10.useState)(null);
|
|
9190
|
+
const [activeCommands, setActiveCommands] = (0, import_react10.useState)(/* @__PURE__ */ new Set());
|
|
9191
|
+
const [sectionGap, setSectionGap] = (0, import_react10.useState)(null);
|
|
9192
|
+
const [toolbarShowEditLink, setToolbarShowEditLink] = (0, import_react10.useState)(false);
|
|
9193
|
+
const hoveredNavContainerRef = (0, import_react10.useRef)(null);
|
|
9194
|
+
const [hoveredNavContainerRect, setHoveredNavContainerRect] = (0, import_react10.useState)(null);
|
|
9195
|
+
const hoveredItemElRef = (0, import_react10.useRef)(null);
|
|
9196
|
+
const [hoveredItemRect, setHoveredItemRect] = (0, import_react10.useState)(null);
|
|
9197
|
+
const siblingHintElRef = (0, import_react10.useRef)(null);
|
|
9198
|
+
const [siblingHintRect, setSiblingHintRect] = (0, import_react10.useState)(null);
|
|
9199
|
+
const [siblingHintRects, setSiblingHintRects] = (0, import_react10.useState)([]);
|
|
9200
|
+
const [isItemDragging, setIsItemDragging] = (0, import_react10.useState)(false);
|
|
9201
|
+
const [isFooterFrameSelection, setIsFooterFrameSelection] = (0, import_react10.useState)(false);
|
|
9202
|
+
const footerDragRef = (0, import_react10.useRef)(null);
|
|
9203
|
+
const [footerDropSlots, setFooterDropSlots] = (0, import_react10.useState)([]);
|
|
9204
|
+
const [activeFooterDropIndex, setActiveFooterDropIndex] = (0, import_react10.useState)(null);
|
|
9205
|
+
const [draggedItemRect, setDraggedItemRect] = (0, import_react10.useState)(null);
|
|
9206
|
+
const footerPointerDragRef = (0, import_react10.useRef)(null);
|
|
9207
|
+
const suppressNextClickRef = (0, import_react10.useRef)(false);
|
|
9208
|
+
const suppressClickUntilRef = (0, import_react10.useRef)(0);
|
|
9209
|
+
const [linkPopover, setLinkPopover] = (0, import_react10.useState)(null);
|
|
9210
|
+
const linkPopoverSessionRef = (0, import_react10.useRef)(null);
|
|
9211
|
+
const addNavAfterAnchorRef = (0, import_react10.useRef)(null);
|
|
9212
|
+
const editContentRef = (0, import_react10.useRef)({});
|
|
9213
|
+
const [sitePages, setSitePages] = (0, import_react10.useState)([]);
|
|
9214
|
+
const [sectionsByPath, setSectionsByPath] = (0, import_react10.useState)({});
|
|
9215
|
+
const sectionsPrefetchGenRef = (0, import_react10.useRef)(0);
|
|
9216
|
+
const setLinkPopoverRef = (0, import_react10.useRef)(setLinkPopover);
|
|
9217
|
+
const linkPopoverPanelRef = (0, import_react10.useRef)(null);
|
|
9218
|
+
const linkPopoverOpenRef = (0, import_react10.useRef)(false);
|
|
9219
|
+
const linkPopoverGraceUntilRef = (0, import_react10.useRef)(0);
|
|
9076
9220
|
setLinkPopoverRef.current = setLinkPopover;
|
|
9077
9221
|
linkPopoverSessionRef.current = linkPopover;
|
|
9078
9222
|
const {
|
|
@@ -9111,7 +9255,7 @@ function OhhwellsBridge() {
|
|
|
9111
9255
|
const bumpLinkPopoverGrace = () => {
|
|
9112
9256
|
linkPopoverGraceUntilRef.current = Date.now() + 350;
|
|
9113
9257
|
};
|
|
9114
|
-
const runSectionsPrefetch = (0,
|
|
9258
|
+
const runSectionsPrefetch = (0, import_react10.useCallback)((pages) => {
|
|
9115
9259
|
if (!isEditMode || shouldUseDevFixtures() || pages.length === 0) return;
|
|
9116
9260
|
const gen = ++sectionsPrefetchGenRef.current;
|
|
9117
9261
|
const paths = pages.map((p) => p.path);
|
|
@@ -9130,9 +9274,9 @@ function OhhwellsBridge() {
|
|
|
9130
9274
|
);
|
|
9131
9275
|
});
|
|
9132
9276
|
}, [isEditMode, pathname]);
|
|
9133
|
-
const runSectionsPrefetchRef = (0,
|
|
9277
|
+
const runSectionsPrefetchRef = (0, import_react10.useRef)(runSectionsPrefetch);
|
|
9134
9278
|
runSectionsPrefetchRef.current = runSectionsPrefetch;
|
|
9135
|
-
(0,
|
|
9279
|
+
(0, import_react10.useEffect)(() => {
|
|
9136
9280
|
if (!linkPopover) {
|
|
9137
9281
|
document.documentElement.removeAttribute("data-ohw-link-popover-open");
|
|
9138
9282
|
return;
|
|
@@ -9182,7 +9326,7 @@ function OhhwellsBridge() {
|
|
|
9182
9326
|
document.removeEventListener("touchmove", preventBackgroundScroll, scrollOpts);
|
|
9183
9327
|
};
|
|
9184
9328
|
}, [linkPopover, postToParent2]);
|
|
9185
|
-
(0,
|
|
9329
|
+
(0, import_react10.useEffect)(() => {
|
|
9186
9330
|
if (!isEditMode) return;
|
|
9187
9331
|
const useFixtures = shouldUseDevFixtures();
|
|
9188
9332
|
if (useFixtures) {
|
|
@@ -9206,14 +9350,14 @@ function OhhwellsBridge() {
|
|
|
9206
9350
|
if (!useFixtures) postToParent2({ type: "ow:request-site-pages" });
|
|
9207
9351
|
return () => window.removeEventListener("message", onSitePages);
|
|
9208
9352
|
}, [isEditMode, postToParent2]);
|
|
9209
|
-
(0,
|
|
9353
|
+
(0, import_react10.useEffect)(() => {
|
|
9210
9354
|
if (!isEditMode || shouldUseDevFixtures()) return;
|
|
9211
9355
|
void loadAllSectionsManifest().then((manifest) => {
|
|
9212
9356
|
if (Object.keys(manifest).length === 0) return;
|
|
9213
9357
|
setSectionsByPath((prev) => ({ ...manifest, ...prev }));
|
|
9214
9358
|
});
|
|
9215
9359
|
}, [isEditMode]);
|
|
9216
|
-
(0,
|
|
9360
|
+
(0, import_react10.useEffect)(() => {
|
|
9217
9361
|
const update = () => {
|
|
9218
9362
|
const el = activeElRef.current ?? selectedElRef.current;
|
|
9219
9363
|
if (el) setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
@@ -9237,10 +9381,10 @@ function OhhwellsBridge() {
|
|
|
9237
9381
|
vvp.removeEventListener("resize", update);
|
|
9238
9382
|
};
|
|
9239
9383
|
}, []);
|
|
9240
|
-
const refreshStateRules = (0,
|
|
9384
|
+
const refreshStateRules = (0, import_react10.useCallback)(() => {
|
|
9241
9385
|
editStylesRef.current?.forceHover && (editStylesRef.current.forceHover.textContent = collectStateRules());
|
|
9242
9386
|
}, []);
|
|
9243
|
-
const processConfigRequest = (0,
|
|
9387
|
+
const processConfigRequest = (0, import_react10.useCallback)((insertAfterVal) => {
|
|
9244
9388
|
const tracker = getSectionsTracker();
|
|
9245
9389
|
let entries = [];
|
|
9246
9390
|
try {
|
|
@@ -9263,7 +9407,7 @@ function OhhwellsBridge() {
|
|
|
9263
9407
|
}
|
|
9264
9408
|
window.postMessage({ type: "ow:schedule-config", insertAfter: insertAfterVal, scheduleId: null }, "*");
|
|
9265
9409
|
}, [isEditMode]);
|
|
9266
|
-
const deactivate = (0,
|
|
9410
|
+
const deactivate = (0, import_react10.useCallback)(() => {
|
|
9267
9411
|
const el = activeElRef.current;
|
|
9268
9412
|
if (!el) return;
|
|
9269
9413
|
const key = el.dataset.ohwKey;
|
|
@@ -9295,12 +9439,12 @@ function OhhwellsBridge() {
|
|
|
9295
9439
|
setToolbarShowEditLink(false);
|
|
9296
9440
|
postToParent2({ type: "ow:exit-edit" });
|
|
9297
9441
|
}, [postToParent2]);
|
|
9298
|
-
const clearSelectedAttr = (0,
|
|
9442
|
+
const clearSelectedAttr = (0, import_react10.useCallback)(() => {
|
|
9299
9443
|
document.querySelectorAll("[data-ohw-selected]").forEach((el) => {
|
|
9300
9444
|
el.removeAttribute("data-ohw-selected");
|
|
9301
9445
|
});
|
|
9302
9446
|
}, []);
|
|
9303
|
-
const deselect = (0,
|
|
9447
|
+
const deselect = (0, import_react10.useCallback)(() => {
|
|
9304
9448
|
clearSelectedAttr();
|
|
9305
9449
|
selectedElRef.current = null;
|
|
9306
9450
|
selectedHrefKeyRef.current = null;
|
|
@@ -9320,11 +9464,11 @@ function OhhwellsBridge() {
|
|
|
9320
9464
|
setToolbarVariant("none");
|
|
9321
9465
|
}
|
|
9322
9466
|
}, [clearSelectedAttr]);
|
|
9323
|
-
const markSelected = (0,
|
|
9467
|
+
const markSelected = (0, import_react10.useCallback)((el) => {
|
|
9324
9468
|
clearSelectedAttr();
|
|
9325
9469
|
el.setAttribute("data-ohw-selected", "");
|
|
9326
9470
|
}, [clearSelectedAttr]);
|
|
9327
|
-
const resolveHrefKeyElement = (0,
|
|
9471
|
+
const resolveHrefKeyElement = (0, import_react10.useCallback)((hrefKey) => {
|
|
9328
9472
|
if (isFooterHrefKey(hrefKey)) {
|
|
9329
9473
|
return document.querySelector(
|
|
9330
9474
|
`footer [data-ohw-href-key="${CSS.escape(hrefKey)}"]`
|
|
@@ -9339,7 +9483,7 @@ function OhhwellsBridge() {
|
|
|
9339
9483
|
`[data-ohw-href-key="${CSS.escape(hrefKey)}"]`
|
|
9340
9484
|
);
|
|
9341
9485
|
}, []);
|
|
9342
|
-
const resyncSelectedNavigationItem = (0,
|
|
9486
|
+
const resyncSelectedNavigationItem = (0, import_react10.useCallback)(() => {
|
|
9343
9487
|
const hrefKey = selectedHrefKeyRef.current;
|
|
9344
9488
|
if (hrefKey) {
|
|
9345
9489
|
const link = resolveHrefKeyElement(hrefKey);
|
|
@@ -9367,7 +9511,7 @@ function OhhwellsBridge() {
|
|
|
9367
9511
|
);
|
|
9368
9512
|
}
|
|
9369
9513
|
}, [resolveHrefKeyElement]);
|
|
9370
|
-
const reselectNavigationItem = (0,
|
|
9514
|
+
const reselectNavigationItem = (0, import_react10.useCallback)((navAnchor) => {
|
|
9371
9515
|
selectedElRef.current = navAnchor;
|
|
9372
9516
|
selectedHrefKeyRef.current = navAnchor.getAttribute("data-ohw-href-key");
|
|
9373
9517
|
selectedFooterColAttrRef.current = null;
|
|
@@ -9382,7 +9526,7 @@ function OhhwellsBridge() {
|
|
|
9382
9526
|
setToolbarShowEditLink(false);
|
|
9383
9527
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
9384
9528
|
}, [markSelected]);
|
|
9385
|
-
const commitNavigationTextEdit = (0,
|
|
9529
|
+
const commitNavigationTextEdit = (0, import_react10.useCallback)((navAnchor) => {
|
|
9386
9530
|
const el = activeElRef.current;
|
|
9387
9531
|
if (!el) return;
|
|
9388
9532
|
const key = el.dataset.ohwKey;
|
|
@@ -9409,7 +9553,7 @@ function OhhwellsBridge() {
|
|
|
9409
9553
|
postToParent2({ type: "ow:exit-edit" });
|
|
9410
9554
|
reselectNavigationItem(navAnchor);
|
|
9411
9555
|
}, [postToParent2, reselectNavigationItem]);
|
|
9412
|
-
const handleAddTopLevelNavItem = (0,
|
|
9556
|
+
const handleAddTopLevelNavItem = (0, import_react10.useCallback)(() => {
|
|
9413
9557
|
const items = listNavbarItems();
|
|
9414
9558
|
addNavAfterAnchorRef.current = items[items.length - 1] ?? null;
|
|
9415
9559
|
deselectRef.current();
|
|
@@ -9421,7 +9565,7 @@ function OhhwellsBridge() {
|
|
|
9421
9565
|
intent: "add-nav"
|
|
9422
9566
|
});
|
|
9423
9567
|
}, []);
|
|
9424
|
-
const clearFooterDragVisuals = (0,
|
|
9568
|
+
const clearFooterDragVisuals = (0, import_react10.useCallback)(() => {
|
|
9425
9569
|
footerDragRef.current = null;
|
|
9426
9570
|
setSiblingHintRects([]);
|
|
9427
9571
|
setFooterDropSlots([]);
|
|
@@ -9430,7 +9574,7 @@ function OhhwellsBridge() {
|
|
|
9430
9574
|
setIsItemDragging(false);
|
|
9431
9575
|
unlockFooterDragInteraction();
|
|
9432
9576
|
}, []);
|
|
9433
|
-
const refreshFooterDragVisuals = (0,
|
|
9577
|
+
const refreshFooterDragVisuals = (0, import_react10.useCallback)((session, activeSlot, clientX, clientY) => {
|
|
9434
9578
|
const dragged = session.draggedEl;
|
|
9435
9579
|
setDraggedItemRect(dragged.getBoundingClientRect());
|
|
9436
9580
|
if (typeof clientX === "number" && typeof clientY === "number") {
|
|
@@ -9455,13 +9599,13 @@ function OhhwellsBridge() {
|
|
|
9455
9599
|
const activeIdx = activeSlot ? slots.findIndex((s) => s.insertIndex === activeSlot.insertIndex) : -1;
|
|
9456
9600
|
setActiveFooterDropIndex(activeIdx >= 0 ? activeIdx : null);
|
|
9457
9601
|
}, []);
|
|
9458
|
-
const refreshFooterDragVisualsRef = (0,
|
|
9602
|
+
const refreshFooterDragVisualsRef = (0, import_react10.useRef)(refreshFooterDragVisuals);
|
|
9459
9603
|
refreshFooterDragVisualsRef.current = refreshFooterDragVisuals;
|
|
9460
|
-
const commitFooterDragRef = (0,
|
|
9604
|
+
const commitFooterDragRef = (0, import_react10.useRef)(() => {
|
|
9461
9605
|
});
|
|
9462
|
-
const beginFooterDragRef = (0,
|
|
9606
|
+
const beginFooterDragRef = (0, import_react10.useRef)(() => {
|
|
9463
9607
|
});
|
|
9464
|
-
const beginFooterDrag = (0,
|
|
9608
|
+
const beginFooterDrag = (0, import_react10.useCallback)(
|
|
9465
9609
|
(session) => {
|
|
9466
9610
|
const rect = session.draggedEl.getBoundingClientRect();
|
|
9467
9611
|
session.lastClientX = session.lastClientX || rect.left + rect.width / 2;
|
|
@@ -9481,7 +9625,7 @@ function OhhwellsBridge() {
|
|
|
9481
9625
|
[refreshFooterDragVisuals]
|
|
9482
9626
|
);
|
|
9483
9627
|
beginFooterDragRef.current = beginFooterDrag;
|
|
9484
|
-
const commitFooterDrag = (0,
|
|
9628
|
+
const commitFooterDrag = (0, import_react10.useCallback)(
|
|
9485
9629
|
(clientX, clientY) => {
|
|
9486
9630
|
const session = footerDragRef.current;
|
|
9487
9631
|
if (!session) {
|
|
@@ -9585,7 +9729,7 @@ function OhhwellsBridge() {
|
|
|
9585
9729
|
[clearFooterDragVisuals, resolveHrefKeyElement, resyncSelectedNavigationItem]
|
|
9586
9730
|
);
|
|
9587
9731
|
commitFooterDragRef.current = commitFooterDrag;
|
|
9588
|
-
const startFooterLinkDrag = (0,
|
|
9732
|
+
const startFooterLinkDrag = (0, import_react10.useCallback)(
|
|
9589
9733
|
(anchor, clientX, clientY, wasSelected) => {
|
|
9590
9734
|
const hrefKey = anchor.getAttribute("data-ohw-href-key");
|
|
9591
9735
|
if (!hrefKey || !isFooterHrefKey(hrefKey)) return false;
|
|
@@ -9606,7 +9750,7 @@ function OhhwellsBridge() {
|
|
|
9606
9750
|
},
|
|
9607
9751
|
[beginFooterDrag]
|
|
9608
9752
|
);
|
|
9609
|
-
const startFooterColumnDrag = (0,
|
|
9753
|
+
const startFooterColumnDrag = (0, import_react10.useCallback)(
|
|
9610
9754
|
(columnEl, clientX, clientY, wasSelected) => {
|
|
9611
9755
|
const columns = listFooterColumns();
|
|
9612
9756
|
const idx = columns.indexOf(columnEl);
|
|
@@ -9626,7 +9770,7 @@ function OhhwellsBridge() {
|
|
|
9626
9770
|
},
|
|
9627
9771
|
[beginFooterDrag]
|
|
9628
9772
|
);
|
|
9629
|
-
const handleItemDragStart = (0,
|
|
9773
|
+
const handleItemDragStart = (0, import_react10.useCallback)(
|
|
9630
9774
|
(e) => {
|
|
9631
9775
|
const selected = selectedElRef.current;
|
|
9632
9776
|
if (!selected) {
|
|
@@ -9646,7 +9790,7 @@ function OhhwellsBridge() {
|
|
|
9646
9790
|
},
|
|
9647
9791
|
[startFooterColumnDrag, startFooterLinkDrag, startNavLinkDrag]
|
|
9648
9792
|
);
|
|
9649
|
-
const handleItemDragEnd = (0,
|
|
9793
|
+
const handleItemDragEnd = (0, import_react10.useCallback)(
|
|
9650
9794
|
(e) => {
|
|
9651
9795
|
if (footerDragRef.current) {
|
|
9652
9796
|
const x = e?.clientX;
|
|
@@ -9672,7 +9816,7 @@ function OhhwellsBridge() {
|
|
|
9672
9816
|
},
|
|
9673
9817
|
[commitFooterDrag, commitNavDrag, navDragRef]
|
|
9674
9818
|
);
|
|
9675
|
-
const handleItemChromePointerDown = (0,
|
|
9819
|
+
const handleItemChromePointerDown = (0, import_react10.useCallback)((e) => {
|
|
9676
9820
|
if (e.button !== 0) return;
|
|
9677
9821
|
const selected = selectedElRef.current;
|
|
9678
9822
|
if (!selected) return;
|
|
@@ -9703,7 +9847,7 @@ function OhhwellsBridge() {
|
|
|
9703
9847
|
}
|
|
9704
9848
|
if (armNavPressFromChrome(selected, e.clientX, e.clientY, e.pointerId)) return;
|
|
9705
9849
|
}, [armNavPressFromChrome]);
|
|
9706
|
-
const handleItemChromeClick = (0,
|
|
9850
|
+
const handleItemChromeClick = (0, import_react10.useCallback)((clientX, clientY) => {
|
|
9707
9851
|
if (suppressNextClickRef.current || Date.now() < suppressClickUntilRef.current) {
|
|
9708
9852
|
suppressNextClickRef.current = false;
|
|
9709
9853
|
return;
|
|
@@ -9716,7 +9860,7 @@ function OhhwellsBridge() {
|
|
|
9716
9860
|
}, []);
|
|
9717
9861
|
reselectNavigationItemRef.current = reselectNavigationItem;
|
|
9718
9862
|
commitNavigationTextEditRef.current = commitNavigationTextEdit;
|
|
9719
|
-
const select = (0,
|
|
9863
|
+
const select = (0, import_react10.useCallback)((anchor) => {
|
|
9720
9864
|
if (!isNavigationItem(anchor)) return;
|
|
9721
9865
|
if (activeElRef.current) deactivate();
|
|
9722
9866
|
selectedElRef.current = anchor;
|
|
@@ -9742,7 +9886,7 @@ function OhhwellsBridge() {
|
|
|
9742
9886
|
setToolbarShowEditLink(false);
|
|
9743
9887
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
9744
9888
|
}, [deactivate, markSelected]);
|
|
9745
|
-
const selectFrame = (0,
|
|
9889
|
+
const selectFrame = (0, import_react10.useCallback)((el) => {
|
|
9746
9890
|
if (!isNavigationContainer(el)) return;
|
|
9747
9891
|
if (activeElRef.current) deactivate();
|
|
9748
9892
|
const isFooterColumn = el.hasAttribute("data-ohw-footer-col") || Boolean(el.closest("footer") && isInferredFooterGroup(el));
|
|
@@ -9770,7 +9914,7 @@ function OhhwellsBridge() {
|
|
|
9770
9914
|
setToolbarShowEditLink(false);
|
|
9771
9915
|
setActiveCommands(/* @__PURE__ */ new Set());
|
|
9772
9916
|
}, [deactivate, markSelected]);
|
|
9773
|
-
const activate = (0,
|
|
9917
|
+
const activate = (0, import_react10.useCallback)((el, options) => {
|
|
9774
9918
|
if (activeElRef.current === el) return;
|
|
9775
9919
|
clearSelectedAttr();
|
|
9776
9920
|
selectedElRef.current = null;
|
|
@@ -9835,7 +9979,7 @@ function OhhwellsBridge() {
|
|
|
9835
9979
|
selectRef.current = select;
|
|
9836
9980
|
selectFrameRef.current = selectFrame;
|
|
9837
9981
|
deselectRef.current = deselect;
|
|
9838
|
-
(0,
|
|
9982
|
+
(0, import_react10.useLayoutEffect)(() => {
|
|
9839
9983
|
if (!subdomain || isEditMode) {
|
|
9840
9984
|
setFetchState("done");
|
|
9841
9985
|
return;
|
|
@@ -9845,6 +9989,7 @@ function OhhwellsBridge() {
|
|
|
9845
9989
|
for (const [key, val] of Object.entries(content)) {
|
|
9846
9990
|
if (key === "__ohw_sections") continue;
|
|
9847
9991
|
if (applyVideoSettingNode(key, val)) continue;
|
|
9992
|
+
if (applyCarouselNode(key, val)) continue;
|
|
9848
9993
|
document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
|
|
9849
9994
|
if (el.dataset.ohwEditable === "image") {
|
|
9850
9995
|
const img = el instanceof HTMLImageElement ? el : el.querySelector("img");
|
|
@@ -9905,7 +10050,7 @@ function OhhwellsBridge() {
|
|
|
9905
10050
|
cancelled = true;
|
|
9906
10051
|
};
|
|
9907
10052
|
}, [subdomain, isEditMode]);
|
|
9908
|
-
(0,
|
|
10053
|
+
(0, import_react10.useEffect)(() => {
|
|
9909
10054
|
if (!subdomain || isEditMode) return;
|
|
9910
10055
|
let debounceTimer = null;
|
|
9911
10056
|
let observer = null;
|
|
@@ -9918,6 +10063,7 @@ function OhhwellsBridge() {
|
|
|
9918
10063
|
for (const [key, val] of Object.entries(content)) {
|
|
9919
10064
|
if (key === "__ohw_sections") continue;
|
|
9920
10065
|
if (applyVideoSettingNode(key, val)) continue;
|
|
10066
|
+
if (applyCarouselNode(key, val)) continue;
|
|
9921
10067
|
document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
|
|
9922
10068
|
if (el.dataset.ohwEditable === "image") {
|
|
9923
10069
|
const img = el instanceof HTMLImageElement ? el : el.querySelector("img");
|
|
@@ -9955,16 +10101,16 @@ function OhhwellsBridge() {
|
|
|
9955
10101
|
if (debounceTimer) clearTimeout(debounceTimer);
|
|
9956
10102
|
};
|
|
9957
10103
|
}, [subdomain, isEditMode, pathname]);
|
|
9958
|
-
(0,
|
|
10104
|
+
(0, import_react10.useLayoutEffect)(() => {
|
|
9959
10105
|
const el = document.getElementById("ohw-loader");
|
|
9960
10106
|
if (!el) return;
|
|
9961
10107
|
const visible = Boolean(subdomain) && fetchState !== "done";
|
|
9962
10108
|
el.style.display = visible ? "flex" : "none";
|
|
9963
10109
|
}, [subdomain, fetchState]);
|
|
9964
|
-
(0,
|
|
10110
|
+
(0, import_react10.useEffect)(() => {
|
|
9965
10111
|
postToParent2({ type: "ow:navigation", path: pathname });
|
|
9966
10112
|
}, [pathname, postToParent2]);
|
|
9967
|
-
(0,
|
|
10113
|
+
(0, import_react10.useEffect)(() => {
|
|
9968
10114
|
if (!isEditMode) return;
|
|
9969
10115
|
if (linkPopoverSessionRef.current?.intent === "add-nav") return;
|
|
9970
10116
|
if (document.querySelector("[data-ohw-section-picker]")) return;
|
|
@@ -9972,7 +10118,7 @@ function OhhwellsBridge() {
|
|
|
9972
10118
|
deselectRef.current();
|
|
9973
10119
|
deactivateRef.current();
|
|
9974
10120
|
}, [pathname, isEditMode]);
|
|
9975
|
-
(0,
|
|
10121
|
+
(0, import_react10.useEffect)(() => {
|
|
9976
10122
|
const contentForNav = () => {
|
|
9977
10123
|
if (isEditMode) return editContentRef.current;
|
|
9978
10124
|
if (!subdomain) return {};
|
|
@@ -10037,7 +10183,7 @@ function OhhwellsBridge() {
|
|
|
10037
10183
|
observer?.disconnect();
|
|
10038
10184
|
};
|
|
10039
10185
|
}, [isEditMode, pathname, subdomain, fetchState, resyncSelectedNavigationItem]);
|
|
10040
|
-
(0,
|
|
10186
|
+
(0, import_react10.useEffect)(() => {
|
|
10041
10187
|
if (!isEditMode) return;
|
|
10042
10188
|
const measure = () => {
|
|
10043
10189
|
const h = document.body.scrollHeight;
|
|
@@ -10061,7 +10207,7 @@ function OhhwellsBridge() {
|
|
|
10061
10207
|
window.removeEventListener("resize", handleResize);
|
|
10062
10208
|
};
|
|
10063
10209
|
}, [pathname, isEditMode, postToParent2]);
|
|
10064
|
-
(0,
|
|
10210
|
+
(0, import_react10.useEffect)(() => {
|
|
10065
10211
|
if (!subdomainFromQuery || isEditMode) return;
|
|
10066
10212
|
const handleClick = (e) => {
|
|
10067
10213
|
const anchor = e.target.closest("a");
|
|
@@ -10077,7 +10223,7 @@ function OhhwellsBridge() {
|
|
|
10077
10223
|
document.addEventListener("click", handleClick, true);
|
|
10078
10224
|
return () => document.removeEventListener("click", handleClick, true);
|
|
10079
10225
|
}, [subdomainFromQuery, isEditMode, router]);
|
|
10080
|
-
(0,
|
|
10226
|
+
(0, import_react10.useEffect)(() => {
|
|
10081
10227
|
if (!isEditMode) {
|
|
10082
10228
|
editStylesRef.current?.base.remove();
|
|
10083
10229
|
editStylesRef.current?.forceHover.remove();
|
|
@@ -11142,6 +11288,7 @@ function OhhwellsBridge() {
|
|
|
11142
11288
|
continue;
|
|
11143
11289
|
}
|
|
11144
11290
|
if (applyVideoSettingNode(key, val)) continue;
|
|
11291
|
+
if (applyCarouselNode(key, val)) continue;
|
|
11145
11292
|
document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
|
|
11146
11293
|
if (el.dataset.ohwEditable === "image") {
|
|
11147
11294
|
const img = el instanceof HTMLImageElement ? el : el.querySelector("img");
|
|
@@ -11438,6 +11585,7 @@ function OhhwellsBridge() {
|
|
|
11438
11585
|
const handleDocMouseLeave = () => {
|
|
11439
11586
|
hoveredImageRef.current = null;
|
|
11440
11587
|
setMediaHover(null);
|
|
11588
|
+
setCarouselHover(null);
|
|
11441
11589
|
document.querySelectorAll("[data-ohw-state-hovered]").forEach((el) => el.removeAttribute("data-ohw-state-hovered"));
|
|
11442
11590
|
document.querySelectorAll("[data-ohw-hovered]").forEach((el) => el.removeAttribute("data-ohw-hovered"));
|
|
11443
11591
|
activeStateElRef.current = null;
|
|
@@ -11477,6 +11625,48 @@ function OhhwellsBridge() {
|
|
|
11477
11625
|
if (e.data?.type !== "ow:canvas-height" || typeof e.data.height !== "number") return;
|
|
11478
11626
|
document.documentElement.style.setProperty("--ohw-canvas-h", `${e.data.height}px`);
|
|
11479
11627
|
};
|
|
11628
|
+
const handleCarouselChange = (e) => {
|
|
11629
|
+
if (e.data?.type !== "ow:carousel-change") return;
|
|
11630
|
+
const { key, images } = e.data;
|
|
11631
|
+
if (!key || !Array.isArray(images)) return;
|
|
11632
|
+
const text = JSON.stringify(images);
|
|
11633
|
+
applyCarouselValue(key, images);
|
|
11634
|
+
editContentRef.current = { ...editContentRef.current, [key]: text };
|
|
11635
|
+
postToParentRef.current({ type: "ow:change", nodes: [{ key, text }] });
|
|
11636
|
+
setCarouselHover(null);
|
|
11637
|
+
};
|
|
11638
|
+
const findCarouselAtPoint = (clientX, clientY) => {
|
|
11639
|
+
const containers = Array.from(document.querySelectorAll(`[${CAROUSEL_ATTR}]`));
|
|
11640
|
+
for (let i = containers.length - 1; i >= 0; i--) {
|
|
11641
|
+
const r2 = containers[i].getBoundingClientRect();
|
|
11642
|
+
if (clientX >= r2.left && clientX <= r2.right && clientY >= r2.top && clientY <= r2.bottom) {
|
|
11643
|
+
return containers[i];
|
|
11644
|
+
}
|
|
11645
|
+
}
|
|
11646
|
+
return null;
|
|
11647
|
+
};
|
|
11648
|
+
const isPointOverEditable = (scope, clientX, clientY) => {
|
|
11649
|
+
const editables = scope.querySelectorAll("[data-ohw-editable], [data-ohw-href-key]");
|
|
11650
|
+
for (const el of editables) {
|
|
11651
|
+
const r2 = el.getBoundingClientRect();
|
|
11652
|
+
if (clientX >= r2.left && clientX <= r2.right && clientY >= r2.top && clientY <= r2.bottom) return true;
|
|
11653
|
+
}
|
|
11654
|
+
return false;
|
|
11655
|
+
};
|
|
11656
|
+
const handleCarouselHover = (e) => {
|
|
11657
|
+
const container = findCarouselAtPoint(e.clientX, e.clientY);
|
|
11658
|
+
const scope = container?.closest("[data-ohw-section]") ?? container?.parentElement ?? null;
|
|
11659
|
+
if (!container || !scope || isPointOverEditable(scope, e.clientX, e.clientY)) {
|
|
11660
|
+
setCarouselHover((prev) => prev ? null : prev);
|
|
11661
|
+
return;
|
|
11662
|
+
}
|
|
11663
|
+
const key = container.getAttribute("data-ohw-key") ?? "";
|
|
11664
|
+
if (!key) return;
|
|
11665
|
+
const r2 = getVisibleRect(container);
|
|
11666
|
+
setCarouselHover(
|
|
11667
|
+
(prev) => prev && prev.key === key && prev.rect.top === r2.top && prev.rect.left === r2.left && prev.rect.width === r2.width && prev.rect.height === r2.height ? prev : { key, rect: { top: r2.top, left: r2.left, width: r2.width, height: r2.height } }
|
|
11668
|
+
);
|
|
11669
|
+
};
|
|
11480
11670
|
const applyToolbarPos = (rect) => {
|
|
11481
11671
|
const ps = parentScrollRef.current;
|
|
11482
11672
|
const measuredW = toolbarElRef.current?.offsetWidth || 330;
|
|
@@ -11590,6 +11780,7 @@ function OhhwellsBridge() {
|
|
|
11590
11780
|
window.addEventListener("message", handleRemoveSchedulingSection);
|
|
11591
11781
|
window.addEventListener("message", handleImageUrl);
|
|
11592
11782
|
window.addEventListener("message", handleImageUploading);
|
|
11783
|
+
window.addEventListener("message", handleCarouselChange);
|
|
11593
11784
|
window.addEventListener("message", handleCanvasHeight);
|
|
11594
11785
|
window.addEventListener("message", handleParentScroll);
|
|
11595
11786
|
window.addEventListener("message", handlePointerSync);
|
|
@@ -11607,6 +11798,7 @@ function OhhwellsBridge() {
|
|
|
11607
11798
|
document.addEventListener("mouseover", handleMouseOver, true);
|
|
11608
11799
|
document.addEventListener("mouseout", handleMouseOut, true);
|
|
11609
11800
|
document.addEventListener("mousemove", handleMouseMove, true);
|
|
11801
|
+
document.addEventListener("mousemove", handleCarouselHover, true);
|
|
11610
11802
|
document.addEventListener("mouseleave", handleDocMouseLeave);
|
|
11611
11803
|
document.addEventListener("dragover", handleDragOver, true);
|
|
11612
11804
|
document.addEventListener("dragleave", handleDragLeave, true);
|
|
@@ -11622,6 +11814,7 @@ function OhhwellsBridge() {
|
|
|
11622
11814
|
document.removeEventListener("mouseover", handleMouseOver, true);
|
|
11623
11815
|
document.removeEventListener("mouseout", handleMouseOut, true);
|
|
11624
11816
|
document.removeEventListener("mousemove", handleMouseMove, true);
|
|
11817
|
+
document.removeEventListener("mousemove", handleCarouselHover, true);
|
|
11625
11818
|
document.removeEventListener("mouseleave", handleDocMouseLeave);
|
|
11626
11819
|
document.removeEventListener("dragover", handleDragOver, true);
|
|
11627
11820
|
document.removeEventListener("dragleave", handleDragLeave, true);
|
|
@@ -11637,6 +11830,7 @@ function OhhwellsBridge() {
|
|
|
11637
11830
|
window.removeEventListener("message", handleRemoveSchedulingSection);
|
|
11638
11831
|
window.removeEventListener("message", handleImageUrl);
|
|
11639
11832
|
window.removeEventListener("message", handleImageUploading);
|
|
11833
|
+
window.removeEventListener("message", handleCarouselChange);
|
|
11640
11834
|
window.removeEventListener("message", handleCanvasHeight);
|
|
11641
11835
|
window.removeEventListener("message", handleParentScroll);
|
|
11642
11836
|
window.removeEventListener("resize", handleViewportResize);
|
|
@@ -11651,7 +11845,7 @@ function OhhwellsBridge() {
|
|
|
11651
11845
|
if (imageShowTimerRef.current) clearTimeout(imageShowTimerRef.current);
|
|
11652
11846
|
};
|
|
11653
11847
|
}, [isEditMode, refreshStateRules]);
|
|
11654
|
-
(0,
|
|
11848
|
+
(0, import_react10.useEffect)(() => {
|
|
11655
11849
|
if (!isEditMode) return;
|
|
11656
11850
|
const THRESHOLD = 10;
|
|
11657
11851
|
const resolveWasSelected = (el) => {
|
|
@@ -11805,7 +11999,7 @@ function OhhwellsBridge() {
|
|
|
11805
11999
|
unlockFooterDragInteraction();
|
|
11806
12000
|
};
|
|
11807
12001
|
}, [isEditMode]);
|
|
11808
|
-
(0,
|
|
12002
|
+
(0, import_react10.useEffect)(() => {
|
|
11809
12003
|
const handler = (e) => {
|
|
11810
12004
|
if (e.data?.type !== "ow:request-schedule-config") return;
|
|
11811
12005
|
const insertAfterVal = e.data.insertAfter;
|
|
@@ -11821,7 +12015,7 @@ function OhhwellsBridge() {
|
|
|
11821
12015
|
window.addEventListener("message", handler);
|
|
11822
12016
|
return () => window.removeEventListener("message", handler);
|
|
11823
12017
|
}, [processConfigRequest]);
|
|
11824
|
-
(0,
|
|
12018
|
+
(0, import_react10.useEffect)(() => {
|
|
11825
12019
|
if (!isEditMode) return;
|
|
11826
12020
|
document.querySelectorAll("[data-ohw-active-state]").forEach((el) => {
|
|
11827
12021
|
el.removeAttribute("data-ohw-active-state");
|
|
@@ -11856,13 +12050,13 @@ function OhhwellsBridge() {
|
|
|
11856
12050
|
clearTimeout(timer);
|
|
11857
12051
|
};
|
|
11858
12052
|
}, [pathname, isEditMode, refreshStateRules, postToParent2]);
|
|
11859
|
-
(0,
|
|
12053
|
+
(0, import_react10.useEffect)(() => {
|
|
11860
12054
|
scrollToHashSectionWhenReady();
|
|
11861
12055
|
const onHashChange = () => scrollToHashSectionWhenReady();
|
|
11862
12056
|
window.addEventListener("hashchange", onHashChange);
|
|
11863
12057
|
return () => window.removeEventListener("hashchange", onHashChange);
|
|
11864
12058
|
}, [pathname]);
|
|
11865
|
-
const handleCommand = (0,
|
|
12059
|
+
const handleCommand = (0, import_react10.useCallback)((cmd) => {
|
|
11866
12060
|
const el = activeElRef.current;
|
|
11867
12061
|
const selBefore = window.getSelection();
|
|
11868
12062
|
let savedOffsets = null;
|
|
@@ -11898,7 +12092,7 @@ function OhhwellsBridge() {
|
|
|
11898
12092
|
if (el) setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
11899
12093
|
refreshActiveCommandsRef.current();
|
|
11900
12094
|
}, []);
|
|
11901
|
-
const handleStateChange = (0,
|
|
12095
|
+
const handleStateChange = (0, import_react10.useCallback)((state) => {
|
|
11902
12096
|
if (!activeStateElRef.current) return;
|
|
11903
12097
|
const el = activeStateElRef.current;
|
|
11904
12098
|
if (state === "Default") {
|
|
@@ -11911,11 +12105,11 @@ function OhhwellsBridge() {
|
|
|
11911
12105
|
}
|
|
11912
12106
|
setToggleState((prev) => prev ? { ...prev, activeState: state } : null);
|
|
11913
12107
|
}, [deactivate]);
|
|
11914
|
-
const closeLinkPopover = (0,
|
|
12108
|
+
const closeLinkPopover = (0, import_react10.useCallback)(() => {
|
|
11915
12109
|
addNavAfterAnchorRef.current = null;
|
|
11916
12110
|
setLinkPopover(null);
|
|
11917
12111
|
}, []);
|
|
11918
|
-
const openLinkPopoverForActive = (0,
|
|
12112
|
+
const openLinkPopoverForActive = (0, import_react10.useCallback)(() => {
|
|
11919
12113
|
const hrefCtx = getHrefKeyFromElement(activeElRef.current);
|
|
11920
12114
|
if (!hrefCtx) return;
|
|
11921
12115
|
bumpLinkPopoverGrace();
|
|
@@ -11926,7 +12120,7 @@ function OhhwellsBridge() {
|
|
|
11926
12120
|
});
|
|
11927
12121
|
deactivate();
|
|
11928
12122
|
}, [deactivate]);
|
|
11929
|
-
const openLinkPopoverForSelected = (0,
|
|
12123
|
+
const openLinkPopoverForSelected = (0, import_react10.useCallback)(() => {
|
|
11930
12124
|
const anchor = selectedElRef.current;
|
|
11931
12125
|
if (!anchor) return;
|
|
11932
12126
|
const key = anchor.getAttribute("data-ohw-href-key");
|
|
@@ -11939,7 +12133,7 @@ function OhhwellsBridge() {
|
|
|
11939
12133
|
});
|
|
11940
12134
|
deselect();
|
|
11941
12135
|
}, [deselect]);
|
|
11942
|
-
const handleLinkPopoverSubmit = (0,
|
|
12136
|
+
const handleLinkPopoverSubmit = (0, import_react10.useCallback)(
|
|
11943
12137
|
(target) => {
|
|
11944
12138
|
const session = linkPopoverSessionRef.current;
|
|
11945
12139
|
if (!session) return;
|
|
@@ -11998,13 +12192,19 @@ function OhhwellsBridge() {
|
|
|
11998
12192
|
const showEditLink = toolbarShowEditLink;
|
|
11999
12193
|
const currentSections = sectionsByPath[pathname] ?? [];
|
|
12000
12194
|
linkPopoverOpenRef.current = linkPopover !== null;
|
|
12001
|
-
const handleMediaReplace = (0,
|
|
12195
|
+
const handleMediaReplace = (0, import_react10.useCallback)(
|
|
12002
12196
|
(key) => {
|
|
12003
12197
|
postToParent2({ type: "ow:image-pick", key, elementType: mediaHover?.elementType ?? "image" });
|
|
12004
12198
|
},
|
|
12005
12199
|
[postToParent2, mediaHover?.elementType]
|
|
12006
12200
|
);
|
|
12007
|
-
const
|
|
12201
|
+
const handleEditCarousel = (0, import_react10.useCallback)(
|
|
12202
|
+
(key) => {
|
|
12203
|
+
postToParent2({ type: "ow:carousel-open", key, images: readCarouselValue(key) });
|
|
12204
|
+
},
|
|
12205
|
+
[postToParent2]
|
|
12206
|
+
);
|
|
12207
|
+
const handleMediaFadeOutComplete = (0, import_react10.useCallback)((key) => {
|
|
12008
12208
|
setUploadingRects((prev) => {
|
|
12009
12209
|
if (!(key in prev)) return prev;
|
|
12010
12210
|
const next = { ...prev };
|
|
@@ -12012,7 +12212,7 @@ function OhhwellsBridge() {
|
|
|
12012
12212
|
return next;
|
|
12013
12213
|
});
|
|
12014
12214
|
}, []);
|
|
12015
|
-
const handleVideoSettingsChange = (0,
|
|
12215
|
+
const handleVideoSettingsChange = (0, import_react10.useCallback)(
|
|
12016
12216
|
(key, settings) => {
|
|
12017
12217
|
document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
|
|
12018
12218
|
const video = getVideoEl(el);
|
|
@@ -12035,9 +12235,9 @@ function OhhwellsBridge() {
|
|
|
12035
12235
|
[postToParent2]
|
|
12036
12236
|
);
|
|
12037
12237
|
return bridgeRoot ? (0, import_react_dom3.createPortal)(
|
|
12038
|
-
/* @__PURE__ */ (0,
|
|
12039
|
-
/* @__PURE__ */ (0,
|
|
12040
|
-
Object.entries(uploadingRects).map(([key, { rect, fadingOut }]) => /* @__PURE__ */ (0,
|
|
12238
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
|
|
12239
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { ref: attachVisibleViewport, "data-ohw-visible-viewport": "", "aria-hidden": true }),
|
|
12240
|
+
Object.entries(uploadingRects).map(([key, { rect, fadingOut }]) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
12041
12241
|
MediaOverlay,
|
|
12042
12242
|
{
|
|
12043
12243
|
hover: { key, rect, elementType: "image", isDragOver: false, hasTextOverlap: false },
|
|
@@ -12048,7 +12248,7 @@ function OhhwellsBridge() {
|
|
|
12048
12248
|
},
|
|
12049
12249
|
`uploading-${key}`
|
|
12050
12250
|
)),
|
|
12051
|
-
mediaHover && !(mediaHover.key in uploadingRects) && /* @__PURE__ */ (0,
|
|
12251
|
+
mediaHover && !(mediaHover.key in uploadingRects) && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
12052
12252
|
MediaOverlay,
|
|
12053
12253
|
{
|
|
12054
12254
|
hover: mediaHover,
|
|
@@ -12057,10 +12257,11 @@ function OhhwellsBridge() {
|
|
|
12057
12257
|
onVideoSettingsChange: handleVideoSettingsChange
|
|
12058
12258
|
}
|
|
12059
12259
|
),
|
|
12060
|
-
|
|
12061
|
-
|
|
12062
|
-
|
|
12063
|
-
isItemDragging &&
|
|
12260
|
+
carouselHover && !linkPopover && !isItemDragging && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(CarouselOverlay, { hover: carouselHover, onEdit: handleEditCarousel }),
|
|
12261
|
+
siblingHintRect && !linkPopover && !isItemDragging && siblingHintRects.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ItemInteractionLayer, { rect: siblingHintRect, state: "sibling-hint" }),
|
|
12262
|
+
siblingHintRects.length > 0 && !linkPopover && !isItemDragging && siblingHintRects.map((rect, i) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ItemInteractionLayer, { rect, state: "sibling-hint" }, `sibling-hint-${i}`)),
|
|
12263
|
+
isItemDragging && draggedItemRect && selectedElRef.current !== footerDragRef.current?.draggedEl && selectedElRef.current !== navDragRef.current?.draggedEl && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ItemInteractionLayer, { rect: draggedItemRect, state: "dragging" }),
|
|
12264
|
+
isItemDragging && footerDropSlots.map((slot, i) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
12064
12265
|
"div",
|
|
12065
12266
|
{
|
|
12066
12267
|
className: "pointer-events-none fixed z-2147483646",
|
|
@@ -12070,7 +12271,7 @@ function OhhwellsBridge() {
|
|
|
12070
12271
|
width: slot.width,
|
|
12071
12272
|
height: slot.height
|
|
12072
12273
|
},
|
|
12073
|
-
children: /* @__PURE__ */ (0,
|
|
12274
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
12074
12275
|
DropIndicator,
|
|
12075
12276
|
{
|
|
12076
12277
|
direction: slot.direction,
|
|
@@ -12081,7 +12282,7 @@ function OhhwellsBridge() {
|
|
|
12081
12282
|
},
|
|
12082
12283
|
`footer-drop-${slot.direction}-${slot.columnIndex}-${slot.insertIndex}-${i}`
|
|
12083
12284
|
)),
|
|
12084
|
-
isItemDragging && navDropSlots.map((slot, i) => /* @__PURE__ */ (0,
|
|
12285
|
+
isItemDragging && navDropSlots.map((slot, i) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
12085
12286
|
"div",
|
|
12086
12287
|
{
|
|
12087
12288
|
className: "pointer-events-none fixed z-2147483646",
|
|
@@ -12091,7 +12292,7 @@ function OhhwellsBridge() {
|
|
|
12091
12292
|
width: slot.width,
|
|
12092
12293
|
height: slot.height
|
|
12093
12294
|
},
|
|
12094
|
-
children: /* @__PURE__ */ (0,
|
|
12295
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
12095
12296
|
DropIndicator,
|
|
12096
12297
|
{
|
|
12097
12298
|
direction: slot.direction,
|
|
@@ -12102,10 +12303,10 @@ function OhhwellsBridge() {
|
|
|
12102
12303
|
},
|
|
12103
12304
|
`nav-drop-${slot.direction}-${slot.parentId ?? "root"}-${slot.insertIndex}-${i}`
|
|
12104
12305
|
)),
|
|
12105
|
-
hoveredNavContainerRect && toolbarVariant !== "select-frame" && !linkPopover && !isItemDragging && /* @__PURE__ */ (0,
|
|
12106
|
-
hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */ (0,
|
|
12107
|
-
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isNavbarLinksContainer(selectedElRef.current) && /* @__PURE__ */ (0,
|
|
12108
|
-
toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame") && /* @__PURE__ */ (0,
|
|
12306
|
+
hoveredNavContainerRect && toolbarVariant !== "select-frame" && !linkPopover && !isItemDragging && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ItemInteractionLayer, { rect: hoveredNavContainerRect, state: "hover" }),
|
|
12307
|
+
hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ItemInteractionLayer, { rect: hoveredItemRect, state: "hover" }),
|
|
12308
|
+
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isNavbarLinksContainer(selectedElRef.current) && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(NavbarContainerChrome, { rect: toolbarRect, onAdd: handleAddTopLevelNavItem }),
|
|
12309
|
+
toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame") && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
12109
12310
|
ItemInteractionLayer,
|
|
12110
12311
|
{
|
|
12111
12312
|
rect: isItemDragging && draggedItemRect && (footerDragRef.current?.wasSelected || navDragRef.current?.wasSelected) ? draggedItemRect : toolbarRect,
|
|
@@ -12119,7 +12320,7 @@ function OhhwellsBridge() {
|
|
|
12119
12320
|
onItemPointerDown: handleItemChromePointerDown,
|
|
12120
12321
|
onItemClick: handleItemChromeClick,
|
|
12121
12322
|
itemDragSurface: !isFooterFrameSelection,
|
|
12122
|
-
toolbar: toolbarVariant === "link-action" && !isItemDragging ? /* @__PURE__ */ (0,
|
|
12323
|
+
toolbar: toolbarVariant === "link-action" && !isItemDragging ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
12123
12324
|
ItemActionToolbar,
|
|
12124
12325
|
{
|
|
12125
12326
|
onEditLink: openLinkPopoverForSelected,
|
|
@@ -12132,8 +12333,8 @@ function OhhwellsBridge() {
|
|
|
12132
12333
|
) : void 0
|
|
12133
12334
|
}
|
|
12134
12335
|
),
|
|
12135
|
-
toolbarRect && toolbarVariant === "rich-text" && !linkPopover && /* @__PURE__ */ (0,
|
|
12136
|
-
/* @__PURE__ */ (0,
|
|
12336
|
+
toolbarRect && toolbarVariant === "rich-text" && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
|
|
12337
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
12137
12338
|
EditGlowChrome,
|
|
12138
12339
|
{
|
|
12139
12340
|
rect: toolbarRect,
|
|
@@ -12143,7 +12344,7 @@ function OhhwellsBridge() {
|
|
|
12143
12344
|
hideHandle: isItemDragging
|
|
12144
12345
|
}
|
|
12145
12346
|
),
|
|
12146
|
-
/* @__PURE__ */ (0,
|
|
12347
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
12147
12348
|
FloatingToolbar,
|
|
12148
12349
|
{
|
|
12149
12350
|
rect: toolbarRect,
|
|
@@ -12156,7 +12357,7 @@ function OhhwellsBridge() {
|
|
|
12156
12357
|
}
|
|
12157
12358
|
)
|
|
12158
12359
|
] }),
|
|
12159
|
-
maxBadge && /* @__PURE__ */ (0,
|
|
12360
|
+
maxBadge && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
|
|
12160
12361
|
"div",
|
|
12161
12362
|
{
|
|
12162
12363
|
"data-ohw-max-badge": "",
|
|
@@ -12182,7 +12383,7 @@ function OhhwellsBridge() {
|
|
|
12182
12383
|
]
|
|
12183
12384
|
}
|
|
12184
12385
|
),
|
|
12185
|
-
toggleState && !linkPopover && /* @__PURE__ */ (0,
|
|
12386
|
+
toggleState && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
12186
12387
|
StateToggle,
|
|
12187
12388
|
{
|
|
12188
12389
|
rect: toggleState.rect,
|
|
@@ -12191,15 +12392,15 @@ function OhhwellsBridge() {
|
|
|
12191
12392
|
onStateChange: handleStateChange
|
|
12192
12393
|
}
|
|
12193
12394
|
),
|
|
12194
|
-
sectionGap && !linkPopover && /* @__PURE__ */ (0,
|
|
12395
|
+
sectionGap && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
|
|
12195
12396
|
"div",
|
|
12196
12397
|
{
|
|
12197
12398
|
"data-ohw-section-insert-line": "",
|
|
12198
12399
|
className: "fixed left-0 w-full z-2147483646 flex items-center pointer-events-none",
|
|
12199
12400
|
style: { top: sectionGap.y, transform: "translateY(-50%)" },
|
|
12200
12401
|
children: [
|
|
12201
|
-
/* @__PURE__ */ (0,
|
|
12202
|
-
/* @__PURE__ */ (0,
|
|
12402
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } }),
|
|
12403
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
12203
12404
|
Badge,
|
|
12204
12405
|
{
|
|
12205
12406
|
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",
|
|
@@ -12216,11 +12417,11 @@ function OhhwellsBridge() {
|
|
|
12216
12417
|
children: "Add Section"
|
|
12217
12418
|
}
|
|
12218
12419
|
),
|
|
12219
|
-
/* @__PURE__ */ (0,
|
|
12420
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } })
|
|
12220
12421
|
]
|
|
12221
12422
|
}
|
|
12222
12423
|
),
|
|
12223
|
-
linkPopover && dialogPortalContainer ? /* @__PURE__ */ (0,
|
|
12424
|
+
linkPopover && dialogPortalContainer ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
12224
12425
|
LinkPopover,
|
|
12225
12426
|
{
|
|
12226
12427
|
panelRef: linkPopoverPanelRef,
|
|
@@ -12269,6 +12470,7 @@ function OhhwellsBridge() {
|
|
|
12269
12470
|
isValidUrl,
|
|
12270
12471
|
parseTarget,
|
|
12271
12472
|
toggleVariants,
|
|
12473
|
+
useOhwCarousel,
|
|
12272
12474
|
validateUrlInput
|
|
12273
12475
|
});
|
|
12274
12476
|
//# sourceMappingURL=index.cjs.map
|