import { j as jsxRuntimeExports } from "./jsx-runtime.CXYVdt5g.js";
import { a$ as GenIcon, bD as HiMiniHashtag, bE as HiMiniAtSymbol, bF as VscSymbolArray, bG as VscSymbolBoolean, bH as VscSymbolString, ap as usePageQueries, bI as useLoopAlias, bJ as RiBracesLine, k as useDraftHelpers } from "./use-editor.CurXdZnZ.js";
import * as React from "react";
import { createContext, useContext, useRef, Suspense, lazy } from "react";
import { a as useControllableState, c as createContextScope, u as useComposedRefs, P as Primitive, b as composeEventHandlers, g as createSlot, S as Slot$1, y } from "./index.bXWE_wTx.js";
import { a as tx, c as css } from "./twind.B1qQmF_s.js";
import { p as p$1 } from "./text.Kef1FAw8.js";
import { o as o$1, s as s$1, c as o$2, v as v$1, b as r$2, t as t$1 } from "./radius.prop.BtpSO2zx.js";
import { a as s$2, b as p$2, n as n$1, e } from "./base-button.DGf1UrDq.js";
import { h as hideOthers, R as ReactRemoveScroll, u as useFocusGuards, F as FocusScope, a as a$2 } from "./icons.D0p_Z6wR.js";
import { c as createPopperScope, a as Root2$1, u as useId, A as Anchor, P as Presence, b as Portal$1, D as DismissableLayer, C as Content, d as Arrow, R } from "./theme.0GtWn8C6.js";
import { u as useDebounceCallback } from "./index.Cwl5DAaT.js";
var POPOVER_NAME = "Popover";
var [createPopoverContext, createPopoverScope] = createContextScope(POPOVER_NAME, [
  createPopperScope
]);
var usePopperScope = createPopperScope();
var [PopoverProvider, usePopoverContext] = createPopoverContext(POPOVER_NAME);
var Popover = (props) => {
  const {
    __scopePopover,
    children,
    open: openProp,
    defaultOpen,
    onOpenChange,
    modal = false
  } = props;
  const popperScope = usePopperScope(__scopePopover);
  const triggerRef = React.useRef(null);
  const [hasCustomAnchor, setHasCustomAnchor] = React.useState(false);
  const [open, setOpen] = useControllableState({
    prop: openProp,
    defaultProp: defaultOpen ?? false,
    onChange: onOpenChange,
    caller: POPOVER_NAME
  });
  return /* @__PURE__ */ jsxRuntimeExports.jsx(Root2$1, { ...popperScope, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
    PopoverProvider,
    {
      scope: __scopePopover,
      contentId: useId(),
      triggerRef,
      open,
      onOpenChange: setOpen,
      onOpenToggle: React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen]),
      hasCustomAnchor,
      onCustomAnchorAdd: React.useCallback(() => setHasCustomAnchor(true), []),
      onCustomAnchorRemove: React.useCallback(() => setHasCustomAnchor(false), []),
      modal,
      children
    }
  ) });
};
Popover.displayName = POPOVER_NAME;
var ANCHOR_NAME = "PopoverAnchor";
var PopoverAnchor = React.forwardRef(
  (props, forwardedRef) => {
    const { __scopePopover, ...anchorProps } = props;
    const context = usePopoverContext(ANCHOR_NAME, __scopePopover);
    const popperScope = usePopperScope(__scopePopover);
    const { onCustomAnchorAdd, onCustomAnchorRemove } = context;
    React.useEffect(() => {
      onCustomAnchorAdd();
      return () => onCustomAnchorRemove();
    }, [onCustomAnchorAdd, onCustomAnchorRemove]);
    return /* @__PURE__ */ jsxRuntimeExports.jsx(Anchor, { ...popperScope, ...anchorProps, ref: forwardedRef });
  }
);
PopoverAnchor.displayName = ANCHOR_NAME;
var TRIGGER_NAME = "PopoverTrigger";
var PopoverTrigger = React.forwardRef(
  (props, forwardedRef) => {
    const { __scopePopover, ...triggerProps } = props;
    const context = usePopoverContext(TRIGGER_NAME, __scopePopover);
    const popperScope = usePopperScope(__scopePopover);
    const composedTriggerRef = useComposedRefs(forwardedRef, context.triggerRef);
    const trigger = /* @__PURE__ */ jsxRuntimeExports.jsx(
      Primitive.button,
      {
        type: "button",
        "aria-haspopup": "dialog",
        "aria-expanded": context.open,
        "aria-controls": context.contentId,
        "data-state": getState(context.open),
        ...triggerProps,
        ref: composedTriggerRef,
        onClick: composeEventHandlers(props.onClick, context.onOpenToggle)
      }
    );
    return context.hasCustomAnchor ? trigger : /* @__PURE__ */ jsxRuntimeExports.jsx(Anchor, { asChild: true, ...popperScope, children: trigger });
  }
);
PopoverTrigger.displayName = TRIGGER_NAME;
var PORTAL_NAME = "PopoverPortal";
var [PortalProvider, usePortalContext] = createPopoverContext(PORTAL_NAME, {
  forceMount: void 0
});
var PopoverPortal = (props) => {
  const { __scopePopover, forceMount, children, container } = props;
  const context = usePopoverContext(PORTAL_NAME, __scopePopover);
  return /* @__PURE__ */ jsxRuntimeExports.jsx(PortalProvider, { scope: __scopePopover, forceMount, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Presence, { present: forceMount || context.open, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Portal$1, { asChild: true, container, children }) }) });
};
PopoverPortal.displayName = PORTAL_NAME;
var CONTENT_NAME = "PopoverContent";
var PopoverContent = React.forwardRef(
  (props, forwardedRef) => {
    const portalContext = usePortalContext(CONTENT_NAME, props.__scopePopover);
    const { forceMount = portalContext.forceMount, ...contentProps } = props;
    const context = usePopoverContext(CONTENT_NAME, props.__scopePopover);
    return /* @__PURE__ */ jsxRuntimeExports.jsx(Presence, { present: forceMount || context.open, children: context.modal ? /* @__PURE__ */ jsxRuntimeExports.jsx(PopoverContentModal, { ...contentProps, ref: forwardedRef }) : /* @__PURE__ */ jsxRuntimeExports.jsx(PopoverContentNonModal, { ...contentProps, ref: forwardedRef }) });
  }
);
PopoverContent.displayName = CONTENT_NAME;
var Slot = createSlot("PopoverContent.RemoveScroll");
var PopoverContentModal = React.forwardRef(
  (props, forwardedRef) => {
    const context = usePopoverContext(CONTENT_NAME, props.__scopePopover);
    const contentRef = React.useRef(null);
    const composedRefs = useComposedRefs(forwardedRef, contentRef);
    const isRightClickOutsideRef = React.useRef(false);
    React.useEffect(() => {
      const content = contentRef.current;
      if (content) return hideOthers(content);
    }, []);
    return /* @__PURE__ */ jsxRuntimeExports.jsx(ReactRemoveScroll, { as: Slot, allowPinchZoom: true, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
      PopoverContentImpl,
      {
        ...props,
        ref: composedRefs,
        trapFocus: context.open,
        disableOutsidePointerEvents: true,
        onCloseAutoFocus: composeEventHandlers(props.onCloseAutoFocus, (event) => {
          event.preventDefault();
          if (!isRightClickOutsideRef.current) context.triggerRef.current?.focus();
        }),
        onPointerDownOutside: composeEventHandlers(
          props.onPointerDownOutside,
          (event) => {
            const originalEvent = event.detail.originalEvent;
            const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true;
            const isRightClick = originalEvent.button === 2 || ctrlLeftClick;
            isRightClickOutsideRef.current = isRightClick;
          },
          { checkForDefaultPrevented: false }
        ),
        onFocusOutside: composeEventHandlers(
          props.onFocusOutside,
          (event) => event.preventDefault(),
          { checkForDefaultPrevented: false }
        )
      }
    ) });
  }
);
var PopoverContentNonModal = React.forwardRef(
  (props, forwardedRef) => {
    const context = usePopoverContext(CONTENT_NAME, props.__scopePopover);
    const hasInteractedOutsideRef = React.useRef(false);
    const hasPointerDownOutsideRef = React.useRef(false);
    return /* @__PURE__ */ jsxRuntimeExports.jsx(
      PopoverContentImpl,
      {
        ...props,
        ref: forwardedRef,
        trapFocus: false,
        disableOutsidePointerEvents: false,
        onCloseAutoFocus: (event) => {
          props.onCloseAutoFocus?.(event);
          if (!event.defaultPrevented) {
            if (!hasInteractedOutsideRef.current) context.triggerRef.current?.focus();
            event.preventDefault();
          }
          hasInteractedOutsideRef.current = false;
          hasPointerDownOutsideRef.current = false;
        },
        onInteractOutside: (event) => {
          props.onInteractOutside?.(event);
          if (!event.defaultPrevented) {
            hasInteractedOutsideRef.current = true;
            if (event.detail.originalEvent.type === "pointerdown") {
              hasPointerDownOutsideRef.current = true;
            }
          }
          const target = event.target;
          const targetIsTrigger = context.triggerRef.current?.contains(target);
          if (targetIsTrigger) event.preventDefault();
          if (event.detail.originalEvent.type === "focusin" && hasPointerDownOutsideRef.current) {
            event.preventDefault();
          }
        }
      }
    );
  }
);
var PopoverContentImpl = React.forwardRef(
  (props, forwardedRef) => {
    const {
      __scopePopover,
      trapFocus,
      onOpenAutoFocus,
      onCloseAutoFocus,
      disableOutsidePointerEvents,
      onEscapeKeyDown,
      onPointerDownOutside,
      onFocusOutside,
      onInteractOutside,
      ...contentProps
    } = props;
    const context = usePopoverContext(CONTENT_NAME, __scopePopover);
    const popperScope = usePopperScope(__scopePopover);
    useFocusGuards();
    return /* @__PURE__ */ jsxRuntimeExports.jsx(
      FocusScope,
      {
        asChild: true,
        loop: true,
        trapped: trapFocus,
        onMountAutoFocus: onOpenAutoFocus,
        onUnmountAutoFocus: onCloseAutoFocus,
        children: /* @__PURE__ */ jsxRuntimeExports.jsx(
          DismissableLayer,
          {
            asChild: true,
            disableOutsidePointerEvents,
            onInteractOutside,
            onEscapeKeyDown,
            onPointerDownOutside,
            onFocusOutside,
            onDismiss: () => context.onOpenChange(false),
            children: /* @__PURE__ */ jsxRuntimeExports.jsx(
              Content,
              {
                "data-state": getState(context.open),
                role: "dialog",
                id: context.contentId,
                ...popperScope,
                ...contentProps,
                ref: forwardedRef,
                style: {
                  ...contentProps.style,
                  // re-namespace exposed content custom properties
                  ...{
                    "--radix-popover-content-transform-origin": "var(--radix-popper-transform-origin)",
                    "--radix-popover-content-available-width": "var(--radix-popper-available-width)",
                    "--radix-popover-content-available-height": "var(--radix-popper-available-height)",
                    "--radix-popover-trigger-width": "var(--radix-popper-anchor-width)",
                    "--radix-popover-trigger-height": "var(--radix-popper-anchor-height)"
                  }
                }
              }
            )
          }
        )
      }
    );
  }
);
var CLOSE_NAME = "PopoverClose";
var PopoverClose = React.forwardRef(
  (props, forwardedRef) => {
    const { __scopePopover, ...closeProps } = props;
    const context = usePopoverContext(CLOSE_NAME, __scopePopover);
    return /* @__PURE__ */ jsxRuntimeExports.jsx(
      Primitive.button,
      {
        type: "button",
        ...closeProps,
        ref: forwardedRef,
        onClick: composeEventHandlers(props.onClick, () => context.onOpenChange(false))
      }
    );
  }
);
PopoverClose.displayName = CLOSE_NAME;
var ARROW_NAME = "PopoverArrow";
var PopoverArrow = React.forwardRef(
  (props, forwardedRef) => {
    const { __scopePopover, ...arrowProps } = props;
    const popperScope = usePopperScope(__scopePopover);
    return /* @__PURE__ */ jsxRuntimeExports.jsx(Arrow, { ...popperScope, ...arrowProps, ref: forwardedRef });
  }
);
PopoverArrow.displayName = ARROW_NAME;
function getState(open) {
  return open ? "open" : "closed";
}
var Root2 = Popover;
var Anchor2 = PopoverAnchor;
var Trigger = PopoverTrigger;
var Portal = PopoverPortal;
var Content2 = PopoverContent;
var Close = PopoverClose;
const t = ["1", "2", "3"], r$1 = ["soft", "surface", "outline"], a$1 = { ...o$2, size: { type: "enum", className: "rt-r-size", values: t, default: "2", responsive: true }, variant: { type: "enum", className: "rt-variant", values: r$1, default: "soft" }, ...s$1, ...o$1 };
const a = React.createContext({}), n = React.forwardRef((t2, l) => {
  const { size: e2 = a$1.size.default } = t2, { asChild: r2, children: C, className: i2, color: c, ...f } = v$1(t2, a$1, r$2), P2 = r2 ? Slot$1 : "div";
  return React.createElement(P2, { "data-accent-color": c, ...f, className: y("rt-CalloutRoot", i2), ref: l }, React.createElement(a.Provider, { value: React.useMemo(() => ({ size: e2 }), [e2]) }, C));
});
n.displayName = "Callout.Root";
const m$1 = React.forwardRef(({ className: t2, ...l }, e2) => React.createElement("div", { ...l, className: y("rt-CalloutIcon", t2), ref: e2 }));
m$1.displayName = "Callout.Icon";
const u = React.forwardRef(({ className: t2, ...l }, e2) => {
  const { size: r2 } = React.useContext(a);
  return React.createElement(p$1, { as: "p", size: s$2(r2, p$2), ...l, asChild: false, ref: e2, className: y("rt-CalloutText", t2) });
});
u.displayName = "Callout.Text";
const o = React.forwardRef(({ className: e2, ...n2 }, r2) => React.createElement(n$1, { ...n2, ref: r2, className: y("rt-IconButton", e2) }));
o.displayName = "IconButton";
const p = ["1", "2", "3", "4"], r = { ...o$2, size: { type: "enum", className: "rt-r-size", values: p, default: "2", responsive: true }, width: t$1.width, minWidth: t$1.minWidth, maxWidth: { ...t$1.maxWidth, default: "480px" }, ...e };
const P = (e2) => React.createElement(Root2, { ...e2 });
P.displayName = "Popover.Root";
const s = React.forwardRef(({ children: e2, ...r2 }, t2) => React.createElement(Trigger, { ...r2, ref: t2, asChild: true }, a$2(e2)));
s.displayName = "Popover.Trigger";
const i = React.forwardRef((e2, r$12) => {
  const { className: t2, forceMount: a2, container: f, ...l } = v$1(e2, r);
  return React.createElement(Portal, { container: f, forceMount: a2 }, React.createElement(R, { asChild: true }, React.createElement(Content2, { align: "start", sideOffset: 8, collisionPadding: 10, ...l, ref: r$12, className: y("rt-PopperContent", "rt-PopoverContent", t2) })));
});
i.displayName = "Popover.Content";
const v = React.forwardRef(({ children: e2, ...r2 }, t2) => React.createElement(Close, { ...r2, ref: t2, asChild: true }, a$2(e2)));
v.displayName = "Popover.Close";
const m = React.forwardRef(({ children: e2, ...r2 }, t2) => React.createElement(Anchor2, { ...r2, ref: t2 }));
m.displayName = "Popover.Anchor";
function getEditorNodeFromField(field) {
  return [
    {
      type: "mention",
      attrs: { "data-id": field, label: field }
    },
    {
      type: "text",
      text: ` `
    }
  ];
}
function insertInEditor(editor, content) {
  console.log("Inserting content %s", content);
  editor.chain().insertContent(content, {
    parseOptions: {
      preserveWhitespace: "full"
    }
  }).run();
}
function CiCalendarDate(props) {
  return GenIcon({ "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "g", "attr": { "id": "Calendar_Date" }, "child": [{ "tag": "path", "attr": { "d": "M18.435,4.955h-1.94v-1.41c0-0.26-0.23-0.51-0.5-0.5c-0.27,0.01-0.5,0.22-0.5,0.5v1.41h-7v-1.41\n            c0-0.26-0.23-0.51-0.5-0.5c-0.27,0.01-0.5,0.22-0.5,0.5v1.41h-1.93c-1.38,0-2.5,1.12-2.5,2.5v11c0,1.38,1.12,2.5,2.5,2.5h12.87\n            c1.38,0,2.5-1.12,2.5-2.5v-11C20.935,6.075,19.815,4.955,18.435,4.955z M19.935,18.455c0,0.83-0.67,1.5-1.5,1.5H5.565\n            c-0.83,0-1.5-0.67-1.5-1.5v-8.42h15.87V18.455z M19.935,9.035H4.065v-1.58c0-0.83,0.67-1.5,1.5-1.5h1.93v0.59\n            c0,0.26,0.23,0.51,0.5,0.5c0.27-0.01,0.5-0.22,0.5-0.5v-0.59h7v0.59c0,0.26,0.23,0.51,0.5,0.5c0.27-0.01,0.5-0.22,0.5-0.5v-0.59\n            h1.94c0.83,0,1.5,0.67,1.5,1.5V9.035z" }, "child": [] }, { "tag": "path", "attr": { "d": "M11.492,17.173v-3.46c0-0.059-0.064-0.095-0.114-0.064l-0.638,0.392\n            c-0.1,0.061-0.228-0.01-0.228-0.128v-0.651c0-0.105,0.055-0.203,0.146-0.257l0.764-0.457c0.047-0.028,0.1-0.043,0.154-0.043h0.626\n            c0.166,0,0.3,0.134,0.3,0.3v4.367c0,0.166-0.134,0.3-0.3,0.3h-0.409C11.626,17.473,11.492,17.339,11.492,17.173z" }, "child": [] }] }] })(props);
}
function GoNumber(props) {
  return GenIcon({ "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "M13.003 7.754a.75.75 0 0 1 .75-.75h5.232a.75.75 0 0 1 .53 1.28l-2.776 2.777c.55.097 1.057.253 1.492.483.905.477 1.504 1.284 1.504 2.418 0 .966-.471 1.75-1.172 2.27-.687.511-1.587.77-2.521.77-1.367 0-2.274-.528-2.667-.756a.75.75 0 0 1 .755-1.297c.331.193.953.553 1.912.553.673 0 1.243-.188 1.627-.473.37-.275.566-.635.566-1.067 0-.5-.219-.836-.703-1.091-.538-.284-1.375-.443-2.471-.443a.75.75 0 0 1-.53-1.28l2.643-2.644h-3.421a.75.75 0 0 1-.75-.75ZM7.88 15.215a1.4 1.4 0 0 0-1.446.83.75.75 0 0 1-1.37-.61 2.899 2.899 0 0 1 2.986-1.71c.589.06 1.139.323 1.557.743.434.446.685 1.058.685 1.778 0 1.641-1.254 2.437-2.12 2.986-.538.341-1.18.694-1.495 1.273H9.75a.75.75 0 0 1 0 1.5h-4a.75.75 0 0 1-.75-.75c0-1.799 1.337-2.63 2.243-3.21 1.032-.659 1.55-1.031 1.55-1.8 0-.355-.116-.584-.26-.732a1.071 1.071 0 0 0-.652-.298Zm.234-13.121a.75.75 0 0 1 .386.656V9h1.252a.75.75 0 0 1 0 1.5H5.75a.75.75 0 0 1 0-1.5H7V4.103l-.853.533a.749.749 0 1 1-.795-1.272l2-1.25a.749.749 0 0 1 .762-.02Z" }, "child": [] }] })(props);
}
function GoRelFilePath(props) {
  return GenIcon({ "attr": { "viewBox": "0 0 24 24" }, "child": [{ "tag": "path", "attr": { "d": "M19.564 4.42a.75.75 0 0 0-1.378-.59l-6.75 15.75a.75.75 0 0 0 1.378.59l6.75-15.75ZM7 18.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0Z" }, "child": [] }] })(props);
}
const NestingContext = createContext(0);
const ChoiceContext = createContext({
  onFieldSelect: () => {
  }
});
const typesIconsMap = {
  string: /* @__PURE__ */ jsxRuntimeExports.jsx(VscSymbolString, { className: "text-upstart-600" }),
  number: /* @__PURE__ */ jsxRuntimeExports.jsx(GoNumber, { className: "text-upstart-600" }),
  boolean: /* @__PURE__ */ jsxRuntimeExports.jsx(VscSymbolBoolean, { className: "text-upstart-600" }),
  array: /* @__PURE__ */ jsxRuntimeExports.jsx(VscSymbolArray, { className: "text-upstart-600" }),
  "date-time": /* @__PURE__ */ jsxRuntimeExports.jsx(CiCalendarDate, { className: "text-upstart-600" }),
  date: /* @__PURE__ */ jsxRuntimeExports.jsx(CiCalendarDate, { className: "text-upstart-600" }),
  email: /* @__PURE__ */ jsxRuntimeExports.jsx(HiMiniAtSymbol, { className: "text-upstart-600" }),
  slug: /* @__PURE__ */ jsxRuntimeExports.jsx(GoRelFilePath, { className: "text-upstart-600" }),
  nanoid: /* @__PURE__ */ jsxRuntimeExports.jsx(HiMiniHashtag, { className: "text-upstart-600" })
};
function SchemaEntry({ schema, prefix }) {
  const nestingLevel = useContext(NestingContext);
  const { onFieldSelect } = useContext(ChoiceContext);
  return /* @__PURE__ */ jsxRuntimeExports.jsx(NestingContext.Provider, { value: nestingLevel + 1, children: /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { id: `${schema.name}_level-${nestingLevel}`, className: "mb-1", children: schema.type === "object" ? /* @__PURE__ */ jsxRuntimeExports.jsx(SchemaObject, { schema, prefix }) : /* @__PURE__ */ jsxRuntimeExports.jsxs("li", { className: "flex items-center gap-0.5 w-full shrink-0 flex-nowrap", children: [
    /* @__PURE__ */ jsxRuntimeExports.jsx(p$1, { size: "3", children: typesIconsMap[schema.format] || typesIconsMap[schema.type] || /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-gray-500", children: "?" }) }),
    /* @__PURE__ */ jsxRuntimeExports.jsx(
      p$1,
      {
        size: "2",
        onClick: () => onFieldSelect(`${prefix}.${schema.name}`),
        className: "hover:bg-upstart-50 cursor-pointer px-1 py-0.5 rounded text-nowrap",
        children: schema.title
      }
    ),
    /* @__PURE__ */ jsxRuntimeExports.jsxs(p$1, { color: "gray", size: "1", className: "text-nowrap", children: [
      "— ",
      prefix,
      ".",
      schema.name
    ] })
  ] }) }) });
}
function SchemaObject({
  schema: { name, required, properties },
  prefix
}) {
  if (properties)
    return /* @__PURE__ */ jsxRuntimeExports.jsxs("ul", { className: "list-disc", children: [
      /* @__PURE__ */ jsxRuntimeExports.jsx("li", { className: tx({ hidden: !name }), children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: name }) }),
      Object.entries(properties).sort(([p1], [p2]) => p1.localeCompare(p2)).map(([name2, value], i2) => /* @__PURE__ */ jsxRuntimeExports.jsx(
        SchemaEntry,
        {
          schema: { ...value, name: name2, optional: required && !required.includes(name2) },
          prefix
        },
        `${name2}-${i2}`
      ))
    ] });
  return null;
}
function JSONSchemaView({
  schema,
  prefix,
  onFieldSelect
}) {
  return /* @__PURE__ */ jsxRuntimeExports.jsx(ChoiceContext.Provider, { value: { onFieldSelect }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(NestingContext.Provider, { value: 0, children: /* @__PURE__ */ jsxRuntimeExports.jsx(SchemaEntry, { schema: schema.items, prefix }) }) });
}
function DatasourceFieldPickerModal({
  brickId,
  onlyAlias,
  onFieldSelect
}) {
  const pageQueries = usePageQueries();
  if (!pageQueries.length) {
    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "bg-white min-w-52 min-h-80 flex flex-col gap-4", children: "No database selected in the dynamic parent brick." });
  }
  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "bg-white flex flex-col gap-3", children: [
    /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-base font-medium", children: "Insert fields from your queries" }),
    /* @__PURE__ */ jsxRuntimeExports.jsx(n, { className: "-mx-4 !py-2 !px-3 !rounded-none", children: /* @__PURE__ */ jsxRuntimeExports.jsx(u, { size: "1", className: tx("text-pretty"), children: "Click on a field to insert it into the text box. Fields are inserted as dynamic placeholders, which will be replaced with their actual values when the document is rendered." }) }),
    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col gap-1 pb-2 max-h-[300px] overflow-y-auto scrollbar-thin", children: pageQueries.filter((q) => q.alias === onlyAlias || !onlyAlias && q.queryInfo.limit === 1).map((query) => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col gap-1", children: [
      /* @__PURE__ */ jsxRuntimeExports.jsxs("h4", { className: "text-sm font-semibold", children: [
        query.alias,
        " - ",
        query.queryInfo?.label
      ] }),
      /* @__PURE__ */ jsxRuntimeExports.jsx(
        JSONSchemaView,
        {
          prefix: query.alias,
          schema: query.datasource.schema,
          onFieldSelect
        },
        query.alias
      )
    ] }, query.alias)) })
  ] });
}
function DatasourceItemButton({
  editor,
  brickId,
  children,
  onFieldClick
}) {
  const queryAlias = useLoopAlias(brickId);
  const onFieldSelect = (field) => {
    onFieldClick?.(field);
    if (!editor) {
      return;
    }
    const content = getEditorNodeFromField(field);
    insertInEditor(editor, content);
  };
  return /* @__PURE__ */ jsxRuntimeExports.jsxs(P, { children: [
    /* @__PURE__ */ jsxRuntimeExports.jsx(s, { children }),
    /* @__PURE__ */ jsxRuntimeExports.jsx(i, { minWidth: "260px", side: "top", align: "start", size: "2", maxHeight: "70dvh", sideOffset: 10, children: /* @__PURE__ */ jsxRuntimeExports.jsx(DatasourceFieldPickerModal, { onFieldSelect, brickId, onlyAlias: queryAlias }) })
  ] });
}
const TextEditor = lazy(() => import("./TextEditor.CBE9ulnq.js"));
function useTextEditorUpdateHandler(brickId, propPath, dynamic = false, enabled = true) {
  const helpers = useDraftHelpers();
  if (!enabled) {
    return;
  }
  return (e2) => {
    console.log("Updating text editor props", brickId, propPath);
    if (dynamic) {
      helpers.updateBrickProps(brickId, {
        [propPath]: e2.editor.getText()
      });
    } else {
      helpers.updateBrickProps(brickId, { [propPath]: e2.editor.getHTML() });
    }
  };
}
function useDynamicTextEditor({
  currentValue,
  brickId,
  schema,
  onChange,
  placeholder
}) {
  const textEditorRef = useRef(null);
  const onChangeDebounced = useDebounceCallback(onChange, 300);
  return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
    /* @__PURE__ */ jsxRuntimeExports.jsx(
      "div",
      {
        className: tx(
          "rounded border border-gray-300 px-2 py-[4px] text-sm flex-grow max-w-[calc(100%-34px)] bg-white",
          css({
            "&:has([contenteditable='true']:focus)": {
              outline: "1px solid var(--violet-8)",
              borderColor: "var(--violet-8)"
            }
          })
        ),
        children: /* @__PURE__ */ jsxRuntimeExports.jsx(Suspense, { fallback: null, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
          TextEditor,
          {
            content: currentValue,
            brickId,
            ref: textEditorRef,
            className: tx(
              css({ lineHeight: "1.5" }),
              schema["ui:multiline"] && `scrollbar-thin ${schema["ui:textarea-class"] ?? "min-h-24"}`
            ),
            placeholder: schema["ui:placeholder"] ?? placeholder,
            spellCheck: !!schema["ui:spellcheck"],
            singleline: true,
            noMenuBar: true,
            dynamic: true,
            onChange: (e2) => {
              onChangeDebounced(e2.editor.getText());
            }
          }
        ) })
      }
    ),
    /* @__PURE__ */ jsxRuntimeExports.jsx(
      DatasourceItemButton,
      {
        brickId,
        onFieldClick: (field) => {
          if (textEditorRef.current?.editor) {
            insertInEditor(textEditorRef.current.editor, getEditorNodeFromField(field));
          }
        },
        children: /* @__PURE__ */ jsxRuntimeExports.jsx(o, { variant: "surface", radius: "large", className: "!w-[31px] !h-[31px]", children: /* @__PURE__ */ jsxRuntimeExports.jsx(RiBracesLine, { className: "w-4 h-4" }) })
      }
    )
  ] });
}
export {
  DatasourceItemButton as D,
  P,
  useDynamicTextEditor as a,
  useTextEditorUpdateHandler as b,
  i,
  n,
  o,
  s,
  u
};
//# sourceMappingURL=use-editable-text.OTrzFCxA.js.map
