@ohhwells/bridge 0.1.49-next.115 → 0.1.50
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 +462 -1243
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +4 -28
- package/dist/index.d.ts +4 -28
- package/dist/index.js +268 -1043
- package/dist/index.js.map +1 -1
- package/dist/styles.css +0 -135
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
|
|
3
3
|
// src/OhhwellsBridge.tsx
|
|
4
|
-
import React11, { useCallback as useCallback5, useEffect as useEffect9, useLayoutEffect as useLayoutEffect3, useRef as useRef7, useState as
|
|
4
|
+
import React11, { useCallback as useCallback5, useEffect as useEffect9, useLayoutEffect as useLayoutEffect3, useRef as useRef7, useState as useState8 } from "react";
|
|
5
5
|
import { createRoot } from "react-dom/client";
|
|
6
6
|
import { flushSync } from "react-dom";
|
|
7
7
|
|
|
@@ -4338,116 +4338,22 @@ var CustomToolbarButton = React4.forwardRef(
|
|
|
4338
4338
|
CustomToolbarButton.displayName = "CustomToolbarButton";
|
|
4339
4339
|
|
|
4340
4340
|
// src/ui/item-action-toolbar.tsx
|
|
4341
|
-
import {
|
|
4342
|
-
import { Copy, CornerLeftUp, Link, MoreHorizontal, Plus, Trash2 } from "lucide-react";
|
|
4343
|
-
|
|
4344
|
-
// src/ui/dropdown-menu.tsx
|
|
4345
|
-
import { DropdownMenu as DropdownMenuPrimitive } from "radix-ui";
|
|
4346
|
-
import { jsx as jsx7 } from "react/jsx-runtime";
|
|
4347
|
-
function DropdownMenu({ ...props }) {
|
|
4348
|
-
return /* @__PURE__ */ jsx7(DropdownMenuPrimitive.Root, { "data-slot": "dropdown-menu", ...props });
|
|
4349
|
-
}
|
|
4350
|
-
function DropdownMenuTrigger({
|
|
4351
|
-
...props
|
|
4352
|
-
}) {
|
|
4353
|
-
return /* @__PURE__ */ jsx7(DropdownMenuPrimitive.Trigger, { "data-slot": "dropdown-menu-trigger", ...props });
|
|
4354
|
-
}
|
|
4355
|
-
function DropdownMenuGroup({
|
|
4356
|
-
className,
|
|
4357
|
-
...props
|
|
4358
|
-
}) {
|
|
4359
|
-
return /* @__PURE__ */ jsx7(
|
|
4360
|
-
DropdownMenuPrimitive.Group,
|
|
4361
|
-
{
|
|
4362
|
-
"data-slot": "dropdown-menu-group",
|
|
4363
|
-
className: cn("flex w-full flex-col items-start p-1", className),
|
|
4364
|
-
...props
|
|
4365
|
-
}
|
|
4366
|
-
);
|
|
4367
|
-
}
|
|
4368
|
-
function DropdownMenuContent({
|
|
4369
|
-
className,
|
|
4370
|
-
sideOffset = 6,
|
|
4371
|
-
...props
|
|
4372
|
-
}) {
|
|
4373
|
-
return /* @__PURE__ */ jsx7(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx7(
|
|
4374
|
-
DropdownMenuPrimitive.Content,
|
|
4375
|
-
{
|
|
4376
|
-
"data-slot": "dropdown-menu-content",
|
|
4377
|
-
"data-ohw-more-menu": "",
|
|
4378
|
-
sideOffset,
|
|
4379
|
-
className: cn(
|
|
4380
|
-
"z-[2147483647] flex w-56 min-w-32 flex-col items-center overflow-hidden rounded-[6px] border border-border bg-popover p-0 text-popover-foreground outline-none",
|
|
4381
|
-
"shadow-[0px_4px_6px_0px_rgba(0,0,0,0.1),0px_2px_4px_0px_rgba(0,0,0,0.1)]",
|
|
4382
|
-
"origin-[var(--radix-dropdown-menu-content-transform-origin)]",
|
|
4383
|
-
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
|
|
4384
|
-
"data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
|
|
4385
|
-
className
|
|
4386
|
-
),
|
|
4387
|
-
...props
|
|
4388
|
-
}
|
|
4389
|
-
) });
|
|
4390
|
-
}
|
|
4391
|
-
function DropdownMenuItem({
|
|
4392
|
-
className,
|
|
4393
|
-
inset,
|
|
4394
|
-
variant = "default",
|
|
4395
|
-
...props
|
|
4396
|
-
}) {
|
|
4397
|
-
return /* @__PURE__ */ jsx7(
|
|
4398
|
-
DropdownMenuPrimitive.Item,
|
|
4399
|
-
{
|
|
4400
|
-
"data-slot": "dropdown-menu-item",
|
|
4401
|
-
"data-inset": inset ? "" : void 0,
|
|
4402
|
-
"data-variant": variant,
|
|
4403
|
-
className: cn(
|
|
4404
|
-
"relative flex w-full min-w-32 cursor-pointer select-none items-center gap-2 rounded-[calc(var(--radius,0.5rem)-4px)] py-1.5 pl-8 pr-2 text-sm leading-5 outline-none",
|
|
4405
|
-
"text-popover-foreground",
|
|
4406
|
-
"focus:bg-muted data-[highlighted]:bg-muted",
|
|
4407
|
-
"data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
|
|
4408
|
-
"[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
|
|
4409
|
-
"[&_svg:not([class*=absolute])]:relative",
|
|
4410
|
-
// Leading icon — Figma absolute left-2 / top-1/2
|
|
4411
|
-
"[&>svg:first-child]:absolute [&>svg:first-child]:left-2 [&>svg:first-child]:top-1/2 [&>svg:first-child]:-translate-y-1/2",
|
|
4412
|
-
"data-[variant=destructive]:text-destructive",
|
|
4413
|
-
"data-[variant=destructive]:focus:bg-bg-destructive-10 data-[variant=destructive]:focus:text-destructive",
|
|
4414
|
-
"data-[variant=destructive]:data-[highlighted]:bg-bg-destructive-10 data-[variant=destructive]:data-[highlighted]:text-destructive",
|
|
4415
|
-
"data-[variant=destructive]:[&_svg]:text-destructive",
|
|
4416
|
-
inset && "pl-8",
|
|
4417
|
-
className
|
|
4418
|
-
),
|
|
4419
|
-
...props
|
|
4420
|
-
}
|
|
4421
|
-
);
|
|
4422
|
-
}
|
|
4423
|
-
function DropdownMenuSeparator({
|
|
4424
|
-
className,
|
|
4425
|
-
...props
|
|
4426
|
-
}) {
|
|
4427
|
-
return /* @__PURE__ */ jsx7(
|
|
4428
|
-
DropdownMenuPrimitive.Separator,
|
|
4429
|
-
{
|
|
4430
|
-
"data-slot": "dropdown-menu-separator",
|
|
4431
|
-
className: cn("h-px w-full bg-border", className),
|
|
4432
|
-
...props
|
|
4433
|
-
}
|
|
4434
|
-
);
|
|
4435
|
-
}
|
|
4341
|
+
import { Link, MoreHorizontal, Plus } from "lucide-react";
|
|
4436
4342
|
|
|
4437
4343
|
// src/ui/tooltip.tsx
|
|
4438
4344
|
import { Tooltip as TooltipPrimitive } from "radix-ui";
|
|
4439
|
-
import { jsx as
|
|
4345
|
+
import { jsx as jsx7 } from "react/jsx-runtime";
|
|
4440
4346
|
function TooltipProvider({
|
|
4441
4347
|
delayDuration = 0,
|
|
4442
4348
|
...props
|
|
4443
4349
|
}) {
|
|
4444
|
-
return /* @__PURE__ */
|
|
4350
|
+
return /* @__PURE__ */ jsx7(TooltipPrimitive.Provider, { "data-slot": "tooltip-provider", delayDuration, ...props });
|
|
4445
4351
|
}
|
|
4446
4352
|
function Tooltip({ ...props }) {
|
|
4447
|
-
return /* @__PURE__ */
|
|
4353
|
+
return /* @__PURE__ */ jsx7(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props });
|
|
4448
4354
|
}
|
|
4449
4355
|
function TooltipTrigger({ ...props }) {
|
|
4450
|
-
return /* @__PURE__ */
|
|
4356
|
+
return /* @__PURE__ */ jsx7(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
|
|
4451
4357
|
}
|
|
4452
4358
|
var arrowClassBySide = {
|
|
4453
4359
|
top: "before:bottom-0 before:left-1/2 before:-translate-x-1/2 before:translate-y-1/2",
|
|
@@ -4464,7 +4370,7 @@ function TooltipContent({
|
|
|
4464
4370
|
...props
|
|
4465
4371
|
}) {
|
|
4466
4372
|
const resolvedSide = side ?? "bottom";
|
|
4467
|
-
return /* @__PURE__ */
|
|
4373
|
+
return /* @__PURE__ */ jsx7(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx7(
|
|
4468
4374
|
TooltipPrimitive.Content,
|
|
4469
4375
|
{
|
|
4470
4376
|
"data-slot": "tooltip-content",
|
|
@@ -4487,7 +4393,7 @@ function TooltipContent({
|
|
|
4487
4393
|
}
|
|
4488
4394
|
|
|
4489
4395
|
// src/ui/item-action-toolbar.tsx
|
|
4490
|
-
import { jsx as
|
|
4396
|
+
import { jsx as jsx8, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
4491
4397
|
function ToolbarActionTooltip({
|
|
4492
4398
|
label,
|
|
4493
4399
|
side = "bottom",
|
|
@@ -4495,31 +4401,25 @@ function ToolbarActionTooltip({
|
|
|
4495
4401
|
buttonProps,
|
|
4496
4402
|
children
|
|
4497
4403
|
}) {
|
|
4498
|
-
const button = /* @__PURE__ */
|
|
4404
|
+
const button = /* @__PURE__ */ jsx8(CustomToolbarButton, { type: "button", "aria-label": label, disabled, ...buttonProps, children });
|
|
4499
4405
|
return /* @__PURE__ */ jsxs3(Tooltip, { children: [
|
|
4500
|
-
/* @__PURE__ */
|
|
4501
|
-
/* @__PURE__ */
|
|
4406
|
+
/* @__PURE__ */ jsx8(TooltipTrigger, { asChild: true, children: disabled ? /* @__PURE__ */ jsx8("span", { className: "inline-flex", children: button }) : button }),
|
|
4407
|
+
/* @__PURE__ */ jsx8(TooltipContent, { side, sideOffset: 9, children: label })
|
|
4502
4408
|
] });
|
|
4503
4409
|
}
|
|
4504
4410
|
function ItemActionToolbar({
|
|
4505
4411
|
onEditLink,
|
|
4506
4412
|
onAddItem,
|
|
4507
|
-
|
|
4508
|
-
onDuplicate,
|
|
4509
|
-
onDelete,
|
|
4413
|
+
onMore,
|
|
4510
4414
|
editLinkDisabled = false,
|
|
4511
4415
|
addItemDisabled = true,
|
|
4512
|
-
moreDisabled =
|
|
4513
|
-
selectParentDisabled = false,
|
|
4514
|
-
duplicateDisabled = false,
|
|
4515
|
-
deleteDisabled = false,
|
|
4416
|
+
moreDisabled = true,
|
|
4516
4417
|
showAddItem = true,
|
|
4517
4418
|
showMore = true,
|
|
4518
4419
|
tooltipSide = "bottom"
|
|
4519
4420
|
}) {
|
|
4520
|
-
|
|
4521
|
-
|
|
4522
|
-
/* @__PURE__ */ jsx9(
|
|
4421
|
+
return /* @__PURE__ */ jsx8(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsxs3(CustomToolbar, { children: [
|
|
4422
|
+
/* @__PURE__ */ jsx8(
|
|
4523
4423
|
ToolbarActionTooltip,
|
|
4524
4424
|
{
|
|
4525
4425
|
label: "Edit link",
|
|
@@ -4537,10 +4437,10 @@ function ItemActionToolbar({
|
|
|
4537
4437
|
e.stopPropagation();
|
|
4538
4438
|
}
|
|
4539
4439
|
},
|
|
4540
|
-
children: /* @__PURE__ */
|
|
4440
|
+
children: /* @__PURE__ */ jsx8(Link, { className: "size-4 shrink-0", "aria-hidden": true })
|
|
4541
4441
|
}
|
|
4542
4442
|
),
|
|
4543
|
-
showAddItem ? /* @__PURE__ */
|
|
4443
|
+
showAddItem ? /* @__PURE__ */ jsx8(
|
|
4544
4444
|
ToolbarActionTooltip,
|
|
4545
4445
|
{
|
|
4546
4446
|
label: "Add item",
|
|
@@ -4554,84 +4454,32 @@ function ItemActionToolbar({
|
|
|
4554
4454
|
onAddItem?.();
|
|
4555
4455
|
}
|
|
4556
4456
|
},
|
|
4557
|
-
children: /* @__PURE__ */
|
|
4457
|
+
children: /* @__PURE__ */ jsx8(Plus, { className: "size-4 shrink-0", "aria-hidden": true })
|
|
4558
4458
|
}
|
|
4559
4459
|
) : null,
|
|
4560
|
-
showMore ? /* @__PURE__ */
|
|
4561
|
-
|
|
4562
|
-
|
|
4563
|
-
|
|
4564
|
-
|
|
4565
|
-
|
|
4566
|
-
|
|
4567
|
-
disabled: moreDisabled,
|
|
4568
|
-
onMouseDown: (e) => {
|
|
4569
|
-
e.preventDefault();
|
|
4570
|
-
e.stopPropagation();
|
|
4571
|
-
},
|
|
4572
|
-
children: /* @__PURE__ */ jsx9(MoreHorizontal, { className: "size-4 shrink-0", "aria-hidden": true })
|
|
4573
|
-
}
|
|
4574
|
-
) }) }),
|
|
4575
|
-
/* @__PURE__ */ jsx9(TooltipContent, { side: tooltipSide, sideOffset: 9, children: "More" })
|
|
4576
|
-
] }),
|
|
4577
|
-
/* @__PURE__ */ jsxs3(
|
|
4578
|
-
DropdownMenuContent,
|
|
4579
|
-
{
|
|
4580
|
-
align: "end",
|
|
4581
|
-
side: "bottom",
|
|
4582
|
-
onCloseAutoFocus: (e) => e.preventDefault(),
|
|
4460
|
+
showMore ? /* @__PURE__ */ jsx8(
|
|
4461
|
+
ToolbarActionTooltip,
|
|
4462
|
+
{
|
|
4463
|
+
label: "More",
|
|
4464
|
+
side: tooltipSide,
|
|
4465
|
+
disabled: moreDisabled,
|
|
4466
|
+
buttonProps: {
|
|
4583
4467
|
onMouseDown: (e) => {
|
|
4468
|
+
if (moreDisabled) return;
|
|
4584
4469
|
e.preventDefault();
|
|
4585
4470
|
e.stopPropagation();
|
|
4586
|
-
|
|
4587
|
-
|
|
4588
|
-
|
|
4589
|
-
|
|
4590
|
-
|
|
4591
|
-
|
|
4592
|
-
disabled: selectParentDisabled,
|
|
4593
|
-
onSelect: () => onSelectParent?.(),
|
|
4594
|
-
children: [
|
|
4595
|
-
/* @__PURE__ */ jsx9(CornerLeftUp, { size: 12, "aria-hidden": true }),
|
|
4596
|
-
"Select parent"
|
|
4597
|
-
]
|
|
4598
|
-
}
|
|
4599
|
-
),
|
|
4600
|
-
/* @__PURE__ */ jsxs3(
|
|
4601
|
-
DropdownMenuItem,
|
|
4602
|
-
{
|
|
4603
|
-
disabled: duplicateDisabled,
|
|
4604
|
-
onSelect: () => onDuplicate?.(),
|
|
4605
|
-
children: [
|
|
4606
|
-
/* @__PURE__ */ jsx9(Copy, { size: 12, "aria-hidden": true }),
|
|
4607
|
-
"Duplicate"
|
|
4608
|
-
]
|
|
4609
|
-
}
|
|
4610
|
-
)
|
|
4611
|
-
] }),
|
|
4612
|
-
/* @__PURE__ */ jsx9(DropdownMenuSeparator, {}),
|
|
4613
|
-
/* @__PURE__ */ jsx9(DropdownMenuGroup, { children: /* @__PURE__ */ jsxs3(
|
|
4614
|
-
DropdownMenuItem,
|
|
4615
|
-
{
|
|
4616
|
-
variant: "destructive",
|
|
4617
|
-
disabled: deleteDisabled,
|
|
4618
|
-
onSelect: () => onDelete?.(),
|
|
4619
|
-
children: [
|
|
4620
|
-
/* @__PURE__ */ jsx9(Trash2, { size: 15, "aria-hidden": true }),
|
|
4621
|
-
"Delete"
|
|
4622
|
-
]
|
|
4623
|
-
}
|
|
4624
|
-
) })
|
|
4625
|
-
]
|
|
4626
|
-
}
|
|
4627
|
-
)
|
|
4628
|
-
] }) : null
|
|
4471
|
+
onMore?.();
|
|
4472
|
+
}
|
|
4473
|
+
},
|
|
4474
|
+
children: /* @__PURE__ */ jsx8(MoreHorizontal, { className: "size-4 shrink-0", "aria-hidden": true })
|
|
4475
|
+
}
|
|
4476
|
+
) : null
|
|
4629
4477
|
] }) });
|
|
4630
4478
|
}
|
|
4631
4479
|
|
|
4632
4480
|
// src/ui/item-interaction-layer.tsx
|
|
4633
4481
|
import * as React5 from "react";
|
|
4634
|
-
import { jsx as
|
|
4482
|
+
import { jsx as jsx9, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
4635
4483
|
var PRIMARY = "var(--ohw-primary, #0885FE)";
|
|
4636
4484
|
var FOCUS_RING = `0 0 0 4px color-mix(in srgb, ${PRIMARY} 12%, transparent)`;
|
|
4637
4485
|
var DRAG_SHADOW = "0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.1)";
|
|
@@ -4713,7 +4561,7 @@ function ClampedToolbarSlot({
|
|
|
4713
4561
|
window.removeEventListener("resize", clamp);
|
|
4714
4562
|
};
|
|
4715
4563
|
}, [placement, children]);
|
|
4716
|
-
return /* @__PURE__ */
|
|
4564
|
+
return /* @__PURE__ */ jsx9(
|
|
4717
4565
|
"div",
|
|
4718
4566
|
{
|
|
4719
4567
|
ref: slotRef,
|
|
@@ -4769,7 +4617,7 @@ function ItemInteractionLayer({
|
|
|
4769
4617
|
zIndex: getChromeZIndex(state)
|
|
4770
4618
|
},
|
|
4771
4619
|
children: [
|
|
4772
|
-
/* @__PURE__ */
|
|
4620
|
+
/* @__PURE__ */ jsx9(
|
|
4773
4621
|
"div",
|
|
4774
4622
|
{
|
|
4775
4623
|
"aria-hidden": true,
|
|
@@ -4777,7 +4625,7 @@ function ItemInteractionLayer({
|
|
|
4777
4625
|
style: getChromeStyle(state)
|
|
4778
4626
|
}
|
|
4779
4627
|
),
|
|
4780
|
-
itemDragEnabled && /* @__PURE__ */
|
|
4628
|
+
itemDragEnabled && /* @__PURE__ */ jsx9(
|
|
4781
4629
|
"div",
|
|
4782
4630
|
{
|
|
4783
4631
|
"data-ohw-item-drag-surface": "",
|
|
@@ -4793,14 +4641,14 @@ function ItemInteractionLayer({
|
|
|
4793
4641
|
}
|
|
4794
4642
|
}
|
|
4795
4643
|
),
|
|
4796
|
-
showDragHandle && /* @__PURE__ */
|
|
4644
|
+
showDragHandle && /* @__PURE__ */ jsx9(
|
|
4797
4645
|
"div",
|
|
4798
4646
|
{
|
|
4799
4647
|
"data-ohw-drag-handle-container": "",
|
|
4800
4648
|
className: "pointer-events-auto absolute left-0 top-1/2 z-10 -translate-x-[calc(100%+7px)] -translate-y-1/2",
|
|
4801
4649
|
style: isDragging ? { opacity: 0 } : void 0,
|
|
4802
4650
|
"aria-hidden": isDragging || void 0,
|
|
4803
|
-
children: /* @__PURE__ */
|
|
4651
|
+
children: /* @__PURE__ */ jsx9(
|
|
4804
4652
|
DragHandle,
|
|
4805
4653
|
{
|
|
4806
4654
|
draggable: !dragDisabled,
|
|
@@ -4830,8 +4678,8 @@ function ItemInteractionLayer({
|
|
|
4830
4678
|
)
|
|
4831
4679
|
}
|
|
4832
4680
|
),
|
|
4833
|
-
showToolbar && state === "active-top" && /* @__PURE__ */
|
|
4834
|
-
showToolbar && state === "active-bottom" && /* @__PURE__ */
|
|
4681
|
+
showToolbar && state === "active-top" && /* @__PURE__ */ jsx9(ClampedToolbarSlot, { placement: "top", children: toolbar }),
|
|
4682
|
+
showToolbar && state === "active-bottom" && /* @__PURE__ */ jsx9(ClampedToolbarSlot, { placement: "bottom", children: toolbar })
|
|
4835
4683
|
]
|
|
4836
4684
|
}
|
|
4837
4685
|
);
|
|
@@ -4844,7 +4692,7 @@ import { Film, ImageIcon, Pause, Play, Volume2, VolumeX } from "lucide-react";
|
|
|
4844
4692
|
// src/ui/button.tsx
|
|
4845
4693
|
import * as React6 from "react";
|
|
4846
4694
|
import { Slot } from "radix-ui";
|
|
4847
|
-
import { jsx as
|
|
4695
|
+
import { jsx as jsx10 } from "react/jsx-runtime";
|
|
4848
4696
|
var buttonVariants = cva(
|
|
4849
4697
|
"inline-flex items-center justify-center gap-1 whitespace-nowrap rounded-md text-sm font-medium transition-colors outline-none disabled:pointer-events-none disabled:opacity-50 min-w-[80px] px-3 py-2",
|
|
4850
4698
|
{
|
|
@@ -4868,7 +4716,7 @@ var buttonVariants = cva(
|
|
|
4868
4716
|
var Button = React6.forwardRef(
|
|
4869
4717
|
({ className, variant, size, asChild = false, ...props }, ref) => {
|
|
4870
4718
|
const Comp = asChild ? Slot.Root : "button";
|
|
4871
|
-
return /* @__PURE__ */
|
|
4719
|
+
return /* @__PURE__ */ jsx10(
|
|
4872
4720
|
Comp,
|
|
4873
4721
|
{
|
|
4874
4722
|
ref,
|
|
@@ -4882,7 +4730,7 @@ var Button = React6.forwardRef(
|
|
|
4882
4730
|
Button.displayName = "Button";
|
|
4883
4731
|
|
|
4884
4732
|
// src/ui/MediaOverlay.tsx
|
|
4885
|
-
import { Fragment as Fragment2, jsx as
|
|
4733
|
+
import { Fragment as Fragment2, jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
4886
4734
|
var MEDIA_UPLOAD_FADE_MS = 300;
|
|
4887
4735
|
var VIDEO_SETTINGS_BAR_INSET = 8;
|
|
4888
4736
|
var OVERLAY_BUTTON_STYLE = {
|
|
@@ -4940,7 +4788,7 @@ function MediaOverlay({
|
|
|
4940
4788
|
return () => anim.cancel();
|
|
4941
4789
|
}, [isUploading, fadingOut, onFadeOutComplete, hover.key]);
|
|
4942
4790
|
if (isUploading) {
|
|
4943
|
-
return /* @__PURE__ */
|
|
4791
|
+
return /* @__PURE__ */ jsx11(
|
|
4944
4792
|
"div",
|
|
4945
4793
|
{
|
|
4946
4794
|
ref: skeletonRef,
|
|
@@ -4949,7 +4797,7 @@ function MediaOverlay({
|
|
|
4949
4797
|
"data-ohw-media-skeleton": "",
|
|
4950
4798
|
"aria-hidden": true,
|
|
4951
4799
|
style: { ...box, pointerEvents: "none" },
|
|
4952
|
-
children: /* @__PURE__ */
|
|
4800
|
+
children: /* @__PURE__ */ jsx11("style", { children: SKELETON_CSS })
|
|
4953
4801
|
}
|
|
4954
4802
|
);
|
|
4955
4803
|
}
|
|
@@ -4969,7 +4817,7 @@ function MediaOverlay({
|
|
|
4969
4817
|
},
|
|
4970
4818
|
onClick: (e) => e.stopPropagation(),
|
|
4971
4819
|
children: [
|
|
4972
|
-
/* @__PURE__ */
|
|
4820
|
+
/* @__PURE__ */ jsx11(
|
|
4973
4821
|
Button,
|
|
4974
4822
|
{
|
|
4975
4823
|
"data-ohw-media-overlay": "",
|
|
@@ -4984,10 +4832,10 @@ function MediaOverlay({
|
|
|
4984
4832
|
e.stopPropagation();
|
|
4985
4833
|
onVideoSettingsChange?.(hover.key, { autoplay: !autoplay });
|
|
4986
4834
|
},
|
|
4987
|
-
children: autoplay ? /* @__PURE__ */
|
|
4835
|
+
children: autoplay ? /* @__PURE__ */ jsx11(Pause, { size: 14 }) : /* @__PURE__ */ jsx11(Play, { size: 14 })
|
|
4988
4836
|
}
|
|
4989
4837
|
),
|
|
4990
|
-
/* @__PURE__ */
|
|
4838
|
+
/* @__PURE__ */ jsx11(
|
|
4991
4839
|
Button,
|
|
4992
4840
|
{
|
|
4993
4841
|
"data-ohw-media-overlay": "",
|
|
@@ -5002,7 +4850,7 @@ function MediaOverlay({
|
|
|
5002
4850
|
e.stopPropagation();
|
|
5003
4851
|
onVideoSettingsChange?.(hover.key, { muted: !muted });
|
|
5004
4852
|
},
|
|
5005
|
-
children: muted ? /* @__PURE__ */
|
|
4853
|
+
children: muted ? /* @__PURE__ */ jsx11(VolumeX, { size: 14 }) : /* @__PURE__ */ jsx11(Volume2, { size: 14 })
|
|
5006
4854
|
}
|
|
5007
4855
|
)
|
|
5008
4856
|
]
|
|
@@ -5010,7 +4858,7 @@ function MediaOverlay({
|
|
|
5010
4858
|
) : null;
|
|
5011
4859
|
return /* @__PURE__ */ jsxs5(Fragment2, { children: [
|
|
5012
4860
|
settingsBar,
|
|
5013
|
-
/* @__PURE__ */
|
|
4861
|
+
/* @__PURE__ */ jsx11(
|
|
5014
4862
|
"div",
|
|
5015
4863
|
{
|
|
5016
4864
|
"data-ohw-bridge": "",
|
|
@@ -5034,18 +4882,14 @@ function MediaOverlay({
|
|
|
5034
4882
|
variant: "outline",
|
|
5035
4883
|
size: "sm",
|
|
5036
4884
|
className: "gap-1.5 cursor-pointer hover:bg-background",
|
|
5037
|
-
style:
|
|
5038
|
-
...OVERLAY_BUTTON_STYLE,
|
|
5039
|
-
// Don't let Replace steal clicks when text (e.g. nav) sits on top of this media.
|
|
5040
|
-
pointerEvents: hover.hasTextOverlap ? "none" : "auto"
|
|
5041
|
-
},
|
|
4885
|
+
style: OVERLAY_BUTTON_STYLE,
|
|
5042
4886
|
onMouseDown: (e) => e.preventDefault(),
|
|
5043
4887
|
onClick: (e) => {
|
|
5044
4888
|
e.stopPropagation();
|
|
5045
4889
|
onReplace(hover.key);
|
|
5046
4890
|
},
|
|
5047
4891
|
children: [
|
|
5048
|
-
isVideo ? /* @__PURE__ */
|
|
4892
|
+
isVideo ? /* @__PURE__ */ jsx11(Film, { size: 14 }) : /* @__PURE__ */ jsx11(ImageIcon, { size: 14 }),
|
|
5049
4893
|
isVideo ? "Replace video" : "Replace image"
|
|
5050
4894
|
]
|
|
5051
4895
|
}
|
|
@@ -5057,7 +4901,7 @@ function MediaOverlay({
|
|
|
5057
4901
|
|
|
5058
4902
|
// src/ui/CarouselOverlay.tsx
|
|
5059
4903
|
import { GalleryHorizontal } from "lucide-react";
|
|
5060
|
-
import { jsx as
|
|
4904
|
+
import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
5061
4905
|
var OVERLAY_BUTTON_STYLE2 = {
|
|
5062
4906
|
pointerEvents: "auto",
|
|
5063
4907
|
fontFamily: "Inter, sans-serif",
|
|
@@ -5069,7 +4913,7 @@ function CarouselOverlay({
|
|
|
5069
4913
|
onEdit
|
|
5070
4914
|
}) {
|
|
5071
4915
|
const { rect } = hover;
|
|
5072
|
-
return /* @__PURE__ */
|
|
4916
|
+
return /* @__PURE__ */ jsx12(
|
|
5073
4917
|
"div",
|
|
5074
4918
|
{
|
|
5075
4919
|
"data-ohw-bridge": "",
|
|
@@ -5101,7 +4945,7 @@ function CarouselOverlay({
|
|
|
5101
4945
|
onEdit(hover.key);
|
|
5102
4946
|
},
|
|
5103
4947
|
children: [
|
|
5104
|
-
/* @__PURE__ */
|
|
4948
|
+
/* @__PURE__ */ jsx12(GalleryHorizontal, { size: 14 }),
|
|
5105
4949
|
"Edit gallery"
|
|
5106
4950
|
]
|
|
5107
4951
|
}
|
|
@@ -5396,22 +5240,22 @@ import { useEffect as useEffect6 } from "react";
|
|
|
5396
5240
|
import * as React8 from "react";
|
|
5397
5241
|
import { Dialog as DialogPrimitive } from "radix-ui";
|
|
5398
5242
|
import { X } from "lucide-react";
|
|
5399
|
-
import { jsx as
|
|
5243
|
+
import { jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
5400
5244
|
function Dialog2({
|
|
5401
5245
|
...props
|
|
5402
5246
|
}) {
|
|
5403
|
-
return /* @__PURE__ */
|
|
5247
|
+
return /* @__PURE__ */ jsx13(DialogPrimitive.Root, { "data-slot": "dialog", ...props });
|
|
5404
5248
|
}
|
|
5405
5249
|
function DialogPortal({
|
|
5406
5250
|
...props
|
|
5407
5251
|
}) {
|
|
5408
|
-
return /* @__PURE__ */
|
|
5252
|
+
return /* @__PURE__ */ jsx13(DialogPrimitive.Portal, { ...props });
|
|
5409
5253
|
}
|
|
5410
5254
|
function DialogOverlay({
|
|
5411
5255
|
className,
|
|
5412
5256
|
...props
|
|
5413
5257
|
}) {
|
|
5414
|
-
return /* @__PURE__ */
|
|
5258
|
+
return /* @__PURE__ */ jsx13(
|
|
5415
5259
|
DialogPrimitive.Overlay,
|
|
5416
5260
|
{
|
|
5417
5261
|
"data-slot": "dialog-overlay",
|
|
@@ -5425,7 +5269,7 @@ var DialogContent = React8.forwardRef(
|
|
|
5425
5269
|
({ className, children, showCloseButton = true, container, ...props }, ref) => {
|
|
5426
5270
|
const positionMode = container ? "absolute" : "fixed";
|
|
5427
5271
|
return /* @__PURE__ */ jsxs7(DialogPortal, { container: container ?? void 0, children: [
|
|
5428
|
-
/* @__PURE__ */
|
|
5272
|
+
/* @__PURE__ */ jsx13(DialogOverlay, { className: cn(positionMode, "inset-0") }),
|
|
5429
5273
|
/* @__PURE__ */ jsxs7(
|
|
5430
5274
|
DialogPrimitive.Content,
|
|
5431
5275
|
{
|
|
@@ -5442,13 +5286,13 @@ var DialogContent = React8.forwardRef(
|
|
|
5442
5286
|
...props,
|
|
5443
5287
|
children: [
|
|
5444
5288
|
children,
|
|
5445
|
-
showCloseButton ? /* @__PURE__ */
|
|
5289
|
+
showCloseButton ? /* @__PURE__ */ jsx13(
|
|
5446
5290
|
DialogPrimitive.Close,
|
|
5447
5291
|
{
|
|
5448
5292
|
type: "button",
|
|
5449
5293
|
className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50",
|
|
5450
5294
|
"aria-label": "Close",
|
|
5451
|
-
children: /* @__PURE__ */
|
|
5295
|
+
children: /* @__PURE__ */ jsx13(X, { size: 16, "aria-hidden": true })
|
|
5452
5296
|
}
|
|
5453
5297
|
) : null
|
|
5454
5298
|
]
|
|
@@ -5462,13 +5306,13 @@ function DialogHeader({
|
|
|
5462
5306
|
className,
|
|
5463
5307
|
...props
|
|
5464
5308
|
}) {
|
|
5465
|
-
return /* @__PURE__ */
|
|
5309
|
+
return /* @__PURE__ */ jsx13("div", { className: cn("flex flex-col gap-1.5", className), ...props });
|
|
5466
5310
|
}
|
|
5467
5311
|
function DialogFooter({
|
|
5468
5312
|
className,
|
|
5469
5313
|
...props
|
|
5470
5314
|
}) {
|
|
5471
|
-
return /* @__PURE__ */
|
|
5315
|
+
return /* @__PURE__ */ jsx13(
|
|
5472
5316
|
"div",
|
|
5473
5317
|
{
|
|
5474
5318
|
className: cn("flex items-center justify-end gap-2", className),
|
|
@@ -5476,7 +5320,7 @@ function DialogFooter({
|
|
|
5476
5320
|
}
|
|
5477
5321
|
);
|
|
5478
5322
|
}
|
|
5479
|
-
var DialogTitle = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
|
|
5323
|
+
var DialogTitle = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
|
|
5480
5324
|
DialogPrimitive.Title,
|
|
5481
5325
|
{
|
|
5482
5326
|
ref,
|
|
@@ -5488,7 +5332,7 @@ var DialogTitle = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE
|
|
|
5488
5332
|
}
|
|
5489
5333
|
));
|
|
5490
5334
|
DialogTitle.displayName = DialogPrimitive.Title.displayName;
|
|
5491
|
-
var DialogDescription = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
|
|
5335
|
+
var DialogDescription = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
|
|
5492
5336
|
DialogPrimitive.Description,
|
|
5493
5337
|
{
|
|
5494
5338
|
ref,
|
|
@@ -5504,19 +5348,19 @@ import { Info, X as X3 } from "lucide-react";
|
|
|
5504
5348
|
|
|
5505
5349
|
// src/ui/link-modal/DestinationBreadcrumb.tsx
|
|
5506
5350
|
import { ArrowRight, File, GalleryVertical } from "lucide-react";
|
|
5507
|
-
import { jsx as
|
|
5351
|
+
import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
5508
5352
|
function DestinationBreadcrumb({
|
|
5509
5353
|
pageTitle,
|
|
5510
5354
|
sectionLabel
|
|
5511
5355
|
}) {
|
|
5512
5356
|
return /* @__PURE__ */ jsxs8("div", { className: "flex w-full flex-col gap-2", children: [
|
|
5513
|
-
/* @__PURE__ */
|
|
5357
|
+
/* @__PURE__ */ jsx14("p", { className: "text-sm font-medium! text-foreground m-0", children: "Destination" }),
|
|
5514
5358
|
/* @__PURE__ */ jsxs8("div", { className: "flex items-center gap-3", children: [
|
|
5515
5359
|
/* @__PURE__ */ jsxs8("div", { className: "flex items-center gap-2", children: [
|
|
5516
|
-
/* @__PURE__ */
|
|
5517
|
-
/* @__PURE__ */
|
|
5360
|
+
/* @__PURE__ */ jsx14(File, { size: 16, className: "shrink-0 text-foreground", "aria-hidden": true }),
|
|
5361
|
+
/* @__PURE__ */ jsx14("span", { className: "text-sm font-medium leading-none text-foreground!", children: pageTitle })
|
|
5518
5362
|
] }),
|
|
5519
|
-
/* @__PURE__ */
|
|
5363
|
+
/* @__PURE__ */ jsx14(
|
|
5520
5364
|
ArrowRight,
|
|
5521
5365
|
{
|
|
5522
5366
|
size: 16,
|
|
@@ -5525,7 +5369,7 @@ function DestinationBreadcrumb({
|
|
|
5525
5369
|
}
|
|
5526
5370
|
),
|
|
5527
5371
|
/* @__PURE__ */ jsxs8("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
|
|
5528
|
-
/* @__PURE__ */
|
|
5372
|
+
/* @__PURE__ */ jsx14(
|
|
5529
5373
|
GalleryVertical,
|
|
5530
5374
|
{
|
|
5531
5375
|
size: 16,
|
|
@@ -5533,7 +5377,7 @@ function DestinationBreadcrumb({
|
|
|
5533
5377
|
"aria-hidden": true
|
|
5534
5378
|
}
|
|
5535
5379
|
),
|
|
5536
|
-
/* @__PURE__ */
|
|
5380
|
+
/* @__PURE__ */ jsx14("span", { className: "truncate text-sm font-medium leading-none text-foreground", children: sectionLabel })
|
|
5537
5381
|
] })
|
|
5538
5382
|
] })
|
|
5539
5383
|
] });
|
|
@@ -5541,7 +5385,7 @@ function DestinationBreadcrumb({
|
|
|
5541
5385
|
|
|
5542
5386
|
// src/ui/link-modal/SectionTreeItem.tsx
|
|
5543
5387
|
import { GalleryVertical as GalleryVertical2 } from "lucide-react";
|
|
5544
|
-
import { jsx as
|
|
5388
|
+
import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
5545
5389
|
function SectionTreeItem({
|
|
5546
5390
|
section,
|
|
5547
5391
|
onSelect,
|
|
@@ -5549,7 +5393,7 @@ function SectionTreeItem({
|
|
|
5549
5393
|
}) {
|
|
5550
5394
|
const interactive = Boolean(onSelect);
|
|
5551
5395
|
return /* @__PURE__ */ jsxs9("div", { className: "flex h-9 w-full items-end pl-3", children: [
|
|
5552
|
-
/* @__PURE__ */
|
|
5396
|
+
/* @__PURE__ */ jsx15(
|
|
5553
5397
|
"div",
|
|
5554
5398
|
{
|
|
5555
5399
|
className: "mr-[-1px] h-9 w-2 shrink-0 rounded-bl-sm border-b border-l border-border mb-4",
|
|
@@ -5574,7 +5418,7 @@ function SectionTreeItem({
|
|
|
5574
5418
|
interactive && selected && "border-primary"
|
|
5575
5419
|
),
|
|
5576
5420
|
children: [
|
|
5577
|
-
/* @__PURE__ */
|
|
5421
|
+
/* @__PURE__ */ jsx15(
|
|
5578
5422
|
GalleryVertical2,
|
|
5579
5423
|
{
|
|
5580
5424
|
size: 16,
|
|
@@ -5582,7 +5426,7 @@ function SectionTreeItem({
|
|
|
5582
5426
|
"aria-hidden": true
|
|
5583
5427
|
}
|
|
5584
5428
|
),
|
|
5585
|
-
/* @__PURE__ */
|
|
5429
|
+
/* @__PURE__ */ jsx15("span", { className: "truncate text-sm font-normal leading-5 text-foreground", children: section.label })
|
|
5586
5430
|
]
|
|
5587
5431
|
}
|
|
5588
5432
|
)
|
|
@@ -5590,14 +5434,14 @@ function SectionTreeItem({
|
|
|
5590
5434
|
}
|
|
5591
5435
|
|
|
5592
5436
|
// src/ui/link-modal/UrlOrPageInput.tsx
|
|
5593
|
-
import { useEffect as useEffect3, useId as useId2, useRef as useRef4, useState as
|
|
5437
|
+
import { useEffect as useEffect3, useId as useId2, useRef as useRef4, useState as useState3 } from "react";
|
|
5594
5438
|
|
|
5595
5439
|
// src/ui/input.tsx
|
|
5596
5440
|
import * as React9 from "react";
|
|
5597
|
-
import { jsx as
|
|
5441
|
+
import { jsx as jsx16 } from "react/jsx-runtime";
|
|
5598
5442
|
var Input = React9.forwardRef(
|
|
5599
5443
|
({ className, type, ...props }, ref) => {
|
|
5600
|
-
return /* @__PURE__ */
|
|
5444
|
+
return /* @__PURE__ */ jsx16(
|
|
5601
5445
|
"input",
|
|
5602
5446
|
{
|
|
5603
5447
|
type,
|
|
@@ -5616,9 +5460,9 @@ Input.displayName = "Input";
|
|
|
5616
5460
|
|
|
5617
5461
|
// src/ui/label.tsx
|
|
5618
5462
|
import { Label as LabelPrimitive } from "radix-ui";
|
|
5619
|
-
import { jsx as
|
|
5463
|
+
import { jsx as jsx17 } from "react/jsx-runtime";
|
|
5620
5464
|
function Label({ className, ...props }) {
|
|
5621
|
-
return /* @__PURE__ */
|
|
5465
|
+
return /* @__PURE__ */ jsx17(
|
|
5622
5466
|
LabelPrimitive.Root,
|
|
5623
5467
|
{
|
|
5624
5468
|
"data-slot": "label",
|
|
@@ -5630,11 +5474,11 @@ function Label({ className, ...props }) {
|
|
|
5630
5474
|
|
|
5631
5475
|
// src/ui/link-modal/UrlOrPageInput.tsx
|
|
5632
5476
|
import { ChevronDown, File as File2, X as X2 } from "lucide-react";
|
|
5633
|
-
import { jsx as
|
|
5477
|
+
import { jsx as jsx18, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
5634
5478
|
function FieldChevron({
|
|
5635
5479
|
onClick
|
|
5636
5480
|
}) {
|
|
5637
|
-
return /* @__PURE__ */
|
|
5481
|
+
return /* @__PURE__ */ jsx18(
|
|
5638
5482
|
"button",
|
|
5639
5483
|
{
|
|
5640
5484
|
type: "button",
|
|
@@ -5642,7 +5486,7 @@ function FieldChevron({
|
|
|
5642
5486
|
onClick,
|
|
5643
5487
|
"aria-label": "Open page list",
|
|
5644
5488
|
tabIndex: -1,
|
|
5645
|
-
children: /* @__PURE__ */
|
|
5489
|
+
children: /* @__PURE__ */ jsx18(ChevronDown, { size: 16 })
|
|
5646
5490
|
}
|
|
5647
5491
|
);
|
|
5648
5492
|
}
|
|
@@ -5661,7 +5505,7 @@ function UrlOrPageInput({
|
|
|
5661
5505
|
const inputId = useId2();
|
|
5662
5506
|
const inputRef = useRef4(null);
|
|
5663
5507
|
const rootRef = useRef4(null);
|
|
5664
|
-
const [isFocused, setIsFocused] =
|
|
5508
|
+
const [isFocused, setIsFocused] = useState3(false);
|
|
5665
5509
|
useEffect3(() => {
|
|
5666
5510
|
if (!dropdownOpen) return;
|
|
5667
5511
|
const isOutside = (e) => {
|
|
@@ -5704,10 +5548,10 @@ function UrlOrPageInput({
|
|
|
5704
5548
|
urlError ? "border-destructive shadow-[0_0_0_1px_var(--ohw-destructive)]" : isFocused ? "border-primary shadow-[0_0_0_1px_var(--ohw-primary)]" : "border-input"
|
|
5705
5549
|
);
|
|
5706
5550
|
return /* @__PURE__ */ jsxs10("div", { className: "flex w-full flex-col gap-2 p-0", children: [
|
|
5707
|
-
/* @__PURE__ */
|
|
5551
|
+
/* @__PURE__ */ jsx18(Label, { htmlFor: inputId, className: cn(urlError && "text-destructive"), children: "Destination" }),
|
|
5708
5552
|
/* @__PURE__ */ jsxs10("div", { ref: rootRef, className: "relative w-full", children: [
|
|
5709
5553
|
/* @__PURE__ */ jsxs10("div", { "data-ohw-link-field": true, className: fieldClassName, children: [
|
|
5710
|
-
selectedPage ? /* @__PURE__ */
|
|
5554
|
+
selectedPage ? /* @__PURE__ */ jsx18("div", { className: "flex shrink-0 items-center pr-2", children: /* @__PURE__ */ jsx18(
|
|
5711
5555
|
File2,
|
|
5712
5556
|
{
|
|
5713
5557
|
size: 16,
|
|
@@ -5715,7 +5559,7 @@ function UrlOrPageInput({
|
|
|
5715
5559
|
"aria-hidden": true
|
|
5716
5560
|
}
|
|
5717
5561
|
) }) : null,
|
|
5718
|
-
readOnly ? /* @__PURE__ */
|
|
5562
|
+
readOnly ? /* @__PURE__ */ jsx18("span", { className: "min-w-0 flex-1 truncate text-sm leading-5 text-foreground", children: selectedPage?.title ?? value }) : /* @__PURE__ */ jsx18(
|
|
5719
5563
|
Input,
|
|
5720
5564
|
{
|
|
5721
5565
|
ref: inputRef,
|
|
@@ -5741,7 +5585,7 @@ function UrlOrPageInput({
|
|
|
5741
5585
|
)
|
|
5742
5586
|
}
|
|
5743
5587
|
),
|
|
5744
|
-
selectedPage && !readOnly ? /* @__PURE__ */
|
|
5588
|
+
selectedPage && !readOnly ? /* @__PURE__ */ jsx18(
|
|
5745
5589
|
"button",
|
|
5746
5590
|
{
|
|
5747
5591
|
type: "button",
|
|
@@ -5749,12 +5593,12 @@ function UrlOrPageInput({
|
|
|
5749
5593
|
onMouseDown: clearSelection,
|
|
5750
5594
|
"aria-label": "Clear selected page",
|
|
5751
5595
|
tabIndex: -1,
|
|
5752
|
-
children: /* @__PURE__ */
|
|
5596
|
+
children: /* @__PURE__ */ jsx18(X2, { size: 16, "aria-hidden": true })
|
|
5753
5597
|
}
|
|
5754
5598
|
) : null,
|
|
5755
|
-
!readOnly ? /* @__PURE__ */
|
|
5599
|
+
!readOnly ? /* @__PURE__ */ jsx18(FieldChevron, { onClick: toggleDropdown }) : null
|
|
5756
5600
|
] }),
|
|
5757
|
-
dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */
|
|
5601
|
+
dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */ jsx18(
|
|
5758
5602
|
"div",
|
|
5759
5603
|
{
|
|
5760
5604
|
"data-ohw-link-page-dropdown": "",
|
|
@@ -5767,8 +5611,8 @@ function UrlOrPageInput({
|
|
|
5767
5611
|
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",
|
|
5768
5612
|
onClick: () => onPageSelect(page),
|
|
5769
5613
|
children: [
|
|
5770
|
-
/* @__PURE__ */
|
|
5771
|
-
/* @__PURE__ */
|
|
5614
|
+
/* @__PURE__ */ jsx18(File2, { size: 16, className: "shrink-0", "aria-hidden": true }),
|
|
5615
|
+
/* @__PURE__ */ jsx18("span", { className: "truncate", children: page.title })
|
|
5772
5616
|
]
|
|
5773
5617
|
},
|
|
5774
5618
|
page.path
|
|
@@ -5776,34 +5620,34 @@ function UrlOrPageInput({
|
|
|
5776
5620
|
}
|
|
5777
5621
|
) : null
|
|
5778
5622
|
] }),
|
|
5779
|
-
urlError ? /* @__PURE__ */
|
|
5623
|
+
urlError ? /* @__PURE__ */ jsx18("p", { className: "text-sm font-medium text-destructive", children: urlError }) : null
|
|
5780
5624
|
] });
|
|
5781
5625
|
}
|
|
5782
5626
|
|
|
5783
5627
|
// src/ui/link-modal/LinkEditorPanel.tsx
|
|
5784
|
-
import { Fragment as Fragment3, jsx as
|
|
5628
|
+
import { Fragment as Fragment3, jsx as jsx19, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
5785
5629
|
function LinkEditorPanel({ state, onClose }) {
|
|
5786
5630
|
const isCancel = state.secondaryLabel === "Cancel" || state.secondaryLabel === "Back to sections";
|
|
5787
5631
|
return /* @__PURE__ */ jsxs11(Fragment3, { children: [
|
|
5788
|
-
/* @__PURE__ */
|
|
5632
|
+
/* @__PURE__ */ jsx19(DialogClose, { asChild: true, children: /* @__PURE__ */ jsx19(
|
|
5789
5633
|
"button",
|
|
5790
5634
|
{
|
|
5791
5635
|
type: "button",
|
|
5792
5636
|
className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50 h-7",
|
|
5793
5637
|
"aria-label": "Close",
|
|
5794
5638
|
onClick: onClose,
|
|
5795
|
-
children: /* @__PURE__ */
|
|
5639
|
+
children: /* @__PURE__ */ jsx19(X3, { size: 16, "aria-hidden": true })
|
|
5796
5640
|
}
|
|
5797
5641
|
) }),
|
|
5798
|
-
/* @__PURE__ */
|
|
5642
|
+
/* @__PURE__ */ jsx19(DialogHeader, { className: "w-full gap-1.5 p-6 pr-12", children: /* @__PURE__ */ jsx19(DialogTitle, { className: "m-0 w-full break-words", children: state.title }) }),
|
|
5799
5643
|
/* @__PURE__ */ jsxs11("div", { className: "flex w-full flex-col gap-3 px-6 pb-8 pt-1", children: [
|
|
5800
|
-
state.showBreadcrumb && state.selectedPage && state.selectedSection ? /* @__PURE__ */
|
|
5644
|
+
state.showBreadcrumb && state.selectedPage && state.selectedSection ? /* @__PURE__ */ jsx19(
|
|
5801
5645
|
DestinationBreadcrumb,
|
|
5802
5646
|
{
|
|
5803
5647
|
pageTitle: state.selectedPage.title,
|
|
5804
5648
|
sectionLabel: state.selectedSection.label
|
|
5805
5649
|
}
|
|
5806
|
-
) : /* @__PURE__ */
|
|
5650
|
+
) : /* @__PURE__ */ jsx19(
|
|
5807
5651
|
UrlOrPageInput,
|
|
5808
5652
|
{
|
|
5809
5653
|
value: state.searchValue,
|
|
@@ -5817,7 +5661,7 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
5817
5661
|
}
|
|
5818
5662
|
),
|
|
5819
5663
|
state.showChooseSection ? /* @__PURE__ */ jsxs11("div", { className: "flex flex-col justify-center gap-2", children: [
|
|
5820
|
-
/* @__PURE__ */
|
|
5664
|
+
/* @__PURE__ */ jsx19(
|
|
5821
5665
|
Button,
|
|
5822
5666
|
{
|
|
5823
5667
|
type: "button",
|
|
@@ -5829,14 +5673,14 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
5829
5673
|
}
|
|
5830
5674
|
),
|
|
5831
5675
|
/* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-1 text-sm text-muted-foreground", children: [
|
|
5832
|
-
/* @__PURE__ */
|
|
5833
|
-
/* @__PURE__ */
|
|
5676
|
+
/* @__PURE__ */ jsx19(Info, { size: 16, className: "shrink-0", "aria-hidden": true }),
|
|
5677
|
+
/* @__PURE__ */ jsx19("span", { children: "Pick a section this link should scroll to." })
|
|
5834
5678
|
] })
|
|
5835
5679
|
] }) : null,
|
|
5836
|
-
state.showSectionRow && state.selectedSection ? /* @__PURE__ */
|
|
5680
|
+
state.showSectionRow && state.selectedSection ? /* @__PURE__ */ jsx19(SectionTreeItem, { section: state.selectedSection, selected: true }) : null
|
|
5837
5681
|
] }),
|
|
5838
5682
|
/* @__PURE__ */ jsxs11(DialogFooter, { className: "w-full px-6 pb-6", children: [
|
|
5839
|
-
/* @__PURE__ */
|
|
5683
|
+
/* @__PURE__ */ jsx19(
|
|
5840
5684
|
Button,
|
|
5841
5685
|
{
|
|
5842
5686
|
type: "button",
|
|
@@ -5851,7 +5695,7 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
5851
5695
|
children: state.secondaryLabel
|
|
5852
5696
|
}
|
|
5853
5697
|
),
|
|
5854
|
-
/* @__PURE__ */
|
|
5698
|
+
/* @__PURE__ */ jsx19(
|
|
5855
5699
|
Button,
|
|
5856
5700
|
{
|
|
5857
5701
|
type: "button",
|
|
@@ -5870,11 +5714,11 @@ function LinkEditorPanel({ state, onClose }) {
|
|
|
5870
5714
|
}
|
|
5871
5715
|
|
|
5872
5716
|
// src/ui/link-modal/SectionPickerOverlay.tsx
|
|
5873
|
-
import { useCallback as useCallback2, useEffect as useEffect4, useMemo as useMemo2, useRef as useRef5, useState as
|
|
5717
|
+
import { useCallback as useCallback2, useEffect as useEffect4, useMemo as useMemo2, useRef as useRef5, useState as useState4 } from "react";
|
|
5874
5718
|
import { createPortal } from "react-dom";
|
|
5875
5719
|
import { ArrowLeft, Check } from "lucide-react";
|
|
5876
5720
|
import { usePathname, useRouter } from "next/navigation";
|
|
5877
|
-
import { jsx as
|
|
5721
|
+
import { jsx as jsx20, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
5878
5722
|
var DIM_OVERLAY = "rgba(0, 0, 0, 0.45)";
|
|
5879
5723
|
function rectsEqual(a, b) {
|
|
5880
5724
|
if (a.size !== b.size) return false;
|
|
@@ -5907,7 +5751,7 @@ function hitTestSectionId(x, y, sectionIds, rects) {
|
|
|
5907
5751
|
return null;
|
|
5908
5752
|
}
|
|
5909
5753
|
function useSectionRects(sectionIdsKey, enabled) {
|
|
5910
|
-
const [rects, setRects] =
|
|
5754
|
+
const [rects, setRects] = useState4(/* @__PURE__ */ new Map());
|
|
5911
5755
|
const sectionIds = useMemo2(
|
|
5912
5756
|
() => sectionIdsKey ? sectionIdsKey.split("\0") : [],
|
|
5913
5757
|
[sectionIdsKey]
|
|
@@ -5953,13 +5797,13 @@ function SectionPickerOverlay({
|
|
|
5953
5797
|
}) {
|
|
5954
5798
|
const router = useRouter();
|
|
5955
5799
|
const pathname = usePathname();
|
|
5956
|
-
const [selectedId, setSelectedId] =
|
|
5957
|
-
const [hoveredId, setHoveredId] =
|
|
5800
|
+
const [selectedId, setSelectedId] = useState4(null);
|
|
5801
|
+
const [hoveredId, setHoveredId] = useState4(null);
|
|
5958
5802
|
const pointerRef = useRef5(null);
|
|
5959
5803
|
const pointerScreenRef = useRef5(null);
|
|
5960
5804
|
const iframeOffsetTopRef = useRef5(null);
|
|
5961
5805
|
const sectionIdsRef = useRef5([]);
|
|
5962
|
-
const [chromeClip, setChromeClip] =
|
|
5806
|
+
const [chromeClip, setChromeClip] = useState4(
|
|
5963
5807
|
() => ({
|
|
5964
5808
|
top: 0,
|
|
5965
5809
|
bottom: typeof window !== "undefined" ? window.innerHeight : 0
|
|
@@ -6113,7 +5957,7 @@ function SectionPickerOverlay({
|
|
|
6113
5957
|
role: "dialog",
|
|
6114
5958
|
"aria-label": "Choose a section",
|
|
6115
5959
|
children: [
|
|
6116
|
-
/* @__PURE__ */
|
|
5960
|
+
/* @__PURE__ */ jsx20(
|
|
6117
5961
|
"div",
|
|
6118
5962
|
{
|
|
6119
5963
|
className: "pointer-events-auto fixed left-5 z-[2]",
|
|
@@ -6127,14 +5971,14 @@ function SectionPickerOverlay({
|
|
|
6127
5971
|
className: "h-8 min-w-0 gap-1 border-border bg-background px-2 py-1.5 shadow-sm hover:bg-muted cursor-pointer",
|
|
6128
5972
|
onClick: onBack,
|
|
6129
5973
|
children: [
|
|
6130
|
-
/* @__PURE__ */
|
|
5974
|
+
/* @__PURE__ */ jsx20(ArrowLeft, { className: "size-4 shrink-0", "aria-hidden": true }),
|
|
6131
5975
|
"Back"
|
|
6132
5976
|
]
|
|
6133
5977
|
}
|
|
6134
5978
|
)
|
|
6135
5979
|
}
|
|
6136
5980
|
),
|
|
6137
|
-
/* @__PURE__ */
|
|
5981
|
+
/* @__PURE__ */ jsx20(
|
|
6138
5982
|
"div",
|
|
6139
5983
|
{
|
|
6140
5984
|
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",
|
|
@@ -6147,7 +5991,7 @@ function SectionPickerOverlay({
|
|
|
6147
5991
|
children: "Click on section to select"
|
|
6148
5992
|
}
|
|
6149
5993
|
),
|
|
6150
|
-
!isOnTargetPage ? /* @__PURE__ */
|
|
5994
|
+
!isOnTargetPage ? /* @__PURE__ */ jsx20(
|
|
6151
5995
|
"div",
|
|
6152
5996
|
{
|
|
6153
5997
|
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",
|
|
@@ -6155,7 +5999,7 @@ function SectionPickerOverlay({
|
|
|
6155
5999
|
children: "Loading page preview\u2026"
|
|
6156
6000
|
}
|
|
6157
6001
|
) : null,
|
|
6158
|
-
isOnTargetPage && liveSections.length === 0 ? /* @__PURE__ */
|
|
6002
|
+
isOnTargetPage && liveSections.length === 0 ? /* @__PURE__ */ jsx20("div", { className: "pointer-events-auto fixed inset-0 z-[1] flex items-center justify-center bg-muted/40", children: /* @__PURE__ */ jsx20("p", { className: "text-sm text-muted-foreground", children: "No sections found on this page." }) }) : null,
|
|
6159
6003
|
isOnTargetPage ? liveSections.map((section) => {
|
|
6160
6004
|
const rect = rects.get(section.id);
|
|
6161
6005
|
if (!rect || rect.width <= 0 || rect.height <= 0) return null;
|
|
@@ -6177,7 +6021,7 @@ function SectionPickerOverlay({
|
|
|
6177
6021
|
"aria-label": `Select section ${section.label}`,
|
|
6178
6022
|
onClick: () => handleSelect(section),
|
|
6179
6023
|
children: [
|
|
6180
|
-
isLit ? /* @__PURE__ */
|
|
6024
|
+
isLit ? /* @__PURE__ */ jsx20(
|
|
6181
6025
|
"span",
|
|
6182
6026
|
{
|
|
6183
6027
|
className: "pointer-events-none absolute",
|
|
@@ -6190,13 +6034,13 @@ function SectionPickerOverlay({
|
|
|
6190
6034
|
"aria-hidden": true
|
|
6191
6035
|
}
|
|
6192
6036
|
) : null,
|
|
6193
|
-
isSelected ? /* @__PURE__ */
|
|
6037
|
+
isSelected ? /* @__PURE__ */ jsx20(
|
|
6194
6038
|
"span",
|
|
6195
6039
|
{
|
|
6196
6040
|
className: "absolute right-3 top-3 flex size-8 items-center justify-center rounded-full text-white",
|
|
6197
6041
|
style: { backgroundColor: "var(--ohw-primary, #0885fe)" },
|
|
6198
6042
|
"aria-hidden": true,
|
|
6199
|
-
children: /* @__PURE__ */
|
|
6043
|
+
children: /* @__PURE__ */ jsx20(Check, { className: "size-5" })
|
|
6200
6044
|
}
|
|
6201
6045
|
) : null
|
|
6202
6046
|
]
|
|
@@ -6212,7 +6056,7 @@ function SectionPickerOverlay({
|
|
|
6212
6056
|
}
|
|
6213
6057
|
|
|
6214
6058
|
// src/ui/link-modal/useLinkModalState.ts
|
|
6215
|
-
import { useCallback as useCallback3, useEffect as useEffect5, useMemo as useMemo3, useState as
|
|
6059
|
+
import { useCallback as useCallback3, useEffect as useEffect5, useMemo as useMemo3, useState as useState5 } from "react";
|
|
6216
6060
|
function useLinkModalState({
|
|
6217
6061
|
open,
|
|
6218
6062
|
mode,
|
|
@@ -6225,12 +6069,12 @@ function useLinkModalState({
|
|
|
6225
6069
|
onSubmit
|
|
6226
6070
|
}) {
|
|
6227
6071
|
const availablePages = useMemo3(() => pages, [pages]);
|
|
6228
|
-
const [searchValue, setSearchValue] =
|
|
6229
|
-
const [selectedPage, setSelectedPage] =
|
|
6230
|
-
const [selectedSection, setSelectedSection] =
|
|
6231
|
-
const [step, setStep] =
|
|
6232
|
-
const [dropdownOpen, setDropdownOpen] =
|
|
6233
|
-
const [urlError, setUrlError] =
|
|
6072
|
+
const [searchValue, setSearchValue] = useState5("");
|
|
6073
|
+
const [selectedPage, setSelectedPage] = useState5(null);
|
|
6074
|
+
const [selectedSection, setSelectedSection] = useState5(null);
|
|
6075
|
+
const [step, setStep] = useState5("input");
|
|
6076
|
+
const [dropdownOpen, setDropdownOpen] = useState5(false);
|
|
6077
|
+
const [urlError, setUrlError] = useState5("");
|
|
6234
6078
|
const reset = useCallback3(() => {
|
|
6235
6079
|
setSearchValue("");
|
|
6236
6080
|
setSelectedPage(null);
|
|
@@ -6376,7 +6220,7 @@ function useLinkModalState({
|
|
|
6376
6220
|
}
|
|
6377
6221
|
|
|
6378
6222
|
// src/ui/link-modal/LinkPopover.tsx
|
|
6379
|
-
import { Fragment as Fragment4, jsx as
|
|
6223
|
+
import { Fragment as Fragment4, jsx as jsx21, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
6380
6224
|
function postToParent(data) {
|
|
6381
6225
|
window.parent?.postMessage(data, "*");
|
|
6382
6226
|
}
|
|
@@ -6473,14 +6317,14 @@ function LinkPopover({
|
|
|
6473
6317
|
};
|
|
6474
6318
|
}, [open, sectionPickerActive]);
|
|
6475
6319
|
return /* @__PURE__ */ jsxs13(Fragment4, { children: [
|
|
6476
|
-
/* @__PURE__ */
|
|
6320
|
+
/* @__PURE__ */ jsx21(
|
|
6477
6321
|
Dialog2,
|
|
6478
6322
|
{
|
|
6479
6323
|
open: open && !sectionPickerActive,
|
|
6480
6324
|
onOpenChange: (next) => {
|
|
6481
6325
|
if (!next) onClose?.();
|
|
6482
6326
|
},
|
|
6483
|
-
children: /* @__PURE__ */
|
|
6327
|
+
children: /* @__PURE__ */ jsx21(
|
|
6484
6328
|
DialogContent,
|
|
6485
6329
|
{
|
|
6486
6330
|
ref: panelRef,
|
|
@@ -6490,12 +6334,12 @@ function LinkPopover({
|
|
|
6490
6334
|
"data-ohw-bridge": "",
|
|
6491
6335
|
showCloseButton: false,
|
|
6492
6336
|
className: "gap-0 p-0 w-full max-w-[448px] pointer-events-auto z-[2147483646] overflow-visible",
|
|
6493
|
-
children: /* @__PURE__ */
|
|
6337
|
+
children: /* @__PURE__ */ jsx21(LinkEditorPanel, { state, onClose })
|
|
6494
6338
|
}
|
|
6495
6339
|
)
|
|
6496
6340
|
}
|
|
6497
6341
|
),
|
|
6498
|
-
sectionPickerActive && state.selectedPage ? /* @__PURE__ */
|
|
6342
|
+
sectionPickerActive && state.selectedPage ? /* @__PURE__ */ jsx21(
|
|
6499
6343
|
SectionPickerOverlay,
|
|
6500
6344
|
{
|
|
6501
6345
|
pagePath: state.selectedPage.path,
|
|
@@ -7034,57 +6878,9 @@ function insertNavbarItem(href, label, afterAnchor = null) {
|
|
|
7034
6878
|
order
|
|
7035
6879
|
};
|
|
7036
6880
|
}
|
|
7037
|
-
function duplicateNavbarItem(sourceAnchor) {
|
|
7038
|
-
if (!isNavbarLinkItem(sourceAnchor)) return null;
|
|
7039
|
-
const sourceHrefKey = sourceAnchor.getAttribute("data-ohw-href-key");
|
|
7040
|
-
if (!sourceHrefKey || !isNavbarHrefKey(sourceHrefKey)) return null;
|
|
7041
|
-
const href = getLinkHref(sourceAnchor);
|
|
7042
|
-
const labelEl = sourceAnchor.querySelector('[data-ohw-editable="text"]');
|
|
7043
|
-
const label = (labelEl?.textContent ?? "").trim() || "Untitled";
|
|
7044
|
-
const forest = getNavForestFromDom();
|
|
7045
|
-
const sourceNode = forest.find((n) => n.id === sourceHrefKey);
|
|
7046
|
-
const childIds = sourceNode?.children.map((c) => c.id) ?? [];
|
|
7047
|
-
const primary = insertNavbarItem(href, label, sourceAnchor);
|
|
7048
|
-
const childResults = [];
|
|
7049
|
-
let after = primary.anchor;
|
|
7050
|
-
for (const childId of childIds) {
|
|
7051
|
-
const childEl = findCounterpartByHrefKey(childId, document) ?? document.querySelector(`[data-ohw-href-key="${CSS.escape(childId)}"]`);
|
|
7052
|
-
if (!childEl || !isNavbarLinkItem(childEl)) continue;
|
|
7053
|
-
const childHref = getLinkHref(childEl);
|
|
7054
|
-
const childLabelEl = childEl.querySelector('[data-ohw-editable="text"]');
|
|
7055
|
-
const childLabel = (childLabelEl?.textContent ?? "").trim() || "Untitled";
|
|
7056
|
-
const inserted = insertNavbarItem(childHref, childLabel, after);
|
|
7057
|
-
childResults.push(inserted);
|
|
7058
|
-
after = inserted.anchor;
|
|
7059
|
-
}
|
|
7060
|
-
let orderJson;
|
|
7061
|
-
if (childResults.length > 0) {
|
|
7062
|
-
const nextForest = getNavForestFromDom();
|
|
7063
|
-
const withoutNew = nextForest.filter(
|
|
7064
|
-
(n) => n.id !== primary.hrefKey && !childResults.some((c) => c.hrefKey === n.id)
|
|
7065
|
-
);
|
|
7066
|
-
const sourceIdx = withoutNew.findIndex((n) => n.id === sourceHrefKey);
|
|
7067
|
-
const insertAt = sourceIdx >= 0 ? sourceIdx + 1 : withoutNew.length;
|
|
7068
|
-
withoutNew.splice(insertAt, 0, {
|
|
7069
|
-
id: primary.hrefKey,
|
|
7070
|
-
children: childResults.map((c) => ({ id: c.hrefKey, children: [] }))
|
|
7071
|
-
});
|
|
7072
|
-
applyNavForest(withoutNew);
|
|
7073
|
-
orderJson = serializeNavOrder(withoutNew);
|
|
7074
|
-
} else {
|
|
7075
|
-
orderJson = serializeNavOrder(getNavForestFromDom());
|
|
7076
|
-
}
|
|
7077
|
-
return {
|
|
7078
|
-
...primary,
|
|
7079
|
-
order: flattenNavOrder(parseNavOrderJson(orderJson) ?? getNavForestFromDom()),
|
|
7080
|
-
childResults,
|
|
7081
|
-
orderJson
|
|
7082
|
-
};
|
|
7083
|
-
}
|
|
7084
6881
|
|
|
7085
6882
|
// src/lib/footer-items.ts
|
|
7086
6883
|
var FOOTER_ORDER_KEY = "__ohw_footer_order";
|
|
7087
|
-
var MAX_FOOTER_COLUMNS = 18;
|
|
7088
6884
|
var FOOTER_HREF_RE = /^footer-(\d+)-(\d+)-href$/;
|
|
7089
6885
|
function parseFooterHrefKey(key) {
|
|
7090
6886
|
if (!key) return null;
|
|
@@ -7265,191 +7061,7 @@ function parseFooterOrder(content) {
|
|
|
7265
7061
|
return null;
|
|
7266
7062
|
}
|
|
7267
7063
|
}
|
|
7268
|
-
var FOOTER_HEADING_RE = /^footer-(\d+)-heading$/;
|
|
7269
|
-
var FOOTER_LABEL_RE = /^footer-(\d+)-(\d+)-label$/;
|
|
7270
|
-
var DEFAULT_FOOTER_COLUMN_HEADING = "New";
|
|
7271
|
-
var DEFAULT_FOOTER_COLUMN_LINK_LABEL = "New link";
|
|
7272
|
-
var DEFAULT_FOOTER_COLUMN_LINK_HREF = "";
|
|
7273
|
-
function isFooterLinksContainer(el) {
|
|
7274
|
-
return el.hasAttribute("data-ohw-footer-links") || el.classList.contains("rb-footer-links");
|
|
7275
|
-
}
|
|
7276
|
-
function getFooterColumnIndicesInDom() {
|
|
7277
|
-
const indices = /* @__PURE__ */ new Set();
|
|
7278
|
-
for (const col of listFooterColumns()) {
|
|
7279
|
-
const attr = col.getAttribute("data-ohw-footer-col");
|
|
7280
|
-
if (attr != null) {
|
|
7281
|
-
const n = parseInt(attr, 10);
|
|
7282
|
-
if (Number.isFinite(n)) indices.add(n);
|
|
7283
|
-
}
|
|
7284
|
-
for (const link of listFooterLinksInColumn(col)) {
|
|
7285
|
-
const parsed = parseFooterHrefKey(link.getAttribute("data-ohw-href-key"));
|
|
7286
|
-
if (parsed) indices.add(parsed.col);
|
|
7287
|
-
}
|
|
7288
|
-
const heading = col.querySelector('[data-ohw-key^="footer-"][data-ohw-key$="-heading"]');
|
|
7289
|
-
const headingKey = heading?.getAttribute("data-ohw-key");
|
|
7290
|
-
if (headingKey) {
|
|
7291
|
-
const match = headingKey.match(FOOTER_HEADING_RE);
|
|
7292
|
-
if (match) indices.add(parseInt(match[1], 10));
|
|
7293
|
-
}
|
|
7294
|
-
}
|
|
7295
|
-
return [...indices].sort((a, b) => a - b);
|
|
7296
|
-
}
|
|
7297
|
-
function getNextFooterColumnIndex() {
|
|
7298
|
-
const indices = getFooterColumnIndicesInDom();
|
|
7299
|
-
if (indices.length === 0) return 0;
|
|
7300
|
-
return Math.max(...indices) + 1;
|
|
7301
|
-
}
|
|
7302
|
-
function canAddFooterColumn() {
|
|
7303
|
-
return listFooterColumns().length < MAX_FOOTER_COLUMNS;
|
|
7304
|
-
}
|
|
7305
|
-
function buildFooterHeading(colIndex, text) {
|
|
7306
|
-
const heading = document.createElement("p");
|
|
7307
|
-
heading.setAttribute("data-ohw-editable", "text");
|
|
7308
|
-
heading.setAttribute("data-ohw-key", `footer-${colIndex}-heading`);
|
|
7309
|
-
heading.textContent = text;
|
|
7310
|
-
heading.style.cssText = [
|
|
7311
|
-
"color: var(--espresso, #3d312b)",
|
|
7312
|
-
"font-size: 14px",
|
|
7313
|
-
"font-weight: 800",
|
|
7314
|
-
"opacity: 0.82",
|
|
7315
|
-
"margin: 0 0 6px",
|
|
7316
|
-
"padding: 0",
|
|
7317
|
-
"line-height: 1.2"
|
|
7318
|
-
].join(";");
|
|
7319
|
-
return heading;
|
|
7320
|
-
}
|
|
7321
|
-
function buildFooterLink(colIndex, itemIndex, href, label, template) {
|
|
7322
|
-
const anchor = cloneFooterLinkShell(template);
|
|
7323
|
-
anchor.setAttribute("href", href);
|
|
7324
|
-
anchor.setAttribute("data-ohw-href-key", `footer-${colIndex}-${itemIndex}-href`);
|
|
7325
|
-
const span = document.createElement("span");
|
|
7326
|
-
span.setAttribute("data-ohw-editable", "text");
|
|
7327
|
-
span.setAttribute("data-ohw-key", `footer-${colIndex}-${itemIndex}-label`);
|
|
7328
|
-
span.textContent = label;
|
|
7329
|
-
anchor.appendChild(span);
|
|
7330
|
-
return anchor;
|
|
7331
|
-
}
|
|
7332
|
-
function footerColumnExistsInDom(colIndex) {
|
|
7333
|
-
return document.querySelector(`[data-ohw-footer-col="${colIndex}"]`) !== null || document.querySelector(`[data-ohw-href-key^="footer-${colIndex}-"]`) !== null || document.querySelector(`[data-ohw-key="footer-${colIndex}-heading"]`) !== null;
|
|
7334
|
-
}
|
|
7335
|
-
function getFooterLinkTemplate() {
|
|
7336
|
-
for (const col of listFooterColumns()) {
|
|
7337
|
-
const link = listFooterLinksInColumn(col)[0];
|
|
7338
|
-
if (link) return link;
|
|
7339
|
-
}
|
|
7340
|
-
return null;
|
|
7341
|
-
}
|
|
7342
|
-
function getFooterColumnTemplate() {
|
|
7343
|
-
return listFooterColumns()[0] ?? null;
|
|
7344
|
-
}
|
|
7345
|
-
function insertFooterColumnDom(colIndex, heading, items) {
|
|
7346
|
-
const container = getFooterLinksContainer();
|
|
7347
|
-
if (!container) return null;
|
|
7348
|
-
const colTemplate = getFooterColumnTemplate();
|
|
7349
|
-
const linkTemplate = getFooterLinkTemplate();
|
|
7350
|
-
const column = document.createElement("div");
|
|
7351
|
-
if (colTemplate?.className) column.className = colTemplate.className;
|
|
7352
|
-
else column.className = "rb-footer-link-col";
|
|
7353
|
-
column.setAttribute("data-ohw-footer-col", String(colIndex));
|
|
7354
|
-
if (colTemplate) {
|
|
7355
|
-
const gap = getComputedStyle(colTemplate).gap;
|
|
7356
|
-
if (gap && gap !== "normal") column.style.gap = gap;
|
|
7357
|
-
column.style.display = getComputedStyle(colTemplate).display || "flex";
|
|
7358
|
-
column.style.flexDirection = "column";
|
|
7359
|
-
}
|
|
7360
|
-
column.appendChild(buildFooterHeading(colIndex, heading));
|
|
7361
|
-
let firstLink = null;
|
|
7362
|
-
items.forEach((item, itemIndex) => {
|
|
7363
|
-
const link = buildFooterLink(colIndex, itemIndex, item.href, item.label, linkTemplate);
|
|
7364
|
-
column.appendChild(link);
|
|
7365
|
-
if (!firstLink) firstLink = link;
|
|
7366
|
-
});
|
|
7367
|
-
container.appendChild(column);
|
|
7368
|
-
return { column, firstLink };
|
|
7369
|
-
}
|
|
7370
|
-
function insertFooterColumn(heading = DEFAULT_FOOTER_COLUMN_HEADING, linkLabel = DEFAULT_FOOTER_COLUMN_LINK_LABEL, linkHref = DEFAULT_FOOTER_COLUMN_LINK_HREF) {
|
|
7371
|
-
if (!canAddFooterColumn()) {
|
|
7372
|
-
throw new Error(`Footer column limit reached (${MAX_FOOTER_COLUMNS})`);
|
|
7373
|
-
}
|
|
7374
|
-
const colIndex = getNextFooterColumnIndex();
|
|
7375
|
-
const inserted = insertFooterColumnDom(colIndex, heading, [{ href: linkHref, label: linkLabel }]);
|
|
7376
|
-
if (!inserted?.firstLink) throw new Error("Failed to insert footer column");
|
|
7377
|
-
syncFooterColumnIndices(listFooterColumns());
|
|
7378
|
-
return {
|
|
7379
|
-
column: inserted.column,
|
|
7380
|
-
firstLink: inserted.firstLink,
|
|
7381
|
-
colIndex,
|
|
7382
|
-
headingKey: `footer-${colIndex}-heading`,
|
|
7383
|
-
hrefKey: `footer-${colIndex}-0-href`,
|
|
7384
|
-
labelKey: `footer-${colIndex}-0-label`,
|
|
7385
|
-
heading,
|
|
7386
|
-
label: linkLabel,
|
|
7387
|
-
href: linkHref,
|
|
7388
|
-
order: getFooterOrderFromDom()
|
|
7389
|
-
};
|
|
7390
|
-
}
|
|
7391
|
-
function collectFooterColumnIndicesFromContent(content) {
|
|
7392
|
-
const indices = /* @__PURE__ */ new Set();
|
|
7393
|
-
for (const key of Object.keys(content)) {
|
|
7394
|
-
const href = parseFooterHrefKey(key);
|
|
7395
|
-
if (href) indices.add(href.col);
|
|
7396
|
-
const heading = key.match(FOOTER_HEADING_RE);
|
|
7397
|
-
if (heading) indices.add(parseInt(heading[1], 10));
|
|
7398
|
-
const label = key.match(FOOTER_LABEL_RE);
|
|
7399
|
-
if (label) indices.add(parseInt(label[1], 10));
|
|
7400
|
-
}
|
|
7401
|
-
const order = parseFooterOrder(content);
|
|
7402
|
-
if (order) {
|
|
7403
|
-
for (const col of order) {
|
|
7404
|
-
for (const hrefKey of col) {
|
|
7405
|
-
const parsed = parseFooterHrefKey(hrefKey);
|
|
7406
|
-
if (parsed) indices.add(parsed.col);
|
|
7407
|
-
}
|
|
7408
|
-
}
|
|
7409
|
-
}
|
|
7410
|
-
return [...indices].sort((a, b) => a - b);
|
|
7411
|
-
}
|
|
7412
|
-
function collectFooterItemsForColumn(content, colIndex) {
|
|
7413
|
-
const itemIndices = /* @__PURE__ */ new Set();
|
|
7414
|
-
for (const key of Object.keys(content)) {
|
|
7415
|
-
const href = parseFooterHrefKey(key);
|
|
7416
|
-
if (href?.col === colIndex) itemIndices.add(href.item);
|
|
7417
|
-
const label = key.match(FOOTER_LABEL_RE);
|
|
7418
|
-
if (label && parseInt(label[1], 10) === colIndex) {
|
|
7419
|
-
itemIndices.add(parseInt(label[2], 10));
|
|
7420
|
-
}
|
|
7421
|
-
}
|
|
7422
|
-
const sorted = [...itemIndices].sort((a, b) => a - b);
|
|
7423
|
-
if (sorted.length === 0) {
|
|
7424
|
-
return [
|
|
7425
|
-
{
|
|
7426
|
-
href: content[`footer-${colIndex}-0-href`] ?? DEFAULT_FOOTER_COLUMN_LINK_HREF,
|
|
7427
|
-
label: content[`footer-${colIndex}-0-label`] ?? DEFAULT_FOOTER_COLUMN_LINK_LABEL
|
|
7428
|
-
}
|
|
7429
|
-
];
|
|
7430
|
-
}
|
|
7431
|
-
return sorted.map((itemIndex) => ({
|
|
7432
|
-
href: content[`footer-${colIndex}-${itemIndex}-href`] ?? DEFAULT_FOOTER_COLUMN_LINK_HREF,
|
|
7433
|
-
label: content[`footer-${colIndex}-${itemIndex}-label`] ?? DEFAULT_FOOTER_COLUMN_LINK_LABEL
|
|
7434
|
-
}));
|
|
7435
|
-
}
|
|
7436
|
-
function reconcileFooterColumnsFromContent(content) {
|
|
7437
|
-
const indices = collectFooterColumnIndicesFromContent(content);
|
|
7438
|
-
for (const colIndex of indices) {
|
|
7439
|
-
if (footerColumnExistsInDom(colIndex)) continue;
|
|
7440
|
-
const heading = content[`footer-${colIndex}-heading`] ?? DEFAULT_FOOTER_COLUMN_HEADING;
|
|
7441
|
-
const items = collectFooterItemsForColumn(content, colIndex);
|
|
7442
|
-
const hasPayload = Boolean(content[`footer-${colIndex}-heading`]) || items.some(
|
|
7443
|
-
(_, i) => content[`footer-${colIndex}-${i}-href`] !== void 0 || content[`footer-${colIndex}-${i}-label`] !== void 0
|
|
7444
|
-
) || (parseFooterOrder(content)?.some(
|
|
7445
|
-
(col) => col.some((k) => parseFooterHrefKey(k)?.col === colIndex)
|
|
7446
|
-
) ?? false);
|
|
7447
|
-
if (!hasPayload) continue;
|
|
7448
|
-
insertFooterColumnDom(colIndex, heading, items);
|
|
7449
|
-
}
|
|
7450
|
-
}
|
|
7451
7064
|
function reconcileFooterOrderFromContent(content) {
|
|
7452
|
-
reconcileFooterColumnsFromContent(content);
|
|
7453
7065
|
const order = parseFooterOrder(content);
|
|
7454
7066
|
if (!order?.length) return;
|
|
7455
7067
|
const current = getFooterOrderFromDom();
|
|
@@ -7459,26 +7071,6 @@ function reconcileFooterOrderFromContent(content) {
|
|
|
7459
7071
|
}
|
|
7460
7072
|
applyFooterOrder(order);
|
|
7461
7073
|
}
|
|
7462
|
-
function resolveFooterLinksContainerSelectionTarget(target, clientX, clientY, isPointOverItem) {
|
|
7463
|
-
const container = getFooterLinksContainer();
|
|
7464
|
-
if (!container) return null;
|
|
7465
|
-
const inContainer = target === container || container.contains(target) && Boolean(target.closest("[data-ohw-footer-links], .rb-footer-links"));
|
|
7466
|
-
if (!inContainer && target !== container) {
|
|
7467
|
-
const r2 = container.getBoundingClientRect();
|
|
7468
|
-
const over = clientX >= r2.left && clientX <= r2.right && clientY >= r2.top && clientY <= r2.bottom;
|
|
7469
|
-
if (!over) return null;
|
|
7470
|
-
}
|
|
7471
|
-
if (isPointOverItem(container, clientX, clientY)) return null;
|
|
7472
|
-
const column = target.closest("[data-ohw-footer-col], [data-ohw-footer-column]") ?? null;
|
|
7473
|
-
if (column && container.contains(column)) {
|
|
7474
|
-
if (target === column || column.contains(target)) return null;
|
|
7475
|
-
}
|
|
7476
|
-
if (target === container || container.contains(target) || inContainer) {
|
|
7477
|
-
if (target === container || isFooterLinksContainer(target)) return container;
|
|
7478
|
-
if (!column) return container;
|
|
7479
|
-
}
|
|
7480
|
-
return null;
|
|
7481
|
-
}
|
|
7482
7074
|
function isRowLayoutColumn(links) {
|
|
7483
7075
|
if (links.length < 2) return false;
|
|
7484
7076
|
const firstTop = links[0].getBoundingClientRect().top;
|
|
@@ -7633,108 +7225,6 @@ function hitTestColumnDropSlot(clientX, _clientY) {
|
|
|
7633
7225
|
}
|
|
7634
7226
|
return best?.slot ?? null;
|
|
7635
7227
|
}
|
|
7636
|
-
function getLinkHref2(el) {
|
|
7637
|
-
const key = el.getAttribute("data-ohw-href-key");
|
|
7638
|
-
if (key) {
|
|
7639
|
-
const stored = getStoredLinkHref(key);
|
|
7640
|
-
if (stored !== void 0) return stored;
|
|
7641
|
-
}
|
|
7642
|
-
return el.getAttribute("href") ?? "";
|
|
7643
|
-
}
|
|
7644
|
-
function getNextFooterItemIndex(col) {
|
|
7645
|
-
let max = -1;
|
|
7646
|
-
for (const el of document.querySelectorAll("footer [data-ohw-href-key]")) {
|
|
7647
|
-
const parsed = parseFooterHrefKey(el.getAttribute("data-ohw-href-key"));
|
|
7648
|
-
if (!parsed || parsed.col !== col) continue;
|
|
7649
|
-
if (parsed.item > max) max = parsed.item;
|
|
7650
|
-
}
|
|
7651
|
-
return max + 1;
|
|
7652
|
-
}
|
|
7653
|
-
function cloneFooterLinkShell(template) {
|
|
7654
|
-
const anchor = document.createElement("a");
|
|
7655
|
-
if (template) {
|
|
7656
|
-
anchor.style.cssText = template.style.cssText;
|
|
7657
|
-
if (template.className) anchor.className = template.className;
|
|
7658
|
-
}
|
|
7659
|
-
anchor.style.cursor = "pointer";
|
|
7660
|
-
anchor.style.textDecoration = "none";
|
|
7661
|
-
return anchor;
|
|
7662
|
-
}
|
|
7663
|
-
function insertFooterItem(column, href, label, afterAnchor = null) {
|
|
7664
|
-
const columns = listFooterColumns();
|
|
7665
|
-
const colIndex = columns.indexOf(column);
|
|
7666
|
-
if (colIndex < 0) throw new Error("Footer column not found");
|
|
7667
|
-
const item = getNextFooterItemIndex(colIndex);
|
|
7668
|
-
const hrefKey = `footer-${colIndex}-${item}-href`;
|
|
7669
|
-
const labelKey = `footer-${colIndex}-${item}-label`;
|
|
7670
|
-
const template = listFooterLinksInColumn(column)[0] ?? null;
|
|
7671
|
-
const anchor = cloneFooterLinkShell(template);
|
|
7672
|
-
anchor.href = href;
|
|
7673
|
-
anchor.setAttribute("data-ohw-href-key", hrefKey);
|
|
7674
|
-
const span = document.createElement("span");
|
|
7675
|
-
span.setAttribute("data-ohw-editable", "text");
|
|
7676
|
-
span.setAttribute("data-ohw-key", labelKey);
|
|
7677
|
-
span.textContent = label;
|
|
7678
|
-
anchor.appendChild(span);
|
|
7679
|
-
if (afterAnchor && afterAnchor.parentElement === column) {
|
|
7680
|
-
afterAnchor.insertAdjacentElement("afterend", anchor);
|
|
7681
|
-
} else {
|
|
7682
|
-
column.appendChild(anchor);
|
|
7683
|
-
}
|
|
7684
|
-
const order = getFooterOrderFromDom();
|
|
7685
|
-
applyFooterOrder(order);
|
|
7686
|
-
return {
|
|
7687
|
-
anchor,
|
|
7688
|
-
col: colIndex,
|
|
7689
|
-
item,
|
|
7690
|
-
hrefKey,
|
|
7691
|
-
labelKey,
|
|
7692
|
-
href,
|
|
7693
|
-
label,
|
|
7694
|
-
order
|
|
7695
|
-
};
|
|
7696
|
-
}
|
|
7697
|
-
function duplicateFooterItem(sourceAnchor) {
|
|
7698
|
-
if (!isFooterLinkAnchor(sourceAnchor)) return null;
|
|
7699
|
-
const column = findFooterColumnForLink(sourceAnchor);
|
|
7700
|
-
if (!column) return null;
|
|
7701
|
-
const href = getLinkHref2(sourceAnchor);
|
|
7702
|
-
const labelEl = sourceAnchor.querySelector('[data-ohw-editable="text"]');
|
|
7703
|
-
const label = (labelEl?.textContent ?? "").trim() || "Untitled";
|
|
7704
|
-
return insertFooterItem(column, href || "/", label, sourceAnchor);
|
|
7705
|
-
}
|
|
7706
|
-
|
|
7707
|
-
// src/lib/add-footer-column.ts
|
|
7708
|
-
function buildFooterColumnEditContentPatch(result) {
|
|
7709
|
-
return {
|
|
7710
|
-
[result.headingKey]: result.heading,
|
|
7711
|
-
[result.hrefKey]: result.href,
|
|
7712
|
-
[result.labelKey]: result.label,
|
|
7713
|
-
[FOOTER_ORDER_KEY]: JSON.stringify(result.order)
|
|
7714
|
-
};
|
|
7715
|
-
}
|
|
7716
|
-
function addFooterColumnWithPersist({
|
|
7717
|
-
postToParent: postToParent2
|
|
7718
|
-
}) {
|
|
7719
|
-
if (!canAddFooterColumn()) {
|
|
7720
|
-
postToParent2({
|
|
7721
|
-
type: "ow:toast",
|
|
7722
|
-
title: `Maximum ${MAX_FOOTER_COLUMNS} columns`,
|
|
7723
|
-
toastType: "error"
|
|
7724
|
-
});
|
|
7725
|
-
return null;
|
|
7726
|
-
}
|
|
7727
|
-
const result = insertFooterColumn();
|
|
7728
|
-
const patch = buildFooterColumnEditContentPatch(result);
|
|
7729
|
-
setStoredLinkHref(result.hrefKey, result.href);
|
|
7730
|
-
postToParent2({
|
|
7731
|
-
type: "ow:change",
|
|
7732
|
-
nodes: Object.entries(patch).map(([key, text]) => ({ key, text }))
|
|
7733
|
-
});
|
|
7734
|
-
postToParent2({ type: "ow:toast", title: "Item added", toastType: "success" });
|
|
7735
|
-
enforceLinkHrefs();
|
|
7736
|
-
return result;
|
|
7737
|
-
}
|
|
7738
7228
|
|
|
7739
7229
|
// src/lib/item-drag-interaction.ts
|
|
7740
7230
|
function disableNativeHrefDrag(el) {
|
|
@@ -7933,7 +7423,7 @@ function hitTestNavDropSlot(clientX, clientY, draggedHrefKey) {
|
|
|
7933
7423
|
}
|
|
7934
7424
|
|
|
7935
7425
|
// src/useNavItemDrag.ts
|
|
7936
|
-
import { useCallback as useCallback4, useEffect as useEffect7, useRef as useRef6, useState as
|
|
7426
|
+
import { useCallback as useCallback4, useEffect as useEffect7, useRef as useRef6, useState as useState6 } from "react";
|
|
7937
7427
|
function useNavItemDrag({
|
|
7938
7428
|
isEditMode,
|
|
7939
7429
|
editContentRef,
|
|
@@ -7959,8 +7449,8 @@ function useNavItemDrag({
|
|
|
7959
7449
|
isNavbarButton: isNavbarButton3
|
|
7960
7450
|
}) {
|
|
7961
7451
|
const navDragRef = useRef6(null);
|
|
7962
|
-
const [navDropSlots, setNavDropSlots] =
|
|
7963
|
-
const [activeNavDropIndex, setActiveNavDropIndex] =
|
|
7452
|
+
const [navDropSlots, setNavDropSlots] = useState6([]);
|
|
7453
|
+
const [activeNavDropIndex, setActiveNavDropIndex] = useState6(null);
|
|
7964
7454
|
const navPointerDragRef = useRef6(null);
|
|
7965
7455
|
const clearNavDragVisuals = useCallback4(() => {
|
|
7966
7456
|
navDragRef.current = null;
|
|
@@ -8268,59 +7758,8 @@ function useNavItemDrag({
|
|
|
8268
7758
|
};
|
|
8269
7759
|
}
|
|
8270
7760
|
|
|
8271
|
-
// src/ui/footer-container-chrome.tsx
|
|
8272
|
-
import { Plus as Plus2 } from "lucide-react";
|
|
8273
|
-
import { jsx as jsx23, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
8274
|
-
function FooterContainerChrome({
|
|
8275
|
-
rect,
|
|
8276
|
-
onAdd,
|
|
8277
|
-
addDisabled = false
|
|
8278
|
-
}) {
|
|
8279
|
-
const chromeGap = 6;
|
|
8280
|
-
const buttonMargin = 7;
|
|
8281
|
-
return /* @__PURE__ */ jsx23(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsx23(
|
|
8282
|
-
"div",
|
|
8283
|
-
{
|
|
8284
|
-
"data-ohw-footer-container-chrome": "",
|
|
8285
|
-
"data-ohw-bridge": "",
|
|
8286
|
-
className: "pointer-events-none fixed z-[2147483647]",
|
|
8287
|
-
style: {
|
|
8288
|
-
top: rect.top - chromeGap,
|
|
8289
|
-
left: rect.left - chromeGap,
|
|
8290
|
-
width: rect.width + chromeGap * 2,
|
|
8291
|
-
height: rect.height + chromeGap * 2
|
|
8292
|
-
},
|
|
8293
|
-
children: /* @__PURE__ */ jsxs14(Tooltip, { children: [
|
|
8294
|
-
/* @__PURE__ */ jsx23(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx23(
|
|
8295
|
-
"button",
|
|
8296
|
-
{
|
|
8297
|
-
type: "button",
|
|
8298
|
-
"data-ohw-footer-add-button": "",
|
|
8299
|
-
disabled: addDisabled,
|
|
8300
|
-
className: "pointer-events-auto absolute left-1/2 flex size-7 -translate-x-1/2 -translate-y-full items-center justify-center rounded-[10px] border border-border bg-background p-0.5 shadow-sm transition-colors hover:bg-muted/80 disabled:pointer-events-none disabled:opacity-40",
|
|
8301
|
-
style: { top: chromeGap - buttonMargin },
|
|
8302
|
-
"aria-label": "Add item",
|
|
8303
|
-
onMouseDown: (e) => {
|
|
8304
|
-
e.preventDefault();
|
|
8305
|
-
e.stopPropagation();
|
|
8306
|
-
},
|
|
8307
|
-
onClick: (e) => {
|
|
8308
|
-
e.preventDefault();
|
|
8309
|
-
e.stopPropagation();
|
|
8310
|
-
if (addDisabled) return;
|
|
8311
|
-
onAdd();
|
|
8312
|
-
},
|
|
8313
|
-
children: /* @__PURE__ */ jsx23(Plus2, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
|
|
8314
|
-
}
|
|
8315
|
-
) }),
|
|
8316
|
-
/* @__PURE__ */ jsx23(TooltipContent, { side: "bottom", sideOffset: 9, children: addDisabled ? "Maximum columns reached" : "Add item" })
|
|
8317
|
-
] })
|
|
8318
|
-
}
|
|
8319
|
-
) });
|
|
8320
|
-
}
|
|
8321
|
-
|
|
8322
7761
|
// src/lib/carousel.ts
|
|
8323
|
-
import { useEffect as useEffect8, useState as
|
|
7762
|
+
import { useEffect as useEffect8, useState as useState7 } from "react";
|
|
8324
7763
|
var CAROUSEL_ATTR = "data-ohw-carousel";
|
|
8325
7764
|
var CAROUSEL_VALUE_ATTR = "data-ohw-carousel-value";
|
|
8326
7765
|
var CAROUSEL_SLIDE_ATTR = "data-ohw-carousel-slide";
|
|
@@ -8382,7 +7821,7 @@ function applyCarouselNode(key, val) {
|
|
|
8382
7821
|
return true;
|
|
8383
7822
|
}
|
|
8384
7823
|
function useOhwCarousel(key, initial) {
|
|
8385
|
-
const [images, setImages] =
|
|
7824
|
+
const [images, setImages] = useState7(initial);
|
|
8386
7825
|
useEffect8(() => {
|
|
8387
7826
|
const el = document.querySelector(
|
|
8388
7827
|
`[${CAROUSEL_ATTR}][data-ohw-key="${CSS.escape(key)}"]`
|
|
@@ -8404,14 +7843,14 @@ function useOhwCarousel(key, initial) {
|
|
|
8404
7843
|
}
|
|
8405
7844
|
|
|
8406
7845
|
// src/ui/navbar-container-chrome.tsx
|
|
8407
|
-
import { Plus as
|
|
8408
|
-
import { jsx as
|
|
7846
|
+
import { Plus as Plus2 } from "lucide-react";
|
|
7847
|
+
import { jsx as jsx22 } from "react/jsx-runtime";
|
|
8409
7848
|
function NavbarContainerChrome({
|
|
8410
7849
|
rect,
|
|
8411
7850
|
onAdd
|
|
8412
7851
|
}) {
|
|
8413
7852
|
const chromeGap = 6;
|
|
8414
|
-
return /* @__PURE__ */
|
|
7853
|
+
return /* @__PURE__ */ jsx22(
|
|
8415
7854
|
"div",
|
|
8416
7855
|
{
|
|
8417
7856
|
"data-ohw-navbar-container-chrome": "",
|
|
@@ -8423,7 +7862,7 @@ function NavbarContainerChrome({
|
|
|
8423
7862
|
width: rect.width + chromeGap * 2,
|
|
8424
7863
|
height: rect.height + chromeGap * 2
|
|
8425
7864
|
},
|
|
8426
|
-
children: /* @__PURE__ */
|
|
7865
|
+
children: /* @__PURE__ */ jsx22(
|
|
8427
7866
|
"button",
|
|
8428
7867
|
{
|
|
8429
7868
|
type: "button",
|
|
@@ -8440,7 +7879,7 @@ function NavbarContainerChrome({
|
|
|
8440
7879
|
e.stopPropagation();
|
|
8441
7880
|
onAdd();
|
|
8442
7881
|
},
|
|
8443
|
-
children: /* @__PURE__ */
|
|
7882
|
+
children: /* @__PURE__ */ jsx22(Plus2, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
|
|
8444
7883
|
}
|
|
8445
7884
|
)
|
|
8446
7885
|
}
|
|
@@ -8449,7 +7888,7 @@ function NavbarContainerChrome({
|
|
|
8449
7888
|
|
|
8450
7889
|
// src/ui/drop-indicator.tsx
|
|
8451
7890
|
import * as React10 from "react";
|
|
8452
|
-
import { jsx as
|
|
7891
|
+
import { jsx as jsx23 } from "react/jsx-runtime";
|
|
8453
7892
|
var dropIndicatorVariants = cva(
|
|
8454
7893
|
"ov-gap-line pointer-events-none shrink-0 transition-opacity duration-150",
|
|
8455
7894
|
{
|
|
@@ -8473,7 +7912,7 @@ var dropIndicatorVariants = cva(
|
|
|
8473
7912
|
);
|
|
8474
7913
|
var DropIndicator = React10.forwardRef(
|
|
8475
7914
|
({ className, direction, state, ...props }, ref) => {
|
|
8476
|
-
return /* @__PURE__ */
|
|
7915
|
+
return /* @__PURE__ */ jsx23(
|
|
8477
7916
|
"div",
|
|
8478
7917
|
{
|
|
8479
7918
|
ref,
|
|
@@ -8490,7 +7929,7 @@ var DropIndicator = React10.forwardRef(
|
|
|
8490
7929
|
DropIndicator.displayName = "DropIndicator";
|
|
8491
7930
|
|
|
8492
7931
|
// src/ui/badge.tsx
|
|
8493
|
-
import { jsx as
|
|
7932
|
+
import { jsx as jsx24 } from "react/jsx-runtime";
|
|
8494
7933
|
var badgeVariants = cva(
|
|
8495
7934
|
"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",
|
|
8496
7935
|
{
|
|
@@ -8508,12 +7947,12 @@ var badgeVariants = cva(
|
|
|
8508
7947
|
}
|
|
8509
7948
|
);
|
|
8510
7949
|
function Badge({ className, variant, ...props }) {
|
|
8511
|
-
return /* @__PURE__ */
|
|
7950
|
+
return /* @__PURE__ */ jsx24("div", { className: cn(badgeVariants({ variant }), className), ...props });
|
|
8512
7951
|
}
|
|
8513
7952
|
|
|
8514
7953
|
// src/OhhwellsBridge.tsx
|
|
8515
7954
|
import { Link as Link2 } from "lucide-react";
|
|
8516
|
-
import { Fragment as Fragment5, jsx as
|
|
7955
|
+
import { Fragment as Fragment5, jsx as jsx25, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
8517
7956
|
var PRIMARY2 = "#0885FE";
|
|
8518
7957
|
var IMAGE_FADE_MS = 300;
|
|
8519
7958
|
function runOpacityFade(el, onDone) {
|
|
@@ -8692,7 +8131,7 @@ function mountSchedulingWidget(insertAfter, notifyOnConnect = false, scheduleId,
|
|
|
8692
8131
|
const root = createRoot(container);
|
|
8693
8132
|
flushSync(() => {
|
|
8694
8133
|
root.render(
|
|
8695
|
-
/* @__PURE__ */
|
|
8134
|
+
/* @__PURE__ */ jsx25(
|
|
8696
8135
|
SchedulingWidget,
|
|
8697
8136
|
{
|
|
8698
8137
|
notifyOnConnect,
|
|
@@ -8732,7 +8171,7 @@ function mountSchedulingEntries(entries, notifyOnConnect = false) {
|
|
|
8732
8171
|
}
|
|
8733
8172
|
}
|
|
8734
8173
|
}
|
|
8735
|
-
function
|
|
8174
|
+
function getLinkHref2(el) {
|
|
8736
8175
|
const anchor = el instanceof HTMLAnchorElement ? el : el.querySelector("a");
|
|
8737
8176
|
return anchor?.getAttribute("href") ?? "";
|
|
8738
8177
|
}
|
|
@@ -8782,7 +8221,7 @@ function collectEditableNodes(extraContent) {
|
|
|
8782
8221
|
return { key: el.dataset.ohwKey ?? "", type: "video", text: getVideoEl(el)?.src ?? "" };
|
|
8783
8222
|
}
|
|
8784
8223
|
if (el.dataset.ohwEditable === "link") {
|
|
8785
|
-
return { key: el.dataset.ohwKey ?? "", type: "link", text:
|
|
8224
|
+
return { key: el.dataset.ohwKey ?? "", type: "link", text: getLinkHref2(el) };
|
|
8786
8225
|
}
|
|
8787
8226
|
return {
|
|
8788
8227
|
key: el.dataset.ohwKey ?? "",
|
|
@@ -8793,7 +8232,7 @@ function collectEditableNodes(extraContent) {
|
|
|
8793
8232
|
document.querySelectorAll("[data-ohw-href-key]").forEach((el) => {
|
|
8794
8233
|
const key = el.getAttribute("data-ohw-href-key") ?? "";
|
|
8795
8234
|
if (!key) return;
|
|
8796
|
-
nodes.push({ key, type: "link", text:
|
|
8235
|
+
nodes.push({ key, type: "link", text: getLinkHref2(el) });
|
|
8797
8236
|
});
|
|
8798
8237
|
if (extraContent) {
|
|
8799
8238
|
for (const key of [NAV_ORDER_KEY, FOOTER_ORDER_KEY, NAV_COUNT_KEY]) {
|
|
@@ -8896,7 +8335,7 @@ function applyLinkByKey(key, val) {
|
|
|
8896
8335
|
}
|
|
8897
8336
|
function isInsideLinkEditor(target) {
|
|
8898
8337
|
return Boolean(
|
|
8899
|
-
target.closest("[data-ohw-link-popover-root]") || target.closest("[data-ohw-link-modal-root]") || target.closest("[data-ohw-link-page-dropdown]") || target.closest("[data-ohw-section-picker]") || target.closest("[data-ohw-navbar-container-chrome]") || target.closest("[data-ohw-navbar-add-button]") || target.closest(
|
|
8338
|
+
target.closest("[data-ohw-link-popover-root]") || target.closest("[data-ohw-link-modal-root]") || target.closest("[data-ohw-link-page-dropdown]") || target.closest("[data-ohw-section-picker]") || target.closest("[data-ohw-navbar-container-chrome]") || target.closest("[data-ohw-navbar-add-button]") || target.closest('[data-slot="popover-content"]') || target.closest('[data-slot="dialog-content"]') || target.closest('[data-slot="dialog-overlay"]')
|
|
8900
8339
|
);
|
|
8901
8340
|
}
|
|
8902
8341
|
function getHrefKeyFromElement(el) {
|
|
@@ -8977,7 +8416,7 @@ function isInferredFooterGroup(el) {
|
|
|
8977
8416
|
return countFooterNavItems(el) >= 2;
|
|
8978
8417
|
}
|
|
8979
8418
|
function isNavigationContainer(el) {
|
|
8980
|
-
return el.hasAttribute("data-ohw-nav-container") ||
|
|
8419
|
+
return el.hasAttribute("data-ohw-nav-container") || el.hasAttribute("data-ohw-footer-col") || el.hasAttribute("data-ohw-footer-column") || isNavigationRoot(el) || isInferredFooterGroup(el);
|
|
8981
8420
|
}
|
|
8982
8421
|
function isNavbarLinksContainer(el) {
|
|
8983
8422
|
return el.hasAttribute("data-ohw-nav-container");
|
|
@@ -8996,9 +8435,6 @@ function isPointOverNavigation(x, y) {
|
|
|
8996
8435
|
const roots = /* @__PURE__ */ new Set();
|
|
8997
8436
|
const navRoot = document.querySelector("[data-ohw-nav-root]") ?? document.querySelector("nav");
|
|
8998
8437
|
if (navRoot) roots.add(navRoot);
|
|
8999
|
-
document.querySelectorAll("[data-ohw-nav-drawer], [data-ohw-nav-container]").forEach((el) => {
|
|
9000
|
-
roots.add(el);
|
|
9001
|
-
});
|
|
9002
8438
|
const footer = document.querySelector("footer");
|
|
9003
8439
|
if (footer) roots.add(footer);
|
|
9004
8440
|
for (const root of roots) {
|
|
@@ -9027,12 +8463,6 @@ function isPointOverNavItem(container, x, y) {
|
|
|
9027
8463
|
return x >= itemRect.left && x <= itemRect.right && y >= itemRect.top && y <= itemRect.bottom;
|
|
9028
8464
|
});
|
|
9029
8465
|
}
|
|
9030
|
-
function isPointOverFooterColumn(x, y) {
|
|
9031
|
-
return listFooterColumns().some((col) => {
|
|
9032
|
-
const r2 = col.getBoundingClientRect();
|
|
9033
|
-
return x >= r2.left && x <= r2.right && y >= r2.top && y <= r2.bottom;
|
|
9034
|
-
});
|
|
9035
|
-
}
|
|
9036
8466
|
function resolveNavContainerSelectionTarget(target, clientX, clientY) {
|
|
9037
8467
|
if (getNavigationItemAnchor(target)) return null;
|
|
9038
8468
|
if (target.closest('[data-ohw-role="navbar-button"]')) return null;
|
|
@@ -9063,10 +8493,7 @@ function getNavigationSelectionParent(el) {
|
|
|
9063
8493
|
if (footerGroup) return footerGroup;
|
|
9064
8494
|
return getNavigationRoot(el);
|
|
9065
8495
|
}
|
|
9066
|
-
if (
|
|
9067
|
-
return getFooterLinksContainer();
|
|
9068
|
-
}
|
|
9069
|
-
if (el.hasAttribute("data-ohw-nav-container") || el.hasAttribute("data-ohw-footer-col") || el.hasAttribute("data-ohw-footer-column") || isFooterLinksContainer(el) || isInferredFooterGroup(el)) {
|
|
8496
|
+
if (el.hasAttribute("data-ohw-nav-container") || el.hasAttribute("data-ohw-footer-col") || el.hasAttribute("data-ohw-footer-column") || isInferredFooterGroup(el)) {
|
|
9070
8497
|
return getNavigationRoot(el);
|
|
9071
8498
|
}
|
|
9072
8499
|
return null;
|
|
@@ -9293,7 +8720,7 @@ function EditGlowChrome({
|
|
|
9293
8720
|
hideHandle = false
|
|
9294
8721
|
}) {
|
|
9295
8722
|
const GAP = SELECTION_CHROME_GAP2;
|
|
9296
|
-
return /* @__PURE__ */
|
|
8723
|
+
return /* @__PURE__ */ jsxs14(
|
|
9297
8724
|
"div",
|
|
9298
8725
|
{
|
|
9299
8726
|
ref: elRef,
|
|
@@ -9308,7 +8735,7 @@ function EditGlowChrome({
|
|
|
9308
8735
|
zIndex: 2147483646
|
|
9309
8736
|
},
|
|
9310
8737
|
children: [
|
|
9311
|
-
/* @__PURE__ */
|
|
8738
|
+
/* @__PURE__ */ jsx25(
|
|
9312
8739
|
"div",
|
|
9313
8740
|
{
|
|
9314
8741
|
style: {
|
|
@@ -9321,7 +8748,7 @@ function EditGlowChrome({
|
|
|
9321
8748
|
}
|
|
9322
8749
|
}
|
|
9323
8750
|
),
|
|
9324
|
-
reorderHrefKey && !hideHandle && /* @__PURE__ */
|
|
8751
|
+
reorderHrefKey && !hideHandle && /* @__PURE__ */ jsx25(
|
|
9325
8752
|
"div",
|
|
9326
8753
|
{
|
|
9327
8754
|
"data-ohw-drag-handle-container": "",
|
|
@@ -9333,7 +8760,7 @@ function EditGlowChrome({
|
|
|
9333
8760
|
transform: "translate(calc(-100% - 7px), -50%)",
|
|
9334
8761
|
pointerEvents: dragDisabled ? "none" : "auto"
|
|
9335
8762
|
},
|
|
9336
|
-
children: /* @__PURE__ */
|
|
8763
|
+
children: /* @__PURE__ */ jsx25(
|
|
9337
8764
|
DragHandle,
|
|
9338
8765
|
{
|
|
9339
8766
|
"aria-label": `Reorder ${reorderHrefKey}`,
|
|
@@ -9543,7 +8970,7 @@ function FloatingToolbar({
|
|
|
9543
8970
|
return () => ro.disconnect();
|
|
9544
8971
|
}, [showEditLink, activeCommands]);
|
|
9545
8972
|
const { top, left, transform } = calcToolbarPos(rect, parentScroll, measuredW);
|
|
9546
|
-
return /* @__PURE__ */
|
|
8973
|
+
return /* @__PURE__ */ jsx25(
|
|
9547
8974
|
"div",
|
|
9548
8975
|
{
|
|
9549
8976
|
ref: setRefs,
|
|
@@ -9555,12 +8982,12 @@ function FloatingToolbar({
|
|
|
9555
8982
|
zIndex: 2147483647,
|
|
9556
8983
|
pointerEvents: "auto"
|
|
9557
8984
|
},
|
|
9558
|
-
children: /* @__PURE__ */
|
|
9559
|
-
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */
|
|
9560
|
-
gi > 0 && /* @__PURE__ */
|
|
8985
|
+
children: /* @__PURE__ */ jsxs14(CustomToolbar, { children: [
|
|
8986
|
+
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ jsxs14(React11.Fragment, { children: [
|
|
8987
|
+
gi > 0 && /* @__PURE__ */ jsx25(CustomToolbarDivider, {}),
|
|
9561
8988
|
btns.map((btn) => {
|
|
9562
8989
|
const isActive = activeCommands.has(btn.cmd);
|
|
9563
|
-
return /* @__PURE__ */
|
|
8990
|
+
return /* @__PURE__ */ jsx25(
|
|
9564
8991
|
CustomToolbarButton,
|
|
9565
8992
|
{
|
|
9566
8993
|
title: btn.title,
|
|
@@ -9569,7 +8996,7 @@ function FloatingToolbar({
|
|
|
9569
8996
|
e.preventDefault();
|
|
9570
8997
|
onCommand(btn.cmd);
|
|
9571
8998
|
},
|
|
9572
|
-
children: /* @__PURE__ */
|
|
8999
|
+
children: /* @__PURE__ */ jsx25(
|
|
9573
9000
|
"svg",
|
|
9574
9001
|
{
|
|
9575
9002
|
width: "16",
|
|
@@ -9590,7 +9017,7 @@ function FloatingToolbar({
|
|
|
9590
9017
|
);
|
|
9591
9018
|
})
|
|
9592
9019
|
] }, gi)),
|
|
9593
|
-
showEditLink ? /* @__PURE__ */
|
|
9020
|
+
showEditLink ? /* @__PURE__ */ jsx25(
|
|
9594
9021
|
CustomToolbarButton,
|
|
9595
9022
|
{
|
|
9596
9023
|
type: "button",
|
|
@@ -9604,7 +9031,7 @@ function FloatingToolbar({
|
|
|
9604
9031
|
e.preventDefault();
|
|
9605
9032
|
e.stopPropagation();
|
|
9606
9033
|
},
|
|
9607
|
-
children: /* @__PURE__ */
|
|
9034
|
+
children: /* @__PURE__ */ jsx25(Link2, { className: "size-4 shrink-0", "aria-hidden": true })
|
|
9608
9035
|
}
|
|
9609
9036
|
) : null
|
|
9610
9037
|
] })
|
|
@@ -9621,7 +9048,7 @@ function StateToggle({
|
|
|
9621
9048
|
states,
|
|
9622
9049
|
onStateChange
|
|
9623
9050
|
}) {
|
|
9624
|
-
return /* @__PURE__ */
|
|
9051
|
+
return /* @__PURE__ */ jsx25(
|
|
9625
9052
|
ToggleGroup,
|
|
9626
9053
|
{
|
|
9627
9054
|
"data-ohw-state-toggle": "",
|
|
@@ -9635,7 +9062,7 @@ function StateToggle({
|
|
|
9635
9062
|
left: rect.right - 8,
|
|
9636
9063
|
transform: "translateX(-100%)"
|
|
9637
9064
|
},
|
|
9638
|
-
children: states.map((state) => /* @__PURE__ */
|
|
9065
|
+
children: states.map((state) => /* @__PURE__ */ jsx25(ToggleGroupItem, { value: state, size: "sm", children: state }, state))
|
|
9639
9066
|
}
|
|
9640
9067
|
);
|
|
9641
9068
|
}
|
|
@@ -9662,7 +9089,7 @@ function OhhwellsBridge() {
|
|
|
9662
9089
|
const router = useRouter2();
|
|
9663
9090
|
const searchParams = useSearchParams();
|
|
9664
9091
|
const isEditMode = isEditSessionActive();
|
|
9665
|
-
const [bridgeRoot, setBridgeRoot] =
|
|
9092
|
+
const [bridgeRoot, setBridgeRoot] = useState8(null);
|
|
9666
9093
|
useEffect9(() => {
|
|
9667
9094
|
const figtreeFontId = "ohw-figtree-font";
|
|
9668
9095
|
if (!document.getElementById(figtreeFontId)) {
|
|
@@ -9696,7 +9123,7 @@ function OhhwellsBridge() {
|
|
|
9696
9123
|
window.parent.postMessage(data, "*");
|
|
9697
9124
|
}
|
|
9698
9125
|
}, []);
|
|
9699
|
-
const [fetchState, setFetchState] =
|
|
9126
|
+
const [fetchState, setFetchState] = useState8("idle");
|
|
9700
9127
|
const autoSaveTimers = useRef7(/* @__PURE__ */ new Map());
|
|
9701
9128
|
const activeElRef = useRef7(null);
|
|
9702
9129
|
const pointerHeldRef = useRef7(false);
|
|
@@ -9707,7 +9134,7 @@ function OhhwellsBridge() {
|
|
|
9707
9134
|
const activeStateElRef = useRef7(null);
|
|
9708
9135
|
const parentScrollRef = useRef7(null);
|
|
9709
9136
|
const visibleViewportRef = useRef7(null);
|
|
9710
|
-
const [dialogPortalContainer, setDialogPortalContainer] =
|
|
9137
|
+
const [dialogPortalContainer, setDialogPortalContainer] = useState8(null);
|
|
9711
9138
|
const attachVisibleViewport = useCallback5((node) => {
|
|
9712
9139
|
visibleViewportRef.current = node;
|
|
9713
9140
|
setDialogPortalContainer(node);
|
|
@@ -9718,9 +9145,9 @@ function OhhwellsBridge() {
|
|
|
9718
9145
|
const hoveredImageRef = useRef7(null);
|
|
9719
9146
|
const hoveredImageHasTextOverlapRef = useRef7(false);
|
|
9720
9147
|
const dragOverElRef = useRef7(null);
|
|
9721
|
-
const [mediaHover, setMediaHover] =
|
|
9722
|
-
const [carouselHover, setCarouselHover] =
|
|
9723
|
-
const [uploadingRects, setUploadingRects] =
|
|
9148
|
+
const [mediaHover, setMediaHover] = useState8(null);
|
|
9149
|
+
const [carouselHover, setCarouselHover] = useState8(null);
|
|
9150
|
+
const [uploadingRects, setUploadingRects] = useState8({});
|
|
9724
9151
|
const hoveredGapRef = useRef7(null);
|
|
9725
9152
|
const imageUnhoverTimerRef = useRef7(null);
|
|
9726
9153
|
const imageShowTimerRef = useRef7(null);
|
|
@@ -9745,40 +9172,40 @@ function OhhwellsBridge() {
|
|
|
9745
9172
|
postToParentRef.current = postToParent2;
|
|
9746
9173
|
const sectionsLoadedRef = useRef7(false);
|
|
9747
9174
|
const pendingScheduleConfigRequests = useRef7([]);
|
|
9748
|
-
const [toolbarRect, setToolbarRect] =
|
|
9749
|
-
const [toolbarVariant, setToolbarVariant] =
|
|
9175
|
+
const [toolbarRect, setToolbarRect] = useState8(null);
|
|
9176
|
+
const [toolbarVariant, setToolbarVariant] = useState8("none");
|
|
9750
9177
|
const toolbarVariantRef = useRef7("none");
|
|
9751
9178
|
toolbarVariantRef.current = toolbarVariant;
|
|
9752
|
-
const [selectedIsCta, setSelectedIsCta] =
|
|
9753
|
-
const [reorderHrefKey, setReorderHrefKey] =
|
|
9754
|
-
const [reorderDragDisabled, setReorderDragDisabled] =
|
|
9755
|
-
const [toggleState, setToggleState] =
|
|
9756
|
-
const [maxBadge, setMaxBadge] =
|
|
9757
|
-
const [activeCommands, setActiveCommands] =
|
|
9758
|
-
const [sectionGap, setSectionGap] =
|
|
9759
|
-
const [toolbarShowEditLink, setToolbarShowEditLink] =
|
|
9179
|
+
const [selectedIsCta, setSelectedIsCta] = useState8(false);
|
|
9180
|
+
const [reorderHrefKey, setReorderHrefKey] = useState8(null);
|
|
9181
|
+
const [reorderDragDisabled, setReorderDragDisabled] = useState8(false);
|
|
9182
|
+
const [toggleState, setToggleState] = useState8(null);
|
|
9183
|
+
const [maxBadge, setMaxBadge] = useState8(null);
|
|
9184
|
+
const [activeCommands, setActiveCommands] = useState8(/* @__PURE__ */ new Set());
|
|
9185
|
+
const [sectionGap, setSectionGap] = useState8(null);
|
|
9186
|
+
const [toolbarShowEditLink, setToolbarShowEditLink] = useState8(false);
|
|
9760
9187
|
const hoveredNavContainerRef = useRef7(null);
|
|
9761
|
-
const [hoveredNavContainerRect, setHoveredNavContainerRect] =
|
|
9188
|
+
const [hoveredNavContainerRect, setHoveredNavContainerRect] = useState8(null);
|
|
9762
9189
|
const hoveredItemElRef = useRef7(null);
|
|
9763
|
-
const [hoveredItemRect, setHoveredItemRect] =
|
|
9190
|
+
const [hoveredItemRect, setHoveredItemRect] = useState8(null);
|
|
9764
9191
|
const siblingHintElRef = useRef7(null);
|
|
9765
|
-
const [siblingHintRect, setSiblingHintRect] =
|
|
9766
|
-
const [siblingHintRects, setSiblingHintRects] =
|
|
9767
|
-
const [isItemDragging, setIsItemDragging] =
|
|
9768
|
-
const [isFooterFrameSelection, setIsFooterFrameSelection] =
|
|
9192
|
+
const [siblingHintRect, setSiblingHintRect] = useState8(null);
|
|
9193
|
+
const [siblingHintRects, setSiblingHintRects] = useState8([]);
|
|
9194
|
+
const [isItemDragging, setIsItemDragging] = useState8(false);
|
|
9195
|
+
const [isFooterFrameSelection, setIsFooterFrameSelection] = useState8(false);
|
|
9769
9196
|
const footerDragRef = useRef7(null);
|
|
9770
|
-
const [footerDropSlots, setFooterDropSlots] =
|
|
9771
|
-
const [activeFooterDropIndex, setActiveFooterDropIndex] =
|
|
9772
|
-
const [draggedItemRect, setDraggedItemRect] =
|
|
9197
|
+
const [footerDropSlots, setFooterDropSlots] = useState8([]);
|
|
9198
|
+
const [activeFooterDropIndex, setActiveFooterDropIndex] = useState8(null);
|
|
9199
|
+
const [draggedItemRect, setDraggedItemRect] = useState8(null);
|
|
9773
9200
|
const footerPointerDragRef = useRef7(null);
|
|
9774
9201
|
const suppressNextClickRef = useRef7(false);
|
|
9775
9202
|
const suppressClickUntilRef = useRef7(0);
|
|
9776
|
-
const [linkPopover, setLinkPopover] =
|
|
9203
|
+
const [linkPopover, setLinkPopover] = useState8(null);
|
|
9777
9204
|
const linkPopoverSessionRef = useRef7(null);
|
|
9778
9205
|
const addNavAfterAnchorRef = useRef7(null);
|
|
9779
9206
|
const editContentRef = useRef7({});
|
|
9780
|
-
const [sitePages, setSitePages] =
|
|
9781
|
-
const [sectionsByPath, setSectionsByPath] =
|
|
9207
|
+
const [sitePages, setSitePages] = useState8([]);
|
|
9208
|
+
const [sectionsByPath, setSectionsByPath] = useState8({});
|
|
9782
9209
|
const sectionsPrefetchGenRef = useRef7(0);
|
|
9783
9210
|
const setLinkPopoverRef = useRef7(setLinkPopover);
|
|
9784
9211
|
const linkPopoverPanelRef = useRef7(null);
|
|
@@ -10132,27 +9559,6 @@ function OhhwellsBridge() {
|
|
|
10132
9559
|
intent: "add-nav"
|
|
10133
9560
|
});
|
|
10134
9561
|
}, []);
|
|
10135
|
-
const handleAddFooterColumn = useCallback5(() => {
|
|
10136
|
-
if (!canAddFooterColumn()) {
|
|
10137
|
-
postToParent2({
|
|
10138
|
-
type: "ow:toast",
|
|
10139
|
-
title: `Maximum ${MAX_FOOTER_COLUMNS} columns`,
|
|
10140
|
-
toastType: "error"
|
|
10141
|
-
});
|
|
10142
|
-
return;
|
|
10143
|
-
}
|
|
10144
|
-
deselectRef.current();
|
|
10145
|
-
deactivateRef.current();
|
|
10146
|
-
const result = addFooterColumnWithPersist({ postToParent: postToParent2 });
|
|
10147
|
-
if (!result) return;
|
|
10148
|
-
editContentRef.current = {
|
|
10149
|
-
...editContentRef.current,
|
|
10150
|
-
...buildFooterColumnEditContentPatch(result)
|
|
10151
|
-
};
|
|
10152
|
-
requestAnimationFrame(() => {
|
|
10153
|
-
selectRef.current(result.firstLink);
|
|
10154
|
-
});
|
|
10155
|
-
}, [postToParent2]);
|
|
10156
9562
|
const clearFooterDragVisuals = useCallback5(() => {
|
|
10157
9563
|
footerDragRef.current = null;
|
|
10158
9564
|
setSiblingHintRects([]);
|
|
@@ -10477,7 +9883,7 @@ function OhhwellsBridge() {
|
|
|
10477
9883
|
const selectFrame = useCallback5((el) => {
|
|
10478
9884
|
if (!isNavigationContainer(el)) return;
|
|
10479
9885
|
if (activeElRef.current) deactivate();
|
|
10480
|
-
const isFooterColumn =
|
|
9886
|
+
const isFooterColumn = el.hasAttribute("data-ohw-footer-col") || Boolean(el.closest("footer") && isInferredFooterGroup(el));
|
|
10481
9887
|
selectedElRef.current = el;
|
|
10482
9888
|
selectedHrefKeyRef.current = null;
|
|
10483
9889
|
selectedFooterColAttrRef.current = isFooterColumn ? el.getAttribute("data-ohw-footer-col") ?? String(listFooterColumns().indexOf(el)) : null;
|
|
@@ -11010,7 +10416,7 @@ function OhhwellsBridge() {
|
|
|
11010
10416
|
setLinkPopoverRef.current({
|
|
11011
10417
|
key: editable.dataset.ohwKey ?? "",
|
|
11012
10418
|
mode: "edit",
|
|
11013
|
-
target:
|
|
10419
|
+
target: getLinkHref2(editable)
|
|
11014
10420
|
});
|
|
11015
10421
|
return;
|
|
11016
10422
|
}
|
|
@@ -11035,7 +10441,7 @@ function OhhwellsBridge() {
|
|
|
11035
10441
|
}
|
|
11036
10442
|
e.preventDefault();
|
|
11037
10443
|
e.stopPropagation();
|
|
11038
|
-
activateRef.current(editable
|
|
10444
|
+
activateRef.current(editable);
|
|
11039
10445
|
return;
|
|
11040
10446
|
}
|
|
11041
10447
|
const hrefAnchor = getNavigationItemAnchor(target);
|
|
@@ -11062,18 +10468,6 @@ function OhhwellsBridge() {
|
|
|
11062
10468
|
selectFrameRef.current(footerColClick);
|
|
11063
10469
|
return;
|
|
11064
10470
|
}
|
|
11065
|
-
const footerLinksToSelect = resolveFooterLinksContainerSelectionTarget(
|
|
11066
|
-
target,
|
|
11067
|
-
e.clientX,
|
|
11068
|
-
e.clientY,
|
|
11069
|
-
isPointOverNavItem
|
|
11070
|
-
);
|
|
11071
|
-
if (footerLinksToSelect) {
|
|
11072
|
-
e.preventDefault();
|
|
11073
|
-
e.stopPropagation();
|
|
11074
|
-
selectFrameRef.current(footerLinksToSelect);
|
|
11075
|
-
return;
|
|
11076
|
-
}
|
|
11077
10471
|
const navContainerToSelect = resolveNavContainerSelectionTarget(target, e.clientX, e.clientY);
|
|
11078
10472
|
if (navContainerToSelect) {
|
|
11079
10473
|
e.preventDefault();
|
|
@@ -11132,8 +10526,8 @@ function OhhwellsBridge() {
|
|
|
11132
10526
|
return;
|
|
11133
10527
|
}
|
|
11134
10528
|
const navLabel = getNavigationLabelEditable(target);
|
|
11135
|
-
|
|
11136
|
-
|
|
10529
|
+
if (!navLabel) return;
|
|
10530
|
+
const { editable } = navLabel;
|
|
11137
10531
|
e.preventDefault();
|
|
11138
10532
|
e.stopPropagation();
|
|
11139
10533
|
if (activeElRef.current !== editable) {
|
|
@@ -11154,38 +10548,16 @@ function OhhwellsBridge() {
|
|
|
11154
10548
|
setHoveredNavContainerRect(null);
|
|
11155
10549
|
return;
|
|
11156
10550
|
}
|
|
11157
|
-
{
|
|
11158
|
-
const
|
|
11159
|
-
|
|
11160
|
-
|
|
11161
|
-
|
|
11162
|
-
|
|
11163
|
-
|
|
11164
|
-
|
|
11165
|
-
hoveredNavContainerRef.current = navContainer;
|
|
11166
|
-
setHoveredNavContainerRect(navContainer.getBoundingClientRect());
|
|
11167
|
-
hoveredItemElRef.current = null;
|
|
11168
|
-
setHoveredItemRect(null);
|
|
11169
|
-
return;
|
|
11170
|
-
}
|
|
10551
|
+
if (toolbarVariantRef.current !== "select-frame") {
|
|
10552
|
+
const navContainer = target.closest("[data-ohw-nav-container]");
|
|
10553
|
+
if (navContainer && !getNavigationItemAnchor(target)) {
|
|
10554
|
+
hoveredNavContainerRef.current = navContainer;
|
|
10555
|
+
setHoveredNavContainerRect(navContainer.getBoundingClientRect());
|
|
10556
|
+
hoveredItemElRef.current = null;
|
|
10557
|
+
setHoveredItemRect(null);
|
|
10558
|
+
return;
|
|
11171
10559
|
}
|
|
11172
|
-
if (
|
|
11173
|
-
const navContainer = target.closest("[data-ohw-nav-container]");
|
|
11174
|
-
if (!navContainer) {
|
|
11175
|
-
const footerLinks = target.closest("[data-ohw-footer-links], .rb-footer-links") ?? null;
|
|
11176
|
-
if (footerLinks && selected2 !== footerLinks && !getNavigationItemAnchor(target) && !target.closest("[data-ohw-footer-col], [data-ohw-footer-column]")) {
|
|
11177
|
-
hoveredNavContainerRef.current = footerLinks;
|
|
11178
|
-
setHoveredNavContainerRect(footerLinks.getBoundingClientRect());
|
|
11179
|
-
hoveredItemElRef.current = null;
|
|
11180
|
-
setHoveredItemRect(null);
|
|
11181
|
-
return;
|
|
11182
|
-
}
|
|
11183
|
-
if (!footerLinks) {
|
|
11184
|
-
hoveredNavContainerRef.current = null;
|
|
11185
|
-
setHoveredNavContainerRect(null);
|
|
11186
|
-
}
|
|
11187
|
-
}
|
|
11188
|
-
} else if (toolbarVariantRef.current === "select-frame") {
|
|
10560
|
+
if (!target.closest("[data-ohw-nav-container]")) {
|
|
11189
10561
|
hoveredNavContainerRef.current = null;
|
|
11190
10562
|
setHoveredNavContainerRect(null);
|
|
11191
10563
|
}
|
|
@@ -11227,9 +10599,9 @@ function OhhwellsBridge() {
|
|
|
11227
10599
|
};
|
|
11228
10600
|
const handleMouseOut = (e) => {
|
|
11229
10601
|
const target = e.target;
|
|
11230
|
-
if (target.closest("[data-ohw-nav-container], [data-ohw-footer-col], [data-ohw-footer-column]
|
|
10602
|
+
if (target.closest("[data-ohw-nav-container], [data-ohw-footer-col], [data-ohw-footer-column]")) {
|
|
11231
10603
|
const related2 = e.relatedTarget instanceof Element ? e.relatedTarget : null;
|
|
11232
|
-
if (related2?.closest("[data-ohw-nav-container], [data-ohw-footer-col], [data-ohw-footer-column], [data-ohw-
|
|
10604
|
+
if (related2?.closest("[data-ohw-nav-container], [data-ohw-footer-col], [data-ohw-footer-column], [data-ohw-navbar-container-chrome], [data-ohw-navbar-add-button]")) {
|
|
11233
10605
|
return;
|
|
11234
10606
|
}
|
|
11235
10607
|
hoveredNavContainerRef.current = null;
|
|
@@ -11324,15 +10696,6 @@ function OhhwellsBridge() {
|
|
|
11324
10696
|
if (track) track.setAttribute("data-ohw-hover-paused", "");
|
|
11325
10697
|
};
|
|
11326
10698
|
const clearImageHover = () => setMediaHover(null);
|
|
11327
|
-
const dismissImageHover = () => {
|
|
11328
|
-
if (hoveredImageRef.current) {
|
|
11329
|
-
hoveredImageRef.current = null;
|
|
11330
|
-
hoveredImageHasTextOverlapRef.current = false;
|
|
11331
|
-
resumeAnimTracks();
|
|
11332
|
-
postToParentRef.current({ type: "ow:image-unhover" });
|
|
11333
|
-
}
|
|
11334
|
-
clearImageHover();
|
|
11335
|
-
};
|
|
11336
10699
|
const findImageAtPoint = (clientX, clientY, fromParentViewport) => {
|
|
11337
10700
|
const { x, y } = toProbeCoords(clientX, clientY, fromParentViewport);
|
|
11338
10701
|
const images = Array.from(document.querySelectorAll(MEDIA_SELECTOR));
|
|
@@ -11376,13 +10739,16 @@ function OhhwellsBridge() {
|
|
|
11376
10739
|
}
|
|
11377
10740
|
return smallest;
|
|
11378
10741
|
};
|
|
10742
|
+
const dismissImageHover = () => {
|
|
10743
|
+
if (hoveredImageRef.current) {
|
|
10744
|
+
hoveredImageRef.current = null;
|
|
10745
|
+
hoveredImageHasTextOverlapRef.current = false;
|
|
10746
|
+
resumeAnimTracks();
|
|
10747
|
+
postToParentRef.current({ type: "ow:image-unhover" });
|
|
10748
|
+
}
|
|
10749
|
+
};
|
|
11379
10750
|
const probeNavigationHoverAt = (x, y) => {
|
|
11380
|
-
|
|
11381
|
-
const selectedIsFooterColumn = Boolean(selected) && !isFooterLinksContainer(selected) && (selected.hasAttribute("data-ohw-footer-col") || selected.hasAttribute("data-ohw-footer-column") || Boolean(selected.closest("footer") && isInferredFooterGroup(selected)));
|
|
11382
|
-
const selectedIsFooterLinks = Boolean(selected && isFooterLinksContainer(selected));
|
|
11383
|
-
const allowNavContainerHover = toolbarVariantRef.current !== "select-frame";
|
|
11384
|
-
const allowFooterLinksHover = (toolbarVariantRef.current !== "select-frame" || selectedIsFooterColumn) && !selectedIsFooterLinks;
|
|
11385
|
-
if (toolbarVariantRef.current === "select-frame" && !allowFooterLinksHover) {
|
|
10751
|
+
if (toolbarVariantRef.current === "select-frame") {
|
|
11386
10752
|
hoveredNavContainerRef.current = null;
|
|
11387
10753
|
setHoveredNavContainerRect(null);
|
|
11388
10754
|
}
|
|
@@ -11404,6 +10770,7 @@ function OhhwellsBridge() {
|
|
|
11404
10770
|
if (navItemHit) {
|
|
11405
10771
|
hoveredNavContainerRef.current = null;
|
|
11406
10772
|
setHoveredNavContainerRect(null);
|
|
10773
|
+
const selected = selectedElRef.current;
|
|
11407
10774
|
if (selected !== navItemHit) {
|
|
11408
10775
|
clearHrefKeyHover(navItemHit);
|
|
11409
10776
|
hoveredItemElRef.current = navItemHit;
|
|
@@ -11415,7 +10782,7 @@ function OhhwellsBridge() {
|
|
|
11415
10782
|
return;
|
|
11416
10783
|
}
|
|
11417
10784
|
}
|
|
11418
|
-
if (
|
|
10785
|
+
if (toolbarVariantRef.current !== "select-frame") {
|
|
11419
10786
|
for (const container of navContainers) {
|
|
11420
10787
|
const containerRect = container.getBoundingClientRect();
|
|
11421
10788
|
const overContainer = x >= containerRect.left && x <= containerRect.right && y >= containerRect.top && y <= containerRect.bottom;
|
|
@@ -11427,23 +10794,12 @@ function OhhwellsBridge() {
|
|
|
11427
10794
|
setHoveredItemRect(null);
|
|
11428
10795
|
return;
|
|
11429
10796
|
}
|
|
10797
|
+
hoveredNavContainerRef.current = null;
|
|
10798
|
+
setHoveredNavContainerRect(null);
|
|
10799
|
+
} else {
|
|
10800
|
+
hoveredNavContainerRef.current = null;
|
|
10801
|
+
setHoveredNavContainerRect(null);
|
|
11430
10802
|
}
|
|
11431
|
-
if (allowFooterLinksHover) {
|
|
11432
|
-
const footerLinks = getFooterLinksContainer();
|
|
11433
|
-
if (footerLinks) {
|
|
11434
|
-
const containerRect = footerLinks.getBoundingClientRect();
|
|
11435
|
-
const overContainer = x >= containerRect.left && x <= containerRect.right && y >= containerRect.top && y <= containerRect.bottom;
|
|
11436
|
-
if (overContainer && !isPointOverNavItem(footerLinks, x, y) && !isPointOverFooterColumn(x, y)) {
|
|
11437
|
-
hoveredNavContainerRef.current = footerLinks;
|
|
11438
|
-
setHoveredNavContainerRect(footerLinks.getBoundingClientRect());
|
|
11439
|
-
hoveredItemElRef.current = null;
|
|
11440
|
-
setHoveredItemRect(null);
|
|
11441
|
-
return;
|
|
11442
|
-
}
|
|
11443
|
-
}
|
|
11444
|
-
}
|
|
11445
|
-
hoveredNavContainerRef.current = null;
|
|
11446
|
-
setHoveredNavContainerRect(null);
|
|
11447
10803
|
for (const column of footerColumns) {
|
|
11448
10804
|
const containerRect = column.getBoundingClientRect();
|
|
11449
10805
|
const overContainer = x >= containerRect.left && x <= containerRect.right && y >= containerRect.top && y <= containerRect.bottom;
|
|
@@ -11482,13 +10838,6 @@ function OhhwellsBridge() {
|
|
|
11482
10838
|
probeNavigationHoverAt(x, y);
|
|
11483
10839
|
return;
|
|
11484
10840
|
}
|
|
11485
|
-
const overMoreMenu = document.elementFromPoint(x, y)?.closest?.(
|
|
11486
|
-
'[data-ohw-more-menu], [data-slot="dropdown-menu-content"], [data-slot="dropdown-menu-item"]'
|
|
11487
|
-
);
|
|
11488
|
-
if (overMoreMenu) {
|
|
11489
|
-
dismissImageHover();
|
|
11490
|
-
return;
|
|
11491
|
-
}
|
|
11492
10841
|
hoveredNavContainerRef.current = null;
|
|
11493
10842
|
setHoveredNavContainerRect(null);
|
|
11494
10843
|
if (hoveredItemElRef.current?.hasAttribute("data-ohw-footer-col") || hoveredItemElRef.current?.hasAttribute("data-ohw-footer-column")) {
|
|
@@ -11535,7 +10884,7 @@ function OhhwellsBridge() {
|
|
|
11535
10884
|
return;
|
|
11536
10885
|
}
|
|
11537
10886
|
const topEl = document.elementFromPoint(x2, y2);
|
|
11538
|
-
if (topEl?.closest('[data-ohw-toolbar], [data-ohw-edit-chrome], [data-ohw-item-interaction], [data-ohw-drag-handle-container], [data-slot="drag-handle"]
|
|
10887
|
+
if (topEl?.closest('[data-ohw-toolbar], [data-ohw-edit-chrome], [data-ohw-item-interaction], [data-ohw-drag-handle-container], [data-slot="drag-handle"]')) {
|
|
11539
10888
|
if (hoveredImageRef.current) {
|
|
11540
10889
|
hoveredImageRef.current = null;
|
|
11541
10890
|
resumeAnimTracks();
|
|
@@ -11959,7 +11308,6 @@ function OhhwellsBridge() {
|
|
|
11959
11308
|
}
|
|
11960
11309
|
editContentRef.current = { ...editContentRef.current, ...content };
|
|
11961
11310
|
reconcileNavbarItemsFromContent(editContentRef.current);
|
|
11962
|
-
reconcileFooterOrderFromContent(editContentRef.current);
|
|
11963
11311
|
syncNavigationDragCursorAttrs();
|
|
11964
11312
|
enforceLinkHrefs();
|
|
11965
11313
|
postToParentRef.current({ type: "ow:hydrate-done" });
|
|
@@ -11979,7 +11327,6 @@ function OhhwellsBridge() {
|
|
|
11979
11327
|
window.addEventListener("message", handleDeactivate);
|
|
11980
11328
|
const handleUiEscape = (e) => {
|
|
11981
11329
|
if (e.data?.type !== "ui:escape") return;
|
|
11982
|
-
if (document.querySelector("[data-ohw-more-menu]")) return;
|
|
11983
11330
|
if (linkPopoverOpenRef.current) {
|
|
11984
11331
|
setLinkPopoverRef.current(null);
|
|
11985
11332
|
return;
|
|
@@ -12015,11 +11362,6 @@ function OhhwellsBridge() {
|
|
|
12015
11362
|
}
|
|
12016
11363
|
if (selectedElRef.current) {
|
|
12017
11364
|
if (toolbarVariantRef.current === "select-frame") {
|
|
12018
|
-
const parent2 = getNavigationSelectionParent(selectedElRef.current);
|
|
12019
|
-
if (parent2 && isNavigationContainer(parent2) && isFooterLinksContainer(parent2) && !isFooterLinksContainer(selectedElRef.current)) {
|
|
12020
|
-
selectFrameRef.current(parent2);
|
|
12021
|
-
return;
|
|
12022
|
-
}
|
|
12023
11365
|
deselectRef.current();
|
|
12024
11366
|
return;
|
|
12025
11367
|
}
|
|
@@ -12034,12 +11376,14 @@ function OhhwellsBridge() {
|
|
|
12034
11376
|
window.addEventListener("message", handleUiEscape);
|
|
12035
11377
|
const handleKeyDown = (e) => {
|
|
12036
11378
|
if (e.key === "Escape" && document.querySelector("[data-ohw-section-picker]")) return;
|
|
12037
|
-
if (e.key === "Escape" && document.querySelector("[data-ohw-more-menu]")) return;
|
|
12038
11379
|
if ((e.ctrlKey || e.metaKey) && e.key.toLowerCase() === "a" && activeElRef.current) {
|
|
12039
|
-
|
|
12040
|
-
|
|
12041
|
-
|
|
12042
|
-
|
|
11380
|
+
const navAnchor = getNavigationItemAnchor(activeElRef.current);
|
|
11381
|
+
if (navAnchor) {
|
|
11382
|
+
e.preventDefault();
|
|
11383
|
+
selectAllTextInEditable(activeElRef.current);
|
|
11384
|
+
refreshActiveCommandsRef.current();
|
|
11385
|
+
return;
|
|
11386
|
+
}
|
|
12043
11387
|
}
|
|
12044
11388
|
if (e.key === "Escape" && linkPopoverOpenRef.current) {
|
|
12045
11389
|
setLinkPopoverRef.current(null);
|
|
@@ -12047,12 +11391,6 @@ function OhhwellsBridge() {
|
|
|
12047
11391
|
}
|
|
12048
11392
|
if (e.key === "Escape" && selectedElRef.current && !activeElRef.current) {
|
|
12049
11393
|
if (toolbarVariantRef.current === "select-frame") {
|
|
12050
|
-
const parent2 = getNavigationSelectionParent(selectedElRef.current);
|
|
12051
|
-
if (parent2 && isNavigationContainer(parent2) && isFooterLinksContainer(parent2) && !isFooterLinksContainer(selectedElRef.current)) {
|
|
12052
|
-
e.preventDefault();
|
|
12053
|
-
selectFrameRef.current(parent2);
|
|
12054
|
-
return;
|
|
12055
|
-
}
|
|
12056
11394
|
deselectRef.current();
|
|
12057
11395
|
return;
|
|
12058
11396
|
}
|
|
@@ -12773,7 +12111,7 @@ function OhhwellsBridge() {
|
|
|
12773
12111
|
setLinkPopover({
|
|
12774
12112
|
key: hrefCtx.key,
|
|
12775
12113
|
mode: "edit",
|
|
12776
|
-
target:
|
|
12114
|
+
target: getLinkHref2(hrefCtx.anchor)
|
|
12777
12115
|
});
|
|
12778
12116
|
deactivate();
|
|
12779
12117
|
}, [deactivate]);
|
|
@@ -12786,107 +12124,10 @@ function OhhwellsBridge() {
|
|
|
12786
12124
|
setLinkPopover({
|
|
12787
12125
|
key,
|
|
12788
12126
|
mode: "edit",
|
|
12789
|
-
target:
|
|
12127
|
+
target: getLinkHref2(anchor)
|
|
12790
12128
|
});
|
|
12791
12129
|
deselect();
|
|
12792
12130
|
}, [deselect]);
|
|
12793
|
-
const handleSelectParent = useCallback5(() => {
|
|
12794
|
-
const selected = selectedElRef.current;
|
|
12795
|
-
if (!selected) return;
|
|
12796
|
-
if (toolbarVariantRef.current === "select-frame") {
|
|
12797
|
-
deselectRef.current();
|
|
12798
|
-
return;
|
|
12799
|
-
}
|
|
12800
|
-
const parent = getNavigationSelectionParent(selected);
|
|
12801
|
-
if (parent && isNavigationContainer(parent)) {
|
|
12802
|
-
selectFrameRef.current(parent);
|
|
12803
|
-
} else {
|
|
12804
|
-
deselectRef.current();
|
|
12805
|
-
}
|
|
12806
|
-
}, []);
|
|
12807
|
-
const handleDuplicateSelected = useCallback5(() => {
|
|
12808
|
-
const selected = selectedElRef.current;
|
|
12809
|
-
if (!selected || !isNavigationItem(selected)) return;
|
|
12810
|
-
const hrefKey = selected.getAttribute("data-ohw-href-key");
|
|
12811
|
-
if (!hrefKey) return;
|
|
12812
|
-
if (isNavbarHrefKey(hrefKey)) {
|
|
12813
|
-
const result = duplicateNavbarItem(selected);
|
|
12814
|
-
if (!result) return;
|
|
12815
|
-
applyLinkByKey(result.hrefKey, result.href);
|
|
12816
|
-
document.querySelectorAll(`[data-ohw-key="${result.labelKey}"]`).forEach((el) => {
|
|
12817
|
-
el.textContent = result.label;
|
|
12818
|
-
});
|
|
12819
|
-
const nodes = [
|
|
12820
|
-
{ key: result.hrefKey, text: result.href },
|
|
12821
|
-
{ key: result.labelKey, text: result.label }
|
|
12822
|
-
];
|
|
12823
|
-
for (const child of result.childResults) {
|
|
12824
|
-
applyLinkByKey(child.hrefKey, child.href);
|
|
12825
|
-
document.querySelectorAll(`[data-ohw-key="${child.labelKey}"]`).forEach((el) => {
|
|
12826
|
-
el.textContent = child.label;
|
|
12827
|
-
});
|
|
12828
|
-
nodes.push(
|
|
12829
|
-
{ key: child.hrefKey, text: child.href },
|
|
12830
|
-
{ key: child.labelKey, text: child.label }
|
|
12831
|
-
);
|
|
12832
|
-
}
|
|
12833
|
-
const maxIndex = Math.max(
|
|
12834
|
-
result.index,
|
|
12835
|
-
...result.childResults.map((c) => c.index)
|
|
12836
|
-
);
|
|
12837
|
-
const navCount = String(maxIndex + 1);
|
|
12838
|
-
nodes.push(
|
|
12839
|
-
{ key: NAV_COUNT_KEY, text: navCount },
|
|
12840
|
-
{ key: NAV_ORDER_KEY, text: result.orderJson }
|
|
12841
|
-
);
|
|
12842
|
-
editContentRef.current = {
|
|
12843
|
-
...editContentRef.current,
|
|
12844
|
-
[result.hrefKey]: result.href,
|
|
12845
|
-
[result.labelKey]: result.label,
|
|
12846
|
-
...Object.fromEntries(
|
|
12847
|
-
result.childResults.flatMap((c) => [
|
|
12848
|
-
[c.hrefKey, c.href],
|
|
12849
|
-
[c.labelKey, c.label]
|
|
12850
|
-
])
|
|
12851
|
-
),
|
|
12852
|
-
[NAV_COUNT_KEY]: navCount,
|
|
12853
|
-
[NAV_ORDER_KEY]: result.orderJson
|
|
12854
|
-
};
|
|
12855
|
-
postToParent2({ type: "ow:change", nodes });
|
|
12856
|
-
enforceLinkHrefs();
|
|
12857
|
-
requestAnimationFrame(() => {
|
|
12858
|
-
selectRef.current(result.anchor);
|
|
12859
|
-
});
|
|
12860
|
-
return;
|
|
12861
|
-
}
|
|
12862
|
-
if (isFooterHrefKey(hrefKey)) {
|
|
12863
|
-
const result = duplicateFooterItem(selected);
|
|
12864
|
-
if (!result) return;
|
|
12865
|
-
applyLinkByKey(result.hrefKey, result.href);
|
|
12866
|
-
document.querySelectorAll(`[data-ohw-key="${result.labelKey}"]`).forEach((el) => {
|
|
12867
|
-
el.textContent = result.label;
|
|
12868
|
-
});
|
|
12869
|
-
const orderJson = JSON.stringify(result.order);
|
|
12870
|
-
editContentRef.current = {
|
|
12871
|
-
...editContentRef.current,
|
|
12872
|
-
[result.hrefKey]: result.href,
|
|
12873
|
-
[result.labelKey]: result.label,
|
|
12874
|
-
[FOOTER_ORDER_KEY]: orderJson
|
|
12875
|
-
};
|
|
12876
|
-
postToParent2({
|
|
12877
|
-
type: "ow:change",
|
|
12878
|
-
nodes: [
|
|
12879
|
-
{ key: result.hrefKey, text: result.href },
|
|
12880
|
-
{ key: result.labelKey, text: result.label },
|
|
12881
|
-
{ key: FOOTER_ORDER_KEY, text: orderJson }
|
|
12882
|
-
]
|
|
12883
|
-
});
|
|
12884
|
-
enforceLinkHrefs();
|
|
12885
|
-
requestAnimationFrame(() => {
|
|
12886
|
-
selectRef.current(result.anchor);
|
|
12887
|
-
});
|
|
12888
|
-
}
|
|
12889
|
-
}, [postToParent2]);
|
|
12890
12131
|
const handleLinkPopoverSubmit = useCallback5(
|
|
12891
12132
|
(target) => {
|
|
12892
12133
|
const session = linkPopoverSessionRef.current;
|
|
@@ -12989,9 +12230,9 @@ function OhhwellsBridge() {
|
|
|
12989
12230
|
[postToParent2]
|
|
12990
12231
|
);
|
|
12991
12232
|
return bridgeRoot ? createPortal2(
|
|
12992
|
-
/* @__PURE__ */
|
|
12993
|
-
/* @__PURE__ */
|
|
12994
|
-
Object.entries(uploadingRects).map(([key, { rect, fadingOut }]) => /* @__PURE__ */
|
|
12233
|
+
/* @__PURE__ */ jsxs14(Fragment5, { children: [
|
|
12234
|
+
/* @__PURE__ */ jsx25("div", { ref: attachVisibleViewport, "data-ohw-visible-viewport": "", "aria-hidden": true }),
|
|
12235
|
+
Object.entries(uploadingRects).map(([key, { rect, fadingOut }]) => /* @__PURE__ */ jsx25(
|
|
12995
12236
|
MediaOverlay,
|
|
12996
12237
|
{
|
|
12997
12238
|
hover: { key, rect, elementType: "image", isDragOver: false, hasTextOverlap: false },
|
|
@@ -13002,7 +12243,7 @@ function OhhwellsBridge() {
|
|
|
13002
12243
|
},
|
|
13003
12244
|
`uploading-${key}`
|
|
13004
12245
|
)),
|
|
13005
|
-
mediaHover && !(mediaHover.key in uploadingRects) && /* @__PURE__ */
|
|
12246
|
+
mediaHover && !(mediaHover.key in uploadingRects) && /* @__PURE__ */ jsx25(
|
|
13006
12247
|
MediaOverlay,
|
|
13007
12248
|
{
|
|
13008
12249
|
hover: mediaHover,
|
|
@@ -13011,11 +12252,11 @@ function OhhwellsBridge() {
|
|
|
13011
12252
|
onVideoSettingsChange: handleVideoSettingsChange
|
|
13012
12253
|
}
|
|
13013
12254
|
),
|
|
13014
|
-
carouselHover && !linkPopover && !isItemDragging && /* @__PURE__ */
|
|
13015
|
-
siblingHintRect && !linkPopover && !isItemDragging && siblingHintRects.length === 0 && /* @__PURE__ */
|
|
13016
|
-
siblingHintRects.length > 0 && !linkPopover && !isItemDragging && siblingHintRects.map((rect, i) => /* @__PURE__ */
|
|
13017
|
-
isItemDragging && draggedItemRect && selectedElRef.current !== footerDragRef.current?.draggedEl && selectedElRef.current !== navDragRef.current?.draggedEl && /* @__PURE__ */
|
|
13018
|
-
isItemDragging && footerDropSlots.map((slot, i) => /* @__PURE__ */
|
|
12255
|
+
carouselHover && !linkPopover && !isItemDragging && /* @__PURE__ */ jsx25(CarouselOverlay, { hover: carouselHover, onEdit: handleEditCarousel }),
|
|
12256
|
+
siblingHintRect && !linkPopover && !isItemDragging && siblingHintRects.length === 0 && /* @__PURE__ */ jsx25(ItemInteractionLayer, { rect: siblingHintRect, state: "sibling-hint" }),
|
|
12257
|
+
siblingHintRects.length > 0 && !linkPopover && !isItemDragging && siblingHintRects.map((rect, i) => /* @__PURE__ */ jsx25(ItemInteractionLayer, { rect, state: "sibling-hint" }, `sibling-hint-${i}`)),
|
|
12258
|
+
isItemDragging && draggedItemRect && selectedElRef.current !== footerDragRef.current?.draggedEl && selectedElRef.current !== navDragRef.current?.draggedEl && /* @__PURE__ */ jsx25(ItemInteractionLayer, { rect: draggedItemRect, state: "dragging" }),
|
|
12259
|
+
isItemDragging && footerDropSlots.map((slot, i) => /* @__PURE__ */ jsx25(
|
|
13019
12260
|
"div",
|
|
13020
12261
|
{
|
|
13021
12262
|
className: "pointer-events-none fixed z-2147483646",
|
|
@@ -13025,7 +12266,7 @@ function OhhwellsBridge() {
|
|
|
13025
12266
|
width: slot.width,
|
|
13026
12267
|
height: slot.height
|
|
13027
12268
|
},
|
|
13028
|
-
children: /* @__PURE__ */
|
|
12269
|
+
children: /* @__PURE__ */ jsx25(
|
|
13029
12270
|
DropIndicator,
|
|
13030
12271
|
{
|
|
13031
12272
|
direction: slot.direction,
|
|
@@ -13036,7 +12277,7 @@ function OhhwellsBridge() {
|
|
|
13036
12277
|
},
|
|
13037
12278
|
`footer-drop-${slot.direction}-${slot.columnIndex}-${slot.insertIndex}-${i}`
|
|
13038
12279
|
)),
|
|
13039
|
-
isItemDragging && navDropSlots.map((slot, i) => /* @__PURE__ */
|
|
12280
|
+
isItemDragging && navDropSlots.map((slot, i) => /* @__PURE__ */ jsx25(
|
|
13040
12281
|
"div",
|
|
13041
12282
|
{
|
|
13042
12283
|
className: "pointer-events-none fixed z-2147483646",
|
|
@@ -13046,7 +12287,7 @@ function OhhwellsBridge() {
|
|
|
13046
12287
|
width: slot.width,
|
|
13047
12288
|
height: slot.height
|
|
13048
12289
|
},
|
|
13049
|
-
children: /* @__PURE__ */
|
|
12290
|
+
children: /* @__PURE__ */ jsx25(
|
|
13050
12291
|
DropIndicator,
|
|
13051
12292
|
{
|
|
13052
12293
|
direction: slot.direction,
|
|
@@ -13057,18 +12298,10 @@ function OhhwellsBridge() {
|
|
|
13057
12298
|
},
|
|
13058
12299
|
`nav-drop-${slot.direction}-${slot.parentId ?? "root"}-${slot.insertIndex}-${i}`
|
|
13059
12300
|
)),
|
|
13060
|
-
hoveredNavContainerRect &&
|
|
13061
|
-
hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */
|
|
13062
|
-
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isNavbarLinksContainer(selectedElRef.current) && /* @__PURE__ */
|
|
13063
|
-
|
|
13064
|
-
FooterContainerChrome,
|
|
13065
|
-
{
|
|
13066
|
-
rect: toolbarRect,
|
|
13067
|
-
onAdd: handleAddFooterColumn,
|
|
13068
|
-
addDisabled: !canAddFooterColumn()
|
|
13069
|
-
}
|
|
13070
|
-
),
|
|
13071
|
-
toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame") && /* @__PURE__ */ jsx27(
|
|
12301
|
+
hoveredNavContainerRect && toolbarVariant !== "select-frame" && !linkPopover && !isItemDragging && /* @__PURE__ */ jsx25(ItemInteractionLayer, { rect: hoveredNavContainerRect, state: "hover" }),
|
|
12302
|
+
hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */ jsx25(ItemInteractionLayer, { rect: hoveredItemRect, state: "hover" }),
|
|
12303
|
+
toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isNavbarLinksContainer(selectedElRef.current) && /* @__PURE__ */ jsx25(NavbarContainerChrome, { rect: toolbarRect, onAdd: handleAddTopLevelNavItem }),
|
|
12304
|
+
toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame") && /* @__PURE__ */ jsx25(
|
|
13072
12305
|
ItemInteractionLayer,
|
|
13073
12306
|
{
|
|
13074
12307
|
rect: isItemDragging && draggedItemRect && (footerDragRef.current?.wasSelected || navDragRef.current?.wasSelected) ? draggedItemRect : toolbarRect,
|
|
@@ -13082,23 +12315,21 @@ function OhhwellsBridge() {
|
|
|
13082
12315
|
onItemPointerDown: handleItemChromePointerDown,
|
|
13083
12316
|
onItemClick: handleItemChromeClick,
|
|
13084
12317
|
itemDragSurface: !isFooterFrameSelection,
|
|
13085
|
-
toolbar: toolbarVariant === "link-action" && !isItemDragging ? /* @__PURE__ */
|
|
12318
|
+
toolbar: toolbarVariant === "link-action" && !isItemDragging ? /* @__PURE__ */ jsx25(
|
|
13086
12319
|
ItemActionToolbar,
|
|
13087
12320
|
{
|
|
13088
12321
|
onEditLink: openLinkPopoverForSelected,
|
|
13089
|
-
onSelectParent: handleSelectParent,
|
|
13090
|
-
onDuplicate: handleDuplicateSelected,
|
|
13091
12322
|
addItemDisabled: true,
|
|
13092
12323
|
editLinkDisabled: false,
|
|
13093
|
-
moreDisabled:
|
|
12324
|
+
moreDisabled: true,
|
|
13094
12325
|
showAddItem: !selectedIsCta,
|
|
13095
12326
|
showMore: !selectedIsCta
|
|
13096
12327
|
}
|
|
13097
12328
|
) : void 0
|
|
13098
12329
|
}
|
|
13099
12330
|
),
|
|
13100
|
-
toolbarRect && toolbarVariant === "rich-text" && !linkPopover && /* @__PURE__ */
|
|
13101
|
-
/* @__PURE__ */
|
|
12331
|
+
toolbarRect && toolbarVariant === "rich-text" && !linkPopover && /* @__PURE__ */ jsxs14(Fragment5, { children: [
|
|
12332
|
+
/* @__PURE__ */ jsx25(
|
|
13102
12333
|
EditGlowChrome,
|
|
13103
12334
|
{
|
|
13104
12335
|
rect: toolbarRect,
|
|
@@ -13108,7 +12339,7 @@ function OhhwellsBridge() {
|
|
|
13108
12339
|
hideHandle: isItemDragging
|
|
13109
12340
|
}
|
|
13110
12341
|
),
|
|
13111
|
-
/* @__PURE__ */
|
|
12342
|
+
/* @__PURE__ */ jsx25(
|
|
13112
12343
|
FloatingToolbar,
|
|
13113
12344
|
{
|
|
13114
12345
|
rect: toolbarRect,
|
|
@@ -13121,7 +12352,7 @@ function OhhwellsBridge() {
|
|
|
13121
12352
|
}
|
|
13122
12353
|
)
|
|
13123
12354
|
] }),
|
|
13124
|
-
maxBadge && /* @__PURE__ */
|
|
12355
|
+
maxBadge && /* @__PURE__ */ jsxs14(
|
|
13125
12356
|
"div",
|
|
13126
12357
|
{
|
|
13127
12358
|
"data-ohw-max-badge": "",
|
|
@@ -13147,7 +12378,7 @@ function OhhwellsBridge() {
|
|
|
13147
12378
|
]
|
|
13148
12379
|
}
|
|
13149
12380
|
),
|
|
13150
|
-
toggleState && !linkPopover && /* @__PURE__ */
|
|
12381
|
+
toggleState && !linkPopover && /* @__PURE__ */ jsx25(
|
|
13151
12382
|
StateToggle,
|
|
13152
12383
|
{
|
|
13153
12384
|
rect: toggleState.rect,
|
|
@@ -13156,15 +12387,15 @@ function OhhwellsBridge() {
|
|
|
13156
12387
|
onStateChange: handleStateChange
|
|
13157
12388
|
}
|
|
13158
12389
|
),
|
|
13159
|
-
sectionGap && !linkPopover && /* @__PURE__ */
|
|
12390
|
+
sectionGap && !linkPopover && /* @__PURE__ */ jsxs14(
|
|
13160
12391
|
"div",
|
|
13161
12392
|
{
|
|
13162
12393
|
"data-ohw-section-insert-line": "",
|
|
13163
12394
|
className: "fixed left-0 w-full z-2147483646 flex items-center pointer-events-none",
|
|
13164
12395
|
style: { top: sectionGap.y, transform: "translateY(-50%)" },
|
|
13165
12396
|
children: [
|
|
13166
|
-
/* @__PURE__ */
|
|
13167
|
-
/* @__PURE__ */
|
|
12397
|
+
/* @__PURE__ */ jsx25("div", { className: "flex-1 bg-primary", style: { height: 3 } }),
|
|
12398
|
+
/* @__PURE__ */ jsx25(
|
|
13168
12399
|
Badge,
|
|
13169
12400
|
{
|
|
13170
12401
|
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",
|
|
@@ -13181,11 +12412,11 @@ function OhhwellsBridge() {
|
|
|
13181
12412
|
children: "Add Section"
|
|
13182
12413
|
}
|
|
13183
12414
|
),
|
|
13184
|
-
/* @__PURE__ */
|
|
12415
|
+
/* @__PURE__ */ jsx25("div", { className: "flex-1 bg-primary", style: { height: 3 } })
|
|
13185
12416
|
]
|
|
13186
12417
|
}
|
|
13187
12418
|
),
|
|
13188
|
-
linkPopover && dialogPortalContainer ? /* @__PURE__ */
|
|
12419
|
+
linkPopover && dialogPortalContainer ? /* @__PURE__ */ jsx25(
|
|
13189
12420
|
LinkPopover,
|
|
13190
12421
|
{
|
|
13191
12422
|
panelRef: linkPopoverPanelRef,
|
|
@@ -13212,12 +12443,6 @@ export {
|
|
|
13212
12443
|
CustomToolbarDivider,
|
|
13213
12444
|
DragHandle,
|
|
13214
12445
|
DropIndicator,
|
|
13215
|
-
DropdownMenu,
|
|
13216
|
-
DropdownMenuContent,
|
|
13217
|
-
DropdownMenuGroup,
|
|
13218
|
-
DropdownMenuItem,
|
|
13219
|
-
DropdownMenuSeparator,
|
|
13220
|
-
DropdownMenuTrigger,
|
|
13221
12446
|
ItemActionToolbar,
|
|
13222
12447
|
ItemInteractionLayer,
|
|
13223
12448
|
LinkEditorPanel,
|