@chaibuilder/sdk 1.2.9 → 1.2.10-7.beta.1

package/dist/Settings-TAgX4hov.js

@@ -1,2186 +0,0 @@
-import { j as e } from "./jsx-runtime-WbnYoNE9.js";
-import * as ne from "react";
-import I, { useState as j, useMemo as _, useEffect as O, useCallback as B, memo as ct, createContext as Me, useContext as se } from "react";
-import { useThrottledCallback as fe } from "@react-hookz/web";
-import { forEach as ke, isArray as ie, omit as pt, truncate as ut, includes as P, get as x, first as ue, split as xt, startCase as Y, toLower as le, isEmpty as m, map as C, find as gt, last as ve, filter as we, set as Oe, keys as ht, cloneDeep as yt, each as bt, capitalize as mt, reject as ft, nth as Ve, startsWith as W, isNumber as vt, parseInt as wt, isNaN as Xe, findLast as jt, flatten as U, intersection as Ye, has as ye, isNull as Ct } from "lodash-es";
-import { useTranslation as K } from "react-i18next";
-import { PlusIcon as Ne, Cross2Icon as Fe, EyeOpenIcon as kt, EyeClosedIcon as He, BorderAllIcon as A, WidthIcon as T, HeightIcon as R, ArrowUpIcon as Q, ArrowRightIcon as ee, ArrowDownIcon as te, ArrowLeftIcon as re, ArrowTopLeftIcon as Nt, ArrowTopRightIcon as _t, ArrowBottomRightIcon as St, ArrowBottomLeftIcon as Tt, AlignLeftIcon as Rt, AlignCenterHorizontallyIcon as Vt, AlignRightIcon as Ht, StretchHorizontallyIcon as Bt, FontItalicIcon as Dt, UnderlineIcon as $t, OverlineIcon as It, LetterCaseUppercaseIcon as At, Cross1Icon as Pt, InfoCircledIcon as _e, MinusIcon as Et, BoxIcon as ze, RowSpacingIcon as Lt, TriangleDownIcon as Mt, CrossCircledIcon as Ot, TrashIcon as Xt, MixerHorizontalIcon as Ze } from "@radix-ui/react-icons";
-import { a$ as Yt, b0 as Ft, B as xe, b1 as zt, b2 as Zt, b3 as Wt, b4 as Ut, b5 as Kt, b6 as qt, b7 as Gt, a7 as q, an as Jt, ao as Qt, ap as er, b8 as tr, al as rr, b9 as lr, am as sr, aD as F, aE as z, aG as Z, ba as or, bb as ar, bc as nr, bd as ir, be as dr, bf as cr, p as We, ad as Ue, i as pr, bg as Ke, bh as de, bi as ce, bj as pe, ak as Se, Q as qe, a4 as Ge, j as Je, aI as Te, bk as ur, bl as xr, a5 as ge, X as gr, aa as Qe, U as Be, ah as hr, ae as yr, bm as br, ar as mr, as as fr, at as vr, au as wr, av as V, bn as et, ax as jr, ay as Cr, az as De, aA as $e } from "./index-niHREMmR.js";
-import { u as kr } from "./controls-XPXGHKht.js";
-import { Check as Nr, EditIcon as _r, TrashIcon as Sr } from "lucide-react";
-import { getBlockComponent as tt, getChaiDataProviders as Tr } from "@chaibuilder/runtime";
-import { E as rt, u as lt } from "./index-pZhGT8uT.js";
-import { J as Rr, a as Vr, d as Hr } from "./index-e0c8PmRQ.js";
-import Br from "@rjsf/core";
-import Dr from "@rjsf/validator-ajv8";
-import { useAtom as $r } from "jotai";
-import Ir from "react-autosuggest";
-import Ar from "fuse.js";
-import { A as Pr, C as he, g as Er } from "./utils-AvyFzbPC.js";
-import { a as Lr } from "./MODIFIERS-RiXS5Mn1.js";
-import "./_commonjsHelpers-UyOWmZb0.js";
-import "@radix-ui/react-toggle";
-import "class-variance-authority";
-import "@radix-ui/react-switch";
-import "@radix-ui/react-slot";
-import "@radix-ui/react-accordion";
-import "@radix-ui/react-alert-dialog";
-import "@radix-ui/react-dialog";
-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-menubar";
-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-context-menu";
-import "react-icons-picker";
-import "react-dom";
-import "react-quill";
-import "flat-to-nested";
-import "./Functions-7jnEwJyw.js";
-import "clsx";
-import "tailwind-merge";
-import "redux-undo";
-import "lodash";
-import "i18next";
-import "@floating-ui/react-dom";
-import "react-textarea-autosize";
-import "flagged";
-import "react-dnd";
-import "@minoru/react-dnd-treeview";
-import "react-hotkeys-hook";
-import "sonner";
-import "./html-to-json-57841sEK.js";
-import "himalaya";
-import "./web-blocks.js";
-function Mr(r) {
-  const s = [], t = {};
-  function o(l, d) {
-    ke(d, (a, c) => {
-      const i = l ? `${l}.${c}` : c, p = ie(a) ? "list" : typeof a;
-      s.push(i), t[i] = p === "string" ? "text" : p === "object" ? "model" : p, p === "object" && !ie(a) && o(i, a);
-    });
-  }
-  return o("", pt(r, ["styles", "_type", "_id", "_name", "_bindings"])), { paths: s, pathsType: t };
-}
-const je = ({ data: r, fullView: s }) => {
-  if (!r)
-    return null;
-  const t = typeof r;
-  return s ? typeof r == "object" ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-    /* @__PURE__ */ e.jsx("div", { className: "h-3" }),
-    /* @__PURE__ */ e.jsx(rt, { children: /* @__PURE__ */ e.jsx(
-      Rr,
-      {
-        data: r,
-        shouldExpandNode: Vr,
-        style: {
-          ...Hr,
-          container: "max-h-[40vh] overflow-y-auto text-[12px] leading-[1.5] tracking-wide font-mono",
-          stringValue: "text-orange-600",
-          label: "text-green-900 font-semibold pr-1 tracking-wider"
-        }
-      }
-    ) })
-  ] }) : /* @__PURE__ */ e.jsxs("div", { className: "max-h-36 w-full overflow-y-auto overflow-x-hidden text-[12px] leading-4 text-gray-800/50", children: [
-    /* @__PURE__ */ e.jsx("span", { className: "font-medium text-gray-800/80", children: "Content: " }),
-    r
-  ] }) : /* @__PURE__ */ e.jsx("div", { className: "w-full overflow-hidden whitespace-nowrap text-[10px] leading-3 text-gray-800/50", children: ut(t === "object" ? JSON.stringify(r) : r, { length: 40 }) });
-}, Ie = ({
-  type: r,
-  value: s = "",
-  setValue: t,
-  data: o,
-  onChange: l,
-  dataType: d,
-  appliedBindings: a
-}) => {
-  const { paths: c, pathsType: i } = Mr(o), p = r === "PROP" ? tt(o == null ? void 0 : o._type) : {}, y = r === "PROP", [n, h] = j(!1), g = _(() => r === "PROP" ? c.filter(
-    (u) => !P(a, u) && x(p, `props.${ue(xt(u, "."))}.binding`)
-  ) : c.filter((u) => d === x(i, u, "")), [r, c, a, d, p]);
-  return O(() => {
-    s && l(s);
-  }, [s, r]), /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-    /* @__PURE__ */ e.jsxs("div", { className: "flex items-center space-x-4", children: [
-      /* @__PURE__ */ e.jsx("p", { className: "text-sm text-muted-foreground", children: Y(le(r)) }),
-      /* @__PURE__ */ e.jsxs(Yt, { open: n, onOpenChange: h, children: [
-        /* @__PURE__ */ e.jsx(Ft, { asChild: !0, children: /* @__PURE__ */ e.jsx(
-          xe,
-          {
-            variant: "outline",
-            size: "sm",
-            className: ` ${m(s) ? "w-44 justify-center bg-blue-500 text-gray-100 hover:bg-blue-400 hover:text-white" : "min-w-[350px] items-center justify-between"}`,
-            children: s ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-              /* @__PURE__ */ e.jsxs("span", { className: "pr-8 text-sm", children: [
-                y && /* @__PURE__ */ e.jsx("span", { className: "mr-2 rounded-full bg-purple-100 px-2 py-0.5 text-[10px] text-purple-500", children: Y(d) }),
-                s
-              ] }),
-              /* @__PURE__ */ e.jsx("span", { className: "cursor-pointer text-[9px] text-blue-400 underline hover:text-blue-700", children: "Change" })
-            ] }) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-              "+ Set ",
-              Y(le(r))
-            ] })
-          }
-        ) }),
-        /* @__PURE__ */ e.jsx(zt, { className: "z-[999] min-w-[300px] p-0", side: "right", align: "start", children: /* @__PURE__ */ e.jsxs(Zt, { children: [
-          /* @__PURE__ */ e.jsx(Wt, { placeholder: `Choose ${le(r)}...` }),
-          /* @__PURE__ */ e.jsxs(Ut, { children: [
-            /* @__PURE__ */ e.jsx(Kt, { children: "No results found." }),
-            /* @__PURE__ */ e.jsx(qt, { children: C(g, (u) => /* @__PURE__ */ e.jsxs(
-              Gt,
-              {
-                value: u,
-                className: `cursor-pointer ${y ? "flex items-center justify-between" : "flex flex-col items-start justify-start"}`,
-                onSelect: (f) => {
-                  t(gt(g, (k) => k === f) || null), h(!1);
-                },
-                children: [
-                  /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-x-2", children: [
-                    /* @__PURE__ */ e.jsx(Nr, { className: `h-4 w-4 text-green-500 ${s === u ? "" : "opacity-0"}` }),
-                    u
-                  ] }),
-                  y ? /* @__PURE__ */ e.jsx("div", { children: /* @__PURE__ */ e.jsx("span", { className: "rounded-full bg-purple-100 px-2 py-0.5 text-[10px] text-purple-500", children: Y(x(i, u, "")) }) }) : /* @__PURE__ */ e.jsx("div", { className: "pl-6", children: /* @__PURE__ */ e.jsx(je, { data: x(o, u) }) })
-                ]
-              },
-              u
-            )) })
-          ] })
-        ] }) })
-      ] })
-    ] }),
-    !y && !m(s) && /* @__PURE__ */ e.jsx("div", { className: "pt-2", children: /* @__PURE__ */ e.jsx(je, { data: x(o, s, ""), fullView: !0 }) })
-  ] });
-}, Or = ({
-  appliedBindings: r = [],
-  onAddBinding: s,
-  editMode: t,
-  item: o
-}) => {
-  const [l, d] = j(t ? o.key : ""), [a, c] = j(t ? o.value : ""), i = q(), [p] = lt(), y = B(
-    (g, u) => {
-      if (m(g))
-        return "";
-      {
-        const f = x(u === "PROP" ? i : p, g, "");
-        if (ie(f))
-          return "list";
-        const k = typeof f;
-        return k === "string" ? "text" : k === "object" ? "model" : k;
-      }
-    },
-    [i, p]
-  ), [n, h] = j(t ? y(o.key, "PROP") : "");
-  return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-    /* @__PURE__ */ e.jsxs(Jt, { children: [
-      /* @__PURE__ */ e.jsx(Qt, { children: "Add Data Binding" }),
-      /* @__PURE__ */ e.jsx(er, { className: "text-xs", children: "Add prop and path of binding. Click save when you're done." })
-    ] }),
-    /* @__PURE__ */ e.jsxs("div", { className: "relative flex flex-col gap-1", children: [
-      /* @__PURE__ */ e.jsx(
-        Ie,
-        {
-          type: "PROP",
-          isDisabled: !1,
-          placeholder: "Enter prop key",
-          value: l,
-          setValue: d,
-          onChange: (g) => {
-            const u = y(g, "PROP");
-            d(g), n !== u && c(""), h(u);
-          },
-          data: i,
-          dataType: n,
-          appliedBindings: r
-        }
-      ),
-      /* @__PURE__ */ e.jsx("div", { className: "h-2" }),
-      /* @__PURE__ */ e.jsx(
-        Ie,
-        {
-          type: "PATH",
-          isDisabled: m(l),
-          placeholder: "Enter data path",
-          value: a,
-          setValue: c,
-          onChange: (g) => {
-            const u = y(g, "PATH");
-            c(n === u ? g : "");
-          },
-          data: p,
-          dataType: n,
-          appliedBindings: r
-        }
-      )
-    ] }),
-    /* @__PURE__ */ e.jsx(tr, { children: /* @__PURE__ */ e.jsx(
-      xe,
-      {
-        type: "submit",
-        className: "mt-4",
-        disabled: m(l) && m(a),
-        onClick: () => s({ key: l, value: a }),
-        children: "Save"
-      }
-    ) })
-  ] });
-}, st = ({ disabled: r, children: s, onAddBinding: t, appliedBindings: o, editMode: l = !0, item: d = {} }) => {
-  const [a, c] = j(!1);
-  return /* @__PURE__ */ e.jsxs(rr, { children: [
-    /* @__PURE__ */ e.jsx(lr, { disabled: r, asChild: !0, onClick: () => c(!0), children: s }),
-    a && /* @__PURE__ */ e.jsx(sr, { children: /* @__PURE__ */ e.jsx(
-      Or,
-      {
-        item: d,
-        editMode: l,
-        appliedBindings: o,
-        onAddBinding: (i) => {
-          t(i), c(!1);
-        }
-      }
-    ) })
-  ] });
-}, Xr = ({
-  item: r,
-  onAddBinding: s,
-  onRemove: t,
-  selectedBlock: o,
-  dataProvider: l,
-  appliedBindings: d
-}) => {
-  const [a, c] = j("string"), i = (p, y) => {
-    if (m(p))
-      return "";
-    {
-      const n = x(y === "PROP" ? o : l, p, "");
-      if (ie(n))
-        return "list";
-      const h = typeof n;
-      return h === "string" ? "text" : h === "object" ? "model" : h;
-    }
-  };
-  return O(() => c(() => i(r.key, "PROP")), [r.key]), /* @__PURE__ */ e.jsxs("div", { className: "relative flex flex-col rounded-md border border-gray-200 p-2", children: [
-    /* @__PURE__ */ e.jsx("div", { className: "text-sm font-normal text-gray-500", children: r.key }),
-    /* @__PURE__ */ e.jsx("div", { className: "font-medium leading-5", children: r.value }),
-    /* @__PURE__ */ e.jsx(je, { data: x(l, r.value, "") }),
-    /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
-      /* @__PURE__ */ e.jsx(st, { editMode: !0, onAddBinding: s, appliedBindings: d, item: r, children: /* @__PURE__ */ e.jsx(_r, { className: "mt-1 h-6 w-6 cursor-pointer rounded border border-blue-400 p-1 text-blue-400 duration-200 hover:scale-105 hover:bg-blue-400 hover:text-white" }) }),
-      /* @__PURE__ */ e.jsx(
-        Sr,
-        {
-          onClick: () => t(),
-          className: "mt-1 h-6 w-6 cursor-pointer rounded border border-red-400 p-1 text-red-400 duration-200 hover:scale-105 hover:bg-red-400 hover:text-white"
-        }
-      )
-    ] }),
-    !m(a) && !m(r.key) && /* @__PURE__ */ e.jsx("div", { className: "absolute right-0 top-1 mt-px flex h-4 items-center rounded-full px-2 text-[10px] font-medium text-purple-600", children: Y(a) })
-  ] });
-}, Yr = ({ bindingData: r, onChange: s }) => {
-  const t = q(), [o] = lt(), l = Tr(), [d, a] = j(
-    C(r, (n, h) => ({ key: h, value: n }))
-  );
-  O(() => {
-    a(C(r, (n, h) => ({ key: h, value: n })));
-  }, [t == null ? void 0 : t._id]);
-  const c = _(() => {
-    if (m(o))
-      return !0;
-    if (m(d))
-      return !1;
-    const n = ve(d);
-    return m(n == null ? void 0 : n.key) || m(n == null ? void 0 : n.value);
-  }, [o, d]), i = (n) => {
-    const h = we(d, (g) => g.key !== n.key);
-    a([...h, n]), y([...h, n]);
-  }, p = (n) => {
-    const h = we(d, (g, u) => n !== u);
-    y([...h]);
-  }, y = B(
-    (n = []) => {
-      if (a(n), m(n)) {
-        s({});
-        return;
-      }
-      const h = {};
-      ke(n, (g) => {
-        !m(g == null ? void 0 : g.key) && !m(g == null ? void 0 : g.value) && Oe(h, g.key, g.value);
-      }), s(h);
-    },
-    [s]
-  );
-  return m(l) ? /* @__PURE__ */ e.jsx("div", { className: "flex w-full items-center justify-center", children: /* @__PURE__ */ e.jsxs("p", { className: "mb-1.5 text-xs text-gray-500", children: [
-    "You have no data providers registered. Please add a data provider to your project. ",
-    /* @__PURE__ */ e.jsx("br", {}),
-    /* @__PURE__ */ e.jsx("a", { className: "text-blue-500", href: "https://chaibuilder.com/docs/registering-data-providers", target: "_blank", children: "Learn more" })
-  ] }) }) : /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
-    C(d, (n, h) => /* @__PURE__ */ e.jsx(
-      Xr,
-      {
-        item: n,
-        onAddBinding: i,
-        onRemove: () => p(h),
-        selectedBlock: t,
-        dataProvider: o,
-        appliedBindings: C(d, "key")
-      },
-      n.key
-    )),
-    /* @__PURE__ */ e.jsxs(F, { delayDuration: 200, children: [
-      /* @__PURE__ */ e.jsx(z, { className: "w-full", children: /* @__PURE__ */ e.jsx(
-        st,
-        {
-          disabled: c,
-          appliedBindings: C(d, "key"),
-          onAddBinding: i,
-          children: /* @__PURE__ */ e.jsx(
-            "span",
-            {
-              className: `w-full rounded-md px-5 py-1.5 text-xs font-medium duration-200 ${c ? "cursor-not-allowed bg-gray-200 text-gray-400" : "bg-blue-700/20 text-blue-800 hover:bg-blue-700/30"}`,
-              children: m(o) ? /* @__PURE__ */ e.jsx("small", { className: "text-[9.5px] text-gray-500", children: "No data provider has been set up for this page" }) : "+ Add Data Binding"
-            }
-          )
-        }
-      ) }),
-      c && /* @__PURE__ */ e.jsx(Z, { sideOffset: -55, className: "text-[11px]", children: m(o) ? "No data provider has been set up for this page." : "Complete last added data binding to add more" })
-    ] })
-  ] });
-}, Fr = () => /* @__PURE__ */ e.jsx("div", { className: "text-xs border rounded-sm p-1 mt-1 border-orange-500 text-orange-500 bg-orange-100", children: "Data binding is set for this field" }), be = ct(({ createHistorySnapshot: r, properties: s, formData: t, onChange: o }) => {
-  const l = { type: "object", properties: {} }, d = {};
-  return Object.keys(s).forEach((a) => {
-    const c = s[a];
-    if (P(["slot", "styles"], c.type))
-      return;
-    const i = a;
-    l.properties[i] = or(c), d[i] = ar(c);
-  }), /* @__PURE__ */ e.jsx(
-    Br,
-    {
-      widgets: {
-        binding: Fr,
-        richtext: nr,
-        icon: ir,
-        image: dr
-      },
-      fields: { link: cr },
-      idSeparator: ".",
-      autoComplete: "off",
-      omitExtraData: !1,
-      liveOmit: !1,
-      liveValidate: !1,
-      validator: Dr,
-      uiSchema: d,
-      onBlur: r,
-      schema: l,
-      formData: t,
-      onChange: o
-    }
-  );
-});
-function zr() {
-  const r = q(), { createSnapshot: s } = We(), t = Ue(), o = tt(r._type), l = { ...r }, d = pr("dataBindingSupport", !1), a = () => s(), c = ({ formData: n }, h) => {
-    if (h) {
-      const g = h.replace("root.", "");
-      t([r._id], { [g]: x(n, g) });
-    }
-  }, i = {
-    _name: kr({
-      title: "Name",
-      default: x(r, "_name", r._type)
-    })
-  }, p = ht(x(l, "_bindings", {})), y = _(() => {
-    const n = yt(x(o, "props", {}));
-    return d && bt(p, (h) => delete n[h]), n;
-  }, [o, p, d]);
-  return /* @__PURE__ */ e.jsxs("div", { className: "overflow-x-hidden", children: [
-    /* @__PURE__ */ e.jsx(
-      be,
-      {
-        onChange: c,
-        createHistorySnapshot: a,
-        formData: l,
-        properties: i
-      }
-    ),
-    /* @__PURE__ */ e.jsx("hr", { className: "mt-4" }),
-    d ? /* @__PURE__ */ e.jsxs(Ke, { type: "multiple", defaultValue: ["STATIC", "BINDING"], className: "h-full w-full", children: [
-      /* @__PURE__ */ e.jsxs(de, { value: "BINDING", children: [
-        /* @__PURE__ */ e.jsx(ce, { className: "bg-gray-100 px-3 py-2 text-xs hover:no-underline", children: /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-x-2", children: [
-          /* @__PURE__ */ e.jsx(
-            "div",
-            {
-              className: `h-[8px] w-[8px] rounded-full ${m(x(r, "_bindings", {})) ? "bg-gray-300" : "bg-blue-500"}`
-            }
-          ),
-          "Data Binding"
-        ] }) }),
-        /* @__PURE__ */ e.jsx(pe, { className: "px-4 pt-4", children: /* @__PURE__ */ e.jsx(
-          Yr,
-          {
-            bindingData: x(l, "_bindings", {}),
-            onChange: (n) => {
-              c({ formData: { ...l, _bindings: n } }, "root._bindings");
-            }
-          }
-        ) })
-      ] }),
-      /* @__PURE__ */ e.jsxs(de, { value: "STATIC", children: [
-        /* @__PURE__ */ e.jsx(ce, { className: "bg-gray-100 px-3 py-2 text-xs hover:no-underline", children: /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-x-2", children: [
-          /* @__PURE__ */ e.jsx("div", { className: "h-[8px] w-[8px] rounded-full bg-blue-500" }),
-          "Static Content"
-        ] }) }),
-        /* @__PURE__ */ e.jsxs(pe, { className: "pt-4", children: [
-          m(p) ? null : /* @__PURE__ */ e.jsxs("div", { className: "mx-4 mb-1 mt-0 rounded-sm border border-orange-500 bg-orange-100 p-1 text-xs text-orange-500", children: [
-            "Data binding is set for ",
-            /* @__PURE__ */ e.jsx("b", { children: C(p, mt).join(", ") }),
-            " ",
-            p.length === 1 ? "property" : "properties",
-            ". Remove data binding to edit static content."
-          ] }),
-          /* @__PURE__ */ e.jsx(
-            be,
-            {
-              onChange: c,
-              createHistorySnapshot: a,
-              formData: l,
-              properties: y
-            }
-          )
-        ] })
-      ] })
-    ] }) : /* @__PURE__ */ e.jsx(
-      be,
-      {
-        onChange: c,
-        createHistorySnapshot: a,
-        formData: l,
-        properties: y
-      }
-    ),
-    /* @__PURE__ */ e.jsx("div", { className: "pb-60" })
-  ] });
-}
-const Ae = new Ar(Pr, {
-  isCaseSensitive: !1,
-  threshold: 0.2,
-  minMatchCharLength: 2,
-  keys: ["name"]
-});
-function Zr() {
-  var E;
-  const [r] = Se(), s = q(), t = qe(), o = Ge(), [l] = Je(), [d, a] = j(""), c = (E = ue(r)) == null ? void 0 : E.prop, i = ft((x(s, c, "").replace(Lr, "").split(",").pop() || "").split(" "), m), p = () => {
-    const w = d.trim().toLowerCase().replace(/ +(?= )/g, "").split(" ");
-    t(l, w, !0), a("");
-  }, [y, n] = j([]), h = ({ value: w }) => {
-    const $ = w.trim().toLowerCase(), L = $.match(/.+:/g);
-    let N = [];
-    if (L && L.length > 0) {
-      const [D] = L, X = $.replace(D, "");
-      N = Ae.search(X).map((b) => ({
-        ...b,
-        item: { ...b.item, name: D + b.item.name }
-      }));
-    } else
-      N = Ae.search($);
-    n(C(N, "item"));
-  }, g = () => {
-    n([]);
-  }, u = (w) => w.name, f = (w) => /* @__PURE__ */ e.jsx("div", { className: "rounded-md p-1", children: w.name }), k = {
-    autoComplete: "off",
-    autoCorrect: "off",
-    autoCapitalize: "off",
-    spellCheck: !1,
-    placeholder: "Enter class name",
-    value: d,
-    onKeyDown: (w) => {
-      w.key === "Enter" && d.trim() !== "" && p();
-    },
-    onChange: (w, { newValue: $ }) => a($),
-    className: "w-full rounded-md text-xs px-2 hover:outline-0 bg-background border-border py-1"
-  };
-  return /* @__PURE__ */ e.jsxs(
-    "div",
-    {
-      className: `no-scrollbar flex ${y.length > 0 ? "min-h-[300px]" : "min-h-max"} w-full flex-col gap-y-5 overflow-y-auto bg-gray-100 px-px`,
-      children: [
-        /* @__PURE__ */ e.jsx(Te, { className: "mt-2", children: "Add Tailwind classes" }),
-        /* @__PURE__ */ e.jsxs("div", { className: "relative -mt-4 flex items-center gap-x-3", children: [
-          /* @__PURE__ */ e.jsx("div", { className: "relative flex w-full items-center gap-x-3", children: /* @__PURE__ */ e.jsx(
-            Ir,
-            {
-              suggestions: y,
-              onSuggestionsFetchRequested: h,
-              onSuggestionsClearRequested: g,
-              getSuggestionValue: u,
-              renderSuggestion: f,
-              inputProps: k,
-              containerProps: {
-                className: "relative h-8 w-full gap-y-1 py-1 border-gray-600"
-              },
-              theme: {
-                suggestion: "bg-transparent",
-                suggestionHighlighted: "bg-gray-700 ",
-                suggestionsContainerOpen: "absolute bg-gray-100 z-50 max-h-[230px] overflow-y-auto w-full  border border-gray-600 rounded-md"
-              }
-            }
-          ) }),
-          /* @__PURE__ */ e.jsx(
-            xe,
-            {
-              variant: "outline",
-              className: "h-6 border-gray-700",
-              onClick: p,
-              disabled: d.trim() === "",
-              size: "sm",
-              children: /* @__PURE__ */ e.jsx(Ne, {})
-            }
-          )
-        ] }),
-        /* @__PURE__ */ e.jsxs("div", { className: "flex w-full flex-wrap gap-2", children: [
-          m(i) && /* @__PURE__ */ e.jsx("div", { className: "flex h-10 w-full items-center justify-center text-center text-sm text-gray-400", children: "No class added" }),
-          ne.Children.toArray(
-            i.map((w) => /* @__PURE__ */ e.jsxs(
-              "div",
-              {
-                className: "group relative flex cursor-default items-center gap-x-1 rounded-full border border-blue-600 bg-blue-500 p-px px-1.5 text-[11px] text-white hover:border-blue-900",
-                children: [
-                  w,
-                  /* @__PURE__ */ e.jsx(
-                    Fe,
-                    {
-                      onClick: () => o(l, [w]),
-                      className: "invisible absolute right-1 hover:text-white group-hover:visible group-hover:cursor-pointer"
-                    }
-                  )
-                ]
-              },
-              w
-            ))
-          )
-        ] })
-      ]
-    }
-  );
-}
-const H = ["px", "%", "em", "rem", "ch", "vh", "vw"], Wr = {
-  heading: "flex.heading",
-  items: [
-    { type: "arbitrary", label: "flex.basis", units: H, property: "flexBasis" },
-    { type: "range", label: "flex.order", property: "order" },
-    { type: "dropdown", label: "flex.flex", property: "flexGrowShrink" },
-    { type: "dropdown", label: "flex.grow", property: "flexGrow" },
-    { type: "dropdown", label: "flex.shrink", property: "flexShrink" }
-  ]
-}, Ur = {
-  heading: "grid.heading",
-  items: [
-    { type: "range", label: "grid.col_span", property: "gridColSpan" },
-    { type: "range", label: "grid.col_start", property: "gridColStart" },
-    { type: "range", label: "grid.col_end", property: "gridColEnd" },
-    { type: "range", label: "grid.row_span", property: "gridRowSpan" },
-    { type: "range", label: "grid.row_start", property: "gridRowStart" },
-    { type: "range", label: "grid.row_end", property: "gridRowEnd" },
-    { type: "range", label: "grid.order", property: "order" }
-  ]
-}, Kr = [
-  {
-    heading: "layout.heading",
-    items: [
-      { type: "arbitrary", label: "layout.width", units: H.concat("auto"), property: "width" },
-      { type: "arbitrary", label: "layout.height", units: H.concat("auto"), property: "height" },
-      {
-        styleType: "multiple",
-        label: "layout.margin",
-        negative: !0,
-        units: [...H, "auto"],
-        options: [
-          { key: "margin", label: "layout.margin_all" },
-          { key: "marginX", label: "layout.margin_lr" },
-          { key: "marginY", label: "layout.margin_tb" },
-          { key: "marginTop", label: "layout.margin_top" },
-          { key: "marginRight", label: "layout.margin_right" },
-          { key: "marginBottom", label: "layout.margin_bottom" },
-          { key: "marginLeft", label: "layout.margin_left" }
-        ]
-      },
-      {
-        styleType: "multiple",
-        label: "layout.padding",
-        options: [
-          { key: "padding", label: "layout.padding_all" },
-          { key: "paddingX", label: "layout.padding_lr" },
-          { key: "paddingY", label: "layout.padding_tb" },
-          { key: "paddingTop", label: "layout.padding_top" },
-          { key: "paddingRight", label: "layout.padding_right" },
-          { key: "paddingBottom", label: "layout.padding_bottom" },
-          { key: "paddingLeft", label: "layout.padding_left" }
-        ]
-      },
-      {
-        styleType: "multiple",
-        label: "layout.space_bt",
-        options: [
-          { key: "spaceX", label: "layout.space_lr" },
-          { key: "spaceY", label: "layout.space_tb" }
-        ]
-      }
-    ]
-  },
-  {
-    heading: "size.heading",
-    items: [
-      {
-        styleType: "accordion",
-        heading: "size.min_width_height",
-        items: [
-          { type: "arbitrary", label: "size.min_width", units: H.concat("auto"), property: "minWidth" },
-          { type: "arbitrary", label: "size.min_height", units: H.concat("auto"), property: "minHeight" }
-        ]
-      },
-      {
-        styleType: "accordion",
-        heading: "size.max_width_height",
-        items: [
-          { type: "arbitrary", label: "size.max_width", units: H.concat("auto"), property: "maxWidth" },
-          { type: "arbitrary", label: "size.max_height", units: H.concat("auto"), property: "maxHeight" }
-        ]
-      },
-      {
-        styleType: "accordion",
-        heading: "size.object_options_aspect_ratio",
-        items: [
-          { type: "dropdown", label: "size.aspect", property: "aspectRatio" },
-          { type: "dropdown", label: "size.fit", property: "objectFit" },
-          { type: "dropdown", label: "size.position", property: "objectPosition" }
-        ]
-      }
-    ]
-  },
-  {
-    heading: "display.heading",
-    items: [
-      { type: "dropdown", label: "display.display", property: "display", units: H },
-      {
-        styleType: "accordion",
-        heading: "display.flex_options",
-        items: [
-          { type: "dropdown", label: "display.flex_direction", property: "flexDirection" },
-          { type: "dropdown", label: "display.flex_wrap", property: "flexWrap" },
-          { type: "dropdown", label: "display.justify_content", property: "justifyContent" },
-          { type: "dropdown", label: "display.align_content", property: "alignContent" },
-          { type: "dropdown", label: "display.align_items", property: "alignItems" },
-          {
-            styleType: "multiple",
-            label: "display.gap",
-            options: [
-              { key: "gap", label: "display.gap_all" },
-              { key: "gapX", label: "display.gap_lr" },
-              { key: "gapY", label: "display.gap_tb" }
-            ]
-          }
-        ],
-        conditions: { display: "flex" }
-      },
-      {
-        styleType: "accordion",
-        heading: "display.grid_options",
-        items: [
-          { type: "range", label: "display.grid_columns", property: "gridColumns" },
-          { type: "range", label: "display.grid_rows", property: "gridRows" },
-          { type: "dropdown", label: "display.grid_auto_flow", property: "gridAutoFlow" },
-          { type: "dropdown", label: "display.grid_auto_cols", property: "gridAutoColumns" },
-          { type: "dropdown", label: "display.grid_auto_rows", property: "gridAutoRows" },
-          { type: "dropdown", label: "display.justify_content", property: "justifyContent" },
-          { type: "dropdown", label: "display.align_content", property: "alignContent" },
-          { type: "dropdown", label: "display.align_items", property: "alignItems" },
-          {
-            styleType: "multiple",
-            label: "display.gap",
-            units: ["px", "rem"],
-            options: [
-              { key: "gap", label: "display.gap_all" },
-              { key: "gapX", label: "display.gap_lr" },
-              { key: "gapY", label: "display.gap_tb" }
-            ]
-          }
-        ],
-        conditions: { display: "grid" }
-      },
-      {
-        styleType: "accordion",
-        heading: "display.visibility_opacity",
-        items: [
-          { type: "dropdown", label: "display.visibility", property: "visibility", units: H },
-          { type: "arbitrary", label: "display.opacity", property: "opacity", units: ["-"] }
-        ]
-      }
-    ]
-  },
-  {
-    heading: "position.heading",
-    items: [
-      { type: "icons", label: "position.position", property: "position" },
-      {
-        styleType: "accordion",
-        heading: "position.options",
-        items: [
-          {
-            styleType: "multiple",
-            label: "position.direction",
-            options: [
-              { key: "top", label: "position.top" },
-              { key: "right", label: "position.right" },
-              { key: "bottom", label: "position.bottom" },
-              { key: "left", label: "position.left" }
-            ]
-          },
-          {
-            styleType: "multiple",
-            label: "position.inset",
-            options: [
-              { key: "inset", label: "position.all" },
-              { key: "insetX", label: "position.lr" },
-              { key: "insetY", label: "position.tb" }
-            ]
-          },
-          { type: "arbitrary", label: "position.z_index", units: ["-", "auto"], property: "zIndex" }
-        ]
-      },
-      {
-        styleType: "accordion",
-        heading: "position.float_clear",
-        items: [
-          { type: "icons", label: "position.float", property: "float" },
-          { type: "dropdown", label: "position.clear", property: "clear" }
-        ]
-      },
-      {
-        styleType: "accordion",
-        heading: "position.overflow_overscroll",
-        items: [
-          {
-            styleType: "multiple",
-            type: "dropdown",
-            label: "position.overflow",
-            options: [
-              { key: "overflow", label: "position.all" },
-              { key: "overflowX", label: "position.lr" },
-              { key: "overflowY", label: "position.tb" }
-            ]
-          },
-          {
-            styleType: "multiple",
-            type: "dropdown",
-            label: "position.overscroll",
-            options: [
-              { key: "overscroll", label: "position.all" },
-              { key: "overscrollX", label: "position.lr" },
-              { key: "overscrollY", label: "position.tb" }
-            ]
-          }
-        ]
-      }
-    ]
-  },
-  {
-    heading: "typography.heading",
-    items: [
-      { type: "dropdown", property: "fontFamily", label: "typography.font" },
-      { type: "arbitrary", property: "fontSize", label: "typography.size", units: H },
-      { type: "arbitrary", property: "lineHeight", label: "typography.height", units: H.concat("-") },
-      { type: "range", property: "fontWeight", label: "typography.weight" },
-      { type: "color", property: "textColor", label: "typography.color" },
-      {
-        styleType: "accordion",
-        heading: "typography.alignments",
-        items: [
-          { type: "dropdown", property: "textAlign", label: "typography.align" },
-          { type: "dropdown", property: "verticalAlign", label: "typography.valign" }
-        ]
-      },
-      {
-        styleType: "accordion",
-        heading: "typography.spacing_decoration_more",
-        items: [
-          { type: "dropdown", property: "letterSpacing", label: "typography.spacing" },
-          { type: "dropdown", property: "textDecoration", label: "typography.decoration" },
-          { type: "range", property: "textDecorationThickness", label: "typography.thickness" },
-          { type: "dropdown", property: "textTransform", label: "typography.transform" }
-        ]
-      },
-      {
-        styleType: "accordion",
-        heading: "typography.whitespace_breaks",
-        items: [
-          { type: "dropdown", property: "whitespace", label: "typography.whitespace" },
-          { type: "dropdown", property: "wordbreak", label: "typography.wordbreak" }
-        ]
-      }
-    ]
-  },
-  {
-    heading: "background.heading",
-    items: [
-      { type: "color", label: "background.bgcolor", property: "backgroundColor" },
-      {
-        styleType: "accordion",
-        heading: "background.position_size_more",
-        items: [
-          { type: "dropdown", label: "background.attachment", property: "backgroundAttachment" },
-          { type: "dropdown", label: "background.clipping", property: "backgroundClip" },
-          { type: "dropdown", label: "background.origin", property: "backgroundOrigin" },
-          { type: "dropdown", label: "background.position", property: "backgroundPosition" },
-          { type: "dropdown", label: "background.repeat", property: "backgroundRepeat" },
-          { type: "dropdown", label: "background.size", property: "backgroundSize" }
-        ]
-      },
-      { type: "dropdown", label: "background.gradient", property: "backgroundGradient" },
-      {
-        styleType: "accordion",
-        heading: "background.gradient_colors",
-        items: [
-          { type: "color", label: "background.from_color", property: "fromColor" },
-          { type: "color", label: "background.via_color", property: "viaColor" },
-          { type: "color", label: "background.to_color", property: "toColor" }
-        ]
-      }
-    ]
-  },
-  {
-    heading: "border.heading",
-    items: [
-      {
-        styleType: "multiple",
-        type: "dropdown",
-        label: "border.width",
-        options: [
-          { key: "border", label: "border.all" },
-          { key: "borderX", label: "border.lr" },
-          { key: "borderY", label: "border.tb" },
-          { key: "borderTop", label: "border.top" },
-          { key: "borderRight", label: "border.right" },
-          { key: "borderBottom", label: "border.bottom" },
-          { key: "borderLeft", label: "border.left" }
-        ]
-      },
-      {
-        styleType: "multiple",
-        type: "dropdown",
-        label: "border.corners",
-        options: [
-          { key: "borderRadius", label: "border.all" },
-          { key: "borderRadiusTop", label: "border.top" },
-          { key: "borderRadiusRight", label: "border.right" },
-          { key: "borderRadiusBottom", label: "border.bottom" },
-          { key: "borderRadiusLeft", label: "border.left" },
-          { key: "borderRadiusTopLeft", label: "border.top_left" },
-          { key: "borderRadiusTopRight", label: "border.top_right" },
-          { key: "borderRadiusBottomRight", label: "border.bottom_right" },
-          { key: "borderRadiusBottomLeft", label: "border.bottom_left" }
-        ]
-      },
-      { type: "color", label: "border.color", property: "borderColor" },
-      { type: "dropdown", label: "border.style", property: "borderStyle" },
-      {
-        styleType: "accordion",
-        heading: "border.divide_options",
-        items: [
-          {
-            styleType: "multiple",
-            type: "range",
-            label: "border.width",
-            options: [
-              { key: "divideXWidth", label: "border.lr" },
-              { key: "divideYWidth", label: "border.tb" }
-            ]
-          },
-          { type: "color", label: "border.divide_color", property: "divideColor" },
-          { type: "dropdown", label: "border.divide_style", property: "divideStyle" }
-        ]
-      },
-      {
-        styleType: "accordion",
-        heading: "border.outline_styling",
-        items: [
-          { type: "range", label: "border.outline_width", property: "outlineWidth" },
-          { type: "range", label: "border.outline_offset", property: "outlineOffset" },
-          { type: "dropdown", label: "border.outline_style", property: "outlineStyle" }
-        ]
-      },
-      {
-        styleType: "accordion",
-        heading: "border.ring_options",
-        items: [
-          { type: "range", label: "border.ring_width", property: "ringWidth" },
-          { type: "color", label: "border.ring_color", property: "ringColor" },
-          { type: "range", label: "border.ring_offset_width", property: "ringOffsetWidth" },
-          { type: "color", label: "border.ring_offset_color", property: "ringOffsetColor" }
-        ]
-      }
-    ]
-  },
-  {
-    heading: "effect.heading",
-    items: [
-      { type: "range", label: "effect.shadow", property: "boxShadow" },
-      { type: "color", label: "effect.color", property: "boxShadowColor" },
-      { type: "dropdown", label: "effect.cursor", property: "cursor" },
-      {
-        styleType: "accordion",
-        heading: "effect.blend_cursor",
-        items: [
-          { type: "dropdown", label: "effect.mix_blend", property: "mixBlendMode" },
-          { type: "dropdown", label: "effect.bg_blend", property: "bgBlendMode" }
-        ]
-      },
-      {
-        styleType: "accordion",
-        heading: "effect.transform",
-        items: [
-          { type: "dropdown", label: "effect.origin", property: "transformOrigin" },
-          {
-            styleType: "multiple",
-            label: "effect.scale",
-            units: ["-"],
-            options: [
-              { key: "scale", label: "effect.all" },
-              { key: "scaleX", label: "effect.lr" },
-              { key: "scaleY", label: "effect.tb" }
-            ]
-          },
-          {
-            styleType: "multiple",
-            label: "effect.skew",
-            units: ["deg"],
-            options: [
-              { key: "skewX", label: "effect.lr" },
-              { key: "skewY", label: "effect.tb" }
-            ]
-          },
-          {
-            styleType: "multiple",
-            label: "effect.translate",
-            negative: !0,
-            options: [
-              { key: "translateX", label: "effect.lr" },
-              { key: "translateY", label: "effect.tb" }
-            ]
-          },
-          { type: "arbitrary", units: ["deg"], negative: !0, label: "effect.rotate", property: "rotate" }
-        ]
-      },
-      {
-        styleType: "accordion",
-        heading: "effect.animation",
-        items: [
-          { type: "dropdown", label: "effect.animation", property: "animation" },
-          { type: "dropdown", label: "effect.transition", property: "transition" },
-          { type: "dropdown", label: "effect.easing", property: "transitionEase" },
-          { type: "arbitrary", units: ["ms"], label: "effect.duration", property: "duration" },
-          { type: "arbitrary", units: ["ms"], label: "effect.delay", property: "delay" }
-        ]
-      }
-    ]
-  },
-  {
-    heading: "classes.heading",
-    items: [{ component: Zr }]
-  }
-], ot = {
-  "not-italic": () => /* @__PURE__ */ e.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e.jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9 3H11V5H9V11H11V13H5V11H7V5H5V3H9Z", fill: "white" }) }),
-  // visibility
-  visible: kt,
-  invisible: He,
-  // display
-  hidden: He,
-  gap: A,
-  gapX: T,
-  gapY: R,
-  spaceX: T,
-  spaceY: R,
-  overscroll: A,
-  overscrollX: T,
-  overscrollY: R,
-  overflow: A,
-  overflowX: T,
-  overflowY: R,
-  top: Q,
-  right: ee,
-  bottom: te,
-  left: re,
-  inset: A,
-  insetX: T,
-  insetY: R,
-  border: A,
-  borderX: T,
-  borderY: R,
-  borderTop: Q,
-  borderRight: ee,
-  borderBottom: te,
-  borderLeft: re,
-  borderRadius: A,
-  borderRadiusX: T,
-  borderRadiusY: R,
-  borderRadiusTop: Q,
-  borderRadiusRight: ee,
-  borderRadiusBottom: te,
-  borderRadiusLeft: re,
-  borderRadiusTopLeft: Nt,
-  borderRadiusTopRight: _t,
-  borderRadiusBottomRight: St,
-  borderRadiusBottomLeft: Tt,
-  divideXWidth: T,
-  divideYWidth: R,
-  scale: A,
-  scaleX: T,
-  scaleY: R,
-  skewX: T,
-  skewY: R,
-  translateX: T,
-  translateY: R,
-  // padding
-  padding: A,
-  paddingX: T,
-  paddingY: R,
-  paddingTop: Q,
-  paddingRight: ee,
-  paddingBottom: te,
-  paddingLeft: re,
-  // margin
-  margin: A,
-  marginX: T,
-  marginY: R,
-  marginTop: Q,
-  marginRight: ee,
-  marginBottom: te,
-  marginLeft: re,
-  // text-align
-  textLeft: Rt,
-  textCenter: Vt,
-  textRight: Ht,
-  textJustify: Bt,
-  // font style
-  italic: Dt,
-  // "not-italic": "",
-  // decoration
-  underline: $t,
-  overline: It,
-  // transform
-  uppercase: At,
-  block: () => /* @__PURE__ */ e.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-    /* @__PURE__ */ e.jsx(
-      "path",
-      {
-        opacity: "0.6",
-        fillRule: "evenodd",
-        clipRule: "evenodd",
-        d: "M2 2H14V14H2V2ZM1 1H15V15H1V1Z",
-        fill: "currentColor"
-      }
-    ),
-    /* @__PURE__ */ e.jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M7 4H4V12H7V4ZM9 4H12V12H9V4Z", fill: "currentColor" })
-  ] }),
-  // floats
-  "float-right": () => /* @__PURE__ */ e.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-    /* @__PURE__ */ e.jsx("path", { d: "M8 4H16V12H8V4Z", fill: "currentColor" }),
-    /* @__PURE__ */ e.jsx(
-      "path",
-      {
-        opacity: "0.6",
-        fillRule: "evenodd",
-        clipRule: "evenodd",
-        d: "M0 4H6V6H0V4ZM0 7H6V9H0V7ZM4 10H0V12H4V10Z",
-        fill: "currentColor"
-      }
-    )
-  ] }),
-  "float-left": () => /* @__PURE__ */ e.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-    /* @__PURE__ */ e.jsx("path", { d: "M0 4H8V12H0V4Z", fill: "currentColor" }),
-    /* @__PURE__ */ e.jsx(
-      "path",
-      {
-        opacity: "0.6",
-        fillRule: "evenodd",
-        clipRule: "evenodd",
-        d: "M10 4H16V6H10V4ZM10 7H16V9H10V7ZM14 10H10V12H14V10Z",
-        fill: "currentColor"
-      }
-    )
-  ] }),
-  "float-none": Fe,
-  // position
-  fixed: () => /* @__PURE__ */ e.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-    /* @__PURE__ */ e.jsx(
-      "path",
-      {
-        opacity: "0.6",
-        fillRule: "evenodd",
-        clipRule: "evenodd",
-        d: "M15 2H14V4H13V5H14V6H15V2ZM10 5V4H9V2H1V8H2V5H10ZM7 4V3H5V4H7ZM4 4V3H2V4H4ZM1 13H7V14H1V13Z",
-        fill: "currentColor"
-      }
-    ),
-    /* @__PURE__ */ e.jsx(
-      "path",
-      {
-        fillRule: "evenodd",
-        clipRule: "evenodd",
-        d: "M11 2H10V3H11V6H12V3H13V2H11ZM2 9H1V12H2V11H7V10H2V9ZM15 7H8V14H15V7Z",
-        fill: "currentColor"
-      }
-    )
-  ] }),
-  absolute: () => /* @__PURE__ */ e.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-    /* @__PURE__ */ e.jsx(
-      "path",
-      {
-        opacity: "0.6",
-        fillRule: "evenodd",
-        clipRule: "evenodd",
-        d: "M14 2H15V6H14V2ZM9 3V2H1V8H2V3H9ZM7 13H1V14H7V13Z",
-        fill: "currentColor"
-      }
-    ),
-    /* @__PURE__ */ e.jsx(
-      "path",
-      {
-        fillRule: "evenodd",
-        clipRule: "evenodd",
-        d: "M11 2H10V3H11V6H12V3H13V2H11ZM2 9H1V12H2V11H7V10H2V9ZM15 7H8V14H15V7Z",
-        fill: "currentColor"
-      }
-    )
-  ] }),
-  relative: () => /* @__PURE__ */ e.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e.jsx(
-    "path",
-    {
-      fillRule: "evenodd",
-      clipRule: "evenodd",
-      d: "M11 2H9V3H11V6H12V3H14V2H11ZM2 8H1V13H2V11H7V10H2V8ZM15 7H8V14H15V7Z",
-      fill: "currentColor"
-    }
-  ) }),
-  sticky: () => /* @__PURE__ */ e.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-    /* @__PURE__ */ e.jsx(
-      "path",
-      {
-        d: "M12.9998 7C13.6558 7 14.2937 6.78498 14.8158 6.38787C15.338 5.99076 15.7156 5.43345 15.8908 4.80128C16.066 4.16912 16.0292 3.49694 15.7859 2.8877C15.5427 2.27846 15.1065 1.76573 14.5441 1.42804C13.9817 1.09034 13.3241 0.946293 12.672 1.01795C12.02 1.08961 11.4094 1.37303 10.9337 1.8248C10.4581 2.27658 10.1436 2.8718 10.0385 3.51932C9.93341 4.16685 10.0434 4.83097 10.3518 5.41L6.88176 8.88C6.80034 8.96122 6.73572 9.05769 6.69158 9.16388C6.64744 9.27008 6.62465 9.38393 6.62451 9.49894C6.62437 9.61395 6.64689 9.72785 6.69077 9.83416C6.73465 9.94046 6.79904 10.0371 6.88026 10.1185C6.96149 10.1999 7.05795 10.2645 7.16415 10.3087C7.27035 10.3528 7.3842 10.3756 7.4992 10.3758C7.61421 10.3759 7.72812 10.3534 7.83442 10.3095C7.94072 10.2656 8.03734 10.2012 8.11876 10.12L11.5888 6.648C12.0088 6.873 12.4888 7 12.9988 7H12.9998Z",
-        fill: "currentColor"
-      }
-    ),
-    /* @__PURE__ */ e.jsx(
-      "path",
-      {
-        opacity: "0.6",
-        fillRule: "evenodd",
-        clipRule: "evenodd",
-        d: "M9.535 2H1V14H15V7.465C14.69 7.645 14.355 7.783 14 7.875V13H2V5H9.126C8.86504 3.98486 9.01223 2.90789 9.536 2H9.535ZM7 3V4H5V3H7ZM4 3V4H2V3H4Z",
-        fill: "currentColor"
-      }
-    )
-  ] }),
-  static: Pt
-}, oe = Me({ canReset: !1, canChange: !0 }), qr = ({ children: r, canReset: s = !1, canChange: t = !0 }) => (
-  // eslint-disable-next-line react/jsx-no-constructed-context-values
-  /* @__PURE__ */ e.jsx(oe.Provider, { value: { canReset: s, canChange: t }, children: r })
-), at = ({ label: r, property: s, onChange: t }) => {
-  const o = _(() => x(he, `${s}.classes`, [""]), [s]), l = ae(s), d = _(() => x(l, "cls", ""), [l]), { canChange: a } = se(oe), c = /\[.*\]/g.test(d);
-  return /* @__PURE__ */ e.jsx("div", { className: r ? "w-full rounded " : "grow", children: c ? /* @__PURE__ */ e.jsxs("div", { className: "flex items-center", children: [
-    /* @__PURE__ */ e.jsx(ur, { className: "w-[70%] rounded py-1", readOnly: !0, value: d }),
-    /* @__PURE__ */ e.jsxs(F, { delayDuration: 100, children: [
-      /* @__PURE__ */ e.jsx(z, { asChild: !0, children: /* @__PURE__ */ e.jsx("button", { type: "button", className: "invisible ml-3 mt-1 text-blue-600 group-hover:visible", children: /* @__PURE__ */ e.jsx(_e, {}) }) }),
-      /* @__PURE__ */ e.jsx(Z, { children: "Current value is using a Tailwind arbitrary value." })
-    ] })
-  ] }) : /* @__PURE__ */ e.jsx(
-    Ce,
-    {
-      rounded: r,
-      onChange: (i) => t(i, s),
-      selected: d,
-      options: o,
-      disabled: !a
-    }
-  ) });
-};
-function Ce({ selected: r, onChange: s, rounded: t = !1, options: o, disabled: l = !1 }) {
-  const d = r.replace(/.*:/g, "").trim(), { undo: a, redo: c } = We();
-  return /* @__PURE__ */ e.jsxs(
-    "select",
-    {
-      disabled: !o.length || l,
-      className: `${t ? "rounded-md border border-border" : "border-0"} w-full disable:bg-gray-500 h-full truncate rounded bg-background px-2 py-1 text-xs outline-none disabled:cursor-not-allowed`,
-      onChange: (i) => s(i.target.value),
-      onKeyDown: (i) => {
-        i.ctrlKey && (i.key === "z" && a(), i.key === "y" && c());
-      },
-      value: d,
-      children: [
-        /* @__PURE__ */ e.jsx("option", { className: "bg-transparent", value: "" }),
-        I.Children.toArray(
-          o.map((i) => /* @__PURE__ */ e.jsx("option", { className: "bg-transparent", value: i, children: i }))
-        )
-      ]
-    }
-  );
-}
-const Gr = ({ property: r, onChange: s }) => {
-  const { canReset: t, canChange: o } = se(oe), l = ae(r), d = _(() => x(l, "cls", ""), [l]), a = _(() => x(he, `${r}.classes`, [""]), [r]), c = a.indexOf(d) > -1 ? a.indexOf(d) : 0, i = /\[.*\]/g.test(d);
-  return /* @__PURE__ */ e.jsx("div", { className: "flex flex-row divide-x divide-solid divide-border rounded border border-border text-xs", children: i ? /* @__PURE__ */ e.jsx("div", { className: "py-[5px] px-2", children: d }) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-    /* @__PURE__ */ e.jsx(
-      "button",
-      {
-        type: "button",
-        className: "box-border w-2/12 rounded-tl rounded-bl bg-background px-1 text-center hover:bg-bg-gray-700 disabled:cursor-not-allowed disabled:bg-gray-600",
-        disabled: !o && (!t || c - 1 < 0),
-        onClick: () => s(Ve(a, c - 1), r),
-        children: /* @__PURE__ */ e.jsx("span", { className: "flex items-center justify-center", children: /* @__PURE__ */ e.jsx(
-          Et,
-          {
-            className: !o && (!t || c - 1 < 0) ? "text-gray-500" : "text-black/60 dark:text-white/60"
-          }
-        ) })
-      }
-    ),
-    /* @__PURE__ */ e.jsx("div", { className: "w-8/12 text-center", children: /* @__PURE__ */ e.jsx(at, { label: !1, property: r, onChange: s }) }),
-    /* @__PURE__ */ e.jsx(
-      "button",
-      {
-        type: "button",
-        className: "w-2/12 rounded-tr rounded-br bg-background px-1 text-center hover:bg-bg-gray-700 disabled:cursor-not-allowed disabled:bg-gray-600",
-        disabled: !o && (!t || c + 1 >= a.length),
-        onClick: () => s(Ve(a, c + 1), r),
-        children: /* @__PURE__ */ e.jsx("span", { className: "flex items-center justify-center", children: /* @__PURE__ */ e.jsx(
-          Ne,
-          {
-            className: !o && (!t || c + 1 >= a.length) ? "text-gray-500" : "text-black/60 dark:text-white/60"
-          }
-        ) })
-      }
-    )
-  ] }) });
-}, Jr = ({ property: r, onChange: s }) => {
-  const t = _(() => x(he, `${r}.classes`, [""]), [r]), { canChange: o } = se(oe), l = ae(r), d = _(() => x(l, "cls", ""), [l]);
-  return /* @__PURE__ */ e.jsx("div", { className: "flex grow flex-wrap gap-1", children: C(t, (a) => /* @__PURE__ */ e.jsxs(F, { children: [
-    /* @__PURE__ */ e.jsx(z, { asChild: !0, children: /* @__PURE__ */ e.jsx(
-      "button",
-      {
-        type: "button",
-        disabled: !o,
-        onClick: () => s(a, r),
-        className: `cursor-pointer rounded border border-gray-600 p-1 disabled:cursor-not-allowed  ${d === a ? " bg-blue-500 text-white" : "disabled:bg-gray-600 disabled:text-gray-400"}`,
-        children: I.createElement(x(ot, a, ze))
-      }
-    ) }),
-    /* @__PURE__ */ e.jsx(Z, { children: Y(le(a)) })
-  ] })) });
-}, Qr = {
-  backgroundColor: "bg",
-  textColor: "text",
-  borderColor: "border",
-  boxShadowColor: "shadow",
-  outlineColor: "outline",
-  divideColor: "divide",
-  fromColor: "from",
-  viaColor: "via",
-  toColor: "to",
-  ringColor: "ring",
-  ringOffsetColor: "ring-offset"
-}, el = ({ property: r, onChange: s }) => {
-  const t = ae(r), o = _(() => x(t, "cls", ""), [t]), { canChange: l } = se(oe), [d, a] = j([]), [c, i] = j({ color: "", shade: "" }), p = o.split("-"), y = x(p, "1", ""), n = x(p, "2", ""), h = B(
-    // eslint-disable-next-line no-shadow
-    (u) => {
-      ["current", "inherit", "transparent", "black", "white"].includes(u) ? (a([]), i({ color: u })) : (a(["50", "100", "200", "300", "400", "500", "600", "700", "800", "900"]), i((f) => ({ ...f, color: u, shade: f.shade ? f.shade : "500" })));
-    },
-    [a, i]
-  );
-  O(() => {
-    if (["current", "inherit", "transparent", "black", "white"].includes(y))
-      return a([]);
-    a(["50", "100", "200", "300", "400", "500", "600", "700", "800", "900"]);
-  }, [y]);
-  const g = B(
-    // eslint-disable-next-line no-shadow
-    (u) => {
-      i({ color: y, shade: u });
-    },
-    [y]
-  );
-  return O(() => {
-    i({ color: "", shade: "" });
-  }, [t]), O(() => {
-    const f = `${x(Qr, r, "")}-${c.color}${c.shade ? `-${c.shade}` : ""}`;
-    f.match(new RegExp(x(he, `${r}.regExp`, ""))) && s(f, r);
-  }, [c, s, r]), /* @__PURE__ */ e.jsxs("div", { className: "flex flex-row divide-x divide-solid divide-border rounded-lg border border-border text-xs", children: [
-    /* @__PURE__ */ e.jsx("div", { className: "grow text-center", children: /* @__PURE__ */ e.jsx(
-      Ce,
-      {
-        disabled: !l,
-        rounded: !0,
-        selected: y,
-        onChange: h,
-        options: [
-          "current",
-          "transparent",
-          "primary",
-          "secondary",
-          "black",
-          "white",
-          "slate",
-          "gray",
-          "zinc",
-          "neutral",
-          "stone",
-          "red",
-          "orange",
-          "amber",
-          "yellow",
-          "lime",
-          "green",
-          "emerald",
-          "teal",
-          "cyan",
-          "sky",
-          "blue",
-          "indigo",
-          "violet",
-          "purple",
-          "fuchsia",
-          "pink",
-          "rose"
-        ]
-      }
-    ) }),
-    /* @__PURE__ */ e.jsx("button", { type: "button", className: "grow text-center", children: /* @__PURE__ */ e.jsx(Ce, { rounded: !0, selected: n, disabled: !y || !l, onChange: g, options: d }) })
-  ] });
-}, Pe = (r, s) => {
-  r = r.toLowerCase();
-  let t = r.trim().replace(/ |\+/g, "");
-  if ((t === "auto" || t === "none") && s.includes(t))
-    return { value: "", unit: t };
-  const o = s.length ? new RegExp(s.join("|"), "g") : /XXXXXX/g;
-  t = t.replace(o, "");
-  const l = r.match(o), d = l && l.length > 1, a = !m(t) && Number.isNaN(Number(t));
-  return d || a ? { error: "Invalid value" } : l && (l[0] === "auto" || l[0] === "none") ? { value: l[0], unit: "" } : { value: t, unit: l ? l[0] : "" };
-};
-const tl = (r) => {
-  const s = r.startsWith("-") ? "-" : "", t = r.split("-").pop();
-  if (["auto", "none"].includes(t))
-    return { value: "", unit: t };
-  if (t === "px")
-    return { value: "1", unit: "px" };
-  if (t === "screen")
-    return { value: "100", unit: r.indexOf("w-") !== -1 ? "vw" : "vh" };
-  if (t === "full")
-    return { value: "100", unit: "%" };
-  if (P(r, "skew-"))
-    return { value: `${s}${t}`, unit: "deg" };
-  if (P(r, "rotate-"))
-    return { value: `${s}${t}`, unit: "deg" };
-  if (P(r, "opacity-"))
-    return { value: `${t / 100}`, unit: "-" };
-  if (P(r, "duration-") || P(r, "delay-"))
-    return { value: `${t}`, unit: "ms" };
-  if (P(r, "translate-") && !t.includes("/"))
-    return { value: `${s}${`${t / 4}`}`, unit: "rem" };
-  if (P(r, "scale-"))
-    return { value: `${s}${`${t / 100}`}`, unit: "-" };
-  if (W(r, "border")) {
-    const o = r.match(/border-?(x|y|t|r|b|l)?\d+/g);
-    if (o)
-      return { value: o[0].split("-").pop(), unit: "px" };
-    if (r.match(/border-?(x|y|t|r|b|l)?/g))
-      return { value: "1", unit: "px" };
-  }
-  if (W(r, "max-w-")) {
-    if (r === "max-w-screen-sm")
-      return { value: "640", unit: "px" };
-    if (r === "max-w-screen-md")
-      return { value: "768", unit: "px" };
-    if (r === "max-w-screen-lg")
-      return { value: "1024", unit: "px" };
-    if (r === "max-w-screen-xl")
-      return { value: "1280", unit: "px" };
-    if (r === "max-w-screen-2xl")
-      return { value: "1536", unit: "px" };
-    if (t === "xs")
-      return { value: "320", unit: "px" };
-    if (t === "sm")
-      return { value: "384", unit: "px" };
-    if (t === "md")
-      return { value: "448", unit: "px" };
-    if (t === "lg")
-      return { value: "512", unit: "px" };
-    if (t === "xl")
-      return { value: "576", unit: "px" };
-    if (t === "2xl")
-      return { value: "672", unit: "px" };
-    if (t === "3xl")
-      return { value: "768", unit: "px" };
-    if (t === "4xl")
-      return { value: "896", unit: "px" };
-    if (t === "5xl")
-      return { value: "1024", unit: "px" };
-    if (t === "6xl")
-      return { value: "1152", unit: "px" };
-    if (t === "7xl")
-      return { value: "1280", unit: "px" };
-    if (t === "prose")
-      return { value: "65", unit: "ch" };
-  }
-  if (W(r, "text-")) {
-    if (t === "xs")
-      return { value: "12", unit: "px" };
-    if (t === "sm")
-      return { value: "14", unit: "px" };
-    if (t === "base")
-      return { value: "16", unit: "px" };
-    if (t === "lg")
-      return { value: "18", unit: "px" };
-    if (t === "xl")
-      return { value: "20", unit: "px" };
-    if (t === "2xl")
-      return { value: "24", unit: "px" };
-    if (t === "3xl")
-      return { value: "30", unit: "px" };
-    if (t === "4xl")
-      return { value: "36", unit: "px" };
-    if (t === "5xl")
-      return { value: "48", unit: "px" };
-    if (t === "6xl")
-      return { value: "60", unit: "px" };
-    if (t === "7xl")
-      return { value: "72", unit: "px" };
-    if (t === "8xl")
-      return { value: "96", unit: "px" };
-    if (t === "9xl")
-      return { value: "128", unit: "px" };
-  }
-  if (W(r, "leading-")) {
-    if (t === "none")
-      return { value: "1", unit: "-" };
-    if (t === "tight")
-      return { value: "1.25", unit: "-" };
-    if (t === "snug")
-      return { value: "1.375", unit: "-" };
-    if (t === "normal")
-      return { value: "1.5", unit: "-" };
-    if (t === "relaxed")
-      return { value: "1.625", unit: "-" };
-    if (t === "loose")
-      return { value: "2", unit: "-" };
-  }
-  if (W(r, "tracking-")) {
-    if (t === "tighter")
-      return { value: "-0.05", unit: "em" };
-    if (t === "tight")
-      return { value: "-0.025", unit: "em" };
-    if (t === "normal")
-      return { value: "0", unit: "em" };
-    if (t === "wide")
-      return { value: "0.025", unit: "em" };
-    if (t === "wider")
-      return { value: "0.05", unit: "em" };
-    if (t === "widest")
-      return { value: "0.1", unit: "em" };
-  }
-  if (["max", "min", "fit"].includes(t))
-    return { value: r, unit: "class" };
-  if (t.includes("/")) {
-    const [o, l] = C(t.split("/"), (d) => parseInt(d, 10));
-    return { value: s + (o / l * 100).toFixed(2).replace(".00", ""), unit: "%" };
-  }
-  return vt(parseFloat(t)) ? { value: `${s + parseFloat(t) * 4}`, unit: "px" } : { value: t, unit: "class" };
-};
-const rl = (r) => {
-  if (m(r))
-    return { value: "", unit: "" };
-  const s = r.match(/\[.*\]/g);
-  if (s === null)
-    return ll(r);
-  const t = x(s, "0", "").replace(/\[|\]/g, ""), o = r.startsWith("-") ? "-" : "", l = ue(t.match(/\d+.\d+|\d+/g));
-  return { value: `${o}${l}`, unit: t.replace(l, "") };
-}, ll = (r) => m(r) ? { value: "", unit: "" } : tl(r), nt = I.createContext({
-  setDragData: () => {
-  }
-}), sl = ({
-  unit: r,
-  currentValue: s,
-  onDrag: t,
-  onDragEnd: o,
-  onDragStart: l,
-  negative: d,
-  cssProperty: a
-}) => {
-  const { setDragData: c } = se(nt);
-  return /* @__PURE__ */ e.jsx(
-    "button",
-    {
-      type: "button",
-      onMouseDown: (i) => {
-        const p = {
-          onDrag: t,
-          onDragEnd: o,
-          dragging: !0,
-          dragStartY: i.pageY,
-          dragStartValue: `${s}`,
-          dragUnit: r,
-          negative: d,
-          cssProperty: a
-        };
-        l(p), c(p);
-      },
-      color: void 0,
-      className: "relative z-50 ml-1 hidden h-6 cursor-row-resize rounded bg-background/70 px-2 group-hover:inline",
-      children: /* @__PURE__ */ e.jsx(Lt, {})
-    }
-  );
-}, ol = ({ onSelect: r, current: s, units: t }) => /* @__PURE__ */ e.jsx("div", { "data-theme": "light", className: "-m-[7px] -mx-[13px] flex w-9 flex-col", children: t.map((o) => /* @__PURE__ */ e.jsx(
-  xe,
-  {
-    className: "h-max rounded-none px-1 py-1 text-right text-[11px] hover:bg-blue-400",
-    color: s === o ? "primary" : void 0,
-    size: "sm",
-    onClick: (l) => {
-      l.stopPropagation(), r(o);
-    },
-    children: o
-  },
-  o
-)) }), Ee = 50, al = (r) => {
-  const [s, t] = j(!1), [o, l] = j(""), { currentClass: d, onChange: a, classPrefix: c, cssProperty: i, units: p, negative: y } = r, [n, h] = j(i != null && i.toLowerCase().includes("width") ? "%" : p[0]), [g, u] = j(!1), [f, k] = j(""), [E, w] = j(!1), [$, L] = j(!1);
-  O(() => {
-    const { value: b, unit: v } = rl(d);
-    if (v === "") {
-      l(b), h(i != null && i.toLowerCase().includes("width") ? "%" : ue(p));
-      return;
-    }
-    h(v), l(v === "class" || m(b) ? "" : b);
-  }, [d, i, p]);
-  const N = fe((b) => a(b), [a], Ee), D = fe((b) => a(b, !1), [a], Ee), X = B(
-    (b = !1) => {
-      const v = Pe(`${o}`, p);
-      if (x(v, "error", !1)) {
-        u(!0);
-        return;
-      }
-      const S = x(v, "unit") !== "" ? x(v, "unit") : n;
-      if (S === "auto" || S === "none") {
-        N(`${c}${S}`);
-        return;
-      }
-      if (x(v, "value") === "")
-        return;
-      const J = `${x(v, "value", "").startsWith("-") ? "-" : ""}${c}[${x(v, "value", "").replace("-", "")}${S === "-" ? "" : S}]`;
-      b ? D(J) : N(J);
-    },
-    [N, D, o, n, c, p]
-  ), G = B(
-    (b) => {
-      const v = Pe(`${o}`, p);
-      if (x(v, "error", !1)) {
-        u(!0);
-        return;
-      }
-      if (b === "auto" || b === "none") {
-        N(`${c}${b}`);
-        return;
-      }
-      if (x(v, "value") === "")
-        return;
-      const S = x(v, "unit") !== "" ? x(v, "unit") : b, J = `${x(v, "value", "").startsWith("-") ? "-" : ""}${c}[${x(v, "value", "").replace("-", "")}${S === "-" ? "" : S}]`;
-      N(J);
-    },
-    [N, o, c, p]
-  );
-  return /* @__PURE__ */ e.jsx("div", { className: "flex w-full flex-col", children: /* @__PURE__ */ e.jsx("div", { className: "flex items-center justify-start", children: n === "class" ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-    /* @__PURE__ */ e.jsx("input", { className: "w-20 rounded py-1", readOnly: !0, value: d }),
-    /* @__PURE__ */ e.jsxs(F, { children: [
-      /* @__PURE__ */ e.jsx(z, { asChild: !0, children: /* @__PURE__ */ e.jsx("button", { type: "button", className: "invisible ml-3 mt-1 text-blue-600 group-hover:visible", children: /* @__PURE__ */ e.jsx(_e, {}) }) }),
-      /* @__PURE__ */ e.jsx(Z, { children: "Current value is using a Tailwind preset class." })
-    ] })
-  ] }) : /* @__PURE__ */ e.jsxs("div", { className: `group relative  flex items-center ${E ? "z-auto" : ""}`, children: [
-    /* @__PURE__ */ e.jsxs("div", { className: "flex items-center rounded-md border border-border", children: [
-      ["none", "auto"].indexOf(n) !== -1 ? null : /* @__PURE__ */ e.jsx(
-        "input",
-        {
-          readOnly: n === "class",
-          onKeyPress: (b) => {
-            b.key === "Enter" && X();
-          },
-          onKeyDown: (b) => {
-            if (b.keyCode !== 38 && b.keyCode !== 40)
-              return;
-            b.preventDefault(), L(!0);
-            const v = wt(b.target.value);
-            let S = Xe(v) ? 0 : v;
-            b.keyCode === 38 && (S += 1), b.keyCode === 40 && (S -= 1);
-            const M = `${S}`, dt = `${M.startsWith("-") ? "-" : ""}${c}[${M.replace("-", "")}${n === "-" ? "" : n}]`;
-            D(dt);
-          },
-          onKeyUp: (b) => {
-            $ && (b.preventDefault(), L(!1));
-          },
-          onBlur: () => X(),
-          onChange: (b) => {
-            u(!1), l(b.target.value);
-          },
-          onClick: (b) => {
-            var v;
-            (v = b == null ? void 0 : b.target) == null || v.select(), t(!1);
-          },
-          value: E ? f : o,
-          className: "h-6 w-14 rounded rounded-r-none bg-background pl-2 text-sm focus-visible:outline-0 ".concat(
-            " ",
-            g ? "border-red-500 text-red-500" : "border-foreground/20"
-          )
-        }
-      ),
-      /* @__PURE__ */ e.jsxs(F, { open: s, delayDuration: 100, children: [
-        /* @__PURE__ */ e.jsx(z, { asChild: !0, children: /* @__PURE__ */ e.jsxs(
-          "button",
-          {
-            type: "button",
-            onClick: () => t(!s),
-            className: "flex h-6 cursor-pointer items-center gap-x-1 rounded rounded-l-none bg-background p-px px-1 text-[11px] uppercase",
-            children: [
-              /* @__PURE__ */ e.jsx("span", { className: `inline-block ${p.length === 1 ? "px-2 font-semibold" : ""}`, children: n }),
-              p.length > 1 ? /* @__PURE__ */ e.jsx(Mt, {}) : null
-            ]
-          }
-        ) }),
-        /* @__PURE__ */ e.jsx(xr, { children: /* @__PURE__ */ e.jsx(Z, { className: "bg-background", children: /* @__PURE__ */ e.jsx(
-          ol,
-          {
-            units: p,
-            current: n,
-            onSelect: (b) => {
-              t(!1), h(b), G(b);
-            }
-          }
-        ) }) })
-      ] })
-    ] }),
-    ["none", "auto"].indexOf(n) !== -1 || E ? null : /* @__PURE__ */ e.jsx(
-      sl,
-      {
-        onDragStart: () => w(!0),
-        onDragEnd: (b) => {
-          if (k(() => ""), w(!1), m(b))
-            return;
-          const v = `${b}`, M = `${v.startsWith("-") ? "-" : ""}${c}[${v.replace("-", "")}${n === "-" ? "" : n}]`;
-          N(M);
-        },
-        onDrag: (b) => {
-          if (m(b))
-            return;
-          k(b);
-          const v = `${b}`, M = `${v.startsWith("-") ? "-" : ""}${c}[${v.replace("-", "")}${n === "-" ? "" : n}]`;
-          D(M);
-        },
-        currentValue: o,
-        unit: n,
-        negative: y,
-        cssProperty: i
-      }
-    )
-  ] }) }) });
-}, ae = (r) => {
-  const s = ge();
-  return jt(s, { property: r });
-}, nl = (r, s) => {
-  const t = {
-    xs: 0,
-    sm: 1,
-    md: 2,
-    lg: 3,
-    xl: 4,
-    "2xl": 5
-  };
-  return t[x(r, "mq", "xs")] <= t[s];
-}, il = {
-  width: "w-",
-  height: "h-",
-  minWidth: "min-w-",
-  minHeight: "min-h-",
-  maxWidth: "max-w-",
-  maxHeight: "max-h-",
-  zIndex: "z-",
-  gap: "gap-",
-  gapX: "gap-x-",
-  gapY: "gap-y-",
-  margin: "m-",
-  marginX: "mx-",
-  marginY: "my-",
-  marginTop: "mt-",
-  marginBottom: "mb-",
-  marginLeft: "ml-",
-  marginRight: "mr-",
-  padding: "p-",
-  paddingX: "px-",
-  paddingY: "py-",
-  paddingTop: "pt-",
-  paddingBottom: "pb-",
-  paddingLeft: "pl-",
-  paddingRight: "pr-",
-  spaceX: "space-x-",
-  spaceY: "space-y-",
-  border: "border-",
-  borderTop: "border-t-",
-  borderBottom: "border-b-",
-  borderLeft: "border-l-",
-  borderRight: "border-r-",
-  borderX: "border-x-",
-  borderY: "border-y-",
-  borderRadius: "rounded-",
-  borderRadiusTop: "rounded-t-",
-  borderRadiusRight: "rounded-r-",
-  borderRadiusBottom: "rounded-b-",
-  borderRadiusLeft: "rounded-l-",
-  borderRadiusTopLeft: "rounded-tl-",
-  borderRadiusTopRight: "rounded-tr-",
-  borderRadiusBottomRight: "rounded-br-",
-  borderRadiusBottomLeft: "rounded-bl-",
-  fontSize: "text-",
-  lineHeight: "leading-",
-  letterSpacing: "tracking-",
-  textIndent: "indent-",
-  rotate: "rotate-",
-  duration: "duration-",
-  transitionDelay: "delay-",
-  scale: "scale-",
-  scaleX: "scale-x-",
-  scaleY: "scale-y-",
-  translateX: "translate-x-",
-  translateY: "translate-y-",
-  skewX: "skew-x-",
-  skewY: "skew-y-",
-  top: "top-",
-  bottom: "bottom-",
-  left: "left-",
-  right: "right-",
-  inset: "inset-",
-  insetX: "inset-x-",
-  insetY: "inset-y-",
-  opacity: "opacity-",
-  flexBasis: "basis-"
-}, Le = {
-  xs: "",
-  sm: "640px",
-  md: "768px",
-  lg: "1024px",
-  xl: "1280px",
-  "2xl": "1536px"
-}, dl = (r) => `${r.toUpperCase()} ${Le[r] ? `(${Le[r]} & up)` : ""}`, Re = (r) => {
-  const { t: s } = K(), { type: t = "icons", label: o, property: l, onEmitChange: d = () => {
-  }, units: a, negative: c = !1 } = r, [i] = gr(), [p] = Qe(), [, y] = Be(), n = ae(l), h = qe(), g = Ge(), [u] = Je(), f = _(() => x(n, "fullCls", ""), [n]), k = B(
-    (D, X = !0) => {
-      const G = { dark: i, mq: y, mod: p, cls: D, property: l, fullCls: "" };
-      (i || p !== "") && (G.mq = "xs");
-      const b = Er(G);
-      h(u, [b], X);
-    },
-    [u, i, y, p, l, h]
-  ), E = B(() => {
-    g(u, [f]);
-  }, [u, f, g]), w = _(() => nl(n, y), [n, y]);
-  O(() => {
-    d(w, n);
-  }, [w, d, n]);
-  const [, , $] = Be(), L = B(
-    (D) => {
-      $({
-        xs: 400,
-        sm: 640,
-        md: 800,
-        lg: 1024,
-        xl: 1420,
-        "2xl": 1920
-      }[D]);
-    },
-    [$]
-  ), N = x(n, "dark", null) === i && x(n, "mod", null) === p && x(n, "mq", null) === y;
-  return /* @__PURE__ */ e.jsx(qr, { canChange: w, canReset: n && N, children: /* @__PURE__ */ e.jsxs("div", { className: "group flex flex-row items-center py-2 first:pt-0 last:pb-0", children: [
-    /* @__PURE__ */ e.jsx("div", { className: "relative w-[70px] truncate text-xs text-foreground", children: /* @__PURE__ */ e.jsx("span", { className: `text-[11px] ${n && !N ? "text-foreground" : ""}`, children: s(o) }) }),
-    /* @__PURE__ */ e.jsxs("div", { className: "flex flex-row items-center", children: [
-      /* @__PURE__ */ e.jsxs("div", { className: "w-[150px]", children: [
-        t === "arbitrary" ? /* @__PURE__ */ e.jsx(
-          al,
-          {
-            currentClass: x(n, "cls", ""),
-            classPrefix: x(il, l, ""),
-            units: a || [],
-            onChange: k,
-            negative: c,
-            cssProperty: l
-          }
-        ) : null,
-        t === "icons" && /* @__PURE__ */ e.jsx(Jr, { property: l, onChange: k }),
-        t === "range" && /* @__PURE__ */ e.jsx(Gr, { property: l, onChange: k }),
-        t === "color" && /* @__PURE__ */ e.jsx(el, { property: l, onChange: k }),
-        t === "dropdown" && /* @__PURE__ */ e.jsx(at, { label: o, property: l, onChange: k })
-      ] }),
-      /* @__PURE__ */ e.jsx("div", { className: `w-[30px] cursor-pointer ${f ? "visible" : "invisible"}`, children: N ? /* @__PURE__ */ e.jsx("button", { type: "button", onClick: () => E(), title: "Reset", className: "flex px-1.5 text-xs", children: /* @__PURE__ */ e.jsx(Ot, { className: "h-5 w-5 text-blue-500 hover:opacity-80" }) }) : w && n ? /* @__PURE__ */ e.jsxs(F, { delayDuration: 100, children: [
-        /* @__PURE__ */ e.jsx(z, { asChild: !0, children: /* @__PURE__ */ e.jsx(
-          "button",
-          {
-            type: "button",
-            className: "invisible ml-3 mt-1 rounded-full bg-blue-500 text-white group-hover:visible",
-            children: /* @__PURE__ */ e.jsx(_e, {})
-          }
-        ) }),
-        /* @__PURE__ */ e.jsx(Z, { children: /* @__PURE__ */ e.jsx("div", { className: "text-right", children: /* @__PURE__ */ e.jsxs("div", { children: [
-          "Current style is set at  ",
-          /* @__PURE__ */ e.jsxs("span", { className: "font-bold ", children: [
-            dl(x(n, "mq")),
-            i && !n.dark ? "(Light mode)" : ""
-          ] }),
-          /* @__PURE__ */ e.jsx("br", {}),
-          /* @__PURE__ */ e.jsxs(
-            "button",
-            {
-              type: "button",
-              onClick: () => L(x(n, "mq")),
-              className: "block w-full cursor-default text-right font-semibold text-blue-500",
-              children: [
-                "Switch to ",
-                x(n, "mq").toUpperCase()
-              ]
-            }
-          )
-        ] }) }) })
-      ] }) : null })
-    ] })
-  ] }) });
-}, cl = ["px", "%", "em", "rem", "ch", "vh", "vw"], it = ({
-  label: r,
-  options: s,
-  borderB: t = !1,
-  borderT: o = !1,
-  type: l = "arbitrary",
-  units: d = cl,
-  negative: a = !1
-}) => {
-  const { t: c } = K(), [i, p] = j(s[0].key), y = ge(), n = B((h) => C(y, "property").includes(h), [y]);
-  return /* @__PURE__ */ e.jsxs(
-    "div",
-    {
-      className: `mb-2 border-gray-800 py-2 first:pt-0 last:pb-0 ${t ? "border-b" : ""} ${o ? "border-t" : ""}`,
-      children: [
-        /* @__PURE__ */ e.jsxs("div", { className: "flex flex-row text-xs", children: [
-          r && /* @__PURE__ */ e.jsx("span", { className: "relative w-[70px] flex-none text-xs text-foreground", children: c(r) }),
-          /* @__PURE__ */ e.jsx("div", { className: "mb-3 flex grow flex-row flex-wrap gap-x-px", children: I.Children.toArray(
-            s.map(({ label: h, key: g }) => /* @__PURE__ */ e.jsx("div", { className: "first:rounded-l last:rounded-r", children: /* @__PURE__ */ e.jsxs(F, { children: [
-              /* @__PURE__ */ e.jsx(z, { asChild: !0, children: /* @__PURE__ */ e.jsxs(
-                "button",
-                {
-                  type: "button",
-                  onClick: () => p(g),
-                  className: `relative cursor-pointer rounded-full p-1 text-[8px] ${g === i ? " bg-[#3E57F0] text-white" : "text-gray-600 dark:text-gray-300"}`,
-                  children: [
-                    I.createElement("div", {
-                      className: n(g) ? "-bottom-1.5 absolute bg-[#3E57F0] h-[2px] left-0 w-full" : ""
-                    }),
-                    I.createElement(x(ot, g, ze), { className: "text-inherit w-3 h-3" })
-                  ]
-                }
-              ) }),
-              /* @__PURE__ */ e.jsx(Z, { children: Y(le(h)) })
-            ] }) }))
-          ) })
-        ] }),
-        /* @__PURE__ */ e.jsx("div", { className: "mt-0 flex items-center", children: /* @__PURE__ */ e.jsx(
-          Re,
-          {
-            type: l,
-            units: [...d],
-            label: "",
-            property: i,
-            negative: a
-          }
-        ) })
-      ]
-    }
-  );
-}, pl = ({ heading: r, items: s }) => {
-  const { t } = K(), o = ge(), l = _(() => {
-    const d = (i) => U(
-      i.map((p) => p.styleType === "multiple" ? C(p.options, "key") : p.property)
-    ), a = U(
-      s.map((i) => i.styleType === "accordion" ? d(i.items) : i.styleType === "multiple" ? C(i.options, "key") : i.property)
-    ), c = C(o, "property");
-    return Ye(a, c).length > 0;
-  }, [o, s]);
-  return /* @__PURE__ */ e.jsxs("details", { children: [
-    /* @__PURE__ */ e.jsx("summary", { className: "my-px cursor-default rounded-md bg-background p-px px-2 text-[11px] text-foreground", children: /* @__PURE__ */ e.jsxs("div", { className: "inline", children: [
-      t(r),
-      l ? /* @__PURE__ */ e.jsx(
-        "span",
-        {
-          className: `ml-1 mr-2 inline-block h-[8px] w-[8px] rounded-full ${l ? "bg-blue-500" : "bg-gray-300"}`
-        }
-      ) : null
-    ] }) }),
-    /* @__PURE__ */ e.jsx("div", { className: "p-2", children: s.map((d) => d.styleType === "multiple" ? /* @__PURE__ */ e.jsx(it, { ...d }, d.label) : /* @__PURE__ */ e.jsx(Re, { ...d }, d.label)) })
-  ] });
-}, ul = Me({}), me = ({ section: r }) => {
-  const { t: s } = K(), t = ge(), o = B(
-    (a = []) => {
-      const c = {};
-      for (let p = 0; p < t.length; p++)
-        c[t[p].property] = t[p].cls;
-      let i = !0;
-      for (const p in a)
-        if (!ye(c, p) || c[p] !== a[p]) {
-          i = !1;
-          break;
-        }
-      return i;
-    },
-    [t]
-  ), l = _(() => {
-    if (t.length > 0 && r.heading === "classes.heading")
-      return !0;
-    const a = (p) => U(
-      p.map((y) => y.styleType === "multiple" ? U(C(y.options, "key")) : y.property)
-    ), c = U(
-      r.items.map((p) => p.styleType === "accordion" ? a(p.items) : p.styleType === "multiple" ? U(C(p.options, "key")) : p.property)
-    ), i = C(t, "property");
-    return Ye(c, i).length > 0;
-  }, [t, r.heading, r.items]), d = _(() => ({}), []);
-  return /* @__PURE__ */ e.jsx(ul.Provider, { value: d, children: /* @__PURE__ */ e.jsxs(de, { value: r.heading, children: [
-    /* @__PURE__ */ e.jsx(ce, { className: "px-3 py-2 text-xs hover:no-underline", children: /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-x-2", children: [
-      /* @__PURE__ */ e.jsx("div", { className: `h-[8px] w-[8px] rounded-full ${l ? "bg-blue-500" : "bg-gray-300"}` }),
-      s(r.heading)
-    ] }) }),
-    /* @__PURE__ */ e.jsx(pe, { className: "bg-gray-100 px-3.5 py-2", children: I.Children.toArray(
-      r.items.map((a) => ye(a, "component") ? I.createElement(a.component, { key: a.label }) : ye(a, "styleType") ? a.styleType === "multiple" ? /* @__PURE__ */ e.jsx(it, { ...a }, a.label) : a.styleType === "accordion" && o(a == null ? void 0 : a.conditions) ? /* @__PURE__ */ e.jsx(pl, { ...a }, a.label) : null : /* @__PURE__ */ e.jsx(Re, { ...a }, a.label))
-    ) })
-  ] }) });
-}, xl = ({
-  item: r,
-  index: s,
-  canDelete: t,
-  onChange: o,
-  onRemove: l
-}) => /* @__PURE__ */ e.jsxs("div", { className: `flex flex-col gap-1 border-gray-400 py-2 ${t ? "border-b" : ""}`, children: [
-  /* @__PURE__ */ e.jsx(
-    "input",
-    {
-      name: "key",
-      onChange: (d) => o(d, s),
-      value: r.key,
-      placeholder: "Key",
-      className: "w-full rounded border-gray-300 bg-background p-0.5 pl-2 text-sm focus-visible:outline-0",
-      autoComplete: "off",
-      autoCapitalize: "off"
-    }
-  ),
-  /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-x-1.5", children: [
-    /* @__PURE__ */ e.jsx(
-      "input",
-      {
-        name: "value",
-        onChange: (d) => m(r.key) ? {} : o(d, s),
-        value: r.value,
-        placeholder: "Value",
-        className: "w-full rounded border-gray-300 bg-background p-0.5 pl-2 text-sm focus-visible:outline-0",
-        autoComplete: "off",
-        autoCapitalize: "off"
-      }
-    ),
-    /* @__PURE__ */ e.jsx(
-      Xt,
-      {
-        onClick: l,
-        className: "h-6 w-6 cursor-pointer rounded border border-red-400 p-1 text-red-400 hover:opacity-80"
-      }
-    )
-  ] })
-] }), gl = ({ section: r }) => {
-  var h;
-  const { setSyncState: s } = hr(), t = q(), [o, l] = j([]), [d] = Se(), a = Ue(), c = `${x(d, "0.prop")}_attrs`;
-  ne.useEffect(() => {
-    const g = C(x(t, c), (u, f) => ({ key: f, value: u }));
-    m(g) ? l([]) : l(g);
-  }, [x(t, c)]);
-  const i = () => l([...o, { key: "", value: "" }]), p = (g) => {
-    const u = we(o, (f, k) => g !== k);
-    n(u);
-  }, y = (g, u) => {
-    const f = [...o];
-    f[u][g.target.name] = g.target.value, n(f);
-  }, n = ne.useCallback(
-    (g = []) => {
-      const u = {};
-      ke(g, (f) => {
-        m(f.key) || Oe(u, f.key, f.value);
-      }), a([x(t, "_id")], { [c]: u }), s("UNSAVED");
-    },
-    [t, s, a, c]
-  );
-  return /* @__PURE__ */ e.jsxs(de, { value: r.heading, children: [
-    /* @__PURE__ */ e.jsx(ce, { className: "px-3 py-2 text-xs hover:no-underline", children: /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-x-2", children: [
-      /* @__PURE__ */ e.jsx(
-        "div",
-        {
-          className: `h-[8px] w-[8px] rounded-full ${m(x(t, c)) ? "bg-gray-300" : "bg-blue-500"}`
-        }
-      ),
-      "Attributes"
-    ] }) }),
-    /* @__PURE__ */ e.jsx(pe, { className: "bg-gray-100 px-3.5 py-2", children: /* @__PURE__ */ e.jsxs("div", { className: "no-scrollbar flex min-h-max flex-col gap-y-2 overflow-y-auto bg-gray-100 p-px", children: [
-      /* @__PURE__ */ e.jsxs(Te, { className: "mt-2 flex w-full items-center justify-between", children: [
-        "Add Custom attributes",
-        /* @__PURE__ */ e.jsxs(
-          "div",
-          {
-            className: `flex h-6 w-max items-center justify-center gap-x-0.5 rounded-full border p-1 px-2 text-xs ${!m(o) && m((h = ve(o)) == null ? void 0 : h.key) ? "cursor-not-allowed border-gray-400 text-gray-400" : "cursor-pointer border-blue-400 text-blue-400 hover:bg-blue-400 hover:text-white"}`,
-            onClick: () => {
-              var g;
-              !m(o) && m((g = ve(o)) == null ? void 0 : g.key) || i();
-            },
-            children: [
-              /* @__PURE__ */ e.jsx(Ne, { width: 12, height: 12 }),
-              " Add"
-            ]
-          }
-        )
-      ] }),
-      /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col", children: [
-        m(o) && /* @__PURE__ */ e.jsx("div", { className: "flex h-12 items-center justify-center text-sm text-gray-400", children: "Click + Add to add attributes" }),
-        ne.Children.toArray(
-          C(o, (g, u) => {
-            const f = o.length > 0 && u < o.length - 1;
-            return /* @__PURE__ */ e.jsx(
-              xl,
-              {
-                item: g,
-                index: u,
-                canDelete: f,
-                onChange: y,
-                onRemove: () => p(u)
-              }
-            );
-          })
-        )
-      ] })
-    ] }) })
-  ] });
-};
-function hl() {
-  const [r, s] = Qe(), { flexChild: t, gridChild: o } = yr(), [, l] = $r(br), { t: d } = K(), [a] = Se();
-  return m(a) ? /* @__PURE__ */ e.jsx("div", { className: "p-4 text-center", children: /* @__PURE__ */ e.jsxs("div", { className: "space-y-4 rounded-xl p-4", children: [
-    /* @__PURE__ */ e.jsx(Ze, { className: "mx-auto text-3xl" }),
-    /* @__PURE__ */ e.jsx("h1", { children: d("no_styling_block_selected") }),
-    /* @__PURE__ */ e.jsxs("p", { className: "text-xs ", children: [
-      "Hint: Styling allowed blocks are highlighted with",
-      " ",
-      /* @__PURE__ */ e.jsx("span", { className: "border border-orange-500 p-px", children: "orange" }),
-      " border"
-    ] })
-  ] }) }) : (
-    // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
-    /* @__PURE__ */ e.jsxs("div", { onClick: () => l(!1), className: "flex h-full flex-col", children: [
-      /* @__PURE__ */ e.jsx("div", { className: "flex flex-col space-x-4 space-y-3 border-b h-12 border-border px-4 py-1", children: /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-end gap-x-1.5", children: [
-        /* @__PURE__ */ e.jsx(Te, { htmlFor: "", className: "flex gap-x-1.5 text-xs italic", children: "State" }),
-        /* @__PURE__ */ e.jsxs(mr, { defaultValue: r, onValueChange: (c) => s(c), children: [
-          /* @__PURE__ */ e.jsx(fr, { className: "h-auto w-fit p-1 px-3", children: /* @__PURE__ */ e.jsx(vr, { placeholder: "State" }) }),
-          /* @__PURE__ */ e.jsxs(wr, { children: [
-            /* @__PURE__ */ e.jsx(V, { value: "", children: "Normal" }),
-            /* @__PURE__ */ e.jsx(V, { value: "hover", children: "Hover" }),
-            /* @__PURE__ */ e.jsx(V, { value: "active", children: "Active" }),
-            /* @__PURE__ */ e.jsx(V, { value: "focus", children: "Focus" }),
-            /* @__PURE__ */ e.jsx(V, { value: "before", children: "Before" }),
-            /* @__PURE__ */ e.jsx(V, { value: "after", children: "After" }),
-            /* @__PURE__ */ e.jsx(V, { value: "only", children: "Only" }),
-            /* @__PURE__ */ e.jsx(V, { value: "first", children: "First" }),
-            /* @__PURE__ */ e.jsx(V, { value: "last", children: "Last" }),
-            /* @__PURE__ */ e.jsx(V, { value: "first-letter", children: "First Letter" }),
-            /* @__PURE__ */ e.jsx(V, { value: "first-line", children: "First Line" }),
-            /* @__PURE__ */ e.jsx(V, { value: "disabled", children: "Disabled" })
-          ] })
-        ] })
-      ] }) }),
-      /* @__PURE__ */ e.jsx(et, { className: "no-scrollbar -mx-1 flex-1 max-h-full overflow-y-hidden overflow-x-hidden", children: /* @__PURE__ */ e.jsxs(Ke, { defaultValue: ["Layout"], type: "multiple", className: "w-full", children: [
-        t && /* @__PURE__ */ e.jsx(me, { section: Wr }),
-        o ? /* @__PURE__ */ e.jsx(me, { section: Ur }) : null,
-        Kr.map((c) => /* @__PURE__ */ e.jsx(me, { section: c }, c.heading)),
-        /* @__PURE__ */ e.jsx(gl, { section: { heading: "Attributes" } })
-      ] }) })
-    ] })
-  );
-}
-const yl = {
-  px: 1,
-  "%": 1,
-  em: 100,
-  rem: 100,
-  ch: 1,
-  vw: 1,
-  vh: 1,
-  "-": 1,
-  deg: 1,
-  ms: 0.1
-}, Cs = () => {
-  const r = q(), { t: s } = K(), [t, o] = I.useState(""), [l, d] = I.useState({
-    onDrag: (i) => i,
-    onDragEnd: (i) => i,
-    dragStartY: 0,
-    dragging: !1,
-    dragStartValue: 0,
-    dragUnit: "",
-    negative: !1,
-    cssProperty: ""
-  }), a = fe(
-    (i) => {
-      const p = !x(l, "negative", !1), y = x(l, "cssProperty", "");
-      let n = parseFloat(l.dragStartValue);
-      n = Xe(n) ? 0 : n;
-      let h = yl[l.dragUnit];
-      (W(y, "scale") || y === "opacity") && (h = 10);
-      let u = (l.dragStartY - i.pageY) / h + n;
-      p && u < 0 && (u = 0), y === "opacity" && u > 1 && (u = 1), l.onDrag(`${u}`), o(`${u}`);
-    },
-    [l],
-    50
-  ), c = B(() => {
-    setTimeout(() => l.onDragEnd(`${t}`), 100), d({
-      onDrag: (i) => i,
-      onDragEnd: (i) => i,
-      dragStartY: 0,
-      dragging: !1,
-      dragStartValue: 0,
-      dragUnit: "",
-      negative: !1,
-      cssProperty: ""
-    });
-  }, [l, t, d]);
-  return Ct(r) ? /* @__PURE__ */ e.jsx("div", { className: "p-4 text-center", children: /* @__PURE__ */ e.jsxs("div", { className: "space-y-4 rounded-xl p-4", children: [
-    /* @__PURE__ */ e.jsx(Ze, { className: "mx-auto text-3xl" }),
-    /* @__PURE__ */ e.jsx("h1", { children: s("no_block_selected_for_styling") })
-  ] }) }) : /* @__PURE__ */ e.jsx(rt, { children: /* @__PURE__ */ e.jsxs(nt.Provider, { value: { setDragData: d }, children: [
-    l.dragging ? /* @__PURE__ */ e.jsx(
-      "div",
-      {
-        onMouseMove: a,
-        onMouseUp: () => c(),
-        className: "absolute inset-0 z-30 cursor-row-resize bg-gray-300/10"
-      }
-    ) : null,
-    /* @__PURE__ */ e.jsxs(jr, { defaultValue: "settings", className: "flex h-full w-full flex-col py-1", children: [
-      /* @__PURE__ */ e.jsxs(Cr, { className: "mx-1 grid grid-cols-2", children: [
-        /* @__PURE__ */ e.jsx(De, { value: "settings", children: s("settings") }),
-        /* @__PURE__ */ e.jsx(De, { value: "styling", children: s("styling") })
-      ] }),
-      /* @__PURE__ */ e.jsx($e, { value: "settings", className: "no-scrollbar h-full flex-1 overflow-y-auto overflow-x-hidden", children: /* @__PURE__ */ e.jsx(et, { className: "no-scrollbar max-h-full flex-1 overflow-x-hidden overflow-y-hidden pb-5", children: /* @__PURE__ */ e.jsx(zr, {}) }) }),
-      /* @__PURE__ */ e.jsx($e, { value: "styling", className: "h-full flex-1 overflow-y-auto overflow-x-hidden", children: /* @__PURE__ */ e.jsx(hl, {}) })
-    ] })
-  ] }) });
-};
-export {
-  Cs as default
-};