@ohhwells/bridge 0.1.32-next.35 → 0.1.32
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 +180 -341
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -5
- package/dist/index.d.ts +1 -5
- package/dist/index.js +150 -309
- package/dist/index.js.map +1 -1
- package/dist/styles.css +0 -123
- package/package.json +1 -2
package/dist/index.cjs
CHANGED
|
@@ -31,7 +31,6 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
31
31
|
// src/index.ts
|
|
32
32
|
var index_exports = {};
|
|
33
33
|
__export(index_exports, {
|
|
34
|
-
DragHandle: () => DragHandle,
|
|
35
34
|
LinkEditorPanel: () => LinkEditorPanel,
|
|
36
35
|
LinkPopover: () => LinkPopover,
|
|
37
36
|
OhhwellsBridge: () => OhhwellsBridge,
|
|
@@ -42,7 +41,6 @@ __export(index_exports, {
|
|
|
42
41
|
buildTarget: () => buildTarget,
|
|
43
42
|
filterAvailablePages: () => filterAvailablePages,
|
|
44
43
|
getEditModeInitialState: () => getEditModeInitialState,
|
|
45
|
-
isEditSessionActive: () => isEditSessionActive,
|
|
46
44
|
isValidUrl: () => isValidUrl,
|
|
47
45
|
parseTarget: () => parseTarget,
|
|
48
46
|
toggleVariants: () => toggleVariants,
|
|
@@ -4252,34 +4250,6 @@ function ToggleGroupItem({
|
|
|
4252
4250
|
);
|
|
4253
4251
|
}
|
|
4254
4252
|
|
|
4255
|
-
// src/ui/drag-handle.tsx
|
|
4256
|
-
var React3 = __toESM(require("react"), 1);
|
|
4257
|
-
var import_lucide_react = require("lucide-react");
|
|
4258
|
-
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
4259
|
-
var DragHandle = React3.forwardRef(
|
|
4260
|
-
({ className, type = "button", ...props }, ref) => {
|
|
4261
|
-
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4262
|
-
"button",
|
|
4263
|
-
{
|
|
4264
|
-
ref,
|
|
4265
|
-
type,
|
|
4266
|
-
"data-slot": "drag-handle",
|
|
4267
|
-
className: cn(
|
|
4268
|
-
"inline-flex h-7 w-4 shrink-0 items-center justify-center rounded-md transition-all duration-200 max-h-[30px]",
|
|
4269
|
-
"bg-white border border-transparent text-stone-500 shadow-md cursor-grab",
|
|
4270
|
-
"enabled:hover:border enabled:hover:border-stone-200 enabled:hover:text-stone-950",
|
|
4271
|
-
"enabled:active:border enabled:active:border-primary enabled:active:bg-primary-50 enabled:active:text-stone-950 enabled:active:shadow enabled:active:cursor-grabbing",
|
|
4272
|
-
"disabled:cursor-not-allowed disabled:opacity-40 disabled:text-stone-950 disabled:pointer-events-none",
|
|
4273
|
-
className
|
|
4274
|
-
),
|
|
4275
|
-
...props,
|
|
4276
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react.GripVertical, { className: "size-4 shrink-0", "aria-hidden": "true" })
|
|
4277
|
-
}
|
|
4278
|
-
);
|
|
4279
|
-
}
|
|
4280
|
-
);
|
|
4281
|
-
DragHandle.displayName = "DragHandle";
|
|
4282
|
-
|
|
4283
4253
|
// src/OhhwellsBridge.tsx
|
|
4284
4254
|
var import_react_dom2 = require("react-dom");
|
|
4285
4255
|
var import_navigation = require("next/navigation");
|
|
@@ -4559,60 +4529,60 @@ function scrollToHashSectionWhenReady(behavior = "smooth") {
|
|
|
4559
4529
|
}
|
|
4560
4530
|
|
|
4561
4531
|
// src/ui/dialog.tsx
|
|
4562
|
-
var
|
|
4532
|
+
var React3 = __toESM(require("react"), 1);
|
|
4563
4533
|
var import_radix_ui3 = require("radix-ui");
|
|
4564
4534
|
|
|
4565
4535
|
// src/ui/icons.tsx
|
|
4566
|
-
var
|
|
4536
|
+
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
4567
4537
|
function IconX({ className, ...props }) {
|
|
4568
|
-
return /* @__PURE__ */ (0,
|
|
4569
|
-
/* @__PURE__ */ (0,
|
|
4570
|
-
/* @__PURE__ */ (0,
|
|
4538
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className, ...props, children: [
|
|
4539
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M18 6 6 18" }),
|
|
4540
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "m6 6 12 12" })
|
|
4571
4541
|
] });
|
|
4572
4542
|
}
|
|
4573
4543
|
function IconChevronDown({ className, ...props }) {
|
|
4574
|
-
return /* @__PURE__ */ (0,
|
|
4544
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "m6 9 6 6 6-6" }) });
|
|
4575
4545
|
}
|
|
4576
4546
|
function IconFile({ className, ...props }) {
|
|
4577
|
-
return /* @__PURE__ */ (0,
|
|
4578
|
-
/* @__PURE__ */ (0,
|
|
4579
|
-
/* @__PURE__ */ (0,
|
|
4547
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className, ...props, children: [
|
|
4548
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" }),
|
|
4549
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M14 2v4a2 2 0 0 0 2 2h4" })
|
|
4580
4550
|
] });
|
|
4581
4551
|
}
|
|
4582
4552
|
function IconInfo({ className, ...props }) {
|
|
4583
|
-
return /* @__PURE__ */ (0,
|
|
4584
|
-
/* @__PURE__ */ (0,
|
|
4585
|
-
/* @__PURE__ */ (0,
|
|
4586
|
-
/* @__PURE__ */ (0,
|
|
4553
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className, ...props, children: [
|
|
4554
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
|
|
4555
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M12 16v-4" }),
|
|
4556
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M12 8h.01" })
|
|
4587
4557
|
] });
|
|
4588
4558
|
}
|
|
4589
4559
|
function IconArrowRight({ className, ...props }) {
|
|
4590
|
-
return /* @__PURE__ */ (0,
|
|
4591
|
-
/* @__PURE__ */ (0,
|
|
4592
|
-
/* @__PURE__ */ (0,
|
|
4560
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className, ...props, children: [
|
|
4561
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M5 12h14" }),
|
|
4562
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "m12 5 7 7-7 7" })
|
|
4593
4563
|
] });
|
|
4594
4564
|
}
|
|
4595
4565
|
function IconSection({ className, ...props }) {
|
|
4596
|
-
return /* @__PURE__ */ (0,
|
|
4597
|
-
/* @__PURE__ */ (0,
|
|
4598
|
-
/* @__PURE__ */ (0,
|
|
4599
|
-
/* @__PURE__ */ (0,
|
|
4566
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className, ...props, children: [
|
|
4567
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("rect", { width: "18", height: "7", x: "3", y: "3", rx: "1" }),
|
|
4568
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("rect", { width: "9", height: "7", x: "3", y: "14", rx: "1" }),
|
|
4569
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("rect", { width: "5", height: "7", x: "16", y: "14", rx: "1" })
|
|
4600
4570
|
] });
|
|
4601
4571
|
}
|
|
4602
4572
|
|
|
4603
4573
|
// src/ui/dialog.tsx
|
|
4604
|
-
var
|
|
4574
|
+
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
4605
4575
|
function Dialog2({ ...props }) {
|
|
4606
|
-
return /* @__PURE__ */ (0,
|
|
4576
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_radix_ui3.Dialog.Root, { "data-slot": "dialog", ...props });
|
|
4607
4577
|
}
|
|
4608
4578
|
function DialogPortal({ ...props }) {
|
|
4609
|
-
return /* @__PURE__ */ (0,
|
|
4579
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_radix_ui3.Dialog.Portal, { ...props });
|
|
4610
4580
|
}
|
|
4611
4581
|
function DialogOverlay({
|
|
4612
4582
|
className,
|
|
4613
4583
|
...props
|
|
4614
4584
|
}) {
|
|
4615
|
-
return /* @__PURE__ */ (0,
|
|
4585
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
4616
4586
|
import_radix_ui3.Dialog.Overlay,
|
|
4617
4587
|
{
|
|
4618
4588
|
"data-slot": "dialog-overlay",
|
|
@@ -4622,11 +4592,11 @@ function DialogOverlay({
|
|
|
4622
4592
|
}
|
|
4623
4593
|
);
|
|
4624
4594
|
}
|
|
4625
|
-
var DialogContent =
|
|
4595
|
+
var DialogContent = React3.forwardRef(({ className, children, showCloseButton = true, container, ...props }, ref) => {
|
|
4626
4596
|
const positionMode = container ? "absolute" : "fixed";
|
|
4627
|
-
return /* @__PURE__ */ (0,
|
|
4628
|
-
/* @__PURE__ */ (0,
|
|
4629
|
-
/* @__PURE__ */ (0,
|
|
4597
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(DialogPortal, { container: container ?? void 0, children: [
|
|
4598
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DialogOverlay, { className: cn(positionMode, "inset-0") }),
|
|
4599
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
|
|
4630
4600
|
import_radix_ui3.Dialog.Content,
|
|
4631
4601
|
{
|
|
4632
4602
|
ref,
|
|
@@ -4642,13 +4612,13 @@ var DialogContent = React4.forwardRef(({ className, children, showCloseButton =
|
|
|
4642
4612
|
...props,
|
|
4643
4613
|
children: [
|
|
4644
4614
|
children,
|
|
4645
|
-
showCloseButton ? /* @__PURE__ */ (0,
|
|
4615
|
+
showCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
4646
4616
|
import_radix_ui3.Dialog.Close,
|
|
4647
4617
|
{
|
|
4648
4618
|
type: "button",
|
|
4649
4619
|
className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50",
|
|
4650
4620
|
"aria-label": "Close",
|
|
4651
|
-
children: /* @__PURE__ */ (0,
|
|
4621
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(IconX, { "aria-hidden": true })
|
|
4652
4622
|
}
|
|
4653
4623
|
) : null
|
|
4654
4624
|
]
|
|
@@ -4658,12 +4628,12 @@ var DialogContent = React4.forwardRef(({ className, children, showCloseButton =
|
|
|
4658
4628
|
});
|
|
4659
4629
|
DialogContent.displayName = import_radix_ui3.Dialog.Content.displayName;
|
|
4660
4630
|
function DialogHeader({ className, ...props }) {
|
|
4661
|
-
return /* @__PURE__ */ (0,
|
|
4631
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: cn("flex flex-col gap-1.5", className), ...props });
|
|
4662
4632
|
}
|
|
4663
4633
|
function DialogFooter({ className, ...props }) {
|
|
4664
|
-
return /* @__PURE__ */ (0,
|
|
4634
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: cn("flex items-center justify-end gap-2", className), ...props });
|
|
4665
4635
|
}
|
|
4666
|
-
var DialogTitle =
|
|
4636
|
+
var DialogTitle = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
4667
4637
|
import_radix_ui3.Dialog.Title,
|
|
4668
4638
|
{
|
|
4669
4639
|
ref,
|
|
@@ -4672,7 +4642,7 @@ var DialogTitle = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE
|
|
|
4672
4642
|
}
|
|
4673
4643
|
));
|
|
4674
4644
|
DialogTitle.displayName = import_radix_ui3.Dialog.Title.displayName;
|
|
4675
|
-
var DialogDescription =
|
|
4645
|
+
var DialogDescription = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
4676
4646
|
import_radix_ui3.Dialog.Description,
|
|
4677
4647
|
{
|
|
4678
4648
|
ref,
|
|
@@ -4684,9 +4654,9 @@ DialogDescription.displayName = import_radix_ui3.Dialog.Description.displayName;
|
|
|
4684
4654
|
var DialogClose = import_radix_ui3.Dialog.Close;
|
|
4685
4655
|
|
|
4686
4656
|
// src/ui/button.tsx
|
|
4687
|
-
var
|
|
4657
|
+
var React4 = __toESM(require("react"), 1);
|
|
4688
4658
|
var import_radix_ui4 = require("radix-ui");
|
|
4689
|
-
var
|
|
4659
|
+
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
4690
4660
|
var buttonVariants = cva(
|
|
4691
4661
|
"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",
|
|
4692
4662
|
{
|
|
@@ -4707,10 +4677,10 @@ var buttonVariants = cva(
|
|
|
4707
4677
|
}
|
|
4708
4678
|
}
|
|
4709
4679
|
);
|
|
4710
|
-
var Button =
|
|
4680
|
+
var Button = React4.forwardRef(
|
|
4711
4681
|
({ className, variant, size, asChild = false, ...props }, ref) => {
|
|
4712
4682
|
const Comp = asChild ? import_radix_ui4.Slot.Root : "button";
|
|
4713
|
-
return /* @__PURE__ */ (0,
|
|
4683
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
4714
4684
|
Comp,
|
|
4715
4685
|
{
|
|
4716
4686
|
ref,
|
|
@@ -4724,37 +4694,37 @@ var Button = React5.forwardRef(
|
|
|
4724
4694
|
Button.displayName = "Button";
|
|
4725
4695
|
|
|
4726
4696
|
// src/ui/link-modal/DestinationBreadcrumb.tsx
|
|
4727
|
-
var
|
|
4697
|
+
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
4728
4698
|
function DestinationBreadcrumb({ pageTitle, sectionLabel }) {
|
|
4729
|
-
return /* @__PURE__ */ (0,
|
|
4730
|
-
/* @__PURE__ */ (0,
|
|
4731
|
-
/* @__PURE__ */ (0,
|
|
4732
|
-
/* @__PURE__ */ (0,
|
|
4733
|
-
/* @__PURE__ */ (0,
|
|
4734
|
-
/* @__PURE__ */ (0,
|
|
4699
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "flex w-full flex-col gap-2", children: [
|
|
4700
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "text-sm font-medium text-foreground", children: "Destination" }),
|
|
4701
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "flex items-center gap-3", children: [
|
|
4702
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
4703
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(IconFile, { className: "shrink-0 text-foreground", "aria-hidden": true }),
|
|
4704
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "text-sm font-medium leading-none text-foreground", children: pageTitle })
|
|
4735
4705
|
] }),
|
|
4736
|
-
/* @__PURE__ */ (0,
|
|
4737
|
-
/* @__PURE__ */ (0,
|
|
4738
|
-
/* @__PURE__ */ (0,
|
|
4739
|
-
/* @__PURE__ */ (0,
|
|
4706
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(IconArrowRight, { className: "shrink-0 text-muted-foreground", "aria-hidden": true }),
|
|
4707
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
|
|
4708
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(IconSection, { className: "shrink-0 text-foreground", "aria-hidden": true }),
|
|
4709
|
+
/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "truncate text-sm font-medium leading-none text-foreground", children: sectionLabel })
|
|
4740
4710
|
] })
|
|
4741
4711
|
] })
|
|
4742
4712
|
] });
|
|
4743
4713
|
}
|
|
4744
4714
|
|
|
4745
4715
|
// src/ui/link-modal/SectionTreeItem.tsx
|
|
4746
|
-
var
|
|
4716
|
+
var import_jsx_runtime9 = require("react/jsx-runtime");
|
|
4747
4717
|
function SectionTreeItem({ section, onSelect, selected }) {
|
|
4748
4718
|
const interactive = Boolean(onSelect);
|
|
4749
|
-
return /* @__PURE__ */ (0,
|
|
4750
|
-
/* @__PURE__ */ (0,
|
|
4719
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex h-9 w-full items-end pl-3", children: [
|
|
4720
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
4751
4721
|
"div",
|
|
4752
4722
|
{
|
|
4753
4723
|
className: "mr-[-1px] h-9 w-2 shrink-0 rounded-bl-sm border-b border-l border-border mb-4",
|
|
4754
4724
|
"aria-hidden": true
|
|
4755
4725
|
}
|
|
4756
4726
|
),
|
|
4757
|
-
/* @__PURE__ */ (0,
|
|
4727
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
|
|
4758
4728
|
"div",
|
|
4759
4729
|
{
|
|
4760
4730
|
role: interactive ? "button" : void 0,
|
|
@@ -4772,8 +4742,8 @@ function SectionTreeItem({ section, onSelect, selected }) {
|
|
|
4772
4742
|
interactive && selected && "border-primary"
|
|
4773
4743
|
),
|
|
4774
4744
|
children: [
|
|
4775
|
-
/* @__PURE__ */ (0,
|
|
4776
|
-
/* @__PURE__ */ (0,
|
|
4745
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(IconSection, { className: "shrink-0 text-foreground", "aria-hidden": true }),
|
|
4746
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "truncate text-sm font-normal leading-5 text-foreground", children: section.label })
|
|
4777
4747
|
]
|
|
4778
4748
|
}
|
|
4779
4749
|
)
|
|
@@ -4781,11 +4751,11 @@ function SectionTreeItem({ section, onSelect, selected }) {
|
|
|
4781
4751
|
}
|
|
4782
4752
|
function SectionPickerList({ sections, onSelect }) {
|
|
4783
4753
|
if (sections.length === 0) {
|
|
4784
|
-
return /* @__PURE__ */ (0,
|
|
4754
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-sm text-muted-foreground", children: "No sections found on this page." });
|
|
4785
4755
|
}
|
|
4786
|
-
return /* @__PURE__ */ (0,
|
|
4787
|
-
/* @__PURE__ */ (0,
|
|
4788
|
-
sections.map((section) => /* @__PURE__ */ (0,
|
|
4756
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex flex-col gap-1", children: [
|
|
4757
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "text-sm text-muted-foreground", children: "Pick a section this link should scroll to." }),
|
|
4758
|
+
sections.map((section) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SectionTreeItem, { section, onSelect }, section.id))
|
|
4789
4759
|
] });
|
|
4790
4760
|
}
|
|
4791
4761
|
|
|
@@ -4793,11 +4763,11 @@ function SectionPickerList({ sections, onSelect }) {
|
|
|
4793
4763
|
var import_react4 = require("react");
|
|
4794
4764
|
|
|
4795
4765
|
// src/ui/input.tsx
|
|
4796
|
-
var
|
|
4797
|
-
var
|
|
4798
|
-
var Input =
|
|
4766
|
+
var React5 = __toESM(require("react"), 1);
|
|
4767
|
+
var import_jsx_runtime10 = require("react/jsx-runtime");
|
|
4768
|
+
var Input = React5.forwardRef(
|
|
4799
4769
|
({ className, type, ...props }, ref) => {
|
|
4800
|
-
return /* @__PURE__ */ (0,
|
|
4770
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
4801
4771
|
"input",
|
|
4802
4772
|
{
|
|
4803
4773
|
type,
|
|
@@ -4816,9 +4786,9 @@ Input.displayName = "Input";
|
|
|
4816
4786
|
|
|
4817
4787
|
// src/ui/label.tsx
|
|
4818
4788
|
var import_radix_ui5 = require("radix-ui");
|
|
4819
|
-
var
|
|
4789
|
+
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
4820
4790
|
function Label({ className, ...props }) {
|
|
4821
|
-
return /* @__PURE__ */ (0,
|
|
4791
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
4822
4792
|
import_radix_ui5.Label.Root,
|
|
4823
4793
|
{
|
|
4824
4794
|
"data-slot": "label",
|
|
@@ -4829,9 +4799,9 @@ function Label({ className, ...props }) {
|
|
|
4829
4799
|
}
|
|
4830
4800
|
|
|
4831
4801
|
// src/ui/link-modal/UrlOrPageInput.tsx
|
|
4832
|
-
var
|
|
4802
|
+
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
4833
4803
|
function FieldChevron({ onClick }) {
|
|
4834
|
-
return /* @__PURE__ */ (0,
|
|
4804
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
4835
4805
|
"button",
|
|
4836
4806
|
{
|
|
4837
4807
|
type: "button",
|
|
@@ -4839,7 +4809,7 @@ function FieldChevron({ onClick }) {
|
|
|
4839
4809
|
onClick,
|
|
4840
4810
|
"aria-label": "Open page list",
|
|
4841
4811
|
tabIndex: -1,
|
|
4842
|
-
children: /* @__PURE__ */ (0,
|
|
4812
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconChevronDown, {})
|
|
4843
4813
|
}
|
|
4844
4814
|
);
|
|
4845
4815
|
}
|
|
@@ -4878,12 +4848,12 @@ function UrlOrPageInput({
|
|
|
4878
4848
|
"data-ohw-link-field flex h-10 w-full items-center overflow-hidden rounded-md border bg-background pl-3 pr-3 py-2 outline-none transition-[border-color,box-shadow]",
|
|
4879
4849
|
urlError ? "border-destructive shadow-[0_0_0_1px_var(--ohw-destructive)]" : isFocused ? "border-primary shadow-[0_0_0_1px_var(--ohw-primary)]" : "border-input"
|
|
4880
4850
|
);
|
|
4881
|
-
return /* @__PURE__ */ (0,
|
|
4882
|
-
/* @__PURE__ */ (0,
|
|
4883
|
-
/* @__PURE__ */ (0,
|
|
4884
|
-
/* @__PURE__ */ (0,
|
|
4885
|
-
selectedPage ? /* @__PURE__ */ (0,
|
|
4886
|
-
readOnly ? /* @__PURE__ */ (0,
|
|
4851
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex w-full flex-col gap-2 p-0", children: [
|
|
4852
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Label, { htmlFor: inputId, className: cn(urlError && "text-destructive"), children: "Destination" }),
|
|
4853
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "relative w-full", children: [
|
|
4854
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { "data-ohw-link-field": true, className: fieldClassName, children: [
|
|
4855
|
+
selectedPage ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "flex shrink-0 items-center pr-2", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconFile, { className: "text-foreground", "aria-hidden": true }) }) : null,
|
|
4856
|
+
readOnly ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "min-w-0 flex-1 truncate text-sm leading-5 text-foreground", children: selectedPage?.title ?? value }) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
4887
4857
|
Input,
|
|
4888
4858
|
{
|
|
4889
4859
|
ref: inputRef,
|
|
@@ -4902,7 +4872,7 @@ function UrlOrPageInput({
|
|
|
4902
4872
|
)
|
|
4903
4873
|
}
|
|
4904
4874
|
),
|
|
4905
|
-
selectedPage && !readOnly ? /* @__PURE__ */ (0,
|
|
4875
|
+
selectedPage && !readOnly ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
4906
4876
|
"button",
|
|
4907
4877
|
{
|
|
4908
4878
|
type: "button",
|
|
@@ -4910,26 +4880,26 @@ function UrlOrPageInput({
|
|
|
4910
4880
|
onMouseDown: clearSelection,
|
|
4911
4881
|
"aria-label": "Clear selected page",
|
|
4912
4882
|
tabIndex: -1,
|
|
4913
|
-
children: /* @__PURE__ */ (0,
|
|
4883
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconX, { "aria-hidden": true })
|
|
4914
4884
|
}
|
|
4915
4885
|
) : null,
|
|
4916
|
-
!readOnly ? /* @__PURE__ */ (0,
|
|
4886
|
+
!readOnly ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(FieldChevron, { onClick: toggleDropdown }) : null
|
|
4917
4887
|
] }),
|
|
4918
|
-
dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */ (0,
|
|
4888
|
+
dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
4919
4889
|
"div",
|
|
4920
4890
|
{
|
|
4921
4891
|
"data-ohw-link-page-dropdown": "",
|
|
4922
4892
|
className: "absolute left-0 right-0 h-20 top-[calc(100%+4px)] z-10 max-h-48 overflow-auto rounded-lg border border-border bg-popover py-1 shadow-lg",
|
|
4923
4893
|
onMouseDown: (e) => e.preventDefault(),
|
|
4924
|
-
children: filteredPages.map((page) => /* @__PURE__ */ (0,
|
|
4894
|
+
children: filteredPages.map((page) => /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
|
|
4925
4895
|
"button",
|
|
4926
4896
|
{
|
|
4927
4897
|
type: "button",
|
|
4928
4898
|
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",
|
|
4929
4899
|
onClick: () => onPageSelect(page),
|
|
4930
4900
|
children: [
|
|
4931
|
-
/* @__PURE__ */ (0,
|
|
4932
|
-
/* @__PURE__ */ (0,
|
|
4901
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconFile, { className: "shrink-0", "aria-hidden": true }),
|
|
4902
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "truncate", children: page.title })
|
|
4933
4903
|
]
|
|
4934
4904
|
},
|
|
4935
4905
|
page.path
|
|
@@ -4937,7 +4907,7 @@ function UrlOrPageInput({
|
|
|
4937
4907
|
}
|
|
4938
4908
|
) : null
|
|
4939
4909
|
] }),
|
|
4940
|
-
urlError ? /* @__PURE__ */ (0,
|
|
4910
|
+
urlError ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "text-sm font-medium text-destructive", children: urlError }) : null
|
|
4941
4911
|
] });
|
|
4942
4912
|
}
|
|
4943
4913
|
|
|
@@ -5105,7 +5075,7 @@ function useLinkModalState({
|
|
|
5105
5075
|
}
|
|
5106
5076
|
|
|
5107
5077
|
// src/ui/link-modal/LinkEditorPanel.tsx
|
|
5108
|
-
var
|
|
5078
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
5109
5079
|
function LinkEditorPanel({
|
|
5110
5080
|
open = true,
|
|
5111
5081
|
mode = "create",
|
|
@@ -5129,25 +5099,25 @@ function LinkEditorPanel({
|
|
|
5129
5099
|
onSubmit
|
|
5130
5100
|
});
|
|
5131
5101
|
const isCancel = state.secondaryLabel === "Cancel";
|
|
5132
|
-
return /* @__PURE__ */ (0,
|
|
5133
|
-
/* @__PURE__ */ (0,
|
|
5102
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
|
|
5103
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(DialogClose, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
5134
5104
|
"button",
|
|
5135
5105
|
{
|
|
5136
5106
|
type: "button",
|
|
5137
5107
|
className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50",
|
|
5138
5108
|
"aria-label": "Close",
|
|
5139
|
-
children: /* @__PURE__ */ (0,
|
|
5109
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(IconX, { "aria-hidden": true })
|
|
5140
5110
|
}
|
|
5141
5111
|
) }),
|
|
5142
|
-
/* @__PURE__ */ (0,
|
|
5143
|
-
/* @__PURE__ */ (0,
|
|
5144
|
-
state.showBreadcrumb && state.selectedPage && state.selectedSection ? /* @__PURE__ */ (0,
|
|
5112
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(DialogHeader, { className: "w-full gap-1.5 p-6 pr-12", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(DialogTitle, { className: "m-0 w-full break-words", children: state.title }) }),
|
|
5113
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex w-full flex-col gap-3 px-6 pb-8 pt-1", children: [
|
|
5114
|
+
state.showBreadcrumb && state.selectedPage && state.selectedSection ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
5145
5115
|
DestinationBreadcrumb,
|
|
5146
5116
|
{
|
|
5147
5117
|
pageTitle: state.selectedPage.title,
|
|
5148
5118
|
sectionLabel: state.selectedSection.label
|
|
5149
5119
|
}
|
|
5150
|
-
) : /* @__PURE__ */ (0,
|
|
5120
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
5151
5121
|
UrlOrPageInput,
|
|
5152
5122
|
{
|
|
5153
5123
|
value: state.searchValue,
|
|
@@ -5160,18 +5130,18 @@ function LinkEditorPanel({
|
|
|
5160
5130
|
urlError: state.urlError
|
|
5161
5131
|
}
|
|
5162
5132
|
),
|
|
5163
|
-
state.showChooseSection ? /* @__PURE__ */ (0,
|
|
5164
|
-
/* @__PURE__ */ (0,
|
|
5165
|
-
/* @__PURE__ */ (0,
|
|
5166
|
-
/* @__PURE__ */ (0,
|
|
5167
|
-
/* @__PURE__ */ (0,
|
|
5133
|
+
state.showChooseSection ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-col justify-center gap-2", children: [
|
|
5134
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Button, { type: "button", variant: "outline", className: "w-fit cursor-pointer", size: "sm", onClick: state.handleChooseSection, children: "Choose a section" }),
|
|
5135
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex items-center gap-1 text-sm text-muted-foreground", children: [
|
|
5136
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(IconInfo, { className: "shrink-0", "aria-hidden": true }),
|
|
5137
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { children: "Pick a section this link should scroll to." })
|
|
5168
5138
|
] })
|
|
5169
5139
|
] }) : null,
|
|
5170
|
-
state.showSectionPicker ? /* @__PURE__ */ (0,
|
|
5171
|
-
state.showSectionRow && state.selectedSection ? /* @__PURE__ */ (0,
|
|
5140
|
+
state.showSectionPicker ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SectionPickerList, { sections: state.activeSections, onSelect: state.handleSectionSelect }) : null,
|
|
5141
|
+
state.showSectionRow && state.selectedSection ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SectionTreeItem, { section: state.selectedSection, selected: true }) : null
|
|
5172
5142
|
] }),
|
|
5173
|
-
/* @__PURE__ */ (0,
|
|
5174
|
-
/* @__PURE__ */ (0,
|
|
5143
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(DialogFooter, { className: "w-full px-6 pb-6", children: [
|
|
5144
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
5175
5145
|
Button,
|
|
5176
5146
|
{
|
|
5177
5147
|
type: "button",
|
|
@@ -5186,7 +5156,7 @@ function LinkEditorPanel({
|
|
|
5186
5156
|
children: state.secondaryLabel
|
|
5187
5157
|
}
|
|
5188
5158
|
),
|
|
5189
|
-
/* @__PURE__ */ (0,
|
|
5159
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
5190
5160
|
Button,
|
|
5191
5161
|
{
|
|
5192
5162
|
type: "button",
|
|
@@ -5205,7 +5175,7 @@ function LinkEditorPanel({
|
|
|
5205
5175
|
}
|
|
5206
5176
|
|
|
5207
5177
|
// src/ui/link-modal/LinkPopover.tsx
|
|
5208
|
-
var
|
|
5178
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
5209
5179
|
function LinkPopover({
|
|
5210
5180
|
open = true,
|
|
5211
5181
|
panelRef,
|
|
@@ -5213,14 +5183,14 @@ function LinkPopover({
|
|
|
5213
5183
|
onClose,
|
|
5214
5184
|
...editorProps
|
|
5215
5185
|
}) {
|
|
5216
|
-
return /* @__PURE__ */ (0,
|
|
5186
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5217
5187
|
Dialog2,
|
|
5218
5188
|
{
|
|
5219
5189
|
open,
|
|
5220
5190
|
onOpenChange: (next) => {
|
|
5221
5191
|
if (!next) onClose?.();
|
|
5222
5192
|
},
|
|
5223
|
-
children: /* @__PURE__ */ (0,
|
|
5193
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5224
5194
|
DialogContent,
|
|
5225
5195
|
{
|
|
5226
5196
|
ref: panelRef,
|
|
@@ -5230,7 +5200,7 @@ function LinkPopover({
|
|
|
5230
5200
|
"data-ohw-bridge": "",
|
|
5231
5201
|
showCloseButton: false,
|
|
5232
5202
|
className: "gap-0 p-0 w-full md:w-md pointer-events-auto",
|
|
5233
|
-
children: /* @__PURE__ */ (0,
|
|
5203
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(LinkEditorPanel, { ...editorProps, open, onClose })
|
|
5234
5204
|
}
|
|
5235
5205
|
)
|
|
5236
5206
|
}
|
|
@@ -5296,7 +5266,7 @@ function shouldUseDevFixtures() {
|
|
|
5296
5266
|
}
|
|
5297
5267
|
|
|
5298
5268
|
// src/ui/badge.tsx
|
|
5299
|
-
var
|
|
5269
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
5300
5270
|
var badgeVariants = cva(
|
|
5301
5271
|
"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",
|
|
5302
5272
|
{
|
|
@@ -5314,11 +5284,11 @@ var badgeVariants = cva(
|
|
|
5314
5284
|
}
|
|
5315
5285
|
);
|
|
5316
5286
|
function Badge({ className, variant, ...props }) {
|
|
5317
|
-
return /* @__PURE__ */ (0,
|
|
5287
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: cn(badgeVariants({ variant }), className), ...props });
|
|
5318
5288
|
}
|
|
5319
5289
|
|
|
5320
5290
|
// src/OhhwellsBridge.tsx
|
|
5321
|
-
var
|
|
5291
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
5322
5292
|
var PRIMARY = "#0885FE";
|
|
5323
5293
|
var IMAGE_FADE_MS = 300;
|
|
5324
5294
|
function runOpacityFade(el, onDone) {
|
|
@@ -5492,7 +5462,7 @@ function mountSchedulingWidget(insertAfter, notifyOnConnect = false, scheduleId,
|
|
|
5492
5462
|
const root = (0, import_client.createRoot)(container);
|
|
5493
5463
|
(0, import_react_dom.flushSync)(() => {
|
|
5494
5464
|
root.render(
|
|
5495
|
-
/* @__PURE__ */ (0,
|
|
5465
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
5496
5466
|
SchedulingWidget,
|
|
5497
5467
|
{
|
|
5498
5468
|
notifyOnConnect,
|
|
@@ -5540,20 +5510,6 @@ function applyLinkHref(el, val) {
|
|
|
5540
5510
|
const anchor = el instanceof HTMLAnchorElement ? el : el.querySelector("a");
|
|
5541
5511
|
if (anchor) anchor.setAttribute("href", val);
|
|
5542
5512
|
}
|
|
5543
|
-
function getEditMeasureEl(editable) {
|
|
5544
|
-
return editable.closest("[data-ohw-href-key]") ?? editable;
|
|
5545
|
-
}
|
|
5546
|
-
function isDragHandleDisabled(el) {
|
|
5547
|
-
const carriers = [
|
|
5548
|
-
el.closest("[data-ohw-href-key]"),
|
|
5549
|
-
el.closest("[data-ohw-editable]")
|
|
5550
|
-
];
|
|
5551
|
-
return carriers.some((carrier) => {
|
|
5552
|
-
if (!carrier) return false;
|
|
5553
|
-
const raw = carrier.getAttribute("data-ohw-drag-disabled");
|
|
5554
|
-
return raw === "true" || raw === "";
|
|
5555
|
-
});
|
|
5556
|
-
}
|
|
5557
5513
|
function collectEditableNodes() {
|
|
5558
5514
|
const nodes = Array.from(document.querySelectorAll("[data-ohw-editable]")).map((el) => {
|
|
5559
5515
|
if (el.dataset.ohwEditable === "image") {
|
|
@@ -5607,14 +5563,6 @@ function getHrefKeyFromElement(el) {
|
|
|
5607
5563
|
function isNavbarButton(el) {
|
|
5608
5564
|
return Boolean(el.closest('[data-ohw-role="navbar-button"]'));
|
|
5609
5565
|
}
|
|
5610
|
-
function getReorderHandleState(el) {
|
|
5611
|
-
const linkEl = el.closest("[data-ohw-href-key]");
|
|
5612
|
-
if (!linkEl || isNavbarButton(el)) return { key: null, disabled: false };
|
|
5613
|
-
return {
|
|
5614
|
-
key: linkEl.dataset.ohwHrefKey ?? null,
|
|
5615
|
-
disabled: isDragHandleDisabled(el)
|
|
5616
|
-
};
|
|
5617
|
-
}
|
|
5618
5566
|
function clearHrefKeyHover(anchor) {
|
|
5619
5567
|
anchor.removeAttribute("data-ohw-hovered");
|
|
5620
5568
|
anchor.querySelectorAll("[data-ohw-hovered]").forEach((el) => {
|
|
@@ -5744,8 +5692,6 @@ var ICONS = {
|
|
|
5744
5692
|
insertUnorderedList: '<line x1="8" y1="6" x2="21" y2="6"/><line x1="8" y1="12" x2="21" y2="12"/><line x1="8" y1="18" x2="21" y2="18"/><line x1="3" y1="6" x2="3.01" y2="6"/><line x1="3" y1="12" x2="3.01" y2="12"/><line x1="3" y1="18" x2="3.01" y2="18"/>',
|
|
5745
5693
|
insertOrderedList: '<line x1="10" y1="6" x2="21" y2="6"/><line x1="10" y1="12" x2="21" y2="12"/><line x1="10" y1="18" x2="21" y2="18"/><path d="M4 6h1v4"/><path d="M4 10h2"/><path d="M6 18H4c0-1 2-2 2-3s-1-1.5-2-1"/>'
|
|
5746
5694
|
};
|
|
5747
|
-
var TOOLBAR_PILL_PADDING = 2;
|
|
5748
|
-
var TOOLBAR_TOGGLE_GAP = 4;
|
|
5749
5695
|
var TOOLBAR_GROUPS = [
|
|
5750
5696
|
[
|
|
5751
5697
|
{ cmd: "bold", title: "Bold" },
|
|
@@ -5763,64 +5709,24 @@ var TOOLBAR_GROUPS = [
|
|
|
5763
5709
|
{ cmd: "insertOrderedList", title: "Numbered List" }
|
|
5764
5710
|
]
|
|
5765
5711
|
];
|
|
5766
|
-
function
|
|
5767
|
-
rect,
|
|
5768
|
-
elRef,
|
|
5769
|
-
reorderHrefKey,
|
|
5770
|
-
dragDisabled = false
|
|
5771
|
-
}) {
|
|
5712
|
+
function GlowFrame({ rect, elRef }) {
|
|
5772
5713
|
const GAP = 6;
|
|
5773
|
-
return /* @__PURE__ */ (0,
|
|
5714
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
5774
5715
|
"div",
|
|
5775
5716
|
{
|
|
5776
5717
|
ref: elRef,
|
|
5777
|
-
"data-ohw-edit-chrome": "",
|
|
5778
5718
|
style: {
|
|
5779
5719
|
position: "fixed",
|
|
5780
5720
|
top: rect.top - GAP,
|
|
5781
5721
|
left: rect.left - GAP,
|
|
5782
5722
|
width: rect.width + GAP * 2,
|
|
5783
5723
|
height: rect.height + GAP * 2,
|
|
5724
|
+
border: "2px solid #0885FE",
|
|
5725
|
+
borderRadius: 8,
|
|
5726
|
+
boxShadow: "0 0 0 4px rgba(8, 133, 254, 0.12)",
|
|
5784
5727
|
pointerEvents: "none",
|
|
5785
5728
|
zIndex: 2147483646
|
|
5786
|
-
}
|
|
5787
|
-
children: [
|
|
5788
|
-
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
5789
|
-
"div",
|
|
5790
|
-
{
|
|
5791
|
-
style: {
|
|
5792
|
-
position: "absolute",
|
|
5793
|
-
inset: 0,
|
|
5794
|
-
border: "2px solid #0885FE",
|
|
5795
|
-
borderRadius: 8,
|
|
5796
|
-
boxShadow: "0 0 0 4px rgba(8, 133, 254, 0.12)",
|
|
5797
|
-
pointerEvents: "none"
|
|
5798
|
-
}
|
|
5799
|
-
}
|
|
5800
|
-
),
|
|
5801
|
-
reorderHrefKey && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
5802
|
-
"div",
|
|
5803
|
-
{
|
|
5804
|
-
"data-ohw-drag-handle-container": "",
|
|
5805
|
-
"data-ohw-drag-disabled": dragDisabled ? "" : void 0,
|
|
5806
|
-
style: {
|
|
5807
|
-
position: "absolute",
|
|
5808
|
-
left: 0,
|
|
5809
|
-
top: "50%",
|
|
5810
|
-
transform: "translate(calc(-100% - 7px), -50%)",
|
|
5811
|
-
pointerEvents: dragDisabled ? "none" : "auto"
|
|
5812
|
-
},
|
|
5813
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
5814
|
-
DragHandle,
|
|
5815
|
-
{
|
|
5816
|
-
"aria-label": `Reorder ${reorderHrefKey}`,
|
|
5817
|
-
disabled: dragDisabled,
|
|
5818
|
-
"aria-disabled": dragDisabled
|
|
5819
|
-
}
|
|
5820
|
-
)
|
|
5821
|
-
}
|
|
5822
|
-
)
|
|
5823
|
-
]
|
|
5729
|
+
}
|
|
5824
5730
|
}
|
|
5825
5731
|
);
|
|
5826
5732
|
}
|
|
@@ -5864,9 +5770,9 @@ function clampToolbarToClip(top, transform, rect, clip, approxH, gap) {
|
|
|
5864
5770
|
const pinnedTop = Math.min(maxBottom - approxH, Math.max(minTop, clip.top + gap));
|
|
5865
5771
|
return { top: pinnedTop + approxH, transform: "translateX(-50%) translateY(-100%)" };
|
|
5866
5772
|
}
|
|
5867
|
-
function calcToolbarPos(rect, parentScroll, approxW =
|
|
5773
|
+
function calcToolbarPos(rect, parentScroll, approxW = 330) {
|
|
5868
5774
|
const GAP = 8;
|
|
5869
|
-
const APPROX_H =
|
|
5775
|
+
const APPROX_H = 36;
|
|
5870
5776
|
const APPROX_W = approxW;
|
|
5871
5777
|
const clip = getIframeVisibleClip(parentScroll);
|
|
5872
5778
|
const clipTop = clip?.top ?? 0;
|
|
@@ -5900,9 +5806,9 @@ function calcToolbarPos(rect, parentScroll, approxW = 306) {
|
|
|
5900
5806
|
const left = Math.max(GAP + APPROX_W / 2, Math.min(rawLeft, window.innerWidth - GAP - APPROX_W / 2));
|
|
5901
5807
|
return { top, left, transform };
|
|
5902
5808
|
}
|
|
5903
|
-
var EDIT_LINK_ICON = /* @__PURE__ */ (0,
|
|
5904
|
-
/* @__PURE__ */ (0,
|
|
5905
|
-
/* @__PURE__ */ (0,
|
|
5809
|
+
var EDIT_LINK_ICON = /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [
|
|
5810
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("path", { d: "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" }),
|
|
5811
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("path", { d: "M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" })
|
|
5906
5812
|
] });
|
|
5907
5813
|
function FloatingToolbar({
|
|
5908
5814
|
rect,
|
|
@@ -5914,10 +5820,10 @@ function FloatingToolbar({
|
|
|
5914
5820
|
showEditLink,
|
|
5915
5821
|
onEditLink
|
|
5916
5822
|
}) {
|
|
5917
|
-
const approxW = variant === "link-action" ?
|
|
5823
|
+
const approxW = variant === "link-action" ? 120 : 330;
|
|
5918
5824
|
const { top, left, transform } = calcToolbarPos(rect, parentScroll, approxW);
|
|
5919
5825
|
if (variant === "link-action") {
|
|
5920
|
-
return /* @__PURE__ */ (0,
|
|
5826
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
|
|
5921
5827
|
"div",
|
|
5922
5828
|
{
|
|
5923
5829
|
ref: elRef,
|
|
@@ -5934,15 +5840,15 @@ function FloatingToolbar({
|
|
|
5934
5840
|
boxShadow: "0px 2px 4px -2px rgba(0,0,0,.1),0px 4px 6px -1px rgba(0,0,0,.1)",
|
|
5935
5841
|
display: "flex",
|
|
5936
5842
|
alignItems: "center",
|
|
5937
|
-
padding:
|
|
5938
|
-
gap:
|
|
5843
|
+
padding: 4,
|
|
5844
|
+
gap: 6,
|
|
5939
5845
|
fontFamily: "sans-serif",
|
|
5940
5846
|
pointerEvents: "auto",
|
|
5941
5847
|
whiteSpace: "nowrap"
|
|
5942
5848
|
},
|
|
5943
5849
|
onMouseDown: (e) => e.stopPropagation(),
|
|
5944
5850
|
children: [
|
|
5945
|
-
/* @__PURE__ */ (0,
|
|
5851
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
5946
5852
|
"button",
|
|
5947
5853
|
{
|
|
5948
5854
|
type: "button",
|
|
@@ -5977,8 +5883,8 @@ function FloatingToolbar({
|
|
|
5977
5883
|
children: EDIT_LINK_ICON
|
|
5978
5884
|
}
|
|
5979
5885
|
),
|
|
5980
|
-
/* @__PURE__ */ (0,
|
|
5981
|
-
/* @__PURE__ */ (0,
|
|
5886
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { style: { display: "block", width: 1, height: 24, background: "#E7E5E4", flexShrink: 0 } }),
|
|
5887
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
5982
5888
|
"button",
|
|
5983
5889
|
{
|
|
5984
5890
|
type: "button",
|
|
@@ -5997,10 +5903,10 @@ function FloatingToolbar({
|
|
|
5997
5903
|
padding: 6,
|
|
5998
5904
|
opacity: 0.6
|
|
5999
5905
|
},
|
|
6000
|
-
children: /* @__PURE__ */ (0,
|
|
6001
|
-
/* @__PURE__ */ (0,
|
|
6002
|
-
/* @__PURE__ */ (0,
|
|
6003
|
-
/* @__PURE__ */ (0,
|
|
5906
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": true, children: [
|
|
5907
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("circle", { cx: "5", cy: "12", r: "1.5" }),
|
|
5908
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("circle", { cx: "12", cy: "12", r: "1.5" }),
|
|
5909
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("circle", { cx: "19", cy: "12", r: "1.5" })
|
|
6004
5910
|
] })
|
|
6005
5911
|
}
|
|
6006
5912
|
)
|
|
@@ -6008,7 +5914,7 @@ function FloatingToolbar({
|
|
|
6008
5914
|
}
|
|
6009
5915
|
);
|
|
6010
5916
|
}
|
|
6011
|
-
return /* @__PURE__ */ (0,
|
|
5917
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
|
|
6012
5918
|
"div",
|
|
6013
5919
|
{
|
|
6014
5920
|
ref: elRef,
|
|
@@ -6025,19 +5931,19 @@ function FloatingToolbar({
|
|
|
6025
5931
|
boxShadow: "0px 2px 4px -2px rgba(0,0,0,.1),0px 4px 6px -1px rgba(0,0,0,.1)",
|
|
6026
5932
|
display: "flex",
|
|
6027
5933
|
alignItems: "center",
|
|
6028
|
-
padding:
|
|
6029
|
-
gap:
|
|
5934
|
+
padding: 4,
|
|
5935
|
+
gap: 6,
|
|
6030
5936
|
fontFamily: "sans-serif",
|
|
6031
5937
|
pointerEvents: "auto",
|
|
6032
5938
|
whiteSpace: "nowrap"
|
|
6033
5939
|
},
|
|
6034
5940
|
onMouseDown: (e) => e.stopPropagation(),
|
|
6035
5941
|
children: [
|
|
6036
|
-
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ (0,
|
|
6037
|
-
gi > 0 && /* @__PURE__ */ (0,
|
|
5942
|
+
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_react6.default.Fragment, { children: [
|
|
5943
|
+
gi > 0 && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { style: { display: "block", width: 1, height: 24, background: "#E7E5E4", flexShrink: 0 } }),
|
|
6038
5944
|
btns.map((btn) => {
|
|
6039
5945
|
const isActive = activeCommands.has(btn.cmd);
|
|
6040
|
-
return /* @__PURE__ */ (0,
|
|
5946
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
6041
5947
|
"button",
|
|
6042
5948
|
{
|
|
6043
5949
|
title: btn.title,
|
|
@@ -6063,7 +5969,7 @@ function FloatingToolbar({
|
|
|
6063
5969
|
flexShrink: 0,
|
|
6064
5970
|
padding: 6
|
|
6065
5971
|
},
|
|
6066
|
-
children: /* @__PURE__ */ (0,
|
|
5972
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
6067
5973
|
"svg",
|
|
6068
5974
|
{
|
|
6069
5975
|
width: "16",
|
|
@@ -6083,7 +5989,7 @@ function FloatingToolbar({
|
|
|
6083
5989
|
);
|
|
6084
5990
|
})
|
|
6085
5991
|
] }, gi)),
|
|
6086
|
-
showEditLink ? /* @__PURE__ */ (0,
|
|
5992
|
+
showEditLink ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
6087
5993
|
"button",
|
|
6088
5994
|
{
|
|
6089
5995
|
type: "button",
|
|
@@ -6132,7 +6038,7 @@ function StateToggle({
|
|
|
6132
6038
|
states,
|
|
6133
6039
|
onStateChange
|
|
6134
6040
|
}) {
|
|
6135
|
-
return /* @__PURE__ */ (0,
|
|
6041
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
6136
6042
|
ToggleGroup,
|
|
6137
6043
|
{
|
|
6138
6044
|
"data-ohw-state-toggle": "",
|
|
@@ -6146,7 +6052,7 @@ function StateToggle({
|
|
|
6146
6052
|
left: rect.right - 8,
|
|
6147
6053
|
transform: "translateX(-100%)"
|
|
6148
6054
|
},
|
|
6149
|
-
children: states.map((state) => /* @__PURE__ */ (0,
|
|
6055
|
+
children: states.map((state) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToggleGroupItem, { value: state, size: "sm", children: state }, state))
|
|
6150
6056
|
}
|
|
6151
6057
|
);
|
|
6152
6058
|
}
|
|
@@ -6244,8 +6150,6 @@ function OhhwellsBridge() {
|
|
|
6244
6150
|
const [toolbarVariant, setToolbarVariant] = (0, import_react6.useState)("none");
|
|
6245
6151
|
const toolbarVariantRef = (0, import_react6.useRef)("none");
|
|
6246
6152
|
toolbarVariantRef.current = toolbarVariant;
|
|
6247
|
-
const [reorderHrefKey, setReorderHrefKey] = (0, import_react6.useState)(null);
|
|
6248
|
-
const [reorderDragDisabled, setReorderDragDisabled] = (0, import_react6.useState)(false);
|
|
6249
6153
|
const [toggleState, setToggleState] = (0, import_react6.useState)(null);
|
|
6250
6154
|
const [maxBadge, setMaxBadge] = (0, import_react6.useState)(null);
|
|
6251
6155
|
const [activeCommands, setActiveCommands] = (0, import_react6.useState)(/* @__PURE__ */ new Set());
|
|
@@ -6352,7 +6256,7 @@ function OhhwellsBridge() {
|
|
|
6352
6256
|
(0, import_react6.useEffect)(() => {
|
|
6353
6257
|
const update = () => {
|
|
6354
6258
|
const el = activeElRef.current ?? selectedElRef.current;
|
|
6355
|
-
if (el) setToolbarRect(
|
|
6259
|
+
if (el) setToolbarRect(el.getBoundingClientRect());
|
|
6356
6260
|
setToggleState((prev) => {
|
|
6357
6261
|
if (!prev || !activeStateElRef.current) return prev;
|
|
6358
6262
|
return { ...prev, rect: activeStateElRef.current.getBoundingClientRect() };
|
|
@@ -6419,8 +6323,6 @@ function OhhwellsBridge() {
|
|
|
6419
6323
|
}
|
|
6420
6324
|
el.removeAttribute("contenteditable");
|
|
6421
6325
|
activeElRef.current = null;
|
|
6422
|
-
setReorderHrefKey(null);
|
|
6423
|
-
setReorderDragDisabled(false);
|
|
6424
6326
|
if (!selectedElRef.current) {
|
|
6425
6327
|
setToolbarRect(null);
|
|
6426
6328
|
setToolbarVariant("none");
|
|
@@ -6458,15 +6360,11 @@ function OhhwellsBridge() {
|
|
|
6458
6360
|
setToolbarVariant("rich-text");
|
|
6459
6361
|
el.setAttribute("contenteditable", "true");
|
|
6460
6362
|
el.removeAttribute("data-ohw-hovered");
|
|
6461
|
-
el.closest("[data-ohw-href-key]")?.removeAttribute("data-ohw-hovered");
|
|
6462
6363
|
activeElRef.current = el;
|
|
6463
6364
|
originalContentRef.current = el.innerHTML;
|
|
6464
6365
|
el.focus();
|
|
6366
|
+
setToolbarRect(el.getBoundingClientRect());
|
|
6465
6367
|
setToolbarShowEditLink(Boolean(getHrefKeyFromElement(el)));
|
|
6466
|
-
const { key: reorderKey, disabled: reorderDisabled } = getReorderHandleState(el);
|
|
6467
|
-
setReorderHrefKey(reorderKey);
|
|
6468
|
-
setReorderDragDisabled(reorderDisabled);
|
|
6469
|
-
setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
6470
6368
|
postToParent({ type: "ow:enter-edit", key: el.dataset.ohwKey });
|
|
6471
6369
|
requestAnimationFrame(() => refreshActiveCommandsRef.current());
|
|
6472
6370
|
}, [deactivate, postToParent]);
|
|
@@ -6535,32 +6433,26 @@ function OhhwellsBridge() {
|
|
|
6535
6433
|
(0, import_react6.useEffect)(() => {
|
|
6536
6434
|
if (!subdomain || isEditMode) return;
|
|
6537
6435
|
let debounceTimer = null;
|
|
6538
|
-
let observer = null;
|
|
6539
6436
|
const applyFromCache = () => {
|
|
6540
6437
|
const content = contentCache.get(subdomain);
|
|
6541
6438
|
if (!content) return;
|
|
6542
6439
|
retryMissingSchedulingMounts(getPageSchedulingEntries(content["__ohw_sections"]), false);
|
|
6543
|
-
|
|
6544
|
-
|
|
6545
|
-
|
|
6546
|
-
if (
|
|
6547
|
-
|
|
6548
|
-
if (
|
|
6549
|
-
|
|
6550
|
-
|
|
6551
|
-
|
|
6552
|
-
|
|
6553
|
-
|
|
6554
|
-
|
|
6555
|
-
|
|
6556
|
-
|
|
6557
|
-
|
|
6558
|
-
|
|
6559
|
-
});
|
|
6560
|
-
applyLinkByKey(key, val);
|
|
6561
|
-
}
|
|
6562
|
-
} finally {
|
|
6563
|
-
observer?.observe(document.body, { childList: true, subtree: true });
|
|
6440
|
+
for (const [key, val] of Object.entries(content)) {
|
|
6441
|
+
if (key === "__ohw_sections") continue;
|
|
6442
|
+
document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
|
|
6443
|
+
if (el.dataset.ohwEditable === "image") {
|
|
6444
|
+
const img = el instanceof HTMLImageElement ? el : el.querySelector("img");
|
|
6445
|
+
if (img && img.src !== val) img.src = val;
|
|
6446
|
+
} else if (el.dataset.ohwEditable === "bg-image") {
|
|
6447
|
+
const next = `url('${val}')`;
|
|
6448
|
+
if (el.style.backgroundImage !== next) el.style.backgroundImage = next;
|
|
6449
|
+
} else if (el.dataset.ohwEditable === "link") {
|
|
6450
|
+
applyLinkHref(el, val);
|
|
6451
|
+
} else if (el.innerHTML !== val) {
|
|
6452
|
+
el.innerHTML = val;
|
|
6453
|
+
}
|
|
6454
|
+
});
|
|
6455
|
+
applyLinkByKey(key, val);
|
|
6564
6456
|
}
|
|
6565
6457
|
enforceLinkHrefs();
|
|
6566
6458
|
};
|
|
@@ -6569,10 +6461,10 @@ function OhhwellsBridge() {
|
|
|
6569
6461
|
debounceTimer = setTimeout(applyFromCache, 150);
|
|
6570
6462
|
};
|
|
6571
6463
|
scheduleApply();
|
|
6572
|
-
observer = new MutationObserver(scheduleApply);
|
|
6464
|
+
const observer = new MutationObserver(scheduleApply);
|
|
6573
6465
|
observer.observe(document.body, { childList: true, subtree: true });
|
|
6574
6466
|
return () => {
|
|
6575
|
-
observer
|
|
6467
|
+
observer.disconnect();
|
|
6576
6468
|
if (debounceTimer) clearTimeout(debounceTimer);
|
|
6577
6469
|
};
|
|
6578
6470
|
}, [subdomain, isEditMode, pathname]);
|
|
@@ -6696,11 +6588,6 @@ function OhhwellsBridge() {
|
|
|
6696
6588
|
if (target.closest("[data-ohw-state-toggle]")) return;
|
|
6697
6589
|
if (target.closest("[data-ohw-max-badge]")) return;
|
|
6698
6590
|
if (isInsideLinkEditor(target)) return;
|
|
6699
|
-
if (target.closest('[data-ohw-edit-chrome], [data-ohw-drag-handle-container], [data-slot="drag-handle"]')) {
|
|
6700
|
-
e.preventDefault();
|
|
6701
|
-
e.stopPropagation();
|
|
6702
|
-
return;
|
|
6703
|
-
}
|
|
6704
6591
|
const editable = target.closest("[data-ohw-editable]");
|
|
6705
6592
|
if (editable) {
|
|
6706
6593
|
if (editable.dataset.ohwEditable === "link") {
|
|
@@ -6777,18 +6664,14 @@ function OhhwellsBridge() {
|
|
|
6777
6664
|
const selected = selectedElRef.current;
|
|
6778
6665
|
if (selected && (selected === editable || selected.contains(editable))) return;
|
|
6779
6666
|
if (editable.dataset.ohwEditable !== "image" && editable.dataset.ohwEditable !== "bg-image" && !editable.hasAttribute("contenteditable")) {
|
|
6780
|
-
|
|
6781
|
-
hoverTarget.setAttribute("data-ohw-hovered", "");
|
|
6667
|
+
editable.setAttribute("data-ohw-hovered", "");
|
|
6782
6668
|
}
|
|
6783
6669
|
};
|
|
6784
6670
|
const handleMouseOut = (e) => {
|
|
6785
6671
|
const editable = e.target.closest("[data-ohw-editable]");
|
|
6786
6672
|
if (!editable) return;
|
|
6787
|
-
const related = e.relatedTarget instanceof Element ? e.relatedTarget : null;
|
|
6788
|
-
if (related?.closest("[data-ohw-drag-handle-container]")) return;
|
|
6789
6673
|
if (editable.dataset.ohwEditable !== "image" && editable.dataset.ohwEditable !== "bg-image") {
|
|
6790
|
-
|
|
6791
|
-
hoverTarget.removeAttribute("data-ohw-hovered");
|
|
6674
|
+
editable.removeAttribute("data-ohw-hovered");
|
|
6792
6675
|
}
|
|
6793
6676
|
};
|
|
6794
6677
|
const toProbeCoords = (clientX, clientY, fromParentViewport) => {
|
|
@@ -6903,20 +6786,11 @@ function OhhwellsBridge() {
|
|
|
6903
6786
|
return;
|
|
6904
6787
|
}
|
|
6905
6788
|
}
|
|
6906
|
-
if (activeElRef.current) {
|
|
6907
|
-
if (hoveredImageRef.current) {
|
|
6908
|
-
hoveredImageRef.current = null;
|
|
6909
|
-
hoveredImageHasTextOverlapRef.current = false;
|
|
6910
|
-
resumeAnimTracks();
|
|
6911
|
-
postToParentRef.current({ type: "ow:image-unhover" });
|
|
6912
|
-
}
|
|
6913
|
-
return;
|
|
6914
|
-
}
|
|
6915
6789
|
const imgEl = findImageAtPoint(clientX, clientY, fromParentViewport);
|
|
6916
6790
|
if (imgEl) {
|
|
6917
6791
|
const { x, y } = toProbeCoords(clientX, clientY, fromParentViewport);
|
|
6918
6792
|
const topEl = document.elementFromPoint(x, y);
|
|
6919
|
-
if (topEl?.closest(
|
|
6793
|
+
if (topEl?.closest("[data-ohw-toolbar]")) {
|
|
6920
6794
|
if (hoveredImageRef.current) {
|
|
6921
6795
|
hoveredImageRef.current = null;
|
|
6922
6796
|
resumeAnimTracks();
|
|
@@ -7209,7 +7083,7 @@ function OhhwellsBridge() {
|
|
|
7209
7083
|
const el = e.target;
|
|
7210
7084
|
const key = el.dataset.ohwKey;
|
|
7211
7085
|
if (!key) return;
|
|
7212
|
-
if (el === activeElRef.current) setToolbarRect(
|
|
7086
|
+
if (el === activeElRef.current) setToolbarRect(el.getBoundingClientRect());
|
|
7213
7087
|
const maxLen = el.dataset.ohwMaxLength ? parseInt(el.dataset.ohwMaxLength, 10) : null;
|
|
7214
7088
|
if (maxLen) {
|
|
7215
7089
|
const current = el.innerText.replace(/\n$/, "").length;
|
|
@@ -7439,7 +7313,7 @@ function OhhwellsBridge() {
|
|
|
7439
7313
|
};
|
|
7440
7314
|
const applyToolbarPos = (rect) => {
|
|
7441
7315
|
const ps = parentScrollRef.current;
|
|
7442
|
-
const approxW = toolbarVariantRef.current === "link-action" ?
|
|
7316
|
+
const approxW = toolbarVariantRef.current === "link-action" ? 120 : 330;
|
|
7443
7317
|
if (toolbarElRef.current) {
|
|
7444
7318
|
const { top, left, transform } = calcToolbarPos(rect, ps, approxW);
|
|
7445
7319
|
toolbarElRef.current.style.top = `${top}px`;
|
|
@@ -7618,7 +7492,7 @@ function OhhwellsBridge() {
|
|
|
7618
7492
|
const handleCommand = (0, import_react6.useCallback)((cmd) => {
|
|
7619
7493
|
document.execCommand(cmd, false);
|
|
7620
7494
|
activeElRef.current?.focus();
|
|
7621
|
-
if (activeElRef.current) setToolbarRect(
|
|
7495
|
+
if (activeElRef.current) setToolbarRect(activeElRef.current.getBoundingClientRect());
|
|
7622
7496
|
refreshActiveCommandsRef.current();
|
|
7623
7497
|
}, []);
|
|
7624
7498
|
const handleStateChange = (0, import_react6.useCallback)((state) => {
|
|
@@ -7671,19 +7545,11 @@ function OhhwellsBridge() {
|
|
|
7671
7545
|
const currentSections = sectionsByPath[pathname] ?? [];
|
|
7672
7546
|
linkPopoverOpenRef.current = linkPopover !== null;
|
|
7673
7547
|
return bridgeRoot ? (0, import_react_dom2.createPortal)(
|
|
7674
|
-
/* @__PURE__ */ (0,
|
|
7675
|
-
/* @__PURE__ */ (0,
|
|
7676
|
-
toolbarRect && /* @__PURE__ */ (0,
|
|
7677
|
-
/* @__PURE__ */ (0,
|
|
7678
|
-
|
|
7679
|
-
{
|
|
7680
|
-
rect: toolbarRect,
|
|
7681
|
-
elRef: glowElRef,
|
|
7682
|
-
reorderHrefKey,
|
|
7683
|
-
dragDisabled: reorderDragDisabled
|
|
7684
|
-
}
|
|
7685
|
-
),
|
|
7686
|
-
toolbarVariant === "rich-text" && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
7548
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
|
|
7549
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { ref: attachVisibleViewport, "data-ohw-visible-viewport": "", "aria-hidden": true }),
|
|
7550
|
+
toolbarRect && /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
|
|
7551
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(GlowFrame, { rect: toolbarRect, elRef: glowElRef }),
|
|
7552
|
+
toolbarVariant === "rich-text" && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
7687
7553
|
FloatingToolbar,
|
|
7688
7554
|
{
|
|
7689
7555
|
variant: "rich-text",
|
|
@@ -7696,7 +7562,7 @@ function OhhwellsBridge() {
|
|
|
7696
7562
|
onEditLink: openLinkPopoverForActive
|
|
7697
7563
|
}
|
|
7698
7564
|
),
|
|
7699
|
-
toolbarVariant === "link-action" && /* @__PURE__ */ (0,
|
|
7565
|
+
toolbarVariant === "link-action" && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
7700
7566
|
FloatingToolbar,
|
|
7701
7567
|
{
|
|
7702
7568
|
variant: "link-action",
|
|
@@ -7709,7 +7575,7 @@ function OhhwellsBridge() {
|
|
|
7709
7575
|
}
|
|
7710
7576
|
)
|
|
7711
7577
|
] }),
|
|
7712
|
-
maxBadge && /* @__PURE__ */ (0,
|
|
7578
|
+
maxBadge && /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
|
|
7713
7579
|
"div",
|
|
7714
7580
|
{
|
|
7715
7581
|
"data-ohw-max-badge": "",
|
|
@@ -7735,7 +7601,7 @@ function OhhwellsBridge() {
|
|
|
7735
7601
|
]
|
|
7736
7602
|
}
|
|
7737
7603
|
),
|
|
7738
|
-
toggleState && /* @__PURE__ */ (0,
|
|
7604
|
+
toggleState && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
7739
7605
|
StateToggle,
|
|
7740
7606
|
{
|
|
7741
7607
|
rect: toggleState.rect,
|
|
@@ -7744,15 +7610,15 @@ function OhhwellsBridge() {
|
|
|
7744
7610
|
onStateChange: handleStateChange
|
|
7745
7611
|
}
|
|
7746
7612
|
),
|
|
7747
|
-
sectionGap && /* @__PURE__ */ (0,
|
|
7613
|
+
sectionGap && /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
|
|
7748
7614
|
"div",
|
|
7749
7615
|
{
|
|
7750
7616
|
"data-ohw-section-insert-line": "",
|
|
7751
7617
|
className: "fixed left-0 w-full z-2147483646 flex items-center pointer-events-none",
|
|
7752
7618
|
style: { top: sectionGap.y, transform: "translateY(-50%)" },
|
|
7753
7619
|
children: [
|
|
7754
|
-
/* @__PURE__ */ (0,
|
|
7755
|
-
/* @__PURE__ */ (0,
|
|
7620
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } }),
|
|
7621
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
7756
7622
|
Badge,
|
|
7757
7623
|
{
|
|
7758
7624
|
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",
|
|
@@ -7765,11 +7631,11 @@ function OhhwellsBridge() {
|
|
|
7765
7631
|
children: "Add Section"
|
|
7766
7632
|
}
|
|
7767
7633
|
),
|
|
7768
|
-
/* @__PURE__ */ (0,
|
|
7634
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } })
|
|
7769
7635
|
]
|
|
7770
7636
|
}
|
|
7771
7637
|
),
|
|
7772
|
-
linkPopover && dialogPortalContainer ? /* @__PURE__ */ (0,
|
|
7638
|
+
linkPopover && dialogPortalContainer ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
7773
7639
|
LinkPopover,
|
|
7774
7640
|
{
|
|
7775
7641
|
panelRef: linkPopoverPanelRef,
|
|
@@ -7784,39 +7650,13 @@ function OhhwellsBridge() {
|
|
|
7784
7650
|
onSubmit: handleLinkPopoverSubmit
|
|
7785
7651
|
},
|
|
7786
7652
|
`${linkPopover.key}-${pathname}`
|
|
7787
|
-
) : null
|
|
7788
|
-
sectionGap && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
|
|
7789
|
-
"div",
|
|
7790
|
-
{
|
|
7791
|
-
"data-ohw-section-insert-line": "",
|
|
7792
|
-
className: "fixed left-0 w-full z-2147483646 flex items-center pointer-events-none",
|
|
7793
|
-
style: { top: sectionGap.y, transform: "translateY(-50%)" },
|
|
7794
|
-
children: [
|
|
7795
|
-
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } }),
|
|
7796
|
-
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
7797
|
-
Badge,
|
|
7798
|
-
{
|
|
7799
|
-
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",
|
|
7800
|
-
onClick: () => {
|
|
7801
|
-
window.parent.postMessage(
|
|
7802
|
-
{ type: "ow:add-section", insertAfter: sectionGap.insertAfter, insertBefore: sectionGap.insertBefore },
|
|
7803
|
-
"*"
|
|
7804
|
-
);
|
|
7805
|
-
},
|
|
7806
|
-
children: "Add Section"
|
|
7807
|
-
}
|
|
7808
|
-
),
|
|
7809
|
-
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } })
|
|
7810
|
-
]
|
|
7811
|
-
}
|
|
7812
|
-
)
|
|
7653
|
+
) : null
|
|
7813
7654
|
] }),
|
|
7814
7655
|
bridgeRoot
|
|
7815
7656
|
) : null;
|
|
7816
7657
|
}
|
|
7817
7658
|
// Annotate the CommonJS export names for ESM import in node:
|
|
7818
7659
|
0 && (module.exports = {
|
|
7819
|
-
DragHandle,
|
|
7820
7660
|
LinkEditorPanel,
|
|
7821
7661
|
LinkPopover,
|
|
7822
7662
|
OhhwellsBridge,
|
|
@@ -7827,7 +7667,6 @@ function OhhwellsBridge() {
|
|
|
7827
7667
|
buildTarget,
|
|
7828
7668
|
filterAvailablePages,
|
|
7829
7669
|
getEditModeInitialState,
|
|
7830
|
-
isEditSessionActive,
|
|
7831
7670
|
isValidUrl,
|
|
7832
7671
|
parseTarget,
|
|
7833
7672
|
toggleVariants,
|