import { j as t } from "./jsx-runtime-Sp0orL4X.js";
import m, { Suspense as p } from "react";
import { B as c, S as n, ac as x } from "./context-menu-9cWJcKdh.js";
import { d, F as h, e as o, f } from "./index-ry3B_D93.js";
import { useTranslation as l } from "react-i18next";
import { c as u } from "./iconBase-zweRWSz0.js";
import { EyeOpenIcon as v } from "@radix-ui/react-icons";
import "@radix-ui/react-switch";
import "@radix-ui/react-accordion";
import "class-variance-authority";
import "@radix-ui/react-alert-dialog";
import "@radix-ui/react-slot";
import "@radix-ui/react-label";
import "@radix-ui/react-scroll-area";
import "@radix-ui/react-tabs";
import "@radix-ui/react-tooltip";
import "@radix-ui/react-popover";
import "@radix-ui/react-hover-card";
import "@radix-ui/react-select";
import "@radix-ui/react-dropdown-menu";
import "@radix-ui/react-separator";
import "@radix-ui/react-toast";
import "cmdk";
import "@radix-ui/react-dialog";
import "@radix-ui/react-context-menu";
import "clsx";
import "tailwind-merge";
import "lodash-es";
import "jotai";
import "@chaibuilder/runtime";
import "./plugin-sJ3Hzvpv.js";
import "@react-hookz/web";
import "tree-model";
import "react-quill";
import "./STRINGS-TDN5UhWi.js";
import "flagged";
import "react-hotkeys-hook";
import "@floating-ui/dom";
import "@floating-ui/react-dom";
import "react-event-hook";
import "@tailwindcss/typography";
import "@tailwindcss/forms";
import "@tailwindcss/aspect-ratio";
import "tailwindcss-palette-generator";
import "react-wrap-balancer";
import "react-dom";
import "prop-types";
import "react-error-boundary";
import "re-resizable";
import "lucide-react";
import "@rjsf/validator-ajv8";
import "@rjsf/core";
import "react-arborist";
import "himalaya";
import "react-icons-picker";
import "react-autosuggest";
import "fuse.js";
import "i18next";
import "framer-motion";
const j = () => {
  const { savePage: a, saveState: e } = d(), { t: s } = l(), i = /* @__PURE__ */ t.jsxs(
    c,
    {
      disabled: e === "SAVING",
      onClick: (r) => {
        r.preventDefault(), a();
      },
      className: u(
        "flex h-auto w-fit items-center gap-x-2 p-1 px-2",
        // UNSAVED sate
        "bg-gray-200 text-gray-500 hover:bg-gray-100 dark:bg-gray-800 dark:text-gray-400",
        {
          "animate-pulse bg-gray-300 text-gray-900": e === "SAVING",
          "bg-green-500 text-white hover:bg-green-600 hover:text-white dark:bg-green-600 dark:text-white": e === "SAVED"
        }
      ),
      size: "sm",
      variant: "outline",
      children: [
        /* @__PURE__ */ t.jsx(h, { className: "text-sm text-white" }),
        /* @__PURE__ */ t.jsx("span", { className: "text-sm", children: s(e === "SAVING" ? "saving" : e === "SAVED" ? "saved" : "unsaved") })
      ]
    }
  );
  return /* @__PURE__ */ t.jsx("div", { className: "flex items-center", children: i });
}, g = function() {
  const e = o("previewComponent"), [, s] = f(), { t: i } = l();
  return e ? /* @__PURE__ */ t.jsxs(
    c,
    {
      onClick: (r) => {
        r.preventDefault(), s(!0);
      },
      className: "flex h-auto w-fit items-center gap-x-2 p-1 px-2",
      size: "sm",
      variant: "outline",
      children: [
        /* @__PURE__ */ t.jsx(v, { className: "text-xs" }),
        /* @__PURE__ */ t.jsx("span", { className: "text-sm", children: i("preview") })
      ]
    }
  ) : null;
}, St = () => {
  const a = o("topBarComponents.left", []), e = o("topBarComponents.center", []), s = o("topBarComponents.right", []), i = o("editable", !0);
  return /* @__PURE__ */ t.jsxs("div", { className: "flex h-14 items-center justify-between px-2", children: [
    /* @__PURE__ */ t.jsx("div", { className: "flex items-center space-x-2", children: /* @__PURE__ */ t.jsx("div", { className: "flex items-center space-x-2 font-bold", children: m.Children.toArray(
      a.map((r) => /* @__PURE__ */ t.jsx(p, { fallback: /* @__PURE__ */ t.jsx(n, { className: "h-10" }), children: /* @__PURE__ */ t.jsx(r, {}) }))
    ) }) }),
    /* @__PURE__ */ t.jsx("div", { className: "flex items-center space-x-2", children: m.Children.toArray(
      e.map((r) => /* @__PURE__ */ t.jsx(p, { fallback: /* @__PURE__ */ t.jsx(n, { className: "h-10" }), children: /* @__PURE__ */ t.jsx(r, {}) }))
    ) }),
    /* @__PURE__ */ t.jsxs("div", { className: "flex items-center space-x-1", children: [
      /* @__PURE__ */ t.jsx(g, {}),
      /* @__PURE__ */ t.jsx(x, { orientation: "vertical" }),
      i ? /* @__PURE__ */ t.jsx(j, {}) : null,
      m.Children.toArray(
        s.map((r) => /* @__PURE__ */ t.jsx(p, { fallback: /* @__PURE__ */ t.jsx(n, { className: "h-10" }), children: /* @__PURE__ */ t.jsx(r, {}) }))
      )
    ] })
  ] });
};
export {
  St as default
};
