import { j as jsxRuntimeExports } from "./jsx-runtime.CXYVdt5g.js";
import { useState, useCallback, Fragment } from "react";
import "./index.bXWE_wTx.js";
import { J as useModal, c as useEditorHelpers, aF as useSiteQueries, aG as BsDatabaseDown, aH as BsDatabase, aI as PiListNumbersLight, aJ as BsCrosshair, k as useDraftHelpers, aK as validate, aE as querySchema, aL as TbPlus, aM as debounce, av as RxCross2, at as nanoid } from "./use-editor.CurXdZnZ.js";
import "@sinclair/typebox";
import { g as getDatasourceIndexedFieldsWithTitles } from "./datasources.B4KHvcBE.js";
import { s, u as useDatasources, p, k as g, l as m, n as useDatasource, F as FieldTitle, o as u, a as C, d as u$1, e as g$1, v, y, q as p$1, r as l, T as TagsInput, I } from "./field-factory.SuSTYkHn.js";
import { a as tx } from "./twind.B1qQmF_s.js";
import { L as LuPlus } from "./index.zfYqeaft.js";
import { b as FiEdit } from "./index.BAV_Yptn.js";
import { o } from "./Editor.C1P5MYi_.js";
import { e } from "./tooltip.Bizf56xz.js";
import { o as o$1 } from "./use-editable-text.OTrzFCxA.js";
function Modal() {
  const modal = useModal();
  const { hideModal } = useEditorHelpers();
  return /* @__PURE__ */ jsxRuntimeExports.jsx(
    s,
    {
      open: !!modal,
      onOpenChange: (open) => {
        if (!open) {
          hideModal();
        }
      },
      children: modal === "queries" && /* @__PURE__ */ jsxRuntimeExports.jsx(ModalQueries, {})
    }
  );
}
function ModalQueries() {
  const [showCreationForm, setShowCreationForm] = useState(false);
  const [editingQuery, setEditingQuery] = useState(null);
  const editorHelpers = useEditorHelpers();
  const queries = useSiteQueries();
  const datasources = useDatasources();
  const { hideModal } = useEditorHelpers();
  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
    p,
    {
      "aria-describedby": "Queries managament",
      maxWidth: "760px",
      minHeight: "80dvh",
      className: "overflow-y-clip flex flex-col gap-y-2",
      children: [
        /* @__PURE__ */ jsxRuntimeExports.jsxs(g, { className: "flex items-center gap-3 pl-0 -ml-3", children: [
          /* @__PURE__ */ jsxRuntimeExports.jsx(BsDatabaseDown, { className: "h-6 w-6 text-upstart-600" }),
          "Manage site queries",
          /* @__PURE__ */ jsxRuntimeExports.jsxs(
            o,
            {
              size: "2",
              disabled: !datasources.length || showCreationForm,
              variant: "outline",
              radius: "medium",
              className: tx("!ml-auto", showCreationForm && "!opacity-0"),
              onClick: () => {
                setEditingQuery(null);
                setShowCreationForm(true);
              },
              children: [
                /* @__PURE__ */ jsxRuntimeExports.jsx(LuPlus, { className: "w-4 h-4" }),
                "Create Query"
              ]
            }
          )
        ] }),
        /* @__PURE__ */ jsxRuntimeExports.jsxs(m, { children: [
          "Queries are used to fetch data from your databases. Once defined you can use them in your",
          " ",
          /* @__PURE__ */ jsxRuntimeExports.jsx(
            "button",
            {
              type: "button",
              className: tx("text-upstart-600 hover:underline underline-offset-4"),
              onClick: () => {
                hideModal();
                editorHelpers.setPanel("settings");
              },
              children: "page settings"
            }
          ),
          " ",
          "and reference them to loop over or use their fields in bricks to display dynamic data."
        ] }),
        showCreationForm && /* @__PURE__ */ jsxRuntimeExports.jsx(QueryCreator, { query: editingQuery, onClose: () => setShowCreationForm(false) }),
        !showCreationForm && queries.length === 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col gap-2 justify-center items-center flex-1 text-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-base text-gray-500", children: [
          "You currently have no queries defined.",
          /* @__PURE__ */ jsxRuntimeExports.jsx("br", {}),
          "Create a new query to get started."
        ] }) }),
        queries.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col border border-gray-200 rounded-lg overflow-hidden -mx-1 mt-3 shadow-sm", children: queries.map((query) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
          "div",
          {
            className: "flex items-center justify-between p-4 [&:not(:last-child)]:border-b border-gray-200 ",
            children: [
              /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col gap-2", children: [
                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-medium", children: query.label }),
                /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex gap-6 items-center justify-start text-sm  text-gray-500", children: [
                  /* @__PURE__ */ jsxRuntimeExports.jsx(e, { content: `Database`, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "inline-flex gap-1 items-center cursor-help", children: [
                    /* @__PURE__ */ jsxRuntimeExports.jsx(BsDatabase, { className: "text-upstart-500" }),
                    query.datasourceId
                  ] }) }),
                  /* @__PURE__ */ jsxRuntimeExports.jsx(e, { content: `Number of items`, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "inline-flex gap-1 items-center cursor-help", children: [
                    /* @__PURE__ */ jsxRuntimeExports.jsx(PiListNumbersLight, { className: "text-upstart-500" }),
                    query.limit
                  ] }) }),
                  (query.parameters?.length ?? 0) > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(e, { content: `Parameters`, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "inline-flex gap-1 items-center cursor-help", children: [
                    /* @__PURE__ */ jsxRuntimeExports.jsx(BsCrosshair, { className: "text-upstart-500" }),
                    query.parameters.join(", ")
                  ] }) })
                ] })
              ] }),
              /* @__PURE__ */ jsxRuntimeExports.jsx(
                o$1,
                {
                  size: "2",
                  variant: "soft",
                  color: "violet",
                  onClick: () => {
                    setEditingQuery(query);
                    setShowCreationForm(true);
                  },
                  children: /* @__PURE__ */ jsxRuntimeExports.jsx(FiEdit, { className: "w-4 h-4" })
                }
              )
            ]
          },
          query.id
        )) })
      ]
    }
  );
}
function getQueryTemplate() {
  return {
    id: nanoid(7),
    filters: {
      op: "and",
      fields: []
    },
    sortField: "$publicationDate",
    sortDirection: "desc",
    limit: 10
  };
}
function QueryCreator({ query: initialQuery, onClose }) {
  const [query, setQuery] = useState(initialQuery ?? getQueryTemplate());
  const reset = () => {
    setQuery(getQueryTemplate());
  };
  const { upsertQuery } = useDraftHelpers();
  const datasources = useDatasources();
  const datasource = useDatasource(query?.datasourceId);
  const indexedFields = datasource ? getDatasourceIndexedFieldsWithTitles(datasource) : [];
  const sortableFields = indexedFields.filter((field) => ["$id", "$slug"].includes(field.value) === false);
  const filters = query?.filters?.fields?.filter((f) => "field" in f) ?? [];
  const handleChange = (key, value) => {
    setQuery(
      (prev) => ({
        ...prev,
        sortDirection: key === "sortField" && value === "random()" ? null : prev?.sortDirection,
        [key]: value
      })
    );
  };
  const getOperatorOptionsForField = (fieldName) => {
    if (!datasource) return [];
    const fieldType = getFieldType(fieldName);
    const baseOperators = [
      { value: "eq", label: "Equals" },
      { value: "ne", label: "Not equals" }
    ];
    const stringOperators = [
      { 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" }
    ];
    const arrayOperators = [
      { 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" }
    ];
    const numberOperators = [
      { value: "lt", label: "Less than" },
      { value: "lte", label: "Less than or equal" },
      { value: "gt", label: "Greater than" },
      { value: "gte", label: "Greater than or equal" }
    ];
    const dateOperators = [
      { value: "before", label: "Before Date" },
      { value: "after", label: "After Date" },
      { value: "beforeNow", label: "Before Now" },
      { value: "afterNow", label: "After Now" }
    ];
    switch (fieldType) {
      case "array":
        return arrayOperators;
      case "string":
        return [...baseOperators, ...stringOperators];
      case "number":
      case "integer":
        return [...baseOperators, ...numberOperators];
      case "boolean":
        return [{ value: "eq", label: "Equals" }];
      case "date":
      case "datetime":
        return [...dateOperators, baseOperators[0]];
      default:
        return [...baseOperators, ...stringOperators, ...numberOperators, ...dateOperators];
    }
  };
  const addFilter = () => {
    const newFilter = {
      field: "",
      op: "eq",
      value: ""
    };
    setQuery((prev) => {
      const currentFilters = prev?.filters?.fields?.filter((f) => "field" in f) ?? [];
      return {
        ...prev,
        filters: {
          op: "and",
          fields: [...currentFilters, newFilter]
        }
      };
    });
  };
  const removeFilter = (index) => {
    setQuery((prev) => {
      const currentFilters = prev?.filters?.fields?.filter((f) => "field" in f) ?? [];
      const newFilters = currentFilters.filter((_, i) => i !== index);
      return {
        ...prev,
        filters: {
          op: "and",
          fields: newFilters
        }
      };
    });
  };
  const updateFilter = (index, key, value) => {
    setQuery((prev) => {
      const currentFilters = [...prev?.filters?.fields?.filter((f) => "field" in f) ?? []];
      const currentFilter = { ...currentFilters[index] };
      if (key === "field") {
        const op = value ? getOperatorOptionsForField(value)[0]?.value ?? "eq" : "eq";
        currentFilters[index] = { field: value, op, value: "" };
      } else if (key === "op") {
        currentFilters[index] = { ...currentFilter, op: value, value: "" };
      } else {
        currentFilters[index] = { ...currentFilter, [key]: value };
      }
      console.log("Updated filters:", currentFilters);
      return {
        ...prev,
        filters: {
          op: "and",
          fields: currentFilters
        }
      };
    });
  };
  const getFieldType = (fieldName) => {
    if (!datasource) return "string";
    const property = datasource.schema?.items?.properties?.[fieldName];
    if (property?.type === "string" && property.format === "date") return "date";
    if (property?.type === "string" && property.format === "date-time") return "datetime";
    return property?.type ?? "string";
  };
  const handleSubmit = useCallback(
    (e2) => {
      e2.preventDefault();
      e2.stopPropagation();
      console.log("Submitting query:", query);
      try {
        validate(querySchema, query);
        upsertQuery(query);
        onClose?.();
      } catch (error) {
        console.error("Query validation failed:", error);
      }
    },
    [query]
  );
  function validateQuery(querySchema2, query2) {
    try {
      validate(querySchema2, query2);
      return true;
    } catch (error) {
      return false;
    }
  }
  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
    "form",
    {
      onSubmit: handleSubmit,
      className: "text-sm border border-gray-300 bg-gray-50 p-4 rounded-lg -mx-1 mt-3 shadow-sm",
      children: [
        /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "font-bold text-base mb-3", children: initialQuery ? "Edit query" : "Create a new query" }),
        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col text-sm gap-4 flex-1 -mx-2.5 divide-y divide-gray-200", children: [
          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex justify-between gap-4 flex-1 items-center py-0.5 px-2.5", children: [
            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col gap-1 flex-1", children: [
              /* @__PURE__ */ jsxRuntimeExports.jsx(
                FieldTitle,
                {
                  withIcon: true,
                  className: "font-medium",
                  title: "Label",
                  description: "Label displayed in the Editor"
                }
              ),
              /* @__PURE__ */ jsxRuntimeExports.jsx(
                u,
                {
                  onInput: (e2) => handleChange("label", e2.currentTarget.value),
                  defaultValue: query?.label,
                  maxLength: querySchema.properties.label.maxLength,
                  "aria-required": true,
                  placeholder: "Ex: Latest blog posts"
                }
              )
            ] }),
            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col gap-1 flex-1", children: [
              /* @__PURE__ */ jsxRuntimeExports.jsx(FieldTitle, { withIcon: true, className: "font-medium", title: "Database", description: "Database to query" }),
              /* @__PURE__ */ jsxRuntimeExports.jsxs(
                C,
                {
                  "aria-required": true,
                  defaultValue: query?.datasourceId,
                  size: "2",
                  onValueChange: (value) => setQuery(
                    (prev) => ({
                      ...prev ?? {},
                      datasourceId: value,
                      filters: {
                        op: "and",
                        fields: []
                      }
                    })
                  ),
                  children: [
                    /* @__PURE__ */ jsxRuntimeExports.jsx(
                      u$1,
                      {
                        radius: "medium",
                        variant: "surface",
                        placeholder: "Select a database",
                        className: "!max-w-2/3 !mr-[1px]"
                      }
                    ),
                    /* @__PURE__ */ jsxRuntimeExports.jsx(g$1, { position: "popper", children: datasources.map((ds) => /* @__PURE__ */ jsxRuntimeExports.jsx(v, { value: ds.id, children: ds.label }, ds.id)) })
                  ]
                }
              )
            ] })
          ] }),
          indexedFields.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col gap-2 flex-1 justify-between pt-3 px-2.5", children: [
            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-1 w-full justify-between items-center", children: [
              /* @__PURE__ */ jsxRuntimeExports.jsx(
                FieldTitle,
                {
                  withIcon: true,
                  title: "Filters",
                  className: "font-medium",
                  description: "Add filters to narrow down your query"
                }
              ),
              /* @__PURE__ */ jsxRuntimeExports.jsxs(o, { type: "button", radius: "full", variant: "solid", size: "1", onClick: addFilter, children: [
                /* @__PURE__ */ jsxRuntimeExports.jsx(TbPlus, { className: "w-3 h-3" }),
                "Add Filter"
              ] })
            ] }),
            filters.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col gap-3 mt-1", children: filters.map((filter, index) => /* @__PURE__ */ jsxRuntimeExports.jsxs(Fragment, { children: [
              /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex gap-x-3 gap-y-0.5 items-center", children: [
                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-[200px] flex items-center gap-3 pr-1", children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
                  C,
                  {
                    defaultValue: filter.field,
                    onValueChange: (value) => updateFilter(index, "field", value),
                    children: [
                      /* @__PURE__ */ jsxRuntimeExports.jsx(
                        u$1,
                        {
                          className: "!w-full",
                          radius: "medium",
                          variant: "surface",
                          placeholder: "Select a field"
                        }
                      ),
                      /* @__PURE__ */ jsxRuntimeExports.jsx(g$1, { position: "popper", children: /* @__PURE__ */ jsxRuntimeExports.jsx(y, { children: indexedFields.map((field) => /* @__PURE__ */ jsxRuntimeExports.jsx(v, { value: field.value, children: field.title }, field.value)) }) })
                    ]
                  }
                ) }),
                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: tx("flex gap-2 items-center w-[120px]", !filter.field && "hidden"), children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
                  C,
                  {
                    defaultValue: filter.op,
                    size: "2",
                    onValueChange: (value) => updateFilter(index, "op", value),
                    disabled: !filter.field,
                    children: [
                      /* @__PURE__ */ jsxRuntimeExports.jsx(
                        u$1,
                        {
                          radius: "medium",
                          variant: "ghost",
                          placeholder: "Select operator",
                          className: "!flex-1 !mr-1"
                        }
                      ),
                      /* @__PURE__ */ jsxRuntimeExports.jsx(g$1, { position: "popper", children: /* @__PURE__ */ jsxRuntimeExports.jsx(y, { children: getOperatorOptionsForField(filter.field).map((option) => /* @__PURE__ */ jsxRuntimeExports.jsx(v, { value: option.value, children: option.label }, option.value)) }) })
                    ]
                  },
                  `operator-${index}-${filter.field}`
                ) }),
                getFieldType(filter.field) === "date" || getFieldType(filter.field) === "datetime" ? (filter.op === "before" || filter.op === "after" || filter.op === "eq") && // Absolute date: span both columns
                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: tx("grow flex justify-end", !filter.field && "hidden"), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
                  u,
                  {
                    size: "2",
                    type: getFieldType(filter.field) === "datetime" ? "datetime-local" : "date",
                    defaultValue: String(filter.value || ""),
                    onChange: (e2) => updateFilter(index, "value", e2.target.value),
                    disabled: !filter.field,
                    className: "!w-full"
                  }
                ) }) : (
                  // Non-date fields: span both columns
                  /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: tx("grow flex justify-end", !filter.field && "hidden"), children: getFieldType(filter.field) === "number" || getFieldType(filter.field) === "integer" ? /* @__PURE__ */ jsxRuntimeExports.jsx(
                    u,
                    {
                      type: "number",
                      size: "2",
                      defaultValue: String(filter.value || ""),
                      onChange: (e2) => updateFilter(index, "value", Number(e2.target.value)),
                      placeholder: "Value",
                      min: "1",
                      disabled: !filter.field,
                      className: "!w-full"
                    }
                  ) : getFieldType(filter.field) === "boolean" ? /* @__PURE__ */ jsxRuntimeExports.jsxs(
                    p$1,
                    {
                      size: "1",
                      defaultValue: String(filter.value || "true"),
                      onValueChange: (value) => updateFilter(index, "value", value === "true"),
                      className: tx("!mt-0.5 [&_.rt-SegmentedControlItemLabel]:(px-3)"),
                      children: [
                        /* @__PURE__ */ jsxRuntimeExports.jsx(l, { value: "true", children: "True" }),
                        /* @__PURE__ */ jsxRuntimeExports.jsx(l, { value: "false", children: "False" })
                      ]
                    }
                  ) : getFieldType(filter.field) === "array" ? /* @__PURE__ */ jsxRuntimeExports.jsx(
                    TagsInput,
                    {
                      initialValue: Array.isArray(filter.value) ? filter.value : [],
                      onChange: (value) => updateFilter(index, "value", value),
                      className: "!w-full",
                      placeholder: "Add tags"
                    }
                  ) : /* @__PURE__ */ jsxRuntimeExports.jsx(
                    u,
                    {
                      disabled: !filter.field,
                      defaultValue: String(filter.value || ""),
                      onChange: debounce((e2) => updateFilter(index, "value", e2.target.value), 400),
                      placeholder: "Value",
                      size: "2",
                      className: "!w-full max-w-full"
                    }
                  ) })
                ),
                /* @__PURE__ */ jsxRuntimeExports.jsx(
                  o$1,
                  {
                    size: "1",
                    type: "button",
                    variant: "ghost",
                    className: "hover:(bg-red-100 text-red-800) !shrink-0 !ml-auto",
                    onClick: () => removeFilter(index),
                    children: /* @__PURE__ */ jsxRuntimeExports.jsx(RxCross2, { size: 14 })
                  }
                )
              ] }),
              index < filters.length - 1 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "border-t border-dotted mx-auto w-2/3 border-gray-200 my-2 relative", children: /* @__PURE__ */ jsxRuntimeExports.jsx("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: "And" }) })
            ] }, index)) })
          ] }),
          indexedFields.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col gap-2 flex-1 justify-between pt-3 px-2.5", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-1 w-full justify-between items-center", children: [
            /* @__PURE__ */ jsxRuntimeExports.jsx(
              FieldTitle,
              {
                title: "Parameters",
                className: "font-medium",
                withIcon: true,
                description: "Optional fields that will be used as parameters when using the query. Only indexed fields can be used as parameters. Usually only one parameter is needed, but you can add multiple parameters if necessary. When specifying parameters, you will need to set a value for each parameter every time you use it."
              }
            ),
            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: "TODO/ IMPLEMENT" })
          ] }) }),
          query?.datasourceId && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-1 gap-6 justify-between items-center pt-2.5 pb-1 px-2.5", children: [
            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col gap-1 flex-1 ", children: [
              /* @__PURE__ */ jsxRuntimeExports.jsx(
                FieldTitle,
                {
                  className: "font-medium",
                  title: "Order by",
                  description: "Select a field to sort the results"
                }
              ),
              /* @__PURE__ */ jsxRuntimeExports.jsxs(
                C,
                {
                  defaultValue: query?.sortField,
                  size: "2",
                  onValueChange: (value) => handleChange("sortField", value),
                  children: [
                    /* @__PURE__ */ jsxRuntimeExports.jsx(
                      u$1,
                      {
                        radius: "medium",
                        variant: "surface",
                        className: "!mr-[1px] !mt-0.5",
                        placeholder: "Select a field"
                      }
                    ),
                    /* @__PURE__ */ jsxRuntimeExports.jsxs(g$1, { position: "popper", children: [
                      /* @__PURE__ */ jsxRuntimeExports.jsx(y, { children: sortableFields.map((field) => /* @__PURE__ */ jsxRuntimeExports.jsx(v, { value: field.value, children: field.title }, field.value)) }),
                      /* @__PURE__ */ jsxRuntimeExports.jsx(I, {}),
                      /* @__PURE__ */ jsxRuntimeExports.jsx(y, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(v, { value: "random()", children: "Random" }) })
                    ] })
                  ]
                }
              )
            ] }),
            /* @__PURE__ */ jsxRuntimeExports.jsxs(
              "div",
              {
                className: tx("flex flex-col gap-1 flex-1", query?.sortField === "random()" && "opacity-40"),
                children: [
                  /* @__PURE__ */ jsxRuntimeExports.jsx(
                    FieldTitle,
                    {
                      className: "font-medium",
                      title: "Direction",
                      description: "Select the direction to sort the results"
                    }
                  ),
                  /* @__PURE__ */ jsxRuntimeExports.jsxs(
                    C,
                    {
                      disabled: query?.sortField === "random()",
                      defaultValue: query?.sortDirection || "asc",
                      size: "2",
                      onValueChange: (value) => handleChange("sortDirection", value),
                      children: [
                        /* @__PURE__ */ jsxRuntimeExports.jsx(
                          u$1,
                          {
                            radius: "medium",
                            variant: "surface",
                            placeholder: "Select direction",
                            className: "!mr-[1px] !mt-0.5"
                          }
                        ),
                        /* @__PURE__ */ jsxRuntimeExports.jsx(g$1, { position: "popper", children: /* @__PURE__ */ jsxRuntimeExports.jsxs(y, { children: [
                          /* @__PURE__ */ jsxRuntimeExports.jsx(v, { value: "asc", children: "Ascending" }),
                          /* @__PURE__ */ jsxRuntimeExports.jsx(v, { value: "desc", children: "Descending" })
                        ] }) })
                      ]
                    }
                  )
                ]
              }
            )
          ] }),
          query?.datasourceId && indexedFields.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-1 gap-6 justify-between items-center pt-2.5 pb-1 px-2.5", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col flex-1 gap-2", children: [
            /* @__PURE__ */ jsxRuntimeExports.jsx(
              FieldTitle,
              {
                className: "font-medium",
                title: "Max number of items to fetch",
                containerClassName: "!basis-0"
              }
            ),
            /* @__PURE__ */ jsxRuntimeExports.jsx(
              u,
              {
                type: "number",
                defaultValue: query?.limit?.toString() ?? "10",
                onChange: (e2) => handleChange("limit", parseInt(e2.target.value) || 10),
                min: "1",
                max: "30",
                className: "!w-[40px]"
              }
            )
          ] }) })
        ] }),
        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex justify-end gap-2 mt-10", children: [
          /* @__PURE__ */ jsxRuntimeExports.jsx(
            o,
            {
              type: "button",
              size: "2",
              color: "gray",
              variant: "soft",
              onClick: () => {
                reset();
                onClose?.();
              },
              children: "Cancel"
            }
          ),
          /* @__PURE__ */ jsxRuntimeExports.jsx(o, { disabled: !validateQuery(querySchema, query), type: "submit", size: "2", children: "Save query" })
        ] })
      ]
    }
  );
}
export {
  Modal as default
};
//# sourceMappingURL=Modal.Bpsv33AW.js.map
