import { jsx as a, jsxs as s } from "react/jsx-runtime";
import { useState as M, useEffect as de, useCallback as ce, Fragment as Q } from "react";
import "./index.D1n9HtNk.js";
import { aj as ue, ak as me, al as fe, am as pe, an as he, m as ge, ao as be, ap as Y, aq as F, ar as P, ai as $, as as xe } from "./use-page-data.BYLN5MSa.js";
import { i as ve, u as ye } from "./use-editor.CLs27I-R.js";
import { g as Ne } from "./utils.yOXerPkP.js";
import { s as we, u as ee, p as Ce, l as Se, o as qe, q as ze, F as S, r as q, d as A, e as j, h as I, v, y as D, I as Pe, t as Ae, w as K, T as je } from "./field-factory.Dn_89dan.js";
import { a as C } from "./twind.Cg2g8xBZ.js";
import { L as Ie } from "./index.BaGzuqMO.js";
import { b as De } from "./index.svJU_5da.js";
import { o as f } from "./Editor.Dux-10a7.js";
import { e as G } from "./tooltip.C45WcX50.js";
import { o as V } from "./use-editable-text.CnC92Dpg.js";
function He() {
  const g = ve(), { hideModal: y } = ye();
  return /* @__PURE__ */ a(
    we,
    {
      open: !!g,
      onOpenChange: (o) => {
        o || y();
      },
      children: g === "queries" && /* @__PURE__ */ a(Oe, {})
    }
  );
}
function Oe() {
  const [g, y] = M(null), o = ue(), [d, z] = M(o.length === 0), k = ee();
  return /* @__PURE__ */ s(
    Ce,
    {
      "aria-describedby": "Queries management",
      maxWidth: "860px",
      minHeight: "80dvh",
      className: "overflow-y-clip flex flex-col gap-y-2",
      children: [
        /* @__PURE__ */ s(Se, { className: "flex items-center gap-3 pl-0 -ml-3", children: [
          /* @__PURE__ */ a(me, { className: "h-6 w-6 text-upstart-600" }),
          "Manage queries",
          /* @__PURE__ */ s(
            f,
            {
              size: "2",
              disabled: !k.length || d,
              variant: "outline",
              radius: "medium",
              className: C("!ml-auto", d && "!opacity-0"),
              onClick: () => {
                y(null), z(!0);
              },
              children: [
                /* @__PURE__ */ a(Ie, { className: "w-4 h-4" }),
                "Create Query"
              ]
            }
          )
        ] }),
        /* @__PURE__ */ a(qe, { children: "Queries fetch data from your database. Once defined, a query can be referenced throughout your pages to loop through results and display dynamic content using placeholders." }),
        d && /* @__PURE__ */ a(
          Fe,
          {
            query: g,
            onClose: () => z(!1)
          },
          g?.alias ?? "new-query"
        ),
        o.length === 0 && /* @__PURE__ */ a("div", { className: "flex flex-col gap-2 justify-center items-center flex-1 text-center", children: /* @__PURE__ */ s("span", { className: "text-base text-gray-500", children: [
          "You currently have no queries defined.",
          /* @__PURE__ */ a("br", {}),
          "Create a new query to get started."
        ] }) }),
        o.length > 0 && /* @__PURE__ */ a("div", { className: "flex flex-col border border-gray-200 rounded-lg overflow-hidden -mx-1 mt-3 shadow-sm", children: o.map((b) => /* @__PURE__ */ s(
          "div",
          {
            className: "flex items-center justify-between p-4 [&:not(:last-child)]:border-b border-gray-200 ",
            children: [
              /* @__PURE__ */ s("div", { className: "flex flex-col gap-2", children: [
                /* @__PURE__ */ a("div", { className: "font-medium", children: b.label }),
                /* @__PURE__ */ s("div", { className: "flex gap-6 items-center justify-start text-sm  text-gray-500", children: [
                  /* @__PURE__ */ a(G, { content: "Alias", children: /* @__PURE__ */ s("span", { className: "inline-flex gap-1 items-center cursor-help", children: [
                    /* @__PURE__ */ a(fe, { className: "text-upstart-500" }),
                    b.alias
                  ] }) }),
                  /* @__PURE__ */ a(G, { content: "Database", children: /* @__PURE__ */ s("span", { className: "inline-flex gap-1 items-center cursor-help", children: [
                    /* @__PURE__ */ a(pe, { className: "text-upstart-500" }),
                    b.datasourceId
                  ] }) }),
                  /* @__PURE__ */ a(G, { content: "Number of items", children: /* @__PURE__ */ s("span", { className: "inline-flex gap-1 items-center cursor-help", children: [
                    /* @__PURE__ */ a(he, { className: "text-upstart-500" }),
                    b.limit
                  ] }) })
                ] })
              ] }),
              /* @__PURE__ */ a(
                V,
                {
                  size: "2",
                  variant: "soft",
                  color: "violet",
                  onClick: () => {
                    y(b), z(!0);
                  },
                  children: /* @__PURE__ */ a(De, { className: "w-4 h-4" })
                }
              )
            ]
          },
          b.alias
        )) })
      ]
    }
  );
}
function X() {
  return {
    parameters: {
      op: "and",
      fields: []
    },
    sort: [{ field: "$publicationDate", direction: "desc" }],
    limit: 10
  };
}
function Fe({ query: g, onClose: y }) {
  const [o, d] = M(g ?? X()), z = () => {
    d(X());
  }, { upsertQuery: k } = ge(), b = ee(), N = ze(o?.datasourceId), ae = be(), O = N ? Ne(N) : [], te = O.filter((e) => ["$id", "$slug"].includes(e.value) === !1), re = o?.parameters?.fields?.filter((e) => "field" in e) ?? [], p = o?.sort ?? [], L = N ? re.some((e) => N.indexes.some(
    (t) => t.fulltext === !0 && t.fields.includes(e.field)
  )) : !1;
  de(() => {
    !L && p.some((e) => e === "match()") && d((e) => ({
      ...e,
      sort: p.filter((t) => t !== "match()")
    }));
  }, [L, p]);
  const E = (e, t) => {
    d(
      (r) => ({
        ...r,
        [e]: t
      })
    );
  }, le = () => {
    const e = {
      field: "",
      direction: "desc"
    };
    d((t) => ({
      ...t,
      sort: [...p, e]
    }));
  }, se = (e) => {
    d((t) => ({
      ...t,
      sort: p.filter((r, l) => l !== e)
    }));
  }, B = (e, t, r) => {
    d((l) => {
      const n = [...p];
      return t === "field" ? r === "random()" || r === "match()" ? n[e] = r : n[e] = { field: r, direction: "desc" } : t === "direction" && typeof n[e] == "object" && (n[e] = {
        ...n[e],
        direction: r
      }), {
        ...l,
        sort: n
      };
    });
  }, J = (e) => {
    if (!N) return [];
    const t = Z(e), r = [
      { value: "eq", label: "Equals" },
      { value: "ne", label: "Not equals" }
    ], l = [
      { value: "contains", label: "Contains" },
      { value: "notContains", label: "Not contains" },
      { value: "startsWith", label: "Starts with" },
      { value: "notStartsWith", label: "Not starts with" },
      { value: "endsWith", label: "Ends with" },
      { value: "notEndsWith", label: "Not ends with" }
    ], n = [
      { value: "contains", label: "Contains" },
      { value: "notContains", label: "Not contains" },
      { value: "containsAll", label: "Contains all" },
      { value: "containsAny", label: "Contains any" },
      { value: "notContainsAny", label: "Not contains any" }
    ], i = [
      { value: "lt", label: "Less than" },
      { value: "lte", label: "Less than or equal" },
      { value: "gt", label: "Greater than" },
      { value: "gte", label: "Greater than or equal" }
    ], u = [
      { value: "before", label: "Before Date" },
      { value: "after", label: "After Date" },
      { value: "beforeNow", label: "Before Now" },
      { value: "afterNow", label: "After Now" }
    ];
    switch (t) {
      case "array":
        return n;
      case "string":
        return [...r, ...l];
      case "number":
      case "integer":
        return [...r, ...i];
      case "boolean":
        return [{ value: "eq", label: "Equals" }];
      case "date":
      case "datetime":
        return [...u, r[0]];
      default:
        return [...r, ...l, ...i, ...u];
    }
  }, T = (e, t) => {
    d((r) => {
      if (!r.parameters) return r;
      const l = JSON.parse(JSON.stringify(r.parameters));
      let n = l;
      for (let i = 0; i < e.length; i++)
        n = n.fields[e[i]];
      return n.fields = t(n.fields), {
        ...r,
        parameters: l
      };
    });
  }, W = (e = []) => {
    const t = {
      field: "",
      op: "eq",
      value: ""
    };
    e.length === 0 ? d((r) => ({
      ...r,
      parameters: {
        op: r.parameters?.op || "and",
        fields: [...r.parameters?.fields || [], t]
      }
    })) : T(e, (r) => [...r, t]);
  }, _ = (e = [], t = "and") => {
    const r = {
      op: t,
      fields: [
        // Add a default empty parameter to the new group
        {
          field: "",
          op: "eq",
          value: ""
        }
      ]
    };
    e.length === 0 ? d((l) => ({
      ...l,
      parameters: {
        op: l.parameters?.op || "and",
        fields: [...l.parameters?.fields || [], r]
      }
    })) : T(e, (l) => [...l, r]);
  }, R = (e) => {
    if (e.length === 1)
      d((t) => ({
        ...t,
        parameters: {
          op: t.parameters?.op || "and",
          fields: t.parameters?.fields.filter((r, l) => l !== e[0]) || []
        }
      }));
    else {
      const t = e.slice(0, -1), r = e[e.length - 1];
      T(t, (l) => l.filter((n, i) => i !== r));
    }
  }, w = (e, t, r) => {
    d((l) => {
      if (!l.parameters) return l;
      const n = JSON.parse(JSON.stringify(l.parameters));
      let i = n;
      for (let c = 0; c < e.length - 1; c++)
        i = i.fields[e[c]];
      const u = e[e.length - 1], h = i.fields[u];
      if (t === "field") {
        const c = r ? J(r)[0]?.value ?? "eq" : "eq";
        i.fields[u] = { field: r, op: c, value: "" };
      } else t === "op" ? i.fields[u] = {
        ...h,
        op: r,
        value: h.value
      } : i.fields[u] = { ...h, [t]: r };
      return {
        ...l,
        parameters: n
      };
    });
  }, H = (e) => {
    d((t) => {
      if (!t.parameters) return t;
      if (e.length === 0)
        return {
          ...t,
          parameters: {
            ...t.parameters,
            op: t.parameters.op === "and" ? "or" : "and"
          }
        };
      const r = JSON.parse(JSON.stringify(t.parameters));
      let l = r;
      for (let n = 0; n < e.length; n++)
        l = l.fields[e[n]];
      return l.op = l.op === "and" ? "or" : "and", {
        ...t,
        parameters: r
      };
    });
  }, Z = (e) => {
    if (!N) return "string";
    const t = N.schema?.items?.properties?.[e];
    return t?.type === "string" && t.format === "date" ? "date" : t?.type === "string" && t.format === "date-time" ? "datetime" : t?.type ?? "string";
  }, ie = ce(
    (e) => {
      e.preventDefault(), e.stopPropagation(), console.log("Submitting query:", o);
      try {
        const t = Y(F, o);
        k(t), y?.();
      } catch (t) {
        console.error("Query validation failed:", t);
      }
    },
    [o]
  );
  function ne(e, t) {
    try {
      return Y(e, t), !0;
    } catch {
      return !1;
    }
  }
  const U = ({
    group: e,
    path: t,
    depth: r = 0
  }) => {
    const l = t.length === 0, i = r < 3 - 1;
    return /* @__PURE__ */ s(
      "div",
      {
        className: C(
          "flex flex-col gap-2 rounded-lg",
          !l && "border border-gray-300 bg-white p-3 shadow-sm"
        ),
        children: [
          !l && /* @__PURE__ */ a("div", { className: "flex items-center justify-end -mb-1", children: /* @__PURE__ */ a(
            V,
            {
              size: "1",
              type: "button",
              variant: "ghost",
              className: "hover:(bg-red-100 text-red-800)",
              onClick: () => R(t),
              children: /* @__PURE__ */ a($, { size: 14 })
            }
          ) }),
          /* @__PURE__ */ a("div", { className: "flex flex-col gap-3", children: e.fields.map((u, h) => {
            const c = [...t, h];
            if ("field" in u) {
              const x = u;
              return /* @__PURE__ */ s(Q, { children: [
                /* @__PURE__ */ s("div", { className: "flex gap-x-3 gap-y-0.5 items-center", children: [
                  /* @__PURE__ */ a("div", { className: "w-[200px] flex items-center gap-3 pr-1", children: /* @__PURE__ */ s(
                    A,
                    {
                      value: x.field,
                      onValueChange: (m) => w(c, "field", m),
                      children: [
                        /* @__PURE__ */ a(
                          j,
                          {
                            className: "!w-full",
                            radius: "medium",
                            variant: "surface",
                            placeholder: "Select a field"
                          }
                        ),
                        /* @__PURE__ */ a(I, { position: "popper", children: /* @__PURE__ */ a(D, { children: O.map((m) => /* @__PURE__ */ a(v, { value: m.value, children: m.title }, m.value)) }) })
                      ]
                    }
                  ) }),
                  /* @__PURE__ */ a("div", { className: C("flex gap-2 items-center w-[120px]", !x.field && "hidden"), children: /* @__PURE__ */ s(
                    A,
                    {
                      value: x.op,
                      size: "2",
                      onValueChange: (m) => w(c, "op", m),
                      disabled: !x.field,
                      children: [
                        /* @__PURE__ */ a(
                          j,
                          {
                            radius: "medium",
                            variant: "ghost",
                            placeholder: "Select operator",
                            className: "!flex-1 !mr-1"
                          }
                        ),
                        /* @__PURE__ */ a(I, { position: "popper", children: /* @__PURE__ */ a(D, { children: J(x.field).map((m) => /* @__PURE__ */ a(v, { value: m.value, children: m.label }, m.value)) }) })
                      ]
                    },
                    `operator-${c.join("-")}-${x.field}`
                  ) }),
                  oe(x, c),
                  /* @__PURE__ */ a(
                    V,
                    {
                      size: "1",
                      type: "button",
                      variant: "ghost",
                      className: "hover:(bg-red-100 text-red-800) !shrink-0 !ml-auto",
                      onClick: () => R(c),
                      children: /* @__PURE__ */ a($, { size: 14 })
                    }
                  )
                ] }),
                h < e.fields.length - 1 && /* @__PURE__ */ a("div", { className: "flex items-center justify-center border-t border-dotted mx-auto w-2/3 border-gray-200 my-3 relative z-10", children: /* @__PURE__ */ a(
                  f,
                  {
                    type: "button",
                    size: "1",
                    variant: "soft",
                    className: "!-top-3 !absolute z-20 !opacity-100 !text-xs",
                    onClick: () => H(t),
                    children: e.op === "and" ? "And" : "Or"
                  }
                ) })
              ] }, h);
            } else
              return /* @__PURE__ */ s(Q, { children: [
                /* @__PURE__ */ a(U, { group: u, path: c, depth: r + 1 }),
                h < e.fields.length - 1 && /* @__PURE__ */ a("div", { className: "flex items-center justify-center border-t border-dotted mx-auto w-2/3 border-gray-200 my-3 relative z-10", children: /* @__PURE__ */ a(
                  f,
                  {
                    type: "button",
                    size: "1",
                    variant: "soft",
                    radius: "large",
                    className: "!-top-3 !absolute z-20 !opacity-100 !text-xs",
                    onClick: () => H(t),
                    children: e.op === "and" ? "And" : "Or"
                  }
                ) })
              ] }, h);
          }) }),
          r > 0 && /* @__PURE__ */ s("div", { className: "flex gap-2 mt-2 pt-2 border-t border-gray-200 justify-end items-center", children: [
            /* @__PURE__ */ s(f, { type: "button", radius: "full", variant: "surface", size: "1", onClick: () => W(t), children: [
              /* @__PURE__ */ a(P, { className: "w-3 h-3" }),
              "Add parameter"
            ] }),
            i && /* @__PURE__ */ s(
              f,
              {
                type: "button",
                radius: "full",
                variant: "soft",
                size: "1",
                onClick: () => _(t, e.op === "and" ? "or" : "and"),
                children: [
                  /* @__PURE__ */ a(P, { className: "w-3 h-3" }),
                  "Add group"
                ]
              }
            )
          ] })
        ]
      }
    );
  }, oe = (e, t) => {
    const r = Z(e.field);
    return r === "date" || r === "datetime" ? e.op === "before" || e.op === "after" || e.op === "eq" ? /* @__PURE__ */ a("div", { className: C("grow flex justify-end", !e.field && "hidden"), children: /* @__PURE__ */ a(
      q,
      {
        size: "2",
        type: r === "datetime" ? "datetime-local" : "date",
        value: String(e.value || ""),
        onChange: (l) => w(t, "value", l.target.value),
        disabled: !e.field,
        className: "!w-full"
      }
    ) }) : null : /* @__PURE__ */ a("div", { className: C("grow flex justify-end", !e.field && "hidden"), children: r === "number" || r === "integer" ? /* @__PURE__ */ a(
      q,
      {
        type: "number",
        size: "2",
        value: String(e.value || ""),
        onChange: (l) => w(t, "value", Number(l.target.value)),
        placeholder: "Value",
        min: "1",
        disabled: !e.field,
        className: "!w-full"
      }
    ) : r === "boolean" ? /* @__PURE__ */ s(
      Ae,
      {
        size: "1",
        value: String(e.value || "true"),
        onValueChange: (l) => w(t, "value", l === "true"),
        className: C("!mt-0.5 [&_.rt-SegmentedControlItemLabel]:(px-3)"),
        children: [
          /* @__PURE__ */ a(K, { value: "true", children: "True" }),
          /* @__PURE__ */ a(K, { value: "false", children: "False" })
        ]
      }
    ) : r === "array" ? /* @__PURE__ */ a(
      je,
      {
        options: ae.map((l) => ({
          value: l,
          label: l
        })),
        initialValue: Array.isArray(e.value) ? e.value : [],
        isMulti: !0,
        onChange: (l) => w(t, "value", l ?? []),
        className: "!w-full min-w-fit max-w-full",
        placeholder: "Add parameters (e.g. Slug, Id)"
      }
    ) : /* @__PURE__ */ a(
      q,
      {
        disabled: !e.field,
        value: String(e.value || ""),
        onChange: xe((l) => w(t, "value", l.target.value), 400),
        placeholder: "Value",
        size: "2",
        className: "!w-full max-w-full"
      }
    ) });
  };
  return /* @__PURE__ */ s(
    "form",
    {
      onSubmit: ie,
      className: "text-sm border border-gray-300 bg-gray-50 p-4 rounded-lg -mx-1 mt-3 shadow-sm",
      children: [
        /* @__PURE__ */ s("h3", { className: "font-bold text-[110%] mb-5", children: [
          g ? "Edit query" : "Create a new query",
          ":",
          " ",
          /* @__PURE__ */ a("span", { className: "text-gray-500", children: o?.label })
        ] }),
        /* @__PURE__ */ s("div", { className: "flex flex-col text-sm flex-1 -mx-2.5 divide-y divide-gray-200", children: [
          /* @__PURE__ */ s("div", { className: "flex justify-between gap-4 flex-1 items-center p-3", children: [
            /* @__PURE__ */ s("div", { className: "flex flex-col gap-2 flex-1", children: [
              /* @__PURE__ */ a(
                S,
                {
                  withIcon: !0,
                  className: "font-medium",
                  title: "Label",
                  description: "Label displayed in the Editor"
                }
              ),
              /* @__PURE__ */ a(
                q,
                {
                  onInput: (e) => E("label", e.currentTarget.value),
                  defaultValue: o?.label,
                  maxLength: F.properties.label.maxLength,
                  "aria-required": !0,
                  placeholder: "Ex: Latest blog posts"
                }
              )
            ] }),
            /* @__PURE__ */ s("div", { className: "flex flex-col gap-2 flex-1", children: [
              /* @__PURE__ */ a(
                S,
                {
                  withIcon: !0,
                  className: "font-medium",
                  title: "Alias",
                  description: "Unique identifier to reference this query"
                }
              ),
              /* @__PURE__ */ a(
                q,
                {
                  onInput: (e) => E("alias", e.currentTarget.value),
                  pattern: "^[a-zA-Z_][a-zA-Z0-9_]*$",
                  defaultValue: o?.alias,
                  maxLength: F.properties.alias.maxLength,
                  "aria-required": !0,
                  placeholder: "Ex: latestBlogPosts"
                }
              )
            ] }),
            /* @__PURE__ */ s("div", { className: "flex flex-col gap-2 flex-1", children: [
              /* @__PURE__ */ a(S, { withIcon: !0, className: "font-medium", title: "Database", description: "Database to query" }),
              /* @__PURE__ */ s(
                A,
                {
                  "aria-required": !0,
                  defaultValue: o?.datasourceId,
                  size: "2",
                  onValueChange: (e) => d(
                    (t) => ({
                      ...t ?? {},
                      datasourceId: e,
                      parameters: {
                        op: "and",
                        fields: []
                      }
                    })
                  ),
                  children: [
                    /* @__PURE__ */ a(
                      j,
                      {
                        radius: "medium",
                        variant: "surface",
                        placeholder: "Select a database",
                        className: "!max-w-2/3 !mr-[1px]"
                      }
                    ),
                    /* @__PURE__ */ a(I, { position: "popper", children: b.map((e) => /* @__PURE__ */ a(v, { value: e.id, children: e.label }, e.id)) })
                  ]
                }
              )
            ] })
          ] }),
          O.length > 0 && /* @__PURE__ */ s("div", { className: "flex flex-col gap-2 flex-1 justify-between p-3", children: [
            /* @__PURE__ */ s("div", { className: "flex flex-1 w-full justify-between items-center", children: [
              /* @__PURE__ */ a(
                S,
                {
                  withIcon: !0,
                  title: "Parameters",
                  className: "font-medium",
                  description: "Add parameters to narrow down your query"
                }
              ),
              /* @__PURE__ */ s("div", { className: "flex gap-2 justify-end items-center", children: [
                /* @__PURE__ */ s(f, { type: "button", radius: "full", variant: "surface", size: "1", onClick: () => W(), children: [
                  /* @__PURE__ */ a(P, { className: "w-3 h-3" }),
                  "Add parameter"
                ] }),
                /* @__PURE__ */ s(
                  f,
                  {
                    type: "button",
                    radius: "full",
                    variant: "soft",
                    size: "1",
                    onClick: () => _(),
                    children: [
                      /* @__PURE__ */ a(P, { className: "w-3 h-3" }),
                      "Add group"
                    ]
                  }
                )
              ] })
            ] }),
            o?.parameters && /* @__PURE__ */ a(U, { group: o.parameters, path: [] })
          ] }),
          o?.datasourceId && /* @__PURE__ */ s("div", { className: "flex flex-col gap-2 flex-1 justify-between p-3", children: [
            /* @__PURE__ */ s("div", { className: "flex flex-1 w-full justify-between items-center", children: [
              /* @__PURE__ */ a(
                S,
                {
                  withIcon: !0,
                  title: "Sort results by",
                  className: "font-medium",
                  description: "Add sort criteria to order your query results"
                }
              ),
              /* @__PURE__ */ s(f, { type: "button", radius: "full", variant: "soft", size: "1", onClick: le, children: [
                /* @__PURE__ */ a(P, { className: "w-3 h-3" }),
                "Add sort"
              ] })
            ] }),
            p.length > 0 && /* @__PURE__ */ a("div", { className: "flex flex-col gap-3", children: p.map((e, t) => {
              const r = e === "random()" || e === "match()", l = typeof e == "object" ? e.field : e, n = typeof e == "object" ? e.direction : "desc";
              return /* @__PURE__ */ s(Q, { children: [
                /* @__PURE__ */ s("div", { className: "flex gap-x-3 gap-y-0.5 items-center", children: [
                  /* @__PURE__ */ a("div", { className: "w-[200px] flex items-center gap-3 pr-1", children: /* @__PURE__ */ s(
                    A,
                    {
                      defaultValue: l,
                      onValueChange: (i) => B(t, "field", i),
                      children: [
                        /* @__PURE__ */ a(
                          j,
                          {
                            className: "!w-full",
                            radius: "medium",
                            variant: "surface",
                            placeholder: "Select a field"
                          }
                        ),
                        /* @__PURE__ */ s(I, { position: "popper", children: [
                          /* @__PURE__ */ a(D, { children: te.map((i) => /* @__PURE__ */ a(v, { value: i.value, children: i.title }, i.value)) }),
                          /* @__PURE__ */ a(Pe, {}),
                          /* @__PURE__ */ s(D, { children: [
                            /* @__PURE__ */ a(v, { value: "random()", children: "Random" }),
                            L && /* @__PURE__ */ a(v, { value: "match()", children: "Match (Full-text search)" })
                          ] })
                        ] })
                      ]
                    }
                  ) }),
                  /* @__PURE__ */ a("div", { className: C("flex gap-2 items-center w-[120px]", r && "hidden"), children: /* @__PURE__ */ s(
                    A,
                    {
                      defaultValue: n,
                      size: "2",
                      onValueChange: (i) => B(t, "direction", i),
                      disabled: r,
                      children: [
                        /* @__PURE__ */ a(
                          j,
                          {
                            radius: "medium",
                            variant: "ghost",
                            placeholder: "Select direction",
                            className: "!flex-1 !mr-1"
                          }
                        ),
                        /* @__PURE__ */ a(I, { position: "popper", children: /* @__PURE__ */ s(D, { children: [
                          /* @__PURE__ */ a(v, { value: "asc", children: "Ascending" }),
                          /* @__PURE__ */ a(v, { value: "desc", children: "Descending" })
                        ] }) })
                      ]
                    },
                    `direction-${t}-${l}`
                  ) }),
                  /* @__PURE__ */ a("div", { className: "grow" }),
                  /* @__PURE__ */ a(
                    V,
                    {
                      size: "1",
                      type: "button",
                      variant: "ghost",
                      className: "hover:(bg-red-100 text-red-800) !shrink-0 !ml-auto",
                      onClick: () => se(t),
                      children: /* @__PURE__ */ a($, { size: 14 })
                    }
                  )
                ] }),
                t < p.length - 1 && /* @__PURE__ */ a("div", { className: "border-t border-dotted mx-auto w-2/3 border-gray-200 my-2 relative", children: /* @__PURE__ */ a("span", { className: "absolute left-1/2 -translate-x-1/2 -top-3 bg-gray-50 rounded-full px-2 py-1 inline-block text-xs text-gray-500", children: "Then by" }) })
              ] }, t);
            }) })
          ] }),
          o?.datasourceId && O.length > 0 && /* @__PURE__ */ a("div", { className: "flex flex-1 gap-6 justify-between items-center p-3", children: /* @__PURE__ */ s("div", { className: "flex flex-col flex-1 gap-2", children: [
            /* @__PURE__ */ a(
              S,
              {
                className: "font-medium",
                title: "Max number of items to fetch",
                containerClassName: "!basis-0"
              }
            ),
            /* @__PURE__ */ a(
              q,
              {
                type: "number",
                defaultValue: o?.limit?.toString() ?? "10",
                onChange: (e) => E("limit", parseInt(e.target.value) || 10),
                min: "1",
                max: "30",
                className: "!w-[40px]"
              }
            )
          ] }) })
        ] }),
        /* @__PURE__ */ s("div", { className: "flex justify-end gap-2 mt-10", children: [
          /* @__PURE__ */ a(
            f,
            {
              type: "button",
              size: "2",
              color: "gray",
              variant: "soft",
              onClick: () => {
                z(), y?.();
              },
              children: "Cancel"
            }
          ),
          /* @__PURE__ */ a(f, { disabled: !ne(F, o), type: "submit", size: "2", children: "Save query" })
        ] })
      ]
    }
  );
}
export {
  He as default
};
