@ohhwells/bridge 0.1.33-next.37 → 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/dist/index.cjs +164 -319
- 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 +134 -287
- package/dist/index.js.map +1 -1
- package/dist/styles.css +0 -123
- package/package.json +1 -2
package/dist/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
|
|
3
3
|
// src/OhhwellsBridge.tsx
|
|
4
|
-
import
|
|
4
|
+
import React6, { useCallback as useCallback2, useEffect as useEffect3, useLayoutEffect as useLayoutEffect2, useRef as useRef3, useState as useState5 } from "react";
|
|
5
5
|
import { createRoot } from "react-dom/client";
|
|
6
6
|
import { flushSync } from "react-dom";
|
|
7
7
|
|
|
@@ -4202,34 +4202,6 @@ function ToggleGroupItem({
|
|
|
4202
4202
|
);
|
|
4203
4203
|
}
|
|
4204
4204
|
|
|
4205
|
-
// src/ui/drag-handle.tsx
|
|
4206
|
-
import * as React3 from "react";
|
|
4207
|
-
import { GripVertical } from "lucide-react";
|
|
4208
|
-
import { jsx as jsx5 } from "react/jsx-runtime";
|
|
4209
|
-
var DragHandle = React3.forwardRef(
|
|
4210
|
-
({ className, type = "button", ...props }, ref) => {
|
|
4211
|
-
return /* @__PURE__ */ jsx5(
|
|
4212
|
-
"button",
|
|
4213
|
-
{
|
|
4214
|
-
ref,
|
|
4215
|
-
type,
|
|
4216
|
-
"data-slot": "drag-handle",
|
|
4217
|
-
className: cn(
|
|
4218
|
-
"inline-flex h-7 w-4 shrink-0 items-center justify-center rounded-md transition-all duration-200 max-h-[30px]",
|
|
4219
|
-
"bg-white border border-transparent text-stone-500 shadow-md cursor-grab",
|
|
4220
|
-
"enabled:hover:border enabled:hover:border-stone-200 enabled:hover:text-stone-950",
|
|
4221
|
-
"enabled:active:border enabled:active:border-primary enabled:active:bg-primary-50 enabled:active:text-stone-950 enabled:active:shadow enabled:active:cursor-grabbing",
|
|
4222
|
-
"disabled:cursor-not-allowed disabled:opacity-40 disabled:text-stone-950 disabled:pointer-events-none",
|
|
4223
|
-
className
|
|
4224
|
-
),
|
|
4225
|
-
...props,
|
|
4226
|
-
children: /* @__PURE__ */ jsx5(GripVertical, { className: "size-4 shrink-0", "aria-hidden": "true" })
|
|
4227
|
-
}
|
|
4228
|
-
);
|
|
4229
|
-
}
|
|
4230
|
-
);
|
|
4231
|
-
DragHandle.displayName = "DragHandle";
|
|
4232
|
-
|
|
4233
4205
|
// src/OhhwellsBridge.tsx
|
|
4234
4206
|
import { createPortal } from "react-dom";
|
|
4235
4207
|
import { usePathname, useRouter, useSearchParams } from "next/navigation";
|
|
@@ -4509,60 +4481,60 @@ function scrollToHashSectionWhenReady(behavior = "smooth") {
|
|
|
4509
4481
|
}
|
|
4510
4482
|
|
|
4511
4483
|
// src/ui/dialog.tsx
|
|
4512
|
-
import * as
|
|
4484
|
+
import * as React3 from "react";
|
|
4513
4485
|
import { Dialog as DialogPrimitive } from "radix-ui";
|
|
4514
4486
|
|
|
4515
4487
|
// src/ui/icons.tsx
|
|
4516
|
-
import { jsx as
|
|
4488
|
+
import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
4517
4489
|
function IconX({ className, ...props }) {
|
|
4518
4490
|
return /* @__PURE__ */ jsxs3("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className, ...props, children: [
|
|
4519
|
-
/* @__PURE__ */
|
|
4520
|
-
/* @__PURE__ */
|
|
4491
|
+
/* @__PURE__ */ jsx5("path", { d: "M18 6 6 18" }),
|
|
4492
|
+
/* @__PURE__ */ jsx5("path", { d: "m6 6 12 12" })
|
|
4521
4493
|
] });
|
|
4522
4494
|
}
|
|
4523
4495
|
function IconChevronDown({ className, ...props }) {
|
|
4524
|
-
return /* @__PURE__ */
|
|
4496
|
+
return /* @__PURE__ */ jsx5("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className, ...props, children: /* @__PURE__ */ jsx5("path", { d: "m6 9 6 6 6-6" }) });
|
|
4525
4497
|
}
|
|
4526
4498
|
function IconFile({ className, ...props }) {
|
|
4527
4499
|
return /* @__PURE__ */ jsxs3("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className, ...props, children: [
|
|
4528
|
-
/* @__PURE__ */
|
|
4529
|
-
/* @__PURE__ */
|
|
4500
|
+
/* @__PURE__ */ jsx5("path", { d: "M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" }),
|
|
4501
|
+
/* @__PURE__ */ jsx5("path", { d: "M14 2v4a2 2 0 0 0 2 2h4" })
|
|
4530
4502
|
] });
|
|
4531
4503
|
}
|
|
4532
4504
|
function IconInfo({ className, ...props }) {
|
|
4533
4505
|
return /* @__PURE__ */ jsxs3("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className, ...props, children: [
|
|
4534
|
-
/* @__PURE__ */
|
|
4535
|
-
/* @__PURE__ */
|
|
4536
|
-
/* @__PURE__ */
|
|
4506
|
+
/* @__PURE__ */ jsx5("circle", { cx: "12", cy: "12", r: "10" }),
|
|
4507
|
+
/* @__PURE__ */ jsx5("path", { d: "M12 16v-4" }),
|
|
4508
|
+
/* @__PURE__ */ jsx5("path", { d: "M12 8h.01" })
|
|
4537
4509
|
] });
|
|
4538
4510
|
}
|
|
4539
4511
|
function IconArrowRight({ className, ...props }) {
|
|
4540
4512
|
return /* @__PURE__ */ jsxs3("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className, ...props, children: [
|
|
4541
|
-
/* @__PURE__ */
|
|
4542
|
-
/* @__PURE__ */
|
|
4513
|
+
/* @__PURE__ */ jsx5("path", { d: "M5 12h14" }),
|
|
4514
|
+
/* @__PURE__ */ jsx5("path", { d: "m12 5 7 7-7 7" })
|
|
4543
4515
|
] });
|
|
4544
4516
|
}
|
|
4545
4517
|
function IconSection({ className, ...props }) {
|
|
4546
4518
|
return /* @__PURE__ */ jsxs3("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className, ...props, children: [
|
|
4547
|
-
/* @__PURE__ */
|
|
4548
|
-
/* @__PURE__ */
|
|
4549
|
-
/* @__PURE__ */
|
|
4519
|
+
/* @__PURE__ */ jsx5("rect", { width: "18", height: "7", x: "3", y: "3", rx: "1" }),
|
|
4520
|
+
/* @__PURE__ */ jsx5("rect", { width: "9", height: "7", x: "3", y: "14", rx: "1" }),
|
|
4521
|
+
/* @__PURE__ */ jsx5("rect", { width: "5", height: "7", x: "16", y: "14", rx: "1" })
|
|
4550
4522
|
] });
|
|
4551
4523
|
}
|
|
4552
4524
|
|
|
4553
4525
|
// src/ui/dialog.tsx
|
|
4554
|
-
import { jsx as
|
|
4526
|
+
import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
4555
4527
|
function Dialog2({ ...props }) {
|
|
4556
|
-
return /* @__PURE__ */
|
|
4528
|
+
return /* @__PURE__ */ jsx6(DialogPrimitive.Root, { "data-slot": "dialog", ...props });
|
|
4557
4529
|
}
|
|
4558
4530
|
function DialogPortal({ ...props }) {
|
|
4559
|
-
return /* @__PURE__ */
|
|
4531
|
+
return /* @__PURE__ */ jsx6(DialogPrimitive.Portal, { ...props });
|
|
4560
4532
|
}
|
|
4561
4533
|
function DialogOverlay({
|
|
4562
4534
|
className,
|
|
4563
4535
|
...props
|
|
4564
4536
|
}) {
|
|
4565
|
-
return /* @__PURE__ */
|
|
4537
|
+
return /* @__PURE__ */ jsx6(
|
|
4566
4538
|
DialogPrimitive.Overlay,
|
|
4567
4539
|
{
|
|
4568
4540
|
"data-slot": "dialog-overlay",
|
|
@@ -4572,10 +4544,10 @@ function DialogOverlay({
|
|
|
4572
4544
|
}
|
|
4573
4545
|
);
|
|
4574
4546
|
}
|
|
4575
|
-
var DialogContent =
|
|
4547
|
+
var DialogContent = React3.forwardRef(({ className, children, showCloseButton = true, container, ...props }, ref) => {
|
|
4576
4548
|
const positionMode = container ? "absolute" : "fixed";
|
|
4577
4549
|
return /* @__PURE__ */ jsxs4(DialogPortal, { container: container ?? void 0, children: [
|
|
4578
|
-
/* @__PURE__ */
|
|
4550
|
+
/* @__PURE__ */ jsx6(DialogOverlay, { className: cn(positionMode, "inset-0") }),
|
|
4579
4551
|
/* @__PURE__ */ jsxs4(
|
|
4580
4552
|
DialogPrimitive.Content,
|
|
4581
4553
|
{
|
|
@@ -4592,13 +4564,13 @@ var DialogContent = React4.forwardRef(({ className, children, showCloseButton =
|
|
|
4592
4564
|
...props,
|
|
4593
4565
|
children: [
|
|
4594
4566
|
children,
|
|
4595
|
-
showCloseButton ? /* @__PURE__ */
|
|
4567
|
+
showCloseButton ? /* @__PURE__ */ jsx6(
|
|
4596
4568
|
DialogPrimitive.Close,
|
|
4597
4569
|
{
|
|
4598
4570
|
type: "button",
|
|
4599
4571
|
className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50",
|
|
4600
4572
|
"aria-label": "Close",
|
|
4601
|
-
children: /* @__PURE__ */
|
|
4573
|
+
children: /* @__PURE__ */ jsx6(IconX, { "aria-hidden": true })
|
|
4602
4574
|
}
|
|
4603
4575
|
) : null
|
|
4604
4576
|
]
|
|
@@ -4608,12 +4580,12 @@ var DialogContent = React4.forwardRef(({ className, children, showCloseButton =
|
|
|
4608
4580
|
});
|
|
4609
4581
|
DialogContent.displayName = DialogPrimitive.Content.displayName;
|
|
4610
4582
|
function DialogHeader({ className, ...props }) {
|
|
4611
|
-
return /* @__PURE__ */
|
|
4583
|
+
return /* @__PURE__ */ jsx6("div", { className: cn("flex flex-col gap-1.5", className), ...props });
|
|
4612
4584
|
}
|
|
4613
4585
|
function DialogFooter({ className, ...props }) {
|
|
4614
|
-
return /* @__PURE__ */
|
|
4586
|
+
return /* @__PURE__ */ jsx6("div", { className: cn("flex items-center justify-end gap-2", className), ...props });
|
|
4615
4587
|
}
|
|
4616
|
-
var DialogTitle =
|
|
4588
|
+
var DialogTitle = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
|
|
4617
4589
|
DialogPrimitive.Title,
|
|
4618
4590
|
{
|
|
4619
4591
|
ref,
|
|
@@ -4622,7 +4594,7 @@ var DialogTitle = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE
|
|
|
4622
4594
|
}
|
|
4623
4595
|
));
|
|
4624
4596
|
DialogTitle.displayName = DialogPrimitive.Title.displayName;
|
|
4625
|
-
var DialogDescription =
|
|
4597
|
+
var DialogDescription = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
|
|
4626
4598
|
DialogPrimitive.Description,
|
|
4627
4599
|
{
|
|
4628
4600
|
ref,
|
|
@@ -4634,9 +4606,9 @@ DialogDescription.displayName = DialogPrimitive.Description.displayName;
|
|
|
4634
4606
|
var DialogClose = DialogPrimitive.Close;
|
|
4635
4607
|
|
|
4636
4608
|
// src/ui/button.tsx
|
|
4637
|
-
import * as
|
|
4609
|
+
import * as React4 from "react";
|
|
4638
4610
|
import { Slot } from "radix-ui";
|
|
4639
|
-
import { jsx as
|
|
4611
|
+
import { jsx as jsx7 } from "react/jsx-runtime";
|
|
4640
4612
|
var buttonVariants = cva(
|
|
4641
4613
|
"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",
|
|
4642
4614
|
{
|
|
@@ -4657,10 +4629,10 @@ var buttonVariants = cva(
|
|
|
4657
4629
|
}
|
|
4658
4630
|
}
|
|
4659
4631
|
);
|
|
4660
|
-
var Button =
|
|
4632
|
+
var Button = React4.forwardRef(
|
|
4661
4633
|
({ className, variant, size, asChild = false, ...props }, ref) => {
|
|
4662
4634
|
const Comp = asChild ? Slot.Root : "button";
|
|
4663
|
-
return /* @__PURE__ */
|
|
4635
|
+
return /* @__PURE__ */ jsx7(
|
|
4664
4636
|
Comp,
|
|
4665
4637
|
{
|
|
4666
4638
|
ref,
|
|
@@ -4674,30 +4646,30 @@ var Button = React5.forwardRef(
|
|
|
4674
4646
|
Button.displayName = "Button";
|
|
4675
4647
|
|
|
4676
4648
|
// src/ui/link-modal/DestinationBreadcrumb.tsx
|
|
4677
|
-
import { jsx as
|
|
4649
|
+
import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
4678
4650
|
function DestinationBreadcrumb({ pageTitle, sectionLabel }) {
|
|
4679
4651
|
return /* @__PURE__ */ jsxs5("div", { className: "flex w-full flex-col gap-2", children: [
|
|
4680
|
-
/* @__PURE__ */
|
|
4652
|
+
/* @__PURE__ */ jsx8("p", { className: "text-sm font-medium text-foreground", children: "Destination" }),
|
|
4681
4653
|
/* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-3", children: [
|
|
4682
4654
|
/* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2", children: [
|
|
4683
|
-
/* @__PURE__ */
|
|
4684
|
-
/* @__PURE__ */
|
|
4655
|
+
/* @__PURE__ */ jsx8(IconFile, { className: "shrink-0 text-foreground", "aria-hidden": true }),
|
|
4656
|
+
/* @__PURE__ */ jsx8("span", { className: "text-sm font-medium leading-none text-foreground", children: pageTitle })
|
|
4685
4657
|
] }),
|
|
4686
|
-
/* @__PURE__ */
|
|
4658
|
+
/* @__PURE__ */ jsx8(IconArrowRight, { className: "shrink-0 text-muted-foreground", "aria-hidden": true }),
|
|
4687
4659
|
/* @__PURE__ */ jsxs5("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
|
|
4688
|
-
/* @__PURE__ */
|
|
4689
|
-
/* @__PURE__ */
|
|
4660
|
+
/* @__PURE__ */ jsx8(IconSection, { className: "shrink-0 text-foreground", "aria-hidden": true }),
|
|
4661
|
+
/* @__PURE__ */ jsx8("span", { className: "truncate text-sm font-medium leading-none text-foreground", children: sectionLabel })
|
|
4690
4662
|
] })
|
|
4691
4663
|
] })
|
|
4692
4664
|
] });
|
|
4693
4665
|
}
|
|
4694
4666
|
|
|
4695
4667
|
// src/ui/link-modal/SectionTreeItem.tsx
|
|
4696
|
-
import { jsx as
|
|
4668
|
+
import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
4697
4669
|
function SectionTreeItem({ section, onSelect, selected }) {
|
|
4698
4670
|
const interactive = Boolean(onSelect);
|
|
4699
4671
|
return /* @__PURE__ */ jsxs6("div", { className: "flex h-9 w-full items-end pl-3", children: [
|
|
4700
|
-
/* @__PURE__ */
|
|
4672
|
+
/* @__PURE__ */ jsx9(
|
|
4701
4673
|
"div",
|
|
4702
4674
|
{
|
|
4703
4675
|
className: "mr-[-1px] h-9 w-2 shrink-0 rounded-bl-sm border-b border-l border-border mb-4",
|
|
@@ -4722,8 +4694,8 @@ function SectionTreeItem({ section, onSelect, selected }) {
|
|
|
4722
4694
|
interactive && selected && "border-primary"
|
|
4723
4695
|
),
|
|
4724
4696
|
children: [
|
|
4725
|
-
/* @__PURE__ */
|
|
4726
|
-
/* @__PURE__ */
|
|
4697
|
+
/* @__PURE__ */ jsx9(IconSection, { className: "shrink-0 text-foreground", "aria-hidden": true }),
|
|
4698
|
+
/* @__PURE__ */ jsx9("span", { className: "truncate text-sm font-normal leading-5 text-foreground", children: section.label })
|
|
4727
4699
|
]
|
|
4728
4700
|
}
|
|
4729
4701
|
)
|
|
@@ -4731,11 +4703,11 @@ function SectionTreeItem({ section, onSelect, selected }) {
|
|
|
4731
4703
|
}
|
|
4732
4704
|
function SectionPickerList({ sections, onSelect }) {
|
|
4733
4705
|
if (sections.length === 0) {
|
|
4734
|
-
return /* @__PURE__ */
|
|
4706
|
+
return /* @__PURE__ */ jsx9("p", { className: "text-sm text-muted-foreground", children: "No sections found on this page." });
|
|
4735
4707
|
}
|
|
4736
4708
|
return /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-1", children: [
|
|
4737
|
-
/* @__PURE__ */
|
|
4738
|
-
sections.map((section) => /* @__PURE__ */
|
|
4709
|
+
/* @__PURE__ */ jsx9("p", { className: "text-sm text-muted-foreground", children: "Pick a section this link should scroll to." }),
|
|
4710
|
+
sections.map((section) => /* @__PURE__ */ jsx9(SectionTreeItem, { section, onSelect }, section.id))
|
|
4739
4711
|
] });
|
|
4740
4712
|
}
|
|
4741
4713
|
|
|
@@ -4743,11 +4715,11 @@ function SectionPickerList({ sections, onSelect }) {
|
|
|
4743
4715
|
import { useId as useId2, useRef as useRef2, useState as useState3 } from "react";
|
|
4744
4716
|
|
|
4745
4717
|
// src/ui/input.tsx
|
|
4746
|
-
import * as
|
|
4747
|
-
import { jsx as
|
|
4748
|
-
var Input =
|
|
4718
|
+
import * as React5 from "react";
|
|
4719
|
+
import { jsx as jsx10 } from "react/jsx-runtime";
|
|
4720
|
+
var Input = React5.forwardRef(
|
|
4749
4721
|
({ className, type, ...props }, ref) => {
|
|
4750
|
-
return /* @__PURE__ */
|
|
4722
|
+
return /* @__PURE__ */ jsx10(
|
|
4751
4723
|
"input",
|
|
4752
4724
|
{
|
|
4753
4725
|
type,
|
|
@@ -4766,9 +4738,9 @@ Input.displayName = "Input";
|
|
|
4766
4738
|
|
|
4767
4739
|
// src/ui/label.tsx
|
|
4768
4740
|
import { Label as LabelPrimitive } from "radix-ui";
|
|
4769
|
-
import { jsx as
|
|
4741
|
+
import { jsx as jsx11 } from "react/jsx-runtime";
|
|
4770
4742
|
function Label({ className, ...props }) {
|
|
4771
|
-
return /* @__PURE__ */
|
|
4743
|
+
return /* @__PURE__ */ jsx11(
|
|
4772
4744
|
LabelPrimitive.Root,
|
|
4773
4745
|
{
|
|
4774
4746
|
"data-slot": "label",
|
|
@@ -4779,9 +4751,9 @@ function Label({ className, ...props }) {
|
|
|
4779
4751
|
}
|
|
4780
4752
|
|
|
4781
4753
|
// src/ui/link-modal/UrlOrPageInput.tsx
|
|
4782
|
-
import { jsx as
|
|
4754
|
+
import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
4783
4755
|
function FieldChevron({ onClick }) {
|
|
4784
|
-
return /* @__PURE__ */
|
|
4756
|
+
return /* @__PURE__ */ jsx12(
|
|
4785
4757
|
"button",
|
|
4786
4758
|
{
|
|
4787
4759
|
type: "button",
|
|
@@ -4789,7 +4761,7 @@ function FieldChevron({ onClick }) {
|
|
|
4789
4761
|
onClick,
|
|
4790
4762
|
"aria-label": "Open page list",
|
|
4791
4763
|
tabIndex: -1,
|
|
4792
|
-
children: /* @__PURE__ */
|
|
4764
|
+
children: /* @__PURE__ */ jsx12(IconChevronDown, {})
|
|
4793
4765
|
}
|
|
4794
4766
|
);
|
|
4795
4767
|
}
|
|
@@ -4829,11 +4801,11 @@ function UrlOrPageInput({
|
|
|
4829
4801
|
urlError ? "border-destructive shadow-[0_0_0_1px_var(--ohw-destructive)]" : isFocused ? "border-primary shadow-[0_0_0_1px_var(--ohw-primary)]" : "border-input"
|
|
4830
4802
|
);
|
|
4831
4803
|
return /* @__PURE__ */ jsxs7("div", { className: "flex w-full flex-col gap-2 p-0", children: [
|
|
4832
|
-
/* @__PURE__ */
|
|
4804
|
+
/* @__PURE__ */ jsx12(Label, { htmlFor: inputId, className: cn(urlError && "text-destructive"), children: "Destination" }),
|
|
4833
4805
|
/* @__PURE__ */ jsxs7("div", { className: "relative w-full", children: [
|
|
4834
4806
|
/* @__PURE__ */ jsxs7("div", { "data-ohw-link-field": true, className: fieldClassName, children: [
|
|
4835
|
-
selectedPage ? /* @__PURE__ */
|
|
4836
|
-
readOnly ? /* @__PURE__ */
|
|
4807
|
+
selectedPage ? /* @__PURE__ */ jsx12("div", { className: "flex shrink-0 items-center pr-2", children: /* @__PURE__ */ jsx12(IconFile, { className: "text-foreground", "aria-hidden": true }) }) : null,
|
|
4808
|
+
readOnly ? /* @__PURE__ */ jsx12("span", { className: "min-w-0 flex-1 truncate text-sm leading-5 text-foreground", children: selectedPage?.title ?? value }) : /* @__PURE__ */ jsx12(
|
|
4837
4809
|
Input,
|
|
4838
4810
|
{
|
|
4839
4811
|
ref: inputRef,
|
|
@@ -4852,7 +4824,7 @@ function UrlOrPageInput({
|
|
|
4852
4824
|
)
|
|
4853
4825
|
}
|
|
4854
4826
|
),
|
|
4855
|
-
selectedPage && !readOnly ? /* @__PURE__ */
|
|
4827
|
+
selectedPage && !readOnly ? /* @__PURE__ */ jsx12(
|
|
4856
4828
|
"button",
|
|
4857
4829
|
{
|
|
4858
4830
|
type: "button",
|
|
@@ -4860,12 +4832,12 @@ function UrlOrPageInput({
|
|
|
4860
4832
|
onMouseDown: clearSelection,
|
|
4861
4833
|
"aria-label": "Clear selected page",
|
|
4862
4834
|
tabIndex: -1,
|
|
4863
|
-
children: /* @__PURE__ */
|
|
4835
|
+
children: /* @__PURE__ */ jsx12(IconX, { "aria-hidden": true })
|
|
4864
4836
|
}
|
|
4865
4837
|
) : null,
|
|
4866
|
-
!readOnly ? /* @__PURE__ */
|
|
4838
|
+
!readOnly ? /* @__PURE__ */ jsx12(FieldChevron, { onClick: toggleDropdown }) : null
|
|
4867
4839
|
] }),
|
|
4868
|
-
dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */
|
|
4840
|
+
dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */ jsx12(
|
|
4869
4841
|
"div",
|
|
4870
4842
|
{
|
|
4871
4843
|
"data-ohw-link-page-dropdown": "",
|
|
@@ -4878,8 +4850,8 @@ function UrlOrPageInput({
|
|
|
4878
4850
|
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",
|
|
4879
4851
|
onClick: () => onPageSelect(page),
|
|
4880
4852
|
children: [
|
|
4881
|
-
/* @__PURE__ */
|
|
4882
|
-
/* @__PURE__ */
|
|
4853
|
+
/* @__PURE__ */ jsx12(IconFile, { className: "shrink-0", "aria-hidden": true }),
|
|
4854
|
+
/* @__PURE__ */ jsx12("span", { className: "truncate", children: page.title })
|
|
4883
4855
|
]
|
|
4884
4856
|
},
|
|
4885
4857
|
page.path
|
|
@@ -4887,7 +4859,7 @@ function UrlOrPageInput({
|
|
|
4887
4859
|
}
|
|
4888
4860
|
) : null
|
|
4889
4861
|
] }),
|
|
4890
|
-
urlError ? /* @__PURE__ */
|
|
4862
|
+
urlError ? /* @__PURE__ */ jsx12("p", { className: "text-sm font-medium text-destructive", children: urlError }) : null
|
|
4891
4863
|
] });
|
|
4892
4864
|
}
|
|
4893
4865
|
|
|
@@ -5055,7 +5027,7 @@ function useLinkModalState({
|
|
|
5055
5027
|
}
|
|
5056
5028
|
|
|
5057
5029
|
// src/ui/link-modal/LinkEditorPanel.tsx
|
|
5058
|
-
import { Fragment as Fragment2, jsx as
|
|
5030
|
+
import { Fragment as Fragment2, jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
5059
5031
|
function LinkEditorPanel({
|
|
5060
5032
|
open = true,
|
|
5061
5033
|
mode = "create",
|
|
@@ -5080,24 +5052,24 @@ function LinkEditorPanel({
|
|
|
5080
5052
|
});
|
|
5081
5053
|
const isCancel = state.secondaryLabel === "Cancel";
|
|
5082
5054
|
return /* @__PURE__ */ jsxs8(Fragment2, { children: [
|
|
5083
|
-
/* @__PURE__ */
|
|
5055
|
+
/* @__PURE__ */ jsx13(DialogClose, { asChild: true, children: /* @__PURE__ */ jsx13(
|
|
5084
5056
|
"button",
|
|
5085
5057
|
{
|
|
5086
5058
|
type: "button",
|
|
5087
5059
|
className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50",
|
|
5088
5060
|
"aria-label": "Close",
|
|
5089
|
-
children: /* @__PURE__ */
|
|
5061
|
+
children: /* @__PURE__ */ jsx13(IconX, { "aria-hidden": true })
|
|
5090
5062
|
}
|
|
5091
5063
|
) }),
|
|
5092
|
-
/* @__PURE__ */
|
|
5064
|
+
/* @__PURE__ */ jsx13(DialogHeader, { className: "w-full gap-1.5 p-6 pr-12", children: /* @__PURE__ */ jsx13(DialogTitle, { className: "m-0 w-full break-words", children: state.title }) }),
|
|
5093
5065
|
/* @__PURE__ */ jsxs8("div", { className: "flex w-full flex-col gap-3 px-6 pb-8 pt-1", children: [
|
|
5094
|
-
state.showBreadcrumb && state.selectedPage && state.selectedSection ? /* @__PURE__ */
|
|
5066
|
+
state.showBreadcrumb && state.selectedPage && state.selectedSection ? /* @__PURE__ */ jsx13(
|
|
5095
5067
|
DestinationBreadcrumb,
|
|
5096
5068
|
{
|
|
5097
5069
|
pageTitle: state.selectedPage.title,
|
|
5098
5070
|
sectionLabel: state.selectedSection.label
|
|
5099
5071
|
}
|
|
5100
|
-
) : /* @__PURE__ */
|
|
5072
|
+
) : /* @__PURE__ */ jsx13(
|
|
5101
5073
|
UrlOrPageInput,
|
|
5102
5074
|
{
|
|
5103
5075
|
value: state.searchValue,
|
|
@@ -5111,17 +5083,17 @@ function LinkEditorPanel({
|
|
|
5111
5083
|
}
|
|
5112
5084
|
),
|
|
5113
5085
|
state.showChooseSection ? /* @__PURE__ */ jsxs8("div", { className: "flex flex-col justify-center gap-2", children: [
|
|
5114
|
-
/* @__PURE__ */
|
|
5086
|
+
/* @__PURE__ */ jsx13(Button, { type: "button", variant: "outline", className: "w-fit cursor-pointer", size: "sm", onClick: state.handleChooseSection, children: "Choose a section" }),
|
|
5115
5087
|
/* @__PURE__ */ jsxs8("div", { className: "flex items-center gap-1 text-sm text-muted-foreground", children: [
|
|
5116
|
-
/* @__PURE__ */
|
|
5117
|
-
/* @__PURE__ */
|
|
5088
|
+
/* @__PURE__ */ jsx13(IconInfo, { className: "shrink-0", "aria-hidden": true }),
|
|
5089
|
+
/* @__PURE__ */ jsx13("span", { children: "Pick a section this link should scroll to." })
|
|
5118
5090
|
] })
|
|
5119
5091
|
] }) : null,
|
|
5120
|
-
state.showSectionPicker ? /* @__PURE__ */
|
|
5121
|
-
state.showSectionRow && state.selectedSection ? /* @__PURE__ */
|
|
5092
|
+
state.showSectionPicker ? /* @__PURE__ */ jsx13(SectionPickerList, { sections: state.activeSections, onSelect: state.handleSectionSelect }) : null,
|
|
5093
|
+
state.showSectionRow && state.selectedSection ? /* @__PURE__ */ jsx13(SectionTreeItem, { section: state.selectedSection, selected: true }) : null
|
|
5122
5094
|
] }),
|
|
5123
5095
|
/* @__PURE__ */ jsxs8(DialogFooter, { className: "w-full px-6 pb-6", children: [
|
|
5124
|
-
/* @__PURE__ */
|
|
5096
|
+
/* @__PURE__ */ jsx13(
|
|
5125
5097
|
Button,
|
|
5126
5098
|
{
|
|
5127
5099
|
type: "button",
|
|
@@ -5136,7 +5108,7 @@ function LinkEditorPanel({
|
|
|
5136
5108
|
children: state.secondaryLabel
|
|
5137
5109
|
}
|
|
5138
5110
|
),
|
|
5139
|
-
/* @__PURE__ */
|
|
5111
|
+
/* @__PURE__ */ jsx13(
|
|
5140
5112
|
Button,
|
|
5141
5113
|
{
|
|
5142
5114
|
type: "button",
|
|
@@ -5155,7 +5127,7 @@ function LinkEditorPanel({
|
|
|
5155
5127
|
}
|
|
5156
5128
|
|
|
5157
5129
|
// src/ui/link-modal/LinkPopover.tsx
|
|
5158
|
-
import { jsx as
|
|
5130
|
+
import { jsx as jsx14 } from "react/jsx-runtime";
|
|
5159
5131
|
function LinkPopover({
|
|
5160
5132
|
open = true,
|
|
5161
5133
|
panelRef,
|
|
@@ -5163,14 +5135,14 @@ function LinkPopover({
|
|
|
5163
5135
|
onClose,
|
|
5164
5136
|
...editorProps
|
|
5165
5137
|
}) {
|
|
5166
|
-
return /* @__PURE__ */
|
|
5138
|
+
return /* @__PURE__ */ jsx14(
|
|
5167
5139
|
Dialog2,
|
|
5168
5140
|
{
|
|
5169
5141
|
open,
|
|
5170
5142
|
onOpenChange: (next) => {
|
|
5171
5143
|
if (!next) onClose?.();
|
|
5172
5144
|
},
|
|
5173
|
-
children: /* @__PURE__ */
|
|
5145
|
+
children: /* @__PURE__ */ jsx14(
|
|
5174
5146
|
DialogContent,
|
|
5175
5147
|
{
|
|
5176
5148
|
ref: panelRef,
|
|
@@ -5180,7 +5152,7 @@ function LinkPopover({
|
|
|
5180
5152
|
"data-ohw-bridge": "",
|
|
5181
5153
|
showCloseButton: false,
|
|
5182
5154
|
className: "gap-0 p-0 w-full md:w-md pointer-events-auto",
|
|
5183
|
-
children: /* @__PURE__ */
|
|
5155
|
+
children: /* @__PURE__ */ jsx14(LinkEditorPanel, { ...editorProps, open, onClose })
|
|
5184
5156
|
}
|
|
5185
5157
|
)
|
|
5186
5158
|
}
|
|
@@ -5246,7 +5218,7 @@ function shouldUseDevFixtures() {
|
|
|
5246
5218
|
}
|
|
5247
5219
|
|
|
5248
5220
|
// src/ui/badge.tsx
|
|
5249
|
-
import { jsx as
|
|
5221
|
+
import { jsx as jsx15 } from "react/jsx-runtime";
|
|
5250
5222
|
var badgeVariants = cva(
|
|
5251
5223
|
"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",
|
|
5252
5224
|
{
|
|
@@ -5264,11 +5236,11 @@ var badgeVariants = cva(
|
|
|
5264
5236
|
}
|
|
5265
5237
|
);
|
|
5266
5238
|
function Badge({ className, variant, ...props }) {
|
|
5267
|
-
return /* @__PURE__ */
|
|
5239
|
+
return /* @__PURE__ */ jsx15("div", { className: cn(badgeVariants({ variant }), className), ...props });
|
|
5268
5240
|
}
|
|
5269
5241
|
|
|
5270
5242
|
// src/OhhwellsBridge.tsx
|
|
5271
|
-
import { Fragment as Fragment3, jsx as
|
|
5243
|
+
import { Fragment as Fragment3, jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
5272
5244
|
var PRIMARY = "#0885FE";
|
|
5273
5245
|
var IMAGE_FADE_MS = 300;
|
|
5274
5246
|
function runOpacityFade(el, onDone) {
|
|
@@ -5442,7 +5414,7 @@ function mountSchedulingWidget(insertAfter, notifyOnConnect = false, scheduleId,
|
|
|
5442
5414
|
const root = createRoot(container);
|
|
5443
5415
|
flushSync(() => {
|
|
5444
5416
|
root.render(
|
|
5445
|
-
/* @__PURE__ */
|
|
5417
|
+
/* @__PURE__ */ jsx16(
|
|
5446
5418
|
SchedulingWidget,
|
|
5447
5419
|
{
|
|
5448
5420
|
notifyOnConnect,
|
|
@@ -5490,20 +5462,6 @@ function applyLinkHref(el, val) {
|
|
|
5490
5462
|
const anchor = el instanceof HTMLAnchorElement ? el : el.querySelector("a");
|
|
5491
5463
|
if (anchor) anchor.setAttribute("href", val);
|
|
5492
5464
|
}
|
|
5493
|
-
function getEditMeasureEl(editable) {
|
|
5494
|
-
return editable.closest("[data-ohw-href-key]") ?? editable;
|
|
5495
|
-
}
|
|
5496
|
-
function isDragHandleDisabled(el) {
|
|
5497
|
-
const carriers = [
|
|
5498
|
-
el.closest("[data-ohw-href-key]"),
|
|
5499
|
-
el.closest("[data-ohw-editable]")
|
|
5500
|
-
];
|
|
5501
|
-
return carriers.some((carrier) => {
|
|
5502
|
-
if (!carrier) return false;
|
|
5503
|
-
const raw = carrier.getAttribute("data-ohw-drag-disabled");
|
|
5504
|
-
return raw === "true" || raw === "";
|
|
5505
|
-
});
|
|
5506
|
-
}
|
|
5507
5465
|
function collectEditableNodes() {
|
|
5508
5466
|
const nodes = Array.from(document.querySelectorAll("[data-ohw-editable]")).map((el) => {
|
|
5509
5467
|
if (el.dataset.ohwEditable === "image") {
|
|
@@ -5557,14 +5515,6 @@ function getHrefKeyFromElement(el) {
|
|
|
5557
5515
|
function isNavbarButton(el) {
|
|
5558
5516
|
return Boolean(el.closest('[data-ohw-role="navbar-button"]'));
|
|
5559
5517
|
}
|
|
5560
|
-
function getReorderHandleState(el) {
|
|
5561
|
-
const linkEl = el.closest("[data-ohw-href-key]");
|
|
5562
|
-
if (!linkEl || isNavbarButton(el)) return { key: null, disabled: false };
|
|
5563
|
-
return {
|
|
5564
|
-
key: linkEl.dataset.ohwHrefKey ?? null,
|
|
5565
|
-
disabled: isDragHandleDisabled(el)
|
|
5566
|
-
};
|
|
5567
|
-
}
|
|
5568
5518
|
function clearHrefKeyHover(anchor) {
|
|
5569
5519
|
anchor.removeAttribute("data-ohw-hovered");
|
|
5570
5520
|
anchor.querySelectorAll("[data-ohw-hovered]").forEach((el) => {
|
|
@@ -5694,8 +5644,6 @@ var ICONS = {
|
|
|
5694
5644
|
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"/>',
|
|
5695
5645
|
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"/>'
|
|
5696
5646
|
};
|
|
5697
|
-
var TOOLBAR_PILL_PADDING = 2;
|
|
5698
|
-
var TOOLBAR_TOGGLE_GAP = 4;
|
|
5699
5647
|
var TOOLBAR_GROUPS = [
|
|
5700
5648
|
[
|
|
5701
5649
|
{ cmd: "bold", title: "Bold" },
|
|
@@ -5713,64 +5661,24 @@ var TOOLBAR_GROUPS = [
|
|
|
5713
5661
|
{ cmd: "insertOrderedList", title: "Numbered List" }
|
|
5714
5662
|
]
|
|
5715
5663
|
];
|
|
5716
|
-
function
|
|
5717
|
-
rect,
|
|
5718
|
-
elRef,
|
|
5719
|
-
reorderHrefKey,
|
|
5720
|
-
dragDisabled = false
|
|
5721
|
-
}) {
|
|
5664
|
+
function GlowFrame({ rect, elRef }) {
|
|
5722
5665
|
const GAP = 6;
|
|
5723
|
-
return /* @__PURE__ */
|
|
5666
|
+
return /* @__PURE__ */ jsx16(
|
|
5724
5667
|
"div",
|
|
5725
5668
|
{
|
|
5726
5669
|
ref: elRef,
|
|
5727
|
-
"data-ohw-edit-chrome": "",
|
|
5728
5670
|
style: {
|
|
5729
5671
|
position: "fixed",
|
|
5730
5672
|
top: rect.top - GAP,
|
|
5731
5673
|
left: rect.left - GAP,
|
|
5732
5674
|
width: rect.width + GAP * 2,
|
|
5733
5675
|
height: rect.height + GAP * 2,
|
|
5676
|
+
border: "2px solid #0885FE",
|
|
5677
|
+
borderRadius: 8,
|
|
5678
|
+
boxShadow: "0 0 0 4px rgba(8, 133, 254, 0.12)",
|
|
5734
5679
|
pointerEvents: "none",
|
|
5735
5680
|
zIndex: 2147483646
|
|
5736
|
-
}
|
|
5737
|
-
children: [
|
|
5738
|
-
/* @__PURE__ */ jsx17(
|
|
5739
|
-
"div",
|
|
5740
|
-
{
|
|
5741
|
-
style: {
|
|
5742
|
-
position: "absolute",
|
|
5743
|
-
inset: 0,
|
|
5744
|
-
border: "2px solid #0885FE",
|
|
5745
|
-
borderRadius: 8,
|
|
5746
|
-
boxShadow: "0 0 0 4px rgba(8, 133, 254, 0.12)",
|
|
5747
|
-
pointerEvents: "none"
|
|
5748
|
-
}
|
|
5749
|
-
}
|
|
5750
|
-
),
|
|
5751
|
-
reorderHrefKey && /* @__PURE__ */ jsx17(
|
|
5752
|
-
"div",
|
|
5753
|
-
{
|
|
5754
|
-
"data-ohw-drag-handle-container": "",
|
|
5755
|
-
"data-ohw-drag-disabled": dragDisabled ? "" : void 0,
|
|
5756
|
-
style: {
|
|
5757
|
-
position: "absolute",
|
|
5758
|
-
left: 0,
|
|
5759
|
-
top: "50%",
|
|
5760
|
-
transform: "translate(calc(-100% - 7px), -50%)",
|
|
5761
|
-
pointerEvents: dragDisabled ? "none" : "auto"
|
|
5762
|
-
},
|
|
5763
|
-
children: /* @__PURE__ */ jsx17(
|
|
5764
|
-
DragHandle,
|
|
5765
|
-
{
|
|
5766
|
-
"aria-label": `Reorder ${reorderHrefKey}`,
|
|
5767
|
-
disabled: dragDisabled,
|
|
5768
|
-
"aria-disabled": dragDisabled
|
|
5769
|
-
}
|
|
5770
|
-
)
|
|
5771
|
-
}
|
|
5772
|
-
)
|
|
5773
|
-
]
|
|
5681
|
+
}
|
|
5774
5682
|
}
|
|
5775
5683
|
);
|
|
5776
5684
|
}
|
|
@@ -5814,9 +5722,9 @@ function clampToolbarToClip(top, transform, rect, clip, approxH, gap) {
|
|
|
5814
5722
|
const pinnedTop = Math.min(maxBottom - approxH, Math.max(minTop, clip.top + gap));
|
|
5815
5723
|
return { top: pinnedTop + approxH, transform: "translateX(-50%) translateY(-100%)" };
|
|
5816
5724
|
}
|
|
5817
|
-
function calcToolbarPos(rect, parentScroll, approxW =
|
|
5725
|
+
function calcToolbarPos(rect, parentScroll, approxW = 330) {
|
|
5818
5726
|
const GAP = 8;
|
|
5819
|
-
const APPROX_H =
|
|
5727
|
+
const APPROX_H = 36;
|
|
5820
5728
|
const APPROX_W = approxW;
|
|
5821
5729
|
const clip = getIframeVisibleClip(parentScroll);
|
|
5822
5730
|
const clipTop = clip?.top ?? 0;
|
|
@@ -5851,8 +5759,8 @@ function calcToolbarPos(rect, parentScroll, approxW = 306) {
|
|
|
5851
5759
|
return { top, left, transform };
|
|
5852
5760
|
}
|
|
5853
5761
|
var EDIT_LINK_ICON = /* @__PURE__ */ jsxs9("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: [
|
|
5854
|
-
/* @__PURE__ */
|
|
5855
|
-
/* @__PURE__ */
|
|
5762
|
+
/* @__PURE__ */ jsx16("path", { d: "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" }),
|
|
5763
|
+
/* @__PURE__ */ jsx16("path", { d: "M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" })
|
|
5856
5764
|
] });
|
|
5857
5765
|
function FloatingToolbar({
|
|
5858
5766
|
rect,
|
|
@@ -5864,7 +5772,7 @@ function FloatingToolbar({
|
|
|
5864
5772
|
showEditLink,
|
|
5865
5773
|
onEditLink
|
|
5866
5774
|
}) {
|
|
5867
|
-
const approxW = variant === "link-action" ?
|
|
5775
|
+
const approxW = variant === "link-action" ? 120 : 330;
|
|
5868
5776
|
const { top, left, transform } = calcToolbarPos(rect, parentScroll, approxW);
|
|
5869
5777
|
if (variant === "link-action") {
|
|
5870
5778
|
return /* @__PURE__ */ jsxs9(
|
|
@@ -5884,15 +5792,15 @@ function FloatingToolbar({
|
|
|
5884
5792
|
boxShadow: "0px 2px 4px -2px rgba(0,0,0,.1),0px 4px 6px -1px rgba(0,0,0,.1)",
|
|
5885
5793
|
display: "flex",
|
|
5886
5794
|
alignItems: "center",
|
|
5887
|
-
padding:
|
|
5888
|
-
gap:
|
|
5795
|
+
padding: 4,
|
|
5796
|
+
gap: 6,
|
|
5889
5797
|
fontFamily: "sans-serif",
|
|
5890
5798
|
pointerEvents: "auto",
|
|
5891
5799
|
whiteSpace: "nowrap"
|
|
5892
5800
|
},
|
|
5893
5801
|
onMouseDown: (e) => e.stopPropagation(),
|
|
5894
5802
|
children: [
|
|
5895
|
-
/* @__PURE__ */
|
|
5803
|
+
/* @__PURE__ */ jsx16(
|
|
5896
5804
|
"button",
|
|
5897
5805
|
{
|
|
5898
5806
|
type: "button",
|
|
@@ -5927,8 +5835,8 @@ function FloatingToolbar({
|
|
|
5927
5835
|
children: EDIT_LINK_ICON
|
|
5928
5836
|
}
|
|
5929
5837
|
),
|
|
5930
|
-
/* @__PURE__ */
|
|
5931
|
-
/* @__PURE__ */
|
|
5838
|
+
/* @__PURE__ */ jsx16("span", { style: { display: "block", width: 1, height: 24, background: "#E7E5E4", flexShrink: 0 } }),
|
|
5839
|
+
/* @__PURE__ */ jsx16(
|
|
5932
5840
|
"button",
|
|
5933
5841
|
{
|
|
5934
5842
|
type: "button",
|
|
@@ -5948,9 +5856,9 @@ function FloatingToolbar({
|
|
|
5948
5856
|
opacity: 0.6
|
|
5949
5857
|
},
|
|
5950
5858
|
children: /* @__PURE__ */ jsxs9("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": true, children: [
|
|
5951
|
-
/* @__PURE__ */
|
|
5952
|
-
/* @__PURE__ */
|
|
5953
|
-
/* @__PURE__ */
|
|
5859
|
+
/* @__PURE__ */ jsx16("circle", { cx: "5", cy: "12", r: "1.5" }),
|
|
5860
|
+
/* @__PURE__ */ jsx16("circle", { cx: "12", cy: "12", r: "1.5" }),
|
|
5861
|
+
/* @__PURE__ */ jsx16("circle", { cx: "19", cy: "12", r: "1.5" })
|
|
5954
5862
|
] })
|
|
5955
5863
|
}
|
|
5956
5864
|
)
|
|
@@ -5975,19 +5883,19 @@ function FloatingToolbar({
|
|
|
5975
5883
|
boxShadow: "0px 2px 4px -2px rgba(0,0,0,.1),0px 4px 6px -1px rgba(0,0,0,.1)",
|
|
5976
5884
|
display: "flex",
|
|
5977
5885
|
alignItems: "center",
|
|
5978
|
-
padding:
|
|
5979
|
-
gap:
|
|
5886
|
+
padding: 4,
|
|
5887
|
+
gap: 6,
|
|
5980
5888
|
fontFamily: "sans-serif",
|
|
5981
5889
|
pointerEvents: "auto",
|
|
5982
5890
|
whiteSpace: "nowrap"
|
|
5983
5891
|
},
|
|
5984
5892
|
onMouseDown: (e) => e.stopPropagation(),
|
|
5985
5893
|
children: [
|
|
5986
|
-
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ jsxs9(
|
|
5987
|
-
gi > 0 && /* @__PURE__ */
|
|
5894
|
+
TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ jsxs9(React6.Fragment, { children: [
|
|
5895
|
+
gi > 0 && /* @__PURE__ */ jsx16("span", { style: { display: "block", width: 1, height: 24, background: "#E7E5E4", flexShrink: 0 } }),
|
|
5988
5896
|
btns.map((btn) => {
|
|
5989
5897
|
const isActive = activeCommands.has(btn.cmd);
|
|
5990
|
-
return /* @__PURE__ */
|
|
5898
|
+
return /* @__PURE__ */ jsx16(
|
|
5991
5899
|
"button",
|
|
5992
5900
|
{
|
|
5993
5901
|
title: btn.title,
|
|
@@ -6013,7 +5921,7 @@ function FloatingToolbar({
|
|
|
6013
5921
|
flexShrink: 0,
|
|
6014
5922
|
padding: 6
|
|
6015
5923
|
},
|
|
6016
|
-
children: /* @__PURE__ */
|
|
5924
|
+
children: /* @__PURE__ */ jsx16(
|
|
6017
5925
|
"svg",
|
|
6018
5926
|
{
|
|
6019
5927
|
width: "16",
|
|
@@ -6033,7 +5941,7 @@ function FloatingToolbar({
|
|
|
6033
5941
|
);
|
|
6034
5942
|
})
|
|
6035
5943
|
] }, gi)),
|
|
6036
|
-
showEditLink ? /* @__PURE__ */
|
|
5944
|
+
showEditLink ? /* @__PURE__ */ jsx16(
|
|
6037
5945
|
"button",
|
|
6038
5946
|
{
|
|
6039
5947
|
type: "button",
|
|
@@ -6082,7 +5990,7 @@ function StateToggle({
|
|
|
6082
5990
|
states,
|
|
6083
5991
|
onStateChange
|
|
6084
5992
|
}) {
|
|
6085
|
-
return /* @__PURE__ */
|
|
5993
|
+
return /* @__PURE__ */ jsx16(
|
|
6086
5994
|
ToggleGroup,
|
|
6087
5995
|
{
|
|
6088
5996
|
"data-ohw-state-toggle": "",
|
|
@@ -6096,7 +6004,7 @@ function StateToggle({
|
|
|
6096
6004
|
left: rect.right - 8,
|
|
6097
6005
|
transform: "translateX(-100%)"
|
|
6098
6006
|
},
|
|
6099
|
-
children: states.map((state) => /* @__PURE__ */
|
|
6007
|
+
children: states.map((state) => /* @__PURE__ */ jsx16(ToggleGroupItem, { value: state, size: "sm", children: state }, state))
|
|
6100
6008
|
}
|
|
6101
6009
|
);
|
|
6102
6010
|
}
|
|
@@ -6194,8 +6102,6 @@ function OhhwellsBridge() {
|
|
|
6194
6102
|
const [toolbarVariant, setToolbarVariant] = useState5("none");
|
|
6195
6103
|
const toolbarVariantRef = useRef3("none");
|
|
6196
6104
|
toolbarVariantRef.current = toolbarVariant;
|
|
6197
|
-
const [reorderHrefKey, setReorderHrefKey] = useState5(null);
|
|
6198
|
-
const [reorderDragDisabled, setReorderDragDisabled] = useState5(false);
|
|
6199
6105
|
const [toggleState, setToggleState] = useState5(null);
|
|
6200
6106
|
const [maxBadge, setMaxBadge] = useState5(null);
|
|
6201
6107
|
const [activeCommands, setActiveCommands] = useState5(/* @__PURE__ */ new Set());
|
|
@@ -6302,7 +6208,7 @@ function OhhwellsBridge() {
|
|
|
6302
6208
|
useEffect3(() => {
|
|
6303
6209
|
const update = () => {
|
|
6304
6210
|
const el = activeElRef.current ?? selectedElRef.current;
|
|
6305
|
-
if (el) setToolbarRect(
|
|
6211
|
+
if (el) setToolbarRect(el.getBoundingClientRect());
|
|
6306
6212
|
setToggleState((prev) => {
|
|
6307
6213
|
if (!prev || !activeStateElRef.current) return prev;
|
|
6308
6214
|
return { ...prev, rect: activeStateElRef.current.getBoundingClientRect() };
|
|
@@ -6369,8 +6275,6 @@ function OhhwellsBridge() {
|
|
|
6369
6275
|
}
|
|
6370
6276
|
el.removeAttribute("contenteditable");
|
|
6371
6277
|
activeElRef.current = null;
|
|
6372
|
-
setReorderHrefKey(null);
|
|
6373
|
-
setReorderDragDisabled(false);
|
|
6374
6278
|
if (!selectedElRef.current) {
|
|
6375
6279
|
setToolbarRect(null);
|
|
6376
6280
|
setToolbarVariant("none");
|
|
@@ -6408,15 +6312,11 @@ function OhhwellsBridge() {
|
|
|
6408
6312
|
setToolbarVariant("rich-text");
|
|
6409
6313
|
el.setAttribute("contenteditable", "true");
|
|
6410
6314
|
el.removeAttribute("data-ohw-hovered");
|
|
6411
|
-
el.closest("[data-ohw-href-key]")?.removeAttribute("data-ohw-hovered");
|
|
6412
6315
|
activeElRef.current = el;
|
|
6413
6316
|
originalContentRef.current = el.innerHTML;
|
|
6414
6317
|
el.focus();
|
|
6318
|
+
setToolbarRect(el.getBoundingClientRect());
|
|
6415
6319
|
setToolbarShowEditLink(Boolean(getHrefKeyFromElement(el)));
|
|
6416
|
-
const { key: reorderKey, disabled: reorderDisabled } = getReorderHandleState(el);
|
|
6417
|
-
setReorderHrefKey(reorderKey);
|
|
6418
|
-
setReorderDragDisabled(reorderDisabled);
|
|
6419
|
-
setToolbarRect(getEditMeasureEl(el).getBoundingClientRect());
|
|
6420
6320
|
postToParent({ type: "ow:enter-edit", key: el.dataset.ohwKey });
|
|
6421
6321
|
requestAnimationFrame(() => refreshActiveCommandsRef.current());
|
|
6422
6322
|
}, [deactivate, postToParent]);
|
|
@@ -6481,7 +6381,7 @@ function OhhwellsBridge() {
|
|
|
6481
6381
|
return () => {
|
|
6482
6382
|
cancelled = true;
|
|
6483
6383
|
};
|
|
6484
|
-
}, [subdomain, isEditMode]);
|
|
6384
|
+
}, [subdomain, isEditMode, pathname]);
|
|
6485
6385
|
useEffect3(() => {
|
|
6486
6386
|
if (!subdomain || isEditMode) return;
|
|
6487
6387
|
let debounceTimer = null;
|
|
@@ -6518,7 +6418,7 @@ function OhhwellsBridge() {
|
|
|
6518
6418
|
if (debounceTimer) clearTimeout(debounceTimer);
|
|
6519
6419
|
debounceTimer = setTimeout(applyFromCache, 150);
|
|
6520
6420
|
};
|
|
6521
|
-
|
|
6421
|
+
scheduleApply();
|
|
6522
6422
|
observer = new MutationObserver(scheduleApply);
|
|
6523
6423
|
observer.observe(document.body, { childList: true, subtree: true });
|
|
6524
6424
|
return () => {
|
|
@@ -6646,11 +6546,6 @@ function OhhwellsBridge() {
|
|
|
6646
6546
|
if (target.closest("[data-ohw-state-toggle]")) return;
|
|
6647
6547
|
if (target.closest("[data-ohw-max-badge]")) return;
|
|
6648
6548
|
if (isInsideLinkEditor(target)) return;
|
|
6649
|
-
if (target.closest('[data-ohw-edit-chrome], [data-ohw-drag-handle-container], [data-slot="drag-handle"]')) {
|
|
6650
|
-
e.preventDefault();
|
|
6651
|
-
e.stopPropagation();
|
|
6652
|
-
return;
|
|
6653
|
-
}
|
|
6654
6549
|
const editable = target.closest("[data-ohw-editable]");
|
|
6655
6550
|
if (editable) {
|
|
6656
6551
|
if (editable.dataset.ohwEditable === "link") {
|
|
@@ -6727,18 +6622,14 @@ function OhhwellsBridge() {
|
|
|
6727
6622
|
const selected = selectedElRef.current;
|
|
6728
6623
|
if (selected && (selected === editable || selected.contains(editable))) return;
|
|
6729
6624
|
if (editable.dataset.ohwEditable !== "image" && editable.dataset.ohwEditable !== "bg-image" && !editable.hasAttribute("contenteditable")) {
|
|
6730
|
-
|
|
6731
|
-
hoverTarget.setAttribute("data-ohw-hovered", "");
|
|
6625
|
+
editable.setAttribute("data-ohw-hovered", "");
|
|
6732
6626
|
}
|
|
6733
6627
|
};
|
|
6734
6628
|
const handleMouseOut = (e) => {
|
|
6735
6629
|
const editable = e.target.closest("[data-ohw-editable]");
|
|
6736
6630
|
if (!editable) return;
|
|
6737
|
-
const related = e.relatedTarget instanceof Element ? e.relatedTarget : null;
|
|
6738
|
-
if (related?.closest("[data-ohw-drag-handle-container]")) return;
|
|
6739
6631
|
if (editable.dataset.ohwEditable !== "image" && editable.dataset.ohwEditable !== "bg-image") {
|
|
6740
|
-
|
|
6741
|
-
hoverTarget.removeAttribute("data-ohw-hovered");
|
|
6632
|
+
editable.removeAttribute("data-ohw-hovered");
|
|
6742
6633
|
}
|
|
6743
6634
|
};
|
|
6744
6635
|
const toProbeCoords = (clientX, clientY, fromParentViewport) => {
|
|
@@ -6853,20 +6744,11 @@ function OhhwellsBridge() {
|
|
|
6853
6744
|
return;
|
|
6854
6745
|
}
|
|
6855
6746
|
}
|
|
6856
|
-
if (activeElRef.current) {
|
|
6857
|
-
if (hoveredImageRef.current) {
|
|
6858
|
-
hoveredImageRef.current = null;
|
|
6859
|
-
hoveredImageHasTextOverlapRef.current = false;
|
|
6860
|
-
resumeAnimTracks();
|
|
6861
|
-
postToParentRef.current({ type: "ow:image-unhover" });
|
|
6862
|
-
}
|
|
6863
|
-
return;
|
|
6864
|
-
}
|
|
6865
6747
|
const imgEl = findImageAtPoint(clientX, clientY, fromParentViewport);
|
|
6866
6748
|
if (imgEl) {
|
|
6867
6749
|
const { x, y } = toProbeCoords(clientX, clientY, fromParentViewport);
|
|
6868
6750
|
const topEl = document.elementFromPoint(x, y);
|
|
6869
|
-
if (topEl?.closest(
|
|
6751
|
+
if (topEl?.closest("[data-ohw-toolbar]")) {
|
|
6870
6752
|
if (hoveredImageRef.current) {
|
|
6871
6753
|
hoveredImageRef.current = null;
|
|
6872
6754
|
resumeAnimTracks();
|
|
@@ -7159,7 +7041,7 @@ function OhhwellsBridge() {
|
|
|
7159
7041
|
const el = e.target;
|
|
7160
7042
|
const key = el.dataset.ohwKey;
|
|
7161
7043
|
if (!key) return;
|
|
7162
|
-
if (el === activeElRef.current) setToolbarRect(
|
|
7044
|
+
if (el === activeElRef.current) setToolbarRect(el.getBoundingClientRect());
|
|
7163
7045
|
const maxLen = el.dataset.ohwMaxLength ? parseInt(el.dataset.ohwMaxLength, 10) : null;
|
|
7164
7046
|
if (maxLen) {
|
|
7165
7047
|
const current = el.innerText.replace(/\n$/, "").length;
|
|
@@ -7389,7 +7271,7 @@ function OhhwellsBridge() {
|
|
|
7389
7271
|
};
|
|
7390
7272
|
const applyToolbarPos = (rect) => {
|
|
7391
7273
|
const ps = parentScrollRef.current;
|
|
7392
|
-
const approxW = toolbarVariantRef.current === "link-action" ?
|
|
7274
|
+
const approxW = toolbarVariantRef.current === "link-action" ? 120 : 330;
|
|
7393
7275
|
if (toolbarElRef.current) {
|
|
7394
7276
|
const { top, left, transform } = calcToolbarPos(rect, ps, approxW);
|
|
7395
7277
|
toolbarElRef.current.style.top = `${top}px`;
|
|
@@ -7568,7 +7450,7 @@ function OhhwellsBridge() {
|
|
|
7568
7450
|
const handleCommand = useCallback2((cmd) => {
|
|
7569
7451
|
document.execCommand(cmd, false);
|
|
7570
7452
|
activeElRef.current?.focus();
|
|
7571
|
-
if (activeElRef.current) setToolbarRect(
|
|
7453
|
+
if (activeElRef.current) setToolbarRect(activeElRef.current.getBoundingClientRect());
|
|
7572
7454
|
refreshActiveCommandsRef.current();
|
|
7573
7455
|
}, []);
|
|
7574
7456
|
const handleStateChange = useCallback2((state) => {
|
|
@@ -7622,18 +7504,10 @@ function OhhwellsBridge() {
|
|
|
7622
7504
|
linkPopoverOpenRef.current = linkPopover !== null;
|
|
7623
7505
|
return bridgeRoot ? createPortal(
|
|
7624
7506
|
/* @__PURE__ */ jsxs9(Fragment3, { children: [
|
|
7625
|
-
/* @__PURE__ */
|
|
7507
|
+
/* @__PURE__ */ jsx16("div", { ref: attachVisibleViewport, "data-ohw-visible-viewport": "", "aria-hidden": true }),
|
|
7626
7508
|
toolbarRect && /* @__PURE__ */ jsxs9(Fragment3, { children: [
|
|
7627
|
-
/* @__PURE__ */
|
|
7628
|
-
|
|
7629
|
-
{
|
|
7630
|
-
rect: toolbarRect,
|
|
7631
|
-
elRef: glowElRef,
|
|
7632
|
-
reorderHrefKey,
|
|
7633
|
-
dragDisabled: reorderDragDisabled
|
|
7634
|
-
}
|
|
7635
|
-
),
|
|
7636
|
-
toolbarVariant === "rich-text" && /* @__PURE__ */ jsx17(
|
|
7509
|
+
/* @__PURE__ */ jsx16(GlowFrame, { rect: toolbarRect, elRef: glowElRef }),
|
|
7510
|
+
toolbarVariant === "rich-text" && /* @__PURE__ */ jsx16(
|
|
7637
7511
|
FloatingToolbar,
|
|
7638
7512
|
{
|
|
7639
7513
|
variant: "rich-text",
|
|
@@ -7646,7 +7520,7 @@ function OhhwellsBridge() {
|
|
|
7646
7520
|
onEditLink: openLinkPopoverForActive
|
|
7647
7521
|
}
|
|
7648
7522
|
),
|
|
7649
|
-
toolbarVariant === "link-action" && /* @__PURE__ */
|
|
7523
|
+
toolbarVariant === "link-action" && /* @__PURE__ */ jsx16(
|
|
7650
7524
|
FloatingToolbar,
|
|
7651
7525
|
{
|
|
7652
7526
|
variant: "link-action",
|
|
@@ -7685,7 +7559,7 @@ function OhhwellsBridge() {
|
|
|
7685
7559
|
]
|
|
7686
7560
|
}
|
|
7687
7561
|
),
|
|
7688
|
-
toggleState && /* @__PURE__ */
|
|
7562
|
+
toggleState && /* @__PURE__ */ jsx16(
|
|
7689
7563
|
StateToggle,
|
|
7690
7564
|
{
|
|
7691
7565
|
rect: toggleState.rect,
|
|
@@ -7701,8 +7575,8 @@ function OhhwellsBridge() {
|
|
|
7701
7575
|
className: "fixed left-0 w-full z-2147483646 flex items-center pointer-events-none",
|
|
7702
7576
|
style: { top: sectionGap.y, transform: "translateY(-50%)" },
|
|
7703
7577
|
children: [
|
|
7704
|
-
/* @__PURE__ */
|
|
7705
|
-
/* @__PURE__ */
|
|
7578
|
+
/* @__PURE__ */ jsx16("div", { className: "flex-1 bg-primary", style: { height: 3 } }),
|
|
7579
|
+
/* @__PURE__ */ jsx16(
|
|
7706
7580
|
Badge,
|
|
7707
7581
|
{
|
|
7708
7582
|
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",
|
|
@@ -7715,11 +7589,11 @@ function OhhwellsBridge() {
|
|
|
7715
7589
|
children: "Add Section"
|
|
7716
7590
|
}
|
|
7717
7591
|
),
|
|
7718
|
-
/* @__PURE__ */
|
|
7592
|
+
/* @__PURE__ */ jsx16("div", { className: "flex-1 bg-primary", style: { height: 3 } })
|
|
7719
7593
|
]
|
|
7720
7594
|
}
|
|
7721
7595
|
),
|
|
7722
|
-
linkPopover && dialogPortalContainer ? /* @__PURE__ */
|
|
7596
|
+
linkPopover && dialogPortalContainer ? /* @__PURE__ */ jsx16(
|
|
7723
7597
|
LinkPopover,
|
|
7724
7598
|
{
|
|
7725
7599
|
panelRef: linkPopoverPanelRef,
|
|
@@ -7734,38 +7608,12 @@ function OhhwellsBridge() {
|
|
|
7734
7608
|
onSubmit: handleLinkPopoverSubmit
|
|
7735
7609
|
},
|
|
7736
7610
|
`${linkPopover.key}-${pathname}`
|
|
7737
|
-
) : null
|
|
7738
|
-
sectionGap && /* @__PURE__ */ jsxs9(
|
|
7739
|
-
"div",
|
|
7740
|
-
{
|
|
7741
|
-
"data-ohw-section-insert-line": "",
|
|
7742
|
-
className: "fixed left-0 w-full z-2147483646 flex items-center pointer-events-none",
|
|
7743
|
-
style: { top: sectionGap.y, transform: "translateY(-50%)" },
|
|
7744
|
-
children: [
|
|
7745
|
-
/* @__PURE__ */ jsx17("div", { className: "flex-1 bg-primary", style: { height: 3 } }),
|
|
7746
|
-
/* @__PURE__ */ jsx17(
|
|
7747
|
-
Badge,
|
|
7748
|
-
{
|
|
7749
|
-
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",
|
|
7750
|
-
onClick: () => {
|
|
7751
|
-
window.parent.postMessage(
|
|
7752
|
-
{ type: "ow:add-section", insertAfter: sectionGap.insertAfter, insertBefore: sectionGap.insertBefore },
|
|
7753
|
-
"*"
|
|
7754
|
-
);
|
|
7755
|
-
},
|
|
7756
|
-
children: "Add Section"
|
|
7757
|
-
}
|
|
7758
|
-
),
|
|
7759
|
-
/* @__PURE__ */ jsx17("div", { className: "flex-1 bg-primary", style: { height: 3 } })
|
|
7760
|
-
]
|
|
7761
|
-
}
|
|
7762
|
-
)
|
|
7611
|
+
) : null
|
|
7763
7612
|
] }),
|
|
7764
7613
|
bridgeRoot
|
|
7765
7614
|
) : null;
|
|
7766
7615
|
}
|
|
7767
7616
|
export {
|
|
7768
|
-
DragHandle,
|
|
7769
7617
|
LinkEditorPanel,
|
|
7770
7618
|
LinkPopover,
|
|
7771
7619
|
OhhwellsBridge,
|
|
@@ -7776,7 +7624,6 @@ export {
|
|
|
7776
7624
|
buildTarget,
|
|
7777
7625
|
filterAvailablePages,
|
|
7778
7626
|
getEditModeInitialState,
|
|
7779
|
-
isEditSessionActive,
|
|
7780
7627
|
isValidUrl,
|
|
7781
7628
|
parseTarget,
|
|
7782
7629
|
toggleVariants,
|