@ohhwells/bridge 0.1.33-next.38 → 0.1.33
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/README.md +0 -12
- package/dist/index.cjs +174 -336
- 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 +144 -304
- package/dist/index.js.map +1 -1
- package/dist/styles.css +18 -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,
|
|
@@ -762,10 +760,15 @@ function SchedulingWidget({ notifyOnConnect = false, initialScheduleId, insertAf
|
|
|
762
760
|
};
|
|
763
761
|
const handleReplaceSchedule = () => {
|
|
764
762
|
setIsHovered(false);
|
|
765
|
-
|
|
766
|
-
{
|
|
767
|
-
|
|
768
|
-
|
|
763
|
+
if (schedule) {
|
|
764
|
+
window.parent.postMessage({
|
|
765
|
+
type: "ow:schedule-connected",
|
|
766
|
+
schedule: { id: schedule.id, name: schedule.name },
|
|
767
|
+
insertAfter
|
|
768
|
+
}, "*");
|
|
769
|
+
} else {
|
|
770
|
+
window.parent.postMessage({ type: "ow:scheduling-not-connected", insertAfter }, "*");
|
|
771
|
+
}
|
|
769
772
|
};
|
|
770
773
|
if (!inEditor && !loading && !schedule) return null;
|
|
771
774
|
const sectionId = `scheduling-${insertAfter}`;
|
|
@@ -808,19 +811,7 @@ function SchedulingWidget({ notifyOnConnect = false, initialScheduleId, insertAf
|
|
|
808
811
|
),
|
|
809
812
|
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "max-w-[1280px] mx-auto flex flex-col items-center gap-16", children: [
|
|
810
813
|
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex flex-col items-center gap-4", children: [
|
|
811
|
-
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
812
|
-
"h2",
|
|
813
|
-
{
|
|
814
|
-
className: "font-display text-center m-0 text-(--color-dark,#200C02)",
|
|
815
|
-
style: {
|
|
816
|
-
fontSize: "var(--fs-section-h2, clamp(40px, 4.4vw, 64px))",
|
|
817
|
-
fontWeight: "var(--font-weight-heading, 400)",
|
|
818
|
-
lineHeight: 1.05,
|
|
819
|
-
letterSpacing: "-0.02em"
|
|
820
|
-
},
|
|
821
|
-
children: schedule?.name ?? "Book an appointment"
|
|
822
|
-
}
|
|
823
|
-
),
|
|
814
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("h2", { className: "font-display text-4xl sm:text-5xl font-bold text-center m-0 text-(--color-dark,#200C02)", children: schedule?.name ?? "Book an appointment" }),
|
|
824
815
|
schedule?.description && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "font-body text-body text-center m-0 text-(--color-accent,#A89B83)", children: schedule.description })
|
|
825
816
|
] }),
|
|
826
817
|
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "w-full flex flex-col items-end gap-3", children: [
|
|
@@ -4259,34 +4250,6 @@ function ToggleGroupItem({
|
|
|
4259
4250
|
);
|
|
4260
4251
|
}
|
|
4261
4252
|
|
|
4262
|
-
// src/ui/drag-handle.tsx
|
|
4263
|
-
var React3 = __toESM(require("react"), 1);
|
|
4264
|
-
var import_lucide_react = require("lucide-react");
|
|
4265
|
-
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
4266
|
-
var DragHandle = React3.forwardRef(
|
|
4267
|
-
({ className, type = "button", ...props }, ref) => {
|
|
4268
|
-
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4269
|
-
"button",
|
|
4270
|
-
{
|
|
4271
|
-
ref,
|
|
4272
|
-
type,
|
|
4273
|
-
"data-slot": "drag-handle",
|
|
4274
|
-
className: cn(
|
|
4275
|
-
"inline-flex h-7 w-4 shrink-0 items-center justify-center rounded-md transition-all duration-200 max-h-[30px]",
|
|
4276
|
-
"bg-white border border-transparent text-stone-500 shadow-md cursor-grab",
|
|
4277
|
-
"enabled:hover:border enabled:hover:border-stone-200 enabled:hover:text-stone-950",
|
|
4278
|
-
"enabled:active:border enabled:active:border-primary enabled:active:bg-primary-50 enabled:active:text-stone-950 enabled:active:shadow enabled:active:cursor-grabbing",
|
|
4279
|
-
"disabled:cursor-not-allowed disabled:opacity-40 disabled:text-stone-950 disabled:pointer-events-none",
|
|
4280
|
-
className
|
|
4281
|
-
),
|
|
4282
|
-
...props,
|
|
4283
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react.GripVertical, { className: "size-4 shrink-0", "aria-hidden": "true" })
|
|
4284
|
-
}
|
|
4285
|
-
);
|
|
4286
|
-
}
|
|
4287
|
-
);
|
|
4288
|
-
DragHandle.displayName = "DragHandle";
|
|
4289
|
-
|
|
4290
4253
|
// src/OhhwellsBridge.tsx
|
|
4291
4254
|
var import_react_dom2 = require("react-dom");
|
|
4292
4255
|
var import_navigation = require("next/navigation");
|
|
@@ -4566,60 +4529,60 @@ function scrollToHashSectionWhenReady(behavior = "smooth") {
|
|
|
4566
4529
|
}
|
|
4567
4530
|
|
|
4568
4531
|
// src/ui/dialog.tsx
|
|
4569
|
-
var
|
|
4532
|
+
var React3 = __toESM(require("react"), 1);
|
|
4570
4533
|
var import_radix_ui3 = require("radix-ui");
|
|
4571
4534
|
|
|
4572
4535
|
// src/ui/icons.tsx
|
|
4573
|
-
var
|
|
4536
|
+
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
4574
4537
|
function IconX({ className, ...props }) {
|
|
4575
|
-
return /* @__PURE__ */ (0,
|
|
4576
|
-
/* @__PURE__ */ (0,
|
|
4577
|
-
/* @__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" })
|
|
4578
4541
|
] });
|
|
4579
4542
|
}
|
|
4580
4543
|
function IconChevronDown({ className, ...props }) {
|
|
4581
|
-
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" }) });
|
|
4582
4545
|
}
|
|
4583
4546
|
function IconFile({ className, ...props }) {
|
|
4584
|
-
return /* @__PURE__ */ (0,
|
|
4585
|
-
/* @__PURE__ */ (0,
|
|
4586
|
-
/* @__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" })
|
|
4587
4550
|
] });
|
|
4588
4551
|
}
|
|
4589
4552
|
function IconInfo({ className, ...props }) {
|
|
4590
|
-
return /* @__PURE__ */ (0,
|
|
4591
|
-
/* @__PURE__ */ (0,
|
|
4592
|
-
/* @__PURE__ */ (0,
|
|
4593
|
-
/* @__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" })
|
|
4594
4557
|
] });
|
|
4595
4558
|
}
|
|
4596
4559
|
function IconArrowRight({ className, ...props }) {
|
|
4597
|
-
return /* @__PURE__ */ (0,
|
|
4598
|
-
/* @__PURE__ */ (0,
|
|
4599
|
-
/* @__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" })
|
|
4600
4563
|
] });
|
|
4601
4564
|
}
|
|
4602
4565
|
function IconSection({ className, ...props }) {
|
|
4603
|
-
return /* @__PURE__ */ (0,
|
|
4604
|
-
/* @__PURE__ */ (0,
|
|
4605
|
-
/* @__PURE__ */ (0,
|
|
4606
|
-
/* @__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" })
|
|
4607
4570
|
] });
|
|
4608
4571
|
}
|
|
4609
4572
|
|
|
4610
4573
|
// src/ui/dialog.tsx
|
|
4611
|
-
var
|
|
4574
|
+
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
4612
4575
|
function Dialog2({ ...props }) {
|
|
4613
|
-
return /* @__PURE__ */ (0,
|
|
4576
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_radix_ui3.Dialog.Root, { "data-slot": "dialog", ...props });
|
|
4614
4577
|
}
|
|
4615
4578
|
function DialogPortal({ ...props }) {
|
|
4616
|
-
return /* @__PURE__ */ (0,
|
|
4579
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_radix_ui3.Dialog.Portal, { ...props });
|
|
4617
4580
|
}
|
|
4618
4581
|
function DialogOverlay({
|
|
4619
4582
|
className,
|
|
4620
4583
|
...props
|
|
4621
4584
|
}) {
|
|
4622
|
-
return /* @__PURE__ */ (0,
|
|
4585
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
4623
4586
|
import_radix_ui3.Dialog.Overlay,
|
|
4624
4587
|
{
|
|
4625
4588
|
"data-slot": "dialog-overlay",
|
|
@@ -4629,11 +4592,11 @@ function DialogOverlay({
|
|
|
4629
4592
|
}
|
|
4630
4593
|
);
|
|
4631
4594
|
}
|
|
4632
|
-
var DialogContent =
|
|
4595
|
+
var DialogContent = React3.forwardRef(({ className, children, showCloseButton = true, container, ...props }, ref) => {
|
|
4633
4596
|
const positionMode = container ? "absolute" : "fixed";
|
|
4634
|
-
return /* @__PURE__ */ (0,
|
|
4635
|
-
/* @__PURE__ */ (0,
|
|
4636
|
-
/* @__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)(
|
|
4637
4600
|
import_radix_ui3.Dialog.Content,
|
|
4638
4601
|
{
|
|
4639
4602
|
ref,
|
|
@@ -4649,13 +4612,13 @@ var DialogContent = React4.forwardRef(({ className, children, showCloseButton =
|
|
|
4649
4612
|
...props,
|
|
4650
4613
|
children: [
|
|
4651
4614
|
children,
|
|
4652
|
-
showCloseButton ? /* @__PURE__ */ (0,
|
|
4615
|
+
showCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
4653
4616
|
import_radix_ui3.Dialog.Close,
|
|
4654
4617
|
{
|
|
4655
4618
|
type: "button",
|
|
4656
4619
|
className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50",
|
|
4657
4620
|
"aria-label": "Close",
|
|
4658
|
-
children: /* @__PURE__ */ (0,
|
|
4621
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(IconX, { "aria-hidden": true })
|
|
4659
4622
|
}
|
|
4660
4623
|
) : null
|
|
4661
4624
|
]
|
|
@@ -4665,12 +4628,12 @@ var DialogContent = React4.forwardRef(({ className, children, showCloseButton =
|
|
|
4665
4628
|
});
|
|
4666
4629
|
DialogContent.displayName = import_radix_ui3.Dialog.Content.displayName;
|
|
4667
4630
|
function DialogHeader({ className, ...props }) {
|
|
4668
|
-
return /* @__PURE__ */ (0,
|
|
4631
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: cn("flex flex-col gap-1.5", className), ...props });
|
|
4669
4632
|
}
|
|
4670
4633
|
function DialogFooter({ className, ...props }) {
|
|
4671
|
-
return /* @__PURE__ */ (0,
|
|
4634
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: cn("flex items-center justify-end gap-2", className), ...props });
|
|
4672
4635
|
}
|
|
4673
|
-
var DialogTitle =
|
|
4636
|
+
var DialogTitle = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
4674
4637
|
import_radix_ui3.Dialog.Title,
|
|
4675
4638
|
{
|
|
4676
4639
|
ref,
|
|
@@ -4679,7 +4642,7 @@ var DialogTitle = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE
|
|
|
4679
4642
|
}
|
|
4680
4643
|
));
|
|
4681
4644
|
DialogTitle.displayName = import_radix_ui3.Dialog.Title.displayName;
|
|
4682
|
-
var DialogDescription =
|
|
4645
|
+
var DialogDescription = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
4683
4646
|
import_radix_ui3.Dialog.Description,
|
|
4684
4647
|
{
|
|
4685
4648
|
ref,
|
|
@@ -4691,9 +4654,9 @@ DialogDescription.displayName = import_radix_ui3.Dialog.Description.displayName;
|
|
|
4691
4654
|
var DialogClose = import_radix_ui3.Dialog.Close;
|
|
4692
4655
|
|
|
4693
4656
|
// src/ui/button.tsx
|
|
4694
|
-
var
|
|
4657
|
+
var React4 = __toESM(require("react"), 1);
|
|
4695
4658
|
var import_radix_ui4 = require("radix-ui");
|
|
4696
|
-
var
|
|
4659
|
+
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
4697
4660
|
var buttonVariants = cva(
|
|
4698
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",
|
|
4699
4662
|
{
|
|
@@ -4714,10 +4677,10 @@ var buttonVariants = cva(
|
|
|
4714
4677
|
}
|
|
4715
4678
|
}
|
|
4716
4679
|
);
|
|
4717
|
-
var Button =
|
|
4680
|
+
var Button = React4.forwardRef(
|
|
4718
4681
|
({ className, variant, size, asChild = false, ...props }, ref) => {
|
|
4719
4682
|
const Comp = asChild ? import_radix_ui4.Slot.Root : "button";
|
|
4720
|
-
return /* @__PURE__ */ (0,
|
|
4683
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
4721
4684
|
Comp,
|
|
4722
4685
|
{
|
|
4723
4686
|
ref,
|
|
@@ -4731,37 +4694,37 @@ var Button = React5.forwardRef(
|
|
|
4731
4694
|
Button.displayName = "Button";
|
|
4732
4695
|
|
|
4733
4696
|
// src/ui/link-modal/DestinationBreadcrumb.tsx
|
|
4734
|
-
var
|
|
4697
|
+
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
4735
4698
|
function DestinationBreadcrumb({ pageTitle, sectionLabel }) {
|
|
4736
|
-
return /* @__PURE__ */ (0,
|
|
4737
|
-
/* @__PURE__ */ (0,
|
|
4738
|
-
/* @__PURE__ */ (0,
|
|
4739
|
-
/* @__PURE__ */ (0,
|
|
4740
|
-
/* @__PURE__ */ (0,
|
|
4741
|
-
/* @__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 })
|
|
4742
4705
|
] }),
|
|
4743
|
-
/* @__PURE__ */ (0,
|
|
4744
|
-
/* @__PURE__ */ (0,
|
|
4745
|
-
/* @__PURE__ */ (0,
|
|
4746
|
-
/* @__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 })
|
|
4747
4710
|
] })
|
|
4748
4711
|
] })
|
|
4749
4712
|
] });
|
|
4750
4713
|
}
|
|
4751
4714
|
|
|
4752
4715
|
// src/ui/link-modal/SectionTreeItem.tsx
|
|
4753
|
-
var
|
|
4716
|
+
var import_jsx_runtime9 = require("react/jsx-runtime");
|
|
4754
4717
|
function SectionTreeItem({ section, onSelect, selected }) {
|
|
4755
4718
|
const interactive = Boolean(onSelect);
|
|
4756
|
-
return /* @__PURE__ */ (0,
|
|
4757
|
-
/* @__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)(
|
|
4758
4721
|
"div",
|
|
4759
4722
|
{
|
|
4760
4723
|
className: "mr-[-1px] h-9 w-2 shrink-0 rounded-bl-sm border-b border-l border-border mb-4",
|
|
4761
4724
|
"aria-hidden": true
|
|
4762
4725
|
}
|
|
4763
4726
|
),
|
|
4764
|
-
/* @__PURE__ */ (0,
|
|
4727
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
|
|
4765
4728
|
"div",
|
|
4766
4729
|
{
|
|
4767
4730
|
role: interactive ? "button" : void 0,
|
|
@@ -4779,8 +4742,8 @@ function SectionTreeItem({ section, onSelect, selected }) {
|
|
|
4779
4742
|
interactive && selected && "border-primary"
|
|
4780
4743
|
),
|
|
4781
4744
|
children: [
|
|
4782
|
-
/* @__PURE__ */ (0,
|
|
4783
|
-
/* @__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 })
|
|
4784
4747
|
]
|
|
4785
4748
|
}
|
|
4786
4749
|
)
|
|
@@ -4788,11 +4751,11 @@ function SectionTreeItem({ section, onSelect, selected }) {
|
|
|
4788
4751
|
}
|
|
4789
4752
|
function SectionPickerList({ sections, onSelect }) {
|
|
4790
4753
|
if (sections.length === 0) {
|
|
4791
|
-
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." });
|
|
4792
4755
|
}
|
|
4793
|
-
return /* @__PURE__ */ (0,
|
|
4794
|
-
/* @__PURE__ */ (0,
|
|
4795
|
-
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))
|
|
4796
4759
|
] });
|
|
4797
4760
|
}
|
|
4798
4761
|
|
|
@@ -4800,11 +4763,11 @@ function SectionPickerList({ sections, onSelect }) {
|
|
|
4800
4763
|
var import_react4 = require("react");
|
|
4801
4764
|
|
|
4802
4765
|
// src/ui/input.tsx
|
|
4803
|
-
var
|
|
4804
|
-
var
|
|
4805
|
-
var Input =
|
|
4766
|
+
var React5 = __toESM(require("react"), 1);
|
|
4767
|
+
var import_jsx_runtime10 = require("react/jsx-runtime");
|
|
4768
|
+
var Input = React5.forwardRef(
|
|
4806
4769
|
({ className, type, ...props }, ref) => {
|
|
4807
|
-
return /* @__PURE__ */ (0,
|
|
4770
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
4808
4771
|
"input",
|
|
4809
4772
|
{
|
|
4810
4773
|
type,
|
|
@@ -4823,9 +4786,9 @@ Input.displayName = "Input";
|
|
|
4823
4786
|
|
|
4824
4787
|
// src/ui/label.tsx
|
|
4825
4788
|
var import_radix_ui5 = require("radix-ui");
|
|
4826
|
-
var
|
|
4789
|
+
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
4827
4790
|
function Label({ className, ...props }) {
|
|
4828
|
-
return /* @__PURE__ */ (0,
|
|
4791
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
4829
4792
|
import_radix_ui5.Label.Root,
|
|
4830
4793
|
{
|
|
4831
4794
|
"data-slot": "label",
|
|
@@ -4836,9 +4799,9 @@ function Label({ className, ...props }) {
|
|
|
4836
4799
|
}
|
|
4837
4800
|
|
|
4838
4801
|
// src/ui/link-modal/UrlOrPageInput.tsx
|
|
4839
|
-
var
|
|
4802
|
+
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
4840
4803
|
function FieldChevron({ onClick }) {
|
|
4841
|
-
return /* @__PURE__ */ (0,
|
|
4804
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
4842
4805
|
"button",
|
|
4843
4806
|
{
|
|
4844
4807
|
type: "button",
|
|
@@ -4846,7 +4809,7 @@ function FieldChevron({ onClick }) {
|
|
|
4846
4809
|
onClick,
|
|
4847
4810
|
"aria-label": "Open page list",
|
|
4848
4811
|
tabIndex: -1,
|
|
4849
|
-
children: /* @__PURE__ */ (0,
|
|
4812
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconChevronDown, {})
|
|
4850
4813
|
}
|
|
4851
4814
|
);
|
|
4852
4815
|
}
|
|
@@ -4885,12 +4848,12 @@ function UrlOrPageInput({
|
|
|
4885
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]",
|
|
4886
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"
|
|
4887
4850
|
);
|
|
4888
|
-
return /* @__PURE__ */ (0,
|
|
4889
|
-
/* @__PURE__ */ (0,
|
|
4890
|
-
/* @__PURE__ */ (0,
|
|
4891
|
-
/* @__PURE__ */ (0,
|
|
4892
|
-
selectedPage ? /* @__PURE__ */ (0,
|
|
4893
|
-
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)(
|
|
4894
4857
|
Input,
|
|
4895
4858
|
{
|
|
4896
4859
|
ref: inputRef,
|
|
@@ -4909,7 +4872,7 @@ function UrlOrPageInput({
|
|
|
4909
4872
|
)
|
|
4910
4873
|
}
|
|
4911
4874
|
),
|
|
4912
|
-
selectedPage && !readOnly ? /* @__PURE__ */ (0,
|
|
4875
|
+
selectedPage && !readOnly ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
4913
4876
|
"button",
|
|
4914
4877
|
{
|
|
4915
4878
|
type: "button",
|
|
@@ -4917,26 +4880,26 @@ function UrlOrPageInput({
|
|
|
4917
4880
|
onMouseDown: clearSelection,
|
|
4918
4881
|
"aria-label": "Clear selected page",
|
|
4919
4882
|
tabIndex: -1,
|
|
4920
|
-
children: /* @__PURE__ */ (0,
|
|
4883
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconX, { "aria-hidden": true })
|
|
4921
4884
|
}
|
|
4922
4885
|
) : null,
|
|
4923
|
-
!readOnly ? /* @__PURE__ */ (0,
|
|
4886
|
+
!readOnly ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(FieldChevron, { onClick: toggleDropdown }) : null
|
|
4924
4887
|
] }),
|
|
4925
|
-
dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */ (0,
|
|
4888
|
+
dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
4926
4889
|
"div",
|
|
4927
4890
|
{
|
|
4928
4891
|
"data-ohw-link-page-dropdown": "",
|
|
4929
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",
|
|
4930
4893
|
onMouseDown: (e) => e.preventDefault(),
|
|
4931
|
-
children: filteredPages.map((page) => /* @__PURE__ */ (0,
|
|
4894
|
+
children: filteredPages.map((page) => /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
|
|
4932
4895
|
"button",
|
|
4933
4896
|
{
|
|
4934
4897
|
type: "button",
|
|
4935
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",
|
|
4936
4899
|
onClick: () => onPageSelect(page),
|
|
4937
4900
|
children: [
|
|
4938
|
-
/* @__PURE__ */ (0,
|
|
4939
|
-
/* @__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 })
|
|
4940
4903
|
]
|
|
4941
4904
|
},
|
|
4942
4905
|
page.path
|
|
@@ -4944,7 +4907,7 @@ function UrlOrPageInput({
|
|
|
4944
4907
|
}
|
|
4945
4908
|
) : null
|
|
4946
4909
|
] }),
|
|
4947
|
-
urlError ? /* @__PURE__ */ (0,
|
|
4910
|
+
urlError ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "text-sm font-medium text-destructive", children: urlError }) : null
|
|
4948
4911
|
] });
|
|
4949
4912
|
}
|
|
4950
4913
|
|
|
@@ -5112,7 +5075,7 @@ function useLinkModalState({
|
|
|
5112
5075
|
}
|
|
5113
5076
|
|
|
5114
5077
|
// src/ui/link-modal/LinkEditorPanel.tsx
|
|
5115
|
-
var
|
|
5078
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
5116
5079
|
function LinkEditorPanel({
|
|
5117
5080
|
open = true,
|
|
5118
5081
|
mode = "create",
|
|
@@ -5136,25 +5099,25 @@ function LinkEditorPanel({
|
|
|
5136
5099
|
onSubmit
|
|
5137
5100
|
});
|
|
5138
5101
|
const isCancel = state.secondaryLabel === "Cancel";
|
|
5139
|
-
return /* @__PURE__ */ (0,
|
|
5140
|
-
/* @__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)(
|
|
5141
5104
|
"button",
|
|
5142
5105
|
{
|
|
5143
5106
|
type: "button",
|
|
5144
5107
|
className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50",
|
|
5145
5108
|
"aria-label": "Close",
|
|
5146
|
-
children: /* @__PURE__ */ (0,
|
|
5109
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(IconX, { "aria-hidden": true })
|
|
5147
5110
|
}
|
|
5148
5111
|
) }),
|
|
5149
|
-
/* @__PURE__ */ (0,
|
|
5150
|
-
/* @__PURE__ */ (0,
|
|
5151
|
-
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)(
|
|
5152
5115
|
DestinationBreadcrumb,
|
|
5153
5116
|
{
|
|
5154
5117
|
pageTitle: state.selectedPage.title,
|
|
5155
5118
|
sectionLabel: state.selectedSection.label
|
|
5156
5119
|
}
|
|
5157
|
-
) : /* @__PURE__ */ (0,
|
|
5120
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
5158
5121
|
UrlOrPageInput,
|
|
5159
5122
|
{
|
|
5160
5123
|
value: state.searchValue,
|
|
@@ -5167,18 +5130,18 @@ function LinkEditorPanel({
|
|
|
5167
5130
|
urlError: state.urlError
|
|
5168
5131
|
}
|
|
5169
5132
|
),
|
|
5170
|
-
state.showChooseSection ? /* @__PURE__ */ (0,
|
|
5171
|
-
/* @__PURE__ */ (0,
|
|
5172
|
-
/* @__PURE__ */ (0,
|
|
5173
|
-
/* @__PURE__ */ (0,
|
|
5174
|
-
/* @__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." })
|
|
5175
5138
|
] })
|
|
5176
5139
|
] }) : null,
|
|
5177
|
-
state.showSectionPicker ? /* @__PURE__ */ (0,
|
|
5178
|
-
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
|
|
5179
5142
|
] }),
|
|
5180
|
-
/* @__PURE__ */ (0,
|
|
5181
|
-
/* @__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)(
|
|
5182
5145
|
Button,
|
|
5183
5146
|
{
|
|
5184
5147
|
type: "button",
|
|
@@ -5193,7 +5156,7 @@ function LinkEditorPanel({
|
|
|
5193
5156
|
children: state.secondaryLabel
|
|
5194
5157
|
}
|
|
5195
5158
|
),
|
|
5196
|
-
/* @__PURE__ */ (0,
|
|
5159
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
5197
5160
|
Button,
|
|
5198
5161
|
{
|
|
5199
5162
|
type: "button",
|
|
@@ -5212,7 +5175,7 @@ function LinkEditorPanel({
|
|
|
5212
5175
|
}
|
|
5213
5176
|
|
|
5214
5177
|
// src/ui/link-modal/LinkPopover.tsx
|
|
5215
|
-
var
|
|
5178
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
5216
5179
|
function LinkPopover({
|
|
5217
5180
|
open = true,
|
|
5218
5181
|
panelRef,
|
|
@@ -5220,14 +5183,14 @@ function LinkPopover({
|
|
|
5220
5183
|
onClose,
|
|
5221
5184
|
...editorProps
|
|
5222
5185
|
}) {
|
|
5223
|
-
return /* @__PURE__ */ (0,
|
|
5186
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5224
5187
|
Dialog2,
|
|
5225
5188
|
{
|
|
5226
5189
|
open,
|
|
5227
5190
|
onOpenChange: (next) => {
|
|
5228
5191
|
if (!next) onClose?.();
|
|
5229
5192
|
},
|
|
5230
|
-
children: /* @__PURE__ */ (0,
|
|
5193
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
5231
5194
|
DialogContent,
|
|
5232
5195
|
{
|
|
5233
5196
|
ref: panelRef,
|
|
@@ -5237,7 +5200,7 @@ function LinkPopover({
|
|
|
5237
5200
|
"data-ohw-bridge": "",
|
|
5238
5201
|
showCloseButton: false,
|
|
5239
5202
|
className: "gap-0 p-0 w-full md:w-md pointer-events-auto",
|
|
5240
|
-
children: /* @__PURE__ */ (0,
|
|
5203
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(LinkEditorPanel, { ...editorProps, open, onClose })
|
|
5241
5204
|
}
|
|
5242
5205
|
)
|
|
5243
5206
|
}
|
|
@@ -5303,7 +5266,7 @@ function shouldUseDevFixtures() {
|
|
|
5303
5266
|
}
|
|
5304
5267
|
|
|
5305
5268
|
// src/ui/badge.tsx
|
|
5306
|
-
var
|
|
5269
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
5307
5270
|
var badgeVariants = cva(
|
|
5308
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",
|
|
5309
5272
|
{
|
|
@@ -5321,11 +5284,11 @@ var badgeVariants = cva(
|
|
|
5321
5284
|
}
|
|
5322
5285
|
);
|
|
5323
5286
|
function Badge({ className, variant, ...props }) {
|
|
5324
|
-
return /* @__PURE__ */ (0,
|
|
5287
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: cn(badgeVariants({ variant }), className), ...props });
|
|
5325
5288
|
}
|
|
5326
5289
|
|
|
5327
5290
|
// src/OhhwellsBridge.tsx
|
|
5328
|
-
var
|
|
5291
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
5329
5292
|
var PRIMARY = "#0885FE";
|
|
5330
5293
|
var IMAGE_FADE_MS = 300;
|
|
5331
5294
|
function runOpacityFade(el, onDone) {
|
|
@@ -5499,7 +5462,7 @@ function mountSchedulingWidget(insertAfter, notifyOnConnect = false, scheduleId,
|
|
|
5499
5462
|
const root = (0, import_client.createRoot)(container);
|
|
5500
5463
|
(0, import_react_dom.flushSync)(() => {
|
|
5501
5464
|
root.render(
|
|
5502
|
-
/* @__PURE__ */ (0,
|
|
5465
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
5503
5466
|
SchedulingWidget,
|
|
5504
5467
|
{
|
|
5505
5468
|
notifyOnConnect,
|
|
@@ -5547,20 +5510,6 @@ function applyLinkHref(el, val) {
|
|
|
5547
5510
|
const anchor = el instanceof HTMLAnchorElement ? el : el.querySelector("a");
|
|
5548
5511
|
if (anchor) anchor.setAttribute("href", val);
|
|
5549
5512
|
}
|
|
5550
|
-
function getEditMeasureEl(editable) {
|
|
5551
|
-
return editable.closest("[data-ohw-href-key]") ?? editable;
|
|
5552
|
-
}
|
|
5553
|
-
function isDragHandleDisabled(el) {
|
|
5554
|
-
const carriers = [
|
|
5555
|
-
el.closest("[data-ohw-href-key]"),
|
|
5556
|
-
el.closest("[data-ohw-editable]")
|
|
5557
|
-
];
|
|
5558
|
-
return carriers.some((carrier) => {
|
|
5559
|
-
if (!carrier) return false;
|
|
5560
|
-
const raw = carrier.getAttribute("data-ohw-drag-disabled");
|
|
5561
|
-
return raw === "true" || raw === "";
|
|
5562
|
-
});
|
|
5563
|
-
}
|
|
5564
5513
|
function collectEditableNodes() {
|
|
5565
5514
|
const nodes = Array.from(document.querySelectorAll("[data-ohw-editable]")).map((el) => {
|
|
5566
5515
|
if (el.dataset.ohwEditable === "image") {
|
|
@@ -5614,14 +5563,6 @@ function getHrefKeyFromElement(el) {
|
|
|
5614
5563
|
function isNavbarButton(el) {
|
|
5615
5564
|
return Boolean(el.closest('[data-ohw-role="navbar-button"]'));
|
|
5616
5565
|
}
|
|
5617
|
-
function getReorderHandleState(el) {
|
|
5618
|
-
const linkEl = el.closest("[data-ohw-href-key]");
|
|
5619
|
-
if (!linkEl || isNavbarButton(el)) return { key: null, disabled: false };
|
|
5620
|
-
return {
|
|
5621
|
-
key: linkEl.dataset.ohwHrefKey ?? null,
|
|
5622
|
-
disabled: isDragHandleDisabled(el)
|
|
5623
|
-
};
|
|
5624
|
-
}
|
|
5625
5566
|
function clearHrefKeyHover(anchor) {
|
|
5626
5567
|
anchor.removeAttribute("data-ohw-hovered");
|
|
5627
5568
|
anchor.querySelectorAll("[data-ohw-hovered]").forEach((el) => {
|
|
@@ -5751,8 +5692,6 @@ var ICONS = {
|
|
|
5751
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"/>',
|
|
5752
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"/>'
|
|
5753
5694
|
};
|
|
5754
|
-
var TOOLBAR_PILL_PADDING = 2;
|
|
5755
|
-
var TOOLBAR_TOGGLE_GAP = 4;
|
|
5756
5695
|
var TOOLBAR_GROUPS = [
|
|
5757
5696
|
[
|
|
5758
5697
|
{ cmd: "bold", title: "Bold" },
|
|
@@ -5770,64 +5709,24 @@ var TOOLBAR_GROUPS = [
|
|
|
5770
5709
|
{ cmd: "insertOrderedList", title: "Numbered List" }
|
|
5771
5710
|
]
|
|
5772
5711
|
];
|
|
5773
|
-
function
|
|
5774
|
-
rect,
|
|
5775
|
-
elRef,
|
|
5776
|
-
reorderHrefKey,
|
|
5777
|
-
dragDisabled = false
|
|
5778
|
-
}) {
|
|
5712
|
+
function GlowFrame({ rect, elRef }) {
|
|
5779
5713
|
const GAP = 6;
|
|
5780
|
-
return /* @__PURE__ */ (0,
|
|
5714
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
5781
5715
|
"div",
|
|
5782
5716
|
{
|
|
5783
5717
|
ref: elRef,
|
|
5784
|
-
"data-ohw-edit-chrome": "",
|
|
5785
5718
|
style: {
|
|
5786
5719
|
position: "fixed",
|
|
5787
5720
|
top: rect.top - GAP,
|
|
5788
5721
|
left: rect.left - GAP,
|
|
5789
5722
|
width: rect.width + GAP * 2,
|
|
5790
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)",
|
|
5791
5727
|
pointerEvents: "none",
|
|
5792
5728
|
zIndex: 2147483646
|
|
5793
|
-
}
|
|
5794
|
-
children: [
|
|
5795
|
-
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
5796
|
-
"div",
|
|
5797
|
-
{
|
|
5798
|
-
style: {
|
|
5799
|
-
position: "absolute",
|
|
5800
|
-
inset: 0,
|
|
5801
|
-
border: "2px solid #0885FE",
|
|
5802
|
-
borderRadius: 8,
|
|
5803
|
-
boxShadow: "0 0 0 4px rgba(8, 133, 254, 0.12)",
|
|
5804
|
-
pointerEvents: "none"
|
|
5805
|
-
}
|
|
5806
|
-
}
|
|
5807
|
-
),
|
|
5808
|
-
reorderHrefKey && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
5809
|
-
"div",
|
|
5810
|
-
{
|
|
5811
|
-
"data-ohw-drag-handle-container": "",
|
|
5812
|
-
"data-ohw-drag-disabled": dragDisabled ? "" : void 0,
|
|
5813
|
-
style: {
|
|
5814
|
-
position: "absolute",
|
|
5815
|
-
left: 0,
|
|
5816
|
-
top: "50%",
|
|
5817
|
-
transform: "translate(calc(-100% - 7px), -50%)",
|
|
5818
|
-
pointerEvents: dragDisabled ? "none" : "auto"
|
|
5819
|
-
},
|
|
5820
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
5821
|
-
DragHandle,
|
|
5822
|
-
{
|
|
5823
|
-
"aria-label": `Reorder ${reorderHrefKey}`,
|
|
5824
|
-
disabled: dragDisabled,
|
|
5825
|
-
"aria-disabled": dragDisabled
|
|
5826
|
-
}
|
|
5827
|
-
)
|
|
5828
|
-
}
|
|
5829
|
-
)
|
|
5830
|
-
]
|
|
5729
|
+
}
|
|
5831
5730
|
}
|
|
5832
5731
|
);
|
|
5833
5732
|
}
|
|
@@ -5871,9 +5770,9 @@ function clampToolbarToClip(top, transform, rect, clip, approxH, gap) {
|
|
|
5871
5770
|
const pinnedTop = Math.min(maxBottom - approxH, Math.max(minTop, clip.top + gap));
|
|
5872
5771
|
return { top: pinnedTop + approxH, transform: "translateX(-50%) translateY(-100%)" };
|
|
5873
5772
|
}
|
|
5874
|
-
function calcToolbarPos(rect, parentScroll, approxW =
|
|
5773
|
+
function calcToolbarPos(rect, parentScroll, approxW = 330) {
|
|
5875
5774
|
const GAP = 8;
|
|
5876
|
-
const APPROX_H =
|
|
5775
|
+
const APPROX_H = 36;
|
|
5877
5776
|
const APPROX_W = approxW;
|
|
5878
5777
|
const clip = getIframeVisibleClip(parentScroll);
|
|
5879
5778
|
const clipTop = clip?.top ?? 0;
|
|
@@ -5907,9 +5806,9 @@ function calcToolbarPos(rect, parentScroll, approxW = 306) {
|
|
|
5907
5806
|
const left = Math.max(GAP + APPROX_W / 2, Math.min(rawLeft, window.innerWidth - GAP - APPROX_W / 2));
|
|
5908
5807
|
return { top, left, transform };
|
|
5909
5808
|
}
|
|
5910
|
-
var EDIT_LINK_ICON = /* @__PURE__ */ (0,
|
|
5911
|
-
/* @__PURE__ */ (0,
|
|
5912
|
-
/* @__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" })
|
|
5913
5812
|
] });
|
|
5914
5813
|
function FloatingToolbar({
|
|
5915
5814
|
rect,
|
|
@@ -5921,10 +5820,10 @@ function FloatingToolbar({
|
|
|
5921
5820
|
showEditLink,
|
|
5922
5821
|
onEditLink
|
|
5923
5822
|
}) {
|
|
5924
|
-
const approxW = variant === "link-action" ?
|
|
5823
|
+
const approxW = variant === "link-action" ? 120 : 330;
|
|
5925
5824
|
const { top, left, transform } = calcToolbarPos(rect, parentScroll, approxW);
|
|
5926
5825
|
if (variant === "link-action") {
|
|
5927
|
-
return /* @__PURE__ */ (0,
|
|
5826
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
|
|
5928
5827
|
"div",
|
|
5929
5828
|
{
|
|
5930
5829
|
ref: elRef,
|
|
@@ -5941,15 +5840,15 @@ function FloatingToolbar({
|
|
|
5941
5840
|
boxShadow: "0px 2px 4px -2px rgba(0,0,0,.1),0px 4px 6px -1px rgba(0,0,0,.1)",
|
|
5942
5841
|
display: "flex",
|
|
5943
5842
|
alignItems: "center",
|
|
5944
|
-
padding:
|
|
5945
|
-
gap:
|
|
5843
|
+
padding: 4,
|
|
5844
|
+
gap: 6,
|
|
5946
5845
|
fontFamily: "sans-serif",
|
|
5947
5846
|
pointerEvents: "auto",
|
|
5948
5847
|
whiteSpace: "nowrap"
|
|
5949
5848
|
},
|
|
5950
5849
|
onMouseDown: (e) => e.stopPropagation(),
|
|
5951
5850
|
children: [
|
|
5952
|
-
/* @__PURE__ */ (0,
|
|
5851
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
5953
5852
|
"button",
|
|
5954
5853
|
{
|
|
5955
5854
|
type: "button",
|
|
@@ -5984,8 +5883,8 @@ function FloatingToolbar({
|
|
|
5984
5883
|
children: EDIT_LINK_ICON
|
|
5985
5884
|
}
|
|
5986
5885
|
),
|
|
5987
|
-
/* @__PURE__ */ (0,
|
|
5988
|
-
/* @__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)(
|
|
5989
5888
|
"button",
|
|
5990
5889
|
{
|
|
5991
5890
|
type: "button",
|
|
@@ -6004,10 +5903,10 @@ function FloatingToolbar({
|
|
|
6004
5903
|
padding: 6,
|
|
6005
5904
|
opacity: 0.6
|
|
6006
5905
|
},
|
|
6007
|
-
children: /* @__PURE__ */ (0,
|
|
6008
|
-
/* @__PURE__ */ (0,
|
|
6009
|
-
/* @__PURE__ */ (0,
|
|
6010
|
-
/* @__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" })
|
|
6011
5910
|
] })
|
|
6012
5911
|
}
|
|
6013
5912
|
)
|
|
@@ -6015,7 +5914,7 @@ function FloatingToolbar({
|
|
|
6015
5914
|
}
|
|
6016
5915
|
);
|
|
6017
5916
|
}
|
|
6018
|
-
return /* @__PURE__ */ (0,
|
|
5917
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
|
|
6019
5918
|
"div",
|
|
6020
5919
|
{
|
|
6021
5920
|
ref: elRef,
|
|
@@ -6032,19 +5931,19 @@ function FloatingToolbar({
|
|
|
6032
5931
|
boxShadow: "0px 2px 4px -2px rgba(0,0,0,.1),0px 4px 6px -1px rgba(0,0,0,.1)",
|
|
6033
5932
|
display: "flex",
|
|
6034
5933
|
alignItems: "center",
|
|
6035
|
-
padding:
|
|
6036
|
-
gap:
|
|
5934
|
+
padding: 4,
|
|
5935
|
+
gap: 6,
|
|
6037
5936
|
fontFamily: "sans-serif",
|
|
6038
5937
|
pointerEvents: "auto",
|
|
6039
5938
|
whiteSpace: "nowrap"
|
|
6040
5939
|
},
|
|
6041
5940
|
onMouseDown: (e) => e.stopPropagation(),
|
|
6042
5941
|
children: [
|
|
6043
|
-
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ (0,
|
|
6044
|
-
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 } }),
|
|
6045
5944
|
btns.map((btn) => {
|
|
6046
5945
|
const isActive = activeCommands.has(btn.cmd);
|
|
6047
|
-
return /* @__PURE__ */ (0,
|
|
5946
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
6048
5947
|
"button",
|
|
6049
5948
|
{
|
|
6050
5949
|
title: btn.title,
|
|
@@ -6070,7 +5969,7 @@ function FloatingToolbar({
|
|
|
6070
5969
|
flexShrink: 0,
|
|
6071
5970
|
padding: 6
|
|
6072
5971
|
},
|
|
6073
|
-
children: /* @__PURE__ */ (0,
|
|
5972
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
6074
5973
|
"svg",
|
|
6075
5974
|
{
|
|
6076
5975
|
width: "16",
|
|
@@ -6090,7 +5989,7 @@ function FloatingToolbar({
|
|
|
6090
5989
|
);
|
|
6091
5990
|
})
|
|
6092
5991
|
] }, gi)),
|
|
6093
|
-
showEditLink ? /* @__PURE__ */ (0,
|
|
5992
|
+
showEditLink ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
6094
5993
|
"button",
|
|
6095
5994
|
{
|
|
6096
5995
|
type: "button",
|
|
@@ -6139,7 +6038,7 @@ function StateToggle({
|
|
|
6139
6038
|
states,
|
|
6140
6039
|
onStateChange
|
|
6141
6040
|
}) {
|
|
6142
|
-
return /* @__PURE__ */ (0,
|
|
6041
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
6143
6042
|
ToggleGroup,
|
|
6144
6043
|
{
|
|
6145
6044
|
"data-ohw-state-toggle": "",
|
|
@@ -6153,7 +6052,7 @@ function StateToggle({
|
|
|
6153
6052
|
left: rect.right - 8,
|
|
6154
6053
|
transform: "translateX(-100%)"
|
|
6155
6054
|
},
|
|
6156
|
-
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))
|
|
6157
6056
|
}
|
|
6158
6057
|
);
|
|
6159
6058
|
}
|
|
@@ -6251,8 +6150,6 @@ function OhhwellsBridge() {
|
|
|
6251
6150
|
const [toolbarVariant, setToolbarVariant] = (0, import_react6.useState)("none");
|
|
6252
6151
|
const toolbarVariantRef = (0, import_react6.useRef)("none");
|
|
6253
6152
|
toolbarVariantRef.current = toolbarVariant;
|
|
6254
|
-
const [reorderHrefKey, setReorderHrefKey] = (0, import_react6.useState)(null);
|
|
6255
|
-
const [reorderDragDisabled, setReorderDragDisabled] = (0, import_react6.useState)(false);
|
|
6256
6153
|
const [toggleState, setToggleState] = (0, import_react6.useState)(null);
|
|
6257
6154
|
const [maxBadge, setMaxBadge] = (0, import_react6.useState)(null);
|
|
6258
6155
|
const [activeCommands, setActiveCommands] = (0, import_react6.useState)(/* @__PURE__ */ new Set());
|
|
@@ -6359,7 +6256,7 @@ function OhhwellsBridge() {
|
|
|
6359
6256
|
(0, import_react6.useEffect)(() => {
|
|
6360
6257
|
const update = () => {
|
|
6361
6258
|
const el = activeElRef.current ?? selectedElRef.current;
|
|
6362
|
-
if (el) setToolbarRect(
|
|
6259
|
+
if (el) setToolbarRect(el.getBoundingClientRect());
|
|
6363
6260
|
setToggleState((prev) => {
|
|
6364
6261
|
if (!prev || !activeStateElRef.current) return prev;
|
|
6365
6262
|
return { ...prev, rect: activeStateElRef.current.getBoundingClientRect() };
|
|
@@ -6426,8 +6323,6 @@ function OhhwellsBridge() {
|
|
|
6426
6323
|
}
|
|
6427
6324
|
el.removeAttribute("contenteditable");
|
|
6428
6325
|
activeElRef.current = null;
|
|
6429
|
-
setReorderHrefKey(null);
|
|
6430
|
-
setReorderDragDisabled(false);
|
|
6431
6326
|
if (!selectedElRef.current) {
|
|
6432
6327
|
setToolbarRect(null);
|
|
6433
6328
|
setToolbarVariant("none");
|
|
@@ -6465,15 +6360,11 @@ function OhhwellsBridge() {
|
|
|
6465
6360
|
setToolbarVariant("rich-text");
|
|
6466
6361
|
el.setAttribute("contenteditable", "true");
|
|
6467
6362
|
el.removeAttribute("data-ohw-hovered");
|
|
6468
|
-
el.closest("[data-ohw-href-key]")?.removeAttribute("data-ohw-hovered");
|
|
6469
6363
|
activeElRef.current = el;
|
|
6470
6364
|
originalContentRef.current = el.innerHTML;
|
|
6471
6365
|
el.focus();
|
|
6366
|
+
setToolbarRect(el.getBoundingClientRect());
|
|
6472
6367
|
setToolbarShowEditLink(Boolean(getHrefKeyFromElement(el)));
|
|
6473
|
-
const { key: reorderKey, disabled: reorderDisabled } = getReorderHandleState(el);
|
|
6474
|
-
setReorderHrefKey(reorderKey);
|
|
6475
|
-
setReorderDragDisabled(reorderDisabled);
|
|
6476
|
-
setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
6477
6368
|
postToParent({ type: "ow:enter-edit", key: el.dataset.ohwKey });
|
|
6478
6369
|
requestAnimationFrame(() => refreshActiveCommandsRef.current());
|
|
6479
6370
|
}, [deactivate, postToParent]);
|
|
@@ -6538,7 +6429,7 @@ function OhhwellsBridge() {
|
|
|
6538
6429
|
return () => {
|
|
6539
6430
|
cancelled = true;
|
|
6540
6431
|
};
|
|
6541
|
-
}, [subdomain, isEditMode]);
|
|
6432
|
+
}, [subdomain, isEditMode, pathname]);
|
|
6542
6433
|
(0, import_react6.useEffect)(() => {
|
|
6543
6434
|
if (!subdomain || isEditMode) return;
|
|
6544
6435
|
let debounceTimer = null;
|
|
@@ -6575,7 +6466,7 @@ function OhhwellsBridge() {
|
|
|
6575
6466
|
if (debounceTimer) clearTimeout(debounceTimer);
|
|
6576
6467
|
debounceTimer = setTimeout(applyFromCache, 150);
|
|
6577
6468
|
};
|
|
6578
|
-
|
|
6469
|
+
scheduleApply();
|
|
6579
6470
|
observer = new MutationObserver(scheduleApply);
|
|
6580
6471
|
observer.observe(document.body, { childList: true, subtree: true });
|
|
6581
6472
|
return () => {
|
|
@@ -6703,11 +6594,6 @@ function OhhwellsBridge() {
|
|
|
6703
6594
|
if (target.closest("[data-ohw-state-toggle]")) return;
|
|
6704
6595
|
if (target.closest("[data-ohw-max-badge]")) return;
|
|
6705
6596
|
if (isInsideLinkEditor(target)) return;
|
|
6706
|
-
if (target.closest('[data-ohw-edit-chrome], [data-ohw-drag-handle-container], [data-slot="drag-handle"]')) {
|
|
6707
|
-
e.preventDefault();
|
|
6708
|
-
e.stopPropagation();
|
|
6709
|
-
return;
|
|
6710
|
-
}
|
|
6711
6597
|
const editable = target.closest("[data-ohw-editable]");
|
|
6712
6598
|
if (editable) {
|
|
6713
6599
|
if (editable.dataset.ohwEditable === "link") {
|
|
@@ -6784,18 +6670,14 @@ function OhhwellsBridge() {
|
|
|
6784
6670
|
const selected = selectedElRef.current;
|
|
6785
6671
|
if (selected && (selected === editable || selected.contains(editable))) return;
|
|
6786
6672
|
if (editable.dataset.ohwEditable !== "image" && editable.dataset.ohwEditable !== "bg-image" && !editable.hasAttribute("contenteditable")) {
|
|
6787
|
-
|
|
6788
|
-
hoverTarget.setAttribute("data-ohw-hovered", "");
|
|
6673
|
+
editable.setAttribute("data-ohw-hovered", "");
|
|
6789
6674
|
}
|
|
6790
6675
|
};
|
|
6791
6676
|
const handleMouseOut = (e) => {
|
|
6792
6677
|
const editable = e.target.closest("[data-ohw-editable]");
|
|
6793
6678
|
if (!editable) return;
|
|
6794
|
-
const related = e.relatedTarget instanceof Element ? e.relatedTarget : null;
|
|
6795
|
-
if (related?.closest("[data-ohw-drag-handle-container]")) return;
|
|
6796
6679
|
if (editable.dataset.ohwEditable !== "image" && editable.dataset.ohwEditable !== "bg-image") {
|
|
6797
|
-
|
|
6798
|
-
hoverTarget.removeAttribute("data-ohw-hovered");
|
|
6680
|
+
editable.removeAttribute("data-ohw-hovered");
|
|
6799
6681
|
}
|
|
6800
6682
|
};
|
|
6801
6683
|
const toProbeCoords = (clientX, clientY, fromParentViewport) => {
|
|
@@ -6910,20 +6792,11 @@ function OhhwellsBridge() {
|
|
|
6910
6792
|
return;
|
|
6911
6793
|
}
|
|
6912
6794
|
}
|
|
6913
|
-
if (activeElRef.current) {
|
|
6914
|
-
if (hoveredImageRef.current) {
|
|
6915
|
-
hoveredImageRef.current = null;
|
|
6916
|
-
hoveredImageHasTextOverlapRef.current = false;
|
|
6917
|
-
resumeAnimTracks();
|
|
6918
|
-
postToParentRef.current({ type: "ow:image-unhover" });
|
|
6919
|
-
}
|
|
6920
|
-
return;
|
|
6921
|
-
}
|
|
6922
6795
|
const imgEl = findImageAtPoint(clientX, clientY, fromParentViewport);
|
|
6923
6796
|
if (imgEl) {
|
|
6924
6797
|
const { x, y } = toProbeCoords(clientX, clientY, fromParentViewport);
|
|
6925
6798
|
const topEl = document.elementFromPoint(x, y);
|
|
6926
|
-
if (topEl?.closest(
|
|
6799
|
+
if (topEl?.closest("[data-ohw-toolbar]")) {
|
|
6927
6800
|
if (hoveredImageRef.current) {
|
|
6928
6801
|
hoveredImageRef.current = null;
|
|
6929
6802
|
resumeAnimTracks();
|
|
@@ -7216,7 +7089,7 @@ function OhhwellsBridge() {
|
|
|
7216
7089
|
const el = e.target;
|
|
7217
7090
|
const key = el.dataset.ohwKey;
|
|
7218
7091
|
if (!key) return;
|
|
7219
|
-
if (el === activeElRef.current) setToolbarRect(
|
|
7092
|
+
if (el === activeElRef.current) setToolbarRect(el.getBoundingClientRect());
|
|
7220
7093
|
const maxLen = el.dataset.ohwMaxLength ? parseInt(el.dataset.ohwMaxLength, 10) : null;
|
|
7221
7094
|
if (maxLen) {
|
|
7222
7095
|
const current = el.innerText.replace(/\n$/, "").length;
|
|
@@ -7446,7 +7319,7 @@ function OhhwellsBridge() {
|
|
|
7446
7319
|
};
|
|
7447
7320
|
const applyToolbarPos = (rect) => {
|
|
7448
7321
|
const ps = parentScrollRef.current;
|
|
7449
|
-
const approxW = toolbarVariantRef.current === "link-action" ?
|
|
7322
|
+
const approxW = toolbarVariantRef.current === "link-action" ? 120 : 330;
|
|
7450
7323
|
if (toolbarElRef.current) {
|
|
7451
7324
|
const { top, left, transform } = calcToolbarPos(rect, ps, approxW);
|
|
7452
7325
|
toolbarElRef.current.style.top = `${top}px`;
|
|
@@ -7625,7 +7498,7 @@ function OhhwellsBridge() {
|
|
|
7625
7498
|
const handleCommand = (0, import_react6.useCallback)((cmd) => {
|
|
7626
7499
|
document.execCommand(cmd, false);
|
|
7627
7500
|
activeElRef.current?.focus();
|
|
7628
|
-
if (activeElRef.current) setToolbarRect(
|
|
7501
|
+
if (activeElRef.current) setToolbarRect(activeElRef.current.getBoundingClientRect());
|
|
7629
7502
|
refreshActiveCommandsRef.current();
|
|
7630
7503
|
}, []);
|
|
7631
7504
|
const handleStateChange = (0, import_react6.useCallback)((state) => {
|
|
@@ -7678,19 +7551,11 @@ function OhhwellsBridge() {
|
|
|
7678
7551
|
const currentSections = sectionsByPath[pathname] ?? [];
|
|
7679
7552
|
linkPopoverOpenRef.current = linkPopover !== null;
|
|
7680
7553
|
return bridgeRoot ? (0, import_react_dom2.createPortal)(
|
|
7681
|
-
/* @__PURE__ */ (0,
|
|
7682
|
-
/* @__PURE__ */ (0,
|
|
7683
|
-
toolbarRect && /* @__PURE__ */ (0,
|
|
7684
|
-
/* @__PURE__ */ (0,
|
|
7685
|
-
|
|
7686
|
-
{
|
|
7687
|
-
rect: toolbarRect,
|
|
7688
|
-
elRef: glowElRef,
|
|
7689
|
-
reorderHrefKey,
|
|
7690
|
-
dragDisabled: reorderDragDisabled
|
|
7691
|
-
}
|
|
7692
|
-
),
|
|
7693
|
-
toolbarVariant === "rich-text" && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
7554
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
|
|
7555
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { ref: attachVisibleViewport, "data-ohw-visible-viewport": "", "aria-hidden": true }),
|
|
7556
|
+
toolbarRect && /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
|
|
7557
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(GlowFrame, { rect: toolbarRect, elRef: glowElRef }),
|
|
7558
|
+
toolbarVariant === "rich-text" && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
7694
7559
|
FloatingToolbar,
|
|
7695
7560
|
{
|
|
7696
7561
|
variant: "rich-text",
|
|
@@ -7703,7 +7568,7 @@ function OhhwellsBridge() {
|
|
|
7703
7568
|
onEditLink: openLinkPopoverForActive
|
|
7704
7569
|
}
|
|
7705
7570
|
),
|
|
7706
|
-
toolbarVariant === "link-action" && /* @__PURE__ */ (0,
|
|
7571
|
+
toolbarVariant === "link-action" && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
7707
7572
|
FloatingToolbar,
|
|
7708
7573
|
{
|
|
7709
7574
|
variant: "link-action",
|
|
@@ -7716,7 +7581,7 @@ function OhhwellsBridge() {
|
|
|
7716
7581
|
}
|
|
7717
7582
|
)
|
|
7718
7583
|
] }),
|
|
7719
|
-
maxBadge && /* @__PURE__ */ (0,
|
|
7584
|
+
maxBadge && /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
|
|
7720
7585
|
"div",
|
|
7721
7586
|
{
|
|
7722
7587
|
"data-ohw-max-badge": "",
|
|
@@ -7742,7 +7607,7 @@ function OhhwellsBridge() {
|
|
|
7742
7607
|
]
|
|
7743
7608
|
}
|
|
7744
7609
|
),
|
|
7745
|
-
toggleState && /* @__PURE__ */ (0,
|
|
7610
|
+
toggleState && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
7746
7611
|
StateToggle,
|
|
7747
7612
|
{
|
|
7748
7613
|
rect: toggleState.rect,
|
|
@@ -7751,15 +7616,15 @@ function OhhwellsBridge() {
|
|
|
7751
7616
|
onStateChange: handleStateChange
|
|
7752
7617
|
}
|
|
7753
7618
|
),
|
|
7754
|
-
sectionGap && /* @__PURE__ */ (0,
|
|
7619
|
+
sectionGap && /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
|
|
7755
7620
|
"div",
|
|
7756
7621
|
{
|
|
7757
7622
|
"data-ohw-section-insert-line": "",
|
|
7758
7623
|
className: "fixed left-0 w-full z-2147483646 flex items-center pointer-events-none",
|
|
7759
7624
|
style: { top: sectionGap.y, transform: "translateY(-50%)" },
|
|
7760
7625
|
children: [
|
|
7761
|
-
/* @__PURE__ */ (0,
|
|
7762
|
-
/* @__PURE__ */ (0,
|
|
7626
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } }),
|
|
7627
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
7763
7628
|
Badge,
|
|
7764
7629
|
{
|
|
7765
7630
|
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",
|
|
@@ -7772,11 +7637,11 @@ function OhhwellsBridge() {
|
|
|
7772
7637
|
children: "Add Section"
|
|
7773
7638
|
}
|
|
7774
7639
|
),
|
|
7775
|
-
/* @__PURE__ */ (0,
|
|
7640
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } })
|
|
7776
7641
|
]
|
|
7777
7642
|
}
|
|
7778
7643
|
),
|
|
7779
|
-
linkPopover && dialogPortalContainer ? /* @__PURE__ */ (0,
|
|
7644
|
+
linkPopover && dialogPortalContainer ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
7780
7645
|
LinkPopover,
|
|
7781
7646
|
{
|
|
7782
7647
|
panelRef: linkPopoverPanelRef,
|
|
@@ -7791,39 +7656,13 @@ function OhhwellsBridge() {
|
|
|
7791
7656
|
onSubmit: handleLinkPopoverSubmit
|
|
7792
7657
|
},
|
|
7793
7658
|
`${linkPopover.key}-${pathname}`
|
|
7794
|
-
) : null
|
|
7795
|
-
sectionGap && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
|
|
7796
|
-
"div",
|
|
7797
|
-
{
|
|
7798
|
-
"data-ohw-section-insert-line": "",
|
|
7799
|
-
className: "fixed left-0 w-full z-2147483646 flex items-center pointer-events-none",
|
|
7800
|
-
style: { top: sectionGap.y, transform: "translateY(-50%)" },
|
|
7801
|
-
children: [
|
|
7802
|
-
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } }),
|
|
7803
|
-
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
7804
|
-
Badge,
|
|
7805
|
-
{
|
|
7806
|
-
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",
|
|
7807
|
-
onClick: () => {
|
|
7808
|
-
window.parent.postMessage(
|
|
7809
|
-
{ type: "ow:add-section", insertAfter: sectionGap.insertAfter, insertBefore: sectionGap.insertBefore },
|
|
7810
|
-
"*"
|
|
7811
|
-
);
|
|
7812
|
-
},
|
|
7813
|
-
children: "Add Section"
|
|
7814
|
-
}
|
|
7815
|
-
),
|
|
7816
|
-
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } })
|
|
7817
|
-
]
|
|
7818
|
-
}
|
|
7819
|
-
)
|
|
7659
|
+
) : null
|
|
7820
7660
|
] }),
|
|
7821
7661
|
bridgeRoot
|
|
7822
7662
|
) : null;
|
|
7823
7663
|
}
|
|
7824
7664
|
// Annotate the CommonJS export names for ESM import in node:
|
|
7825
7665
|
0 && (module.exports = {
|
|
7826
|
-
DragHandle,
|
|
7827
7666
|
LinkEditorPanel,
|
|
7828
7667
|
LinkPopover,
|
|
7829
7668
|
OhhwellsBridge,
|
|
@@ -7834,7 +7673,6 @@ function OhhwellsBridge() {
|
|
|
7834
7673
|
buildTarget,
|
|
7835
7674
|
filterAvailablePages,
|
|
7836
7675
|
getEditModeInitialState,
|
|
7837
|
-
isEditSessionActive,
|
|
7838
7676
|
isValidUrl,
|
|
7839
7677
|
parseTarget,
|
|
7840
7678
|
toggleVariants,
|