@react-form-builder/designer/dist/index.js

React Form Library Drag and Drop.

var Xr = Object.defineProperty;
var Yr = (t, e, n) => e in t ? Xr(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
var S = (t, e, n) => (Yr(t, typeof e != "symbol" ? e + "" : e, n), n), Mt = (t, e, n) => {
  if (!e.has(t))
    throw TypeError("Cannot " + n);
};
var O = (t, e, n) => (Mt(t, e, "read from private field"), n ? n.call(t) : e.get(t)), ce = (t, e, n) => {
  if (e.has(t))
    throw TypeError("Cannot add the same private member more than once");
  e instanceof WeakSet ? e.add(t) : e.set(t, n);
}, ve = (t, e, n, o) => (Mt(t, e, "write to private field"), o ? o.call(t, n) : e.set(t, n), n);
var at = (t, e, n) => (Mt(t, e, "access private method"), n);
import { jsx as r, jsxs as h, Fragment as F } from "@emotion/react/jsx-runtime";
import b from "@emotion/styled";
import { createNonNullableContext as _e, forwardRef as Le, namedObserver as w, useStore as W, toLabeledValues as Ot, KeySymbol as Qr, ComponentStore as Ne, timeFormat as Et, ActionEventArgsDeclaration as ei, IFormDataDeclaration as ti, useComponentData as $, isPromise as ni, DataValidator as oi, isProperty as un, isValidatorPropertyBlockType as At, className as ri, useTooltipType as jt, ComponentDataProvider as Ze, key as ii, createProperty as ai, createAnnotation as si, getValidatorPropertyBlockType as mn, boolean as li, globalDefaultLanguage as Zn, Language as re, BiDi as pe, findLanguage as ci, definePreset as di, getKey as ui, ComponentData as mi, nameObservable as Ue, BuilderView as Un, ActionDefinition as Kn, treeForEach as Tt, isContainer as Jn, PersistedFormVersion as hi, screenModel as hn, initFormFields as pi, CalculableResult as Ce, generateUniqueName as gi, AsyncFunction as Wt, calculatePropertyValue as Ci, getFluentCompatibleId as fi, testFluentLocalization as bi, getFluentData as vi, nameAutorun as Ee, DefaultWrapper as wi, checkSlotCondition as pn, groupBy as yi, ComponentTree as He, TemplateField as xi, slotModel as ki, node as Si, toArray as Li, findTreeElementDepth as Mi, emotionCache as gn, loadResource as Gn, unloadResource as Ei, ViewerPropsProvider as Ai, StoreProvider as Ti, LicenseManager as Pi, useDisposable as Fi, Store as Ri, FormViewerPropsStore as Di, ComponentState as Ii, getChildren as Bi, useViewerProps as Vi, BuilderModeProvider as zi, FormViewer as Ni, oneOf as qn, useErrorModel as Hi, tooltipType as $i, useLicense as Oi, SuppressResizeObserverErrors as ji } from "@react-form-builder/core";
import { BuilderView as Ru } from "@react-form-builder/core";
import * as C from "react";
import { useCallback as m, useState as A, useEffect as E, cloneElement as Xn, useRef as q, useMemo as M, useReducer as Yn, createElement as Wi, Component as _i, useImperativeHandle as Zi, Suspense as Ui } from "react";
import { Checkbox as _t, Table as Ie, InputPicker as Be, IconButton as G, InputNumber as bt, Input as ie, Button as H, Form as X, Whisper as fe, Tooltip as Ke, InputGroup as Q, TagInput as Ki, Popover as Zt, DatePicker as Qn, SelectPicker as Ji, Animation as eo, ButtonGroup as me, List as to, Dropdown as B, Divider as Gi, TagPicker as qi, RadioGroup as Xi, Radio as Yi, Message as vt, Schema as pt, CustomProvider as Qi, useToaster as ea, Modal as J, Row as ta, Col as na, Nav as no, Loader as oa } from "rsuite";
import { cx as N, css as Ut } from "@emotion/css";
import { observer as ra } from "mobx-react";
import { Resizable as ia } from "re-resizable";
import { computed as aa, makeAutoObservable as Je, runInAction as Cn, observable as Te, action as $e, reaction as oo, autorun as Ae, makeObservable as sa } from "mobx";
import { debounceTime as la, distinctUntilChanged as ca, Subject as da } from "rxjs";
import { Close as de, Plus as Ge, Icon as Kt, Code as ro, Check as ua, Copy as ma, ArrowUpLine as io, ArrowDownLine as wt, RemindFill as ha, SortUp as pa, SortDown as ga, ArrowRightLine as Ca, Danger as fa, Export as ba, Import as va, FileDownload as wa, FileUpload as ya, Search as xa, ExpandOutline as ka, CollaspedOutline as Sa } from "@rsuite/icons";
import { upperFirst as ao, isObject as so, assign as Jt, isEmpty as lo, startCase as co, isUndefined as yt, merge as La, toUpper as uo, replace as Ma, camelCase as Ea } from "lodash-es";
import * as mo from "@fortawesome/free-solid-svg-icons/faCode.js";
import * as Aa from "@fortawesome/free-solid-svg-icons/faGlobe.js";
import * as st from "@fortawesome/free-solid-svg-icons/faMarker.js";
import { useTranslation as P, initReactI18next as Ta } from "react-i18next";
import { css as qe, CacheProvider as Pa } from "@emotion/react";
import { RgbaColorPicker as Fa } from "react-colorful";
import { faMarker as Ra, faGlobe as Da, faBars as Ia } from "@fortawesome/free-solid-svg-icons";
import fn, { t as Ba } from "i18next";
import * as Va from "@fortawesome/free-solid-svg-icons/faCheck.js";
import { format as ho, parse as za } from "date-fns";
import { constrainedEditor as Na } from "constrained-editor-plugin";
import Ha, { loader as $a } from "@monaco-editor/react";
import "monaco-editor";
import Oa from "i18next-browser-languagedetector";
import ja from "i18next-resources-to-backend";
import Wa from "date-fns/locale/ar-EG/index.js";
import _a from "date-fns/locale/de/index.js";
import Za from "date-fns/locale/en-US/index.js";
import Ua from "date-fns/locale/es/index.js";
import Ka from "date-fns/locale/fa-IR/index.js";
import Ja from "date-fns/locale/fr/index.js";
import po from "date-fns/locale/hi/index.js";
import Ga from "date-fns/locale/it/index.js";
import qa from "date-fns/locale/ja/index.js";
import Xa from "date-fns/locale/ko/index.js";
import go from "date-fns/locale/sr/index.js";
import Ya from "date-fns/locale/zh-CN/index.js";
import { arEG as Qa, deDE as es, enUS as Co, itIT as ts, faIR as ns, frFR as os, esES as rs, jaJP as is, koKR as as, zhCN as ss } from "rsuite/esm/locales/index.js";
import * as ls from "@fortawesome/free-solid-svg-icons/faBookmark.js";
import * as fo from "@fortawesome/free-solid-svg-icons/faPlay.js";
import { useDrag as cs, useDrop as bo, useDragLayer as Xe, DndProvider as ds } from "react-dnd";
import { getEmptyImage as us, HTML5Backend as ms } from "react-dnd-html5-backend";
import { createPortal as hs } from "react-dom";
import * as ps from "@fortawesome/free-regular-svg-icons/faClone.js";
import * as gs from "@fortawesome/free-regular-svg-icons/faTrashAlt.js";
import vo from "scroll-into-view-if-needed";
import * as Cs from "@fortawesome/free-regular-svg-icons/faBookmark.js";
import * as fs from "@fortawesome/free-solid-svg-icons/faRedo.js";
import * as It from "@fortawesome/free-solid-svg-icons/faSave.js";
import * as bs from "@fortawesome/free-solid-svg-icons/faUndo.js";
import * as vs from "@fortawesome/free-solid-svg-icons/faTrash.js";
import { saveAs as ws } from "file-saver";
import wo from "jszip";
import * as yo from "@fortawesome/free-solid-svg-icons/faPaintBrush.js";
import * as ys from "@fortawesome/free-solid-svg-icons/faMoon.js";
import * as xs from "@fortawesome/free-solid-svg-icons/faSun.js";
import * as ks from "@fortawesome/free-solid-svg-icons/faDesktop.js";
import * as Ss from "@fortawesome/free-solid-svg-icons/faMobile.js";
import * as Ls from "@fortawesome/free-solid-svg-icons/faTablet.js";
import * as Ms from "@fortawesome/free-solid-svg-icons/faList.js";
import * as Es from "@fortawesome/free-solid-svg-icons/faPlusCircle.js";
import * as As from "@fortawesome/free-solid-svg-icons/faSitemap.js";
import * as Ts from "@fortawesome/free-solid-svg-icons/faSlidersH.js";
import * as Ps from "@fortawesome/free-solid-svg-icons/faBolt.js";
import * as Fs from "@fortawesome/free-solid-svg-icons/faCircle.js";
import * as Rs from "@fortawesome/free-solid-svg-icons/faSpellCheck.js";
const [
  /**
   * **Internal use only.**
   */
  y,
  /**
   * **Internal use only.**
   */
  Ds
] = _e("BuildStoreContext"), ae = (t, e) => {
  e.displayName = t;
  const n = e, o = `FE_${t}`;
  return (i) => {
    var p;
    const s = (p = y().props.customization) == null ? void 0 : p[t];
    if (!s)
      return /* @__PURE__ */ r(n, { ...i, className: N(o, i.className) });
    if (s.hidden)
      return null;
    const { style: l, customRenderer: c } = s, d = N(o, i == null ? void 0 : i.className, s.className, Ut`${l}`, t), u = /* @__PURE__ */ r(n, { ...i, className: d });
    return c ? c(u, e, i) : u;
  };
}, U = (t, e) => ae(t, ra(e)), { Cell: Is } = Ie, Ye = b(Is)`
  padding: 0;

  & .rs-table-cell-content {
    padding: 9px 3px;
  }
`, Bs = b(_t)`
  & .rs-checkbox-wrapper {
    left: 4px;
    top: 6px;
  }
`, Vs = ({ rowData: t, dataKey: e, rowIndex: n, onChange: o, type: i, ...a }) => {
  const s = t[e] ?? "", l = m((d) => {
    t[e] = d, o == null || o(d, e, n);
  }, [e, o, t, n]);
  return /* @__PURE__ */ r(Ye, { ...a, children: /* @__PURE__ */ r(i === "number" ? bt : ie, { value: s, onChange: l, size: "sm" }) });
}, Mu = ({ rowData: t, dataKey: e, rowIndex: n, onChange: o, ...i }) => {
  const a = t[e] ?? !1, s = m((l, c) => {
    t[e] = c, o == null || o(c, e, n);
  }, [e, o, t, n]);
  return /* @__PURE__ */ r(Ye, { ...i, children: /* @__PURE__ */ r(Bs, { inline: !0, checked: a, onChange: s }) });
}, zs = ({ rowData: t, dataKey: e, rowIndex: n, options: o, onChange: i, ...a }) => {
  const s = t[e] ?? "", l = m((c) => {
    t[e] = c, i == null || i(c, e, n);
  }, [e, i, t, n]);
  return /* @__PURE__ */ r(Ye, { ...a, children: /* @__PURE__ */ r(
    Be,
    {
      value: s,
      data: o,
      onChange: l,
      cleanable: !1,
      creatable: !0,
      block: !0,
      size: "sm",
      placement: "auto"
    }
  ) });
}, Ns = ({ rowData: t, rowIndex: e, onAction: n, icon: o, ...i }) => /* @__PURE__ */ r(Ye, { ...i, children: /* @__PURE__ */ r(
  G,
  {
    appearance: "subtle",
    size: "sm",
    onClick: () => n(e),
    icon: o()
  }
) }), { ErrorMessage: Hs } = X, { Column: $s, HeaderCell: Os } = Ie, js = b(Ie)`
  .rs-table-cell, .rs-table-row {
    background-color: transparent !important;
  }

  &.hideHeader {
    margin-bottom: -40px;

    .rs-table-header-row-wrapper {
      display: none !important;
    }

    .rs-table-body-row-wrapper {
      top: 0 !important;
    }
  }
`, Gt = (t) => {
  const [e, n] = A({}), [o, i] = A(!1), {
    data: a = [],
    onChange: s,
    columns: l,
    label: c,
    errorMessage: d,
    autoAdd: u,
    hideHeader: p,
    onAdd: g,
    onRemove: f,
    ...v
  } = t, { autoHeight: x, maxHeight: k } = e, L = p ? 0 : t.headerHeight ?? 40, D = t.rowHeight ?? 46, Z = t.maxRows ?? 5, K = a.length <= Z, le = t.renderEmpty ? L + D : 0, Me = L + D * Z, be = a.length > Z ? Me : le, Y = m((te) => {
    if (u) {
      const dn = te[te.length - 1];
      (!dn || Object.values(dn).some((qr) => qr)) && te.push({});
    }
    s == null || s(te);
  }, [u, s]), he = m(() => {
    n({
      autoHeight: K,
      maxHeight: be
    });
  }, [be, K]), R = m(() => {
    Y == null || Y([...a, {}]), i(!0), he(), g == null || g(a.length);
  }, [a, Y, he, g]), I = m((te) => {
    a.splice(te, 1), Y == null || Y(a), he(), f == null || f(te);
  }, [a, Y, he, f]), ee = () => l == null ? void 0 : l.map((te) => Xn(te, {
    onChange: () => Y == null ? void 0 : Y([...a])
  })), Gr = () => {
    const te = {};
    return o && (te.y = Number.MAX_SAFE_INTEGER, i(!1)), te;
  };
  return E(he, []), /* @__PURE__ */ h("div", { children: [
    !!c && /* @__PURE__ */ r("label", { children: c }),
    /* @__PURE__ */ h(
      js,
      {
        data: a,
        headerHeight: L,
        rowHeight: D,
        height: k,
        autoHeight: x,
        shouldUpdateScroll: Gr,
        className: N({ hideHeader: p }),
        ...v,
        children: [
          ee(),
          /* @__PURE__ */ h($s, { width: 34, children: [
            /* @__PURE__ */ r(Os, { children: /* @__PURE__ */ r("div", {}) }),
            /* @__PURE__ */ r(Ns, { onAction: I, icon: () => /* @__PURE__ */ r(de, {}) })
          ] })
        ]
      }
    ),
    !!d && /* @__PURE__ */ r(Hs, { show: !!d, placement: "bottomStart", children: d }),
    !u && /* @__PURE__ */ r(H, { appearance: "default", size: "sm", onClick: R, style: { marginTop: 10 }, block: !0, children: /* @__PURE__ */ r(Ge, {}) })
  ] });
}, { Column: Ws, HeaderCell: _s } = Ie, qt = (t) => t.map(({ name: e, input: n, title: o, inputProps: i = {} }) => {
  const a = n ?? Vs;
  return /* @__PURE__ */ h(Ws, { flexGrow: 1, children: [
    /* @__PURE__ */ r(_s, { children: o ?? ao(e) }),
    /* @__PURE__ */ r(a, { dataKey: e, ...i })
  ] }, e);
});
let Zs = 0;
function Us(t) {
  const e = ++Zs;
  return t ? `${t}${e}` : `${e}`;
}
function xo(t) {
  const e = q(null);
  return e.current || (e.current = Us(t)), e.current;
}
const [
  /**
   * **Internal use only.**
   */
  Ks,
  /**
   * **Internal use only.**
   */
  Xt
] = _e("TooltipPlacementContext"), bn = b.label`
  min-width: 80px;
  cursor: pointer;
  user-select: none;

  ${({ hinted: t }) => t && `
    :hover {
      text-decoration: underline;
      text-decoration-style: dotted;
    }
  `};

  &.required:after {
    padding-left: 3px;
    content: "*";
    color: red;
  }
`, ue = ({ hint: t, children: e, ...n }) => {
  const o = Ks(), i = n.placement ?? o;
  return t ? /* @__PURE__ */ r(fe, { speaker: /* @__PURE__ */ r(Ke, { children: t }), placement: i, trigger: "hover", children: e }) : /* @__PURE__ */ r(F, { children: e });
}, ko = ({ hint: t, children: e, ...n }) => t ? /* @__PURE__ */ r(ue, { hint: t, children: /* @__PURE__ */ r(bn, { ...n, hinted: !0, children: e }) }) : /* @__PURE__ */ r(bn, { ...n, children: e }), xt = ({ hint: t, hintPlacement: e, ...n }) => /* @__PURE__ */ r(ue, { hint: t, placement: e ?? "bottom", children: /* @__PURE__ */ r(G, { ...n, size: "xs" }) }), T = (t) => {
  const [e, { exists: n }] = P();
  return (o) => {
    const i = `${t}.${o}`;
    return n(i) ? e(i) : "";
  };
}, Yt = 5, z = b.div`
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: ${({ gap: t }) => t ?? Yt}px;
`, se = b.div`
  display: flex;
  gap: ${({ gap: t }) => t ?? Yt}px;
  ${({ stretchElements: t }) => t && "& > * { flex: 1; }"};
  ${({ spaceBetween: t }) => t && "justify-content: space-between"};
`, So = b.div`
  display: flex;
  gap: 10px;
  justify-content: space-between;
  align-items: center;

  & > label {
    width: 100px;
    min-width: 80px;
  }
`, Lo = qe`
  && {
    display: flex;
    position: relative;
    background-color: var(--rs-btn-default-bg);
    border-radius: 10px;
    padding: 8px;
    padding-inline-start: 12px;
    align-items: center;
    user-select: none;
    justify-content: space-between;
  }
`, Mo = qe`
  && {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: ${Yt}px;
    overflow-y: auto;
  }
`, Js = qe`
  && > * {
    cursor: pointer;

    :hover {
      background-color: var(--rs-btn-default-hover-bg);
    }
  }
`, kt = b.div`
  ${Lo}
`, Qt = b.div`
  ${Mo}
  ${({ clickable: t = !1 }) => t && Js}
`, Gs = (t) => {
  if (t != null && t.icon) {
    const [e, n, , , o] = t.icon;
    return { width: e, height: n, svgPathData: o };
  }
  return t;
}, qs = Le(({ faIcon: t, size: e, ...n }, o) => {
  const { width: i, height: a, svgPathData: s } = Gs(t);
  return /* @__PURE__ */ r(
    "svg",
    {
      viewBox: `0 0 ${i} ${a}`,
      width: `${e ?? 1}em`,
      height: `${e ?? 1}em`,
      fill: "currentColor",
      ...n,
      ref: o,
      children: /* @__PURE__ */ r("path", { d: s })
    }
  );
}), V = Le(({ icon: t, size: e, ...n }, o) => /* @__PURE__ */ r(Kt, { as: qs, ref: o, faIcon: t, size: e, ...n })), Xs = b(G)`
  min-width: 24px;
  margin-inline-end: -6px;
`, Ys = {
  disabled: {
    hint: "neitherCalculableNorLocalizable",
    icon: st,
    color: "var(--rs-btn-default-disabled-bg)"
  },
  calculation: {
    hint: "editCalculable",
    color: "var(--rs-btn-primary-bg)",
    icon: mo
  },
  localization: {
    hint: "editLocalizable",
    color: "var(--rs-btn-primary-bg)",
    icon: Aa
  },
  calculable: {
    hint: "hintCalculable",
    icon: st
  },
  localizable: {
    hint: "hintLocalizable",
    icon: st
  },
  calculableAndLocalizable: {
    hint: "hintCalculableAndLocalizable",
    icon: st
  }
}, Qs = (t) => {
  const { annotation: e, getComputeCode: n, setComputeCode: o, disableCompute: i, getComputeType: a, hasComputeCode: s, componentData: l } = t, c = y(), d = !e.calculable && !e.localizable, u = T("propertiesEditor.codeButton"), p = a(), g = M(() => {
    const x = p === "function" && s("function"), k = p === "localization" && s("localization");
    return d ? "disabled" : x ? "calculation" : k ? "localization" : e.calculable && e.localizable ? "calculableAndLocalizable" : e.calculable ? "calculable" : e.localizable ? "localizable" : "disabled";
  }, [e.calculable, e.localizable, d, s, p]), f = M(() => {
    const { hint: x, icon: k, color: L } = Ys[g];
    return { icon: k, color: L, hint: u(x) };
  }, [g, u]), v = m(() => c.currentEditable = new br(
    i,
    o,
    n,
    a,
    s,
    e,
    l.key
  ), [e, l.key, i, n, a, s, o, c]);
  return /* @__PURE__ */ r(ue, { hint: f.hint, children: /* @__PURE__ */ r(
    Xs,
    {
      onClick: v,
      disabled: d,
      icon: /* @__PURE__ */ r(V, { icon: f.icon, color: f.color }),
      size: "xs",
      appearance: "subtle"
    }
  ) });
}, e1 = U("PropertyCodeButton", Qs), t1 = ae("PropertyLabel", ko), n1 = (t) => /* @__PURE__ */ r("div", { style: { width: "100%" }, ...t }), o1 = ae("PropertyInput", n1), r1 = b.div`
  min-width: 18px;
`, en = (t) => {
  const { children: e, className: n, style: o, label: i, hint: a, required: s, leftButton: l } = t, c = xo("id-"), d = M(() => N({ required: s }), [s]);
  return /* @__PURE__ */ h(So, { style: o, className: n, children: [
    /* @__PURE__ */ h(se, { gap: 10, style: { alignItems: "center" }, children: [
      l ?? /* @__PURE__ */ r(r1, {}),
      /* @__PURE__ */ r(t1, { htmlFor: c, hint: a, className: d, children: /* @__PURE__ */ r(F, { children: i }) })
    ] }),
    !!e && /* @__PURE__ */ r(o1, { children: Xn(e, { id: c }) })
  ] });
}, i1 = (t) => {
  const { annotation: e, children: n, style: o } = t, { className: i, ...a } = t, s = t.componentData.model.type, l = T(`annotation.${e.key}`), c = T(`${s}.${e.key}`), d = m((g) => c(g) || l(g), [l, c]), u = M(() => e.hint ?? d("hint"), [e.hint, d]), p = M(() => d("name") || e.name, [e.name, d]);
  return /* @__PURE__ */ r(
    en,
    {
      style: o,
      className: i,
      required: e.required,
      hint: u,
      label: p,
      leftButton: /* @__PURE__ */ r(e1, { ...a }),
      children: n
    }
  );
}, _ = ae("LabeledProperty", i1), a1 = [{ name: "value" }, { name: "label" }], s1 = (t) => {
  const { value: e, onChange: n, annotation: o, componentData: i } = t, { onAdd: a, onRemove: s, columns: l, calculateEditorProps: c } = o.editorProps ?? {}, d = W(), u = M(() => qt(l ?? a1), [l]), p = m((v) => {
    a == null || a(v, i, d);
  }, [d, i, a]), g = m((v) => {
    s == null || s(v, i, d);
  }, [d, i, s]), f = (c == null ? void 0 : c(i, n)) ?? {};
  return /* @__PURE__ */ h(F, { children: [
    /* @__PURE__ */ r(_, { ...t }),
    /* @__PURE__ */ r(
      Gt,
      {
        data: e,
        onChange: n,
        columns: u,
        onRemove: g,
        onAdd: p,
        ...f
      }
    )
  ] });
}, l1 = w("ArrayInput", s1), vn = (t, e) => {
  try {
    return JSON.stringify(t, null, e);
  } catch {
    return;
  }
}, c1 = (t) => {
  const { value: e, onChange: n, onClean: o, onValidate: i, editorKey: a, editorTitle: s } = t, l = y(), c = M(() => (so(e) ? vn(e, 2) : e) ?? "", [e]), d = M(() => {
    var p;
    return e ? ((p = vn(e)) == null ? void 0 : p.substring(0, 50)) ?? "Error" : "";
  }, [e]), u = m(() => {
    l.editJsonCode(a, s, c, n, i);
  }, [l, a, s, n, c, i]);
  return /* @__PURE__ */ h(Q, { inside: !0, size: "xs", children: [
    /* @__PURE__ */ r(ie, { value: d, onClick: u, readOnly: !0, color: "var(--rs-btn-ghost-text)" }),
    /* @__PURE__ */ r(Q.Button, { onClick: e ? o : u, children: e ? /* @__PURE__ */ r(de, {}) : /* @__PURE__ */ r(ro, {}) })
  ] });
}, d1 = (t) => {
  const e = JSON.parse(t);
  if (typeof e != "object" || Array.isArray(e))
    throw new Error("The value must be an object");
}, u1 = ({ rowData: t, dataKey: e, rowIndex: n, onChange: o, editorTitle: i, ...a }) => {
  const s = t[e] ?? {}, l = M(() => `${i}[${n}]`, [i, n]), c = m((u) => {
    t[e] = u, o == null || o(u, e, n);
  }, [e, o, t, n]), d = m(() => {
    c(void 0);
  }, [c]);
  return /* @__PURE__ */ r(Ye, { ...a, children: /* @__PURE__ */ r(
    c1,
    {
      editorKey: `${e}-${n}`,
      editorTitle: l,
      value: s,
      onChange: c,
      onClean: d,
      onValidate: d1
    }
  ) });
}, m1 = [{ name: "item", input: u1 }], h1 = (t) => {
  var a;
  const { value: e, onChange: n, annotation: o } = t, i = M(() => {
    var c;
    const s = ((c = o.editorProps) == null ? void 0 : c.columns) ?? m1, l = s == null ? void 0 : s[0];
    return l && !l.inputProps && (l.inputProps = { editorTitle: `${t.componentData.key}.${o.name}` }), qt(s);
  }, [(a = o.editorProps) == null ? void 0 : a.columns, o.name, t.componentData.key]);
  return /* @__PURE__ */ h(F, { children: [
    /* @__PURE__ */ r(_, { ...t }),
    /* @__PURE__ */ r(Gt, { data: e, onChange: n, columns: i })
  ] });
}, p1 = (t) => {
  const { value: e, onChange: n, onClean: o } = t, i = T("propertiesEditor");
  return /* @__PURE__ */ r(_, { ...t, children: /* @__PURE__ */ r(
    Ki,
    {
      value: e ?? "",
      onChange: n,
      onClean: o,
      block: !0,
      size: "xs",
      style: { width: "100%" },
      placeholder: i("setInputHint")
    }
  ) });
}, g1 = [
  "a",
  "abbr",
  "about",
  "accentHeight",
  "accept",
  "acceptCharset",
  "accessKey",
  "accumulate",
  "action",
  "additive",
  "address",
  "alignmentBaseline",
  "allowFullScreen",
  "allowReorder",
  "allowTransparency",
  "alphabetic",
  "alt",
  "altGlyph",
  "altGlyphDef",
  "altGlyphItem",
  "amplitude",
  "animate",
  "animateColor",
  "animateMotion",
  "animateTransform",
  "arabicForm",
  "area",
  "article",
  "ascent",
  "aside",
  "async",
  "attributeName",
  "attributeType",
  "audio",
  "autoCapitalize",
  "autoComplete",
  "autoCorrect",
  "autoFocus",
  "autoPlay",
  "autoReverse",
  "autoSave",
  "azimuth",
  "b",
  "base",
  "baseFrequency",
  "baselineShift",
  "baseProfile",
  "bbox",
  "bdi",
  "bdo",
  "begin",
  "bias",
  "blockquote",
  "body",
  "br",
  "button",
  "by",
  "calcMode",
  "canvas",
  "capHeight",
  "caption",
  "capture",
  "cellPadding",
  "cellSpacing",
  "challenge",
  "charSet",
  "checked",
  "circle",
  "cite",
  "classID",
  "className",
  "clip",
  "clipPath",
  "clipPathUnits",
  "clipRule",
  "code",
  "col",
  "colgroup",
  "color",
  "color-profile",
  "colorInterpolation",
  "colorInterpolationFilters",
  "colorProfile",
  "colorRendering",
  "cols",
  "colSpan",
  "content",
  "contentEditable",
  "contentScriptType",
  "contentStyleType",
  "contextMenu",
  "controls",
  "coords",
  "crossOrigin",
  "cursor",
  "cx",
  "cy",
  "d",
  "dangerouslySetInnerHTML",
  "data",
  "datalist",
  "datatype",
  "dateTime",
  "dd",
  "decelerate",
  "default",
  "defaultChecked",
  "defaultValue",
  "defer",
  "defs",
  "del",
  "desc",
  "descent",
  "details",
  "dfn",
  "dialog",
  "diffuseConstant",
  "dir",
  "direction",
  "disabled",
  "display",
  "div",
  "divisor",
  "dl",
  "dominantBaseline",
  "download",
  "draggable",
  "dt",
  "dur",
  "dx",
  "dy",
  "edgeMode",
  "elevation",
  "ellipse",
  "em",
  "embed",
  "enableBackground",
  "encType",
  "end",
  "exponent",
  "externalResourcesRequired",
  "feBlend",
  "feColorMatrix",
  "feComponentTransfer",
  "feComposite",
  "feConvolveMatrix",
  "feDiffuseLighting",
  "feDisplacementMap",
  "feDistantLight",
  "feFlood",
  "feFuncA",
  "feFuncB",
  "feFuncG",
  "feFuncR",
  "feGaussianBlur",
  "feImage",
  "feMerge",
  "feMergeNode",
  "feMorphology",
  "feOffset",
  "fePointLight",
  "feSpecularLighting",
  "feSpotLight",
  "feTile",
  "feTurbulence",
  "fieldset",
  "figcaption",
  "figure",
  "fill",
  "fillOpacity",
  "fillRule",
  "filter",
  "filterRes",
  "filterUnits",
  "floodColor",
  "floodOpacity",
  "focusable",
  "font",
  "font-face",
  "font-face-format",
  "font-face-name",
  "font-face-src",
  "font-face-uri",
  "fontFamily",
  "fontSize",
  "fontSizeAdjust",
  "fontStretch",
  "fontStyle",
  "fontVariant",
  "fontWeight",
  "footer",
  "foreignObject",
  "form",
  "formAction",
  "format",
  "formEncType",
  "formMethod",
  "formNoValidate",
  "formTarget",
  "frameBorder",
  "from",
  "fx",
  "fy",
  "g",
  "g1",
  "g2",
  "glyph",
  "glyphName",
  "glyphOrientationHorizontal",
  "glyphOrientationVertical",
  "glyphRef",
  "gradientTransform",
  "gradientUnits",
  "h1",
  "h2",
  "h3",
  "h4",
  "h5",
  "h6",
  "hanging",
  "head",
  "header",
  "headers",
  "height",
  "hgroup",
  "hidden",
  "high",
  "hkern",
  "horizAdvX",
  "horizOriginX",
  "hr",
  "href",
  "hrefLang",
  "html",
  "htmlFor",
  "httpEquiv",
  "i",
  "icon",
  "id",
  "ideographic",
  "iframe",
  "image",
  "imageRendering",
  "img",
  "in",
  "in2",
  "inlist",
  "input",
  "inputMode",
  "ins",
  "integrity",
  "intercept",
  "is",
  "itemID",
  "itemProp",
  "itemRef",
  "itemScope",
  "itemType",
  "k",
  "k1",
  "k2",
  "k3",
  "k4",
  "kbd",
  "kernelMatrix",
  "kernelUnitLength",
  "kerning",
  "keygen",
  "keyParams",
  "keyPoints",
  "keySplines",
  "keyTimes",
  "keyType",
  "kind",
  "label",
  "lang",
  "legend",
  "lengthAdjust",
  "letterSpacing",
  "li",
  "lightingColor",
  "limitingConeAngle",
  "line",
  "linearGradient",
  "link",
  "list",
  "local",
  "loop",
  "low",
  "main",
  "manifest",
  "map",
  "marginHeight",
  "marginWidth",
  "mark",
  "marker",
  "markerEnd",
  "markerHeight",
  "markerMid",
  "markerStart",
  "markerUnits",
  "markerWidth",
  "mask",
  "maskContentUnits",
  "maskUnits",
  "math",
  "mathematical",
  "max",
  "maxLength",
  "media",
  "mediaGroup",
  "menu",
  "menuitem",
  "meta",
  "metadata",
  "meter",
  "method",
  "min",
  "minLength",
  "missing-glyph",
  "mode",
  "mpath",
  "multiple",
  "muted",
  "name",
  "nav",
  "nonce",
  "noscript",
  "noValidate",
  "numOctaves",
  "object",
  "offset",
  "ol",
  "onBlur",
  "onChange",
  "onClick",
  "onFocus",
  "onInput",
  "onInvalid",
  "onKeyDown",
  "onKeyPress",
  "onKeyUp",
  "onSubmit",
  "opacity",
  "open",
  "operator",
  "optgroup",
  "optimum",
  "option",
  "order",
  "orient",
  "orientation",
  "origin",
  "output",
  "overflow",
  "overlinePosition",
  "overlineThickness",
  "p",
  "paintOrder",
  "panose1",
  "param",
  "path",
  "pathLength",
  "pattern",
  "patternContentUnits",
  "patternTransform",
  "patternUnits",
  "picture",
  "placeholder",
  "playsInline",
  "pointerEvents",
  "points",
  "pointsAtX",
  "pointsAtY",
  "pointsAtZ",
  "polygon",
  "polyline",
  "poster",
  "pre",
  "prefix",
  "preload",
  "preserveAlpha",
  "preserveAspectRatio",
  "primitiveUnits",
  "profile",
  "progress",
  "property",
  "q",
  "r",
  "radialGradient",
  "radioGroup",
  "radius",
  "rb",
  "readOnly",
  "rect",
  "refX",
  "refY",
  "rel",
  "renderingIntent",
  "repeatCount",
  "repeatDur",
  "required",
  "requiredExtensions",
  "requiredFeatures",
  "resource",
  "restart",
  "result",
  "results",
  "reversed",
  "role",
  "rotate",
  "rows",
  "rowSpan",
  "rp",
  "rt",
  "rtc",
  "ruby",
  "rx",
  "ry",
  "s",
  "samp",
  "sandbox",
  "scale",
  "scope",
  "scoped",
  "script",
  "scrolling",
  "seamless",
  "section",
  "security",
  "seed",
  "select",
  "selected",
  "set",
  "shape",
  "shapeRendering",
  "size",
  "sizes",
  "slope",
  "slot",
  "small",
  "source",
  "spacing",
  "span",
  "specularConstant",
  "specularExponent",
  "speed",
  "spellCheck",
  "spreadMethod",
  "src",
  "srcDoc",
  "srcLang",
  "srcSet",
  "start",
  "startOffset",
  "stdDeviation",
  "stemh",
  "stemv",
  "step",
  "stitchTiles",
  "stop",
  "stopColor",
  "stopOpacity",
  "strikethroughPosition",
  "strikethroughThickness",
  "string",
  "stroke",
  "strokeDasharray",
  "strokeDashoffset",
  "strokeLinecap",
  "strokeLinejoin",
  "strokeMiterlimit",
  "strokeOpacity",
  "strokeWidth",
  "strong",
  "style",
  "sub",
  "summary",
  "sup",
  "suppressContentEditableWarning",
  "surfaceScale",
  "svg",
  "switch",
  "symbol",
  "systemLanguage",
  "tabIndex",
  "table",
  "tableValues",
  "target",
  "targetX",
  "targetY",
  "tbody",
  "td",
  "template",
  "text",
  "textAnchor",
  "textarea",
  "textDecoration",
  "textLength",
  "textPath",
  "textRendering",
  "tfoot",
  "th",
  "thead",
  "time",
  "title",
  "to",
  "tr",
  "track",
  "transform",
  "tref",
  "tspan",
  "type",
  "typeof",
  "u",
  "u1",
  "u2",
  "ul",
  "underlinePosition",
  "underlineThickness",
  "unicode",
  "unicodeBidi",
  "unicodeRange",
  "unitsPerEm",
  "unselectable",
  "use",
  "useMap",
  "vAlphabetic",
  "value",
  "values",
  "var",
  "vectorEffect",
  "version",
  "vertAdvY",
  "vertOriginX",
  "vertOriginY",
  "vHanging",
  "video",
  "vIdeographic",
  "view",
  "viewBox",
  "viewTarget",
  "visibility",
  "vkern",
  "vMathematical",
  "vocab",
  "wbr",
  "width",
  "widths",
  "wmode",
  "wordSpacing",
  "wrap",
  "writingMode",
  "x",
  "x1",
  "x2",
  "xChannelSelector",
  "xHeight",
  "xlinkActuate",
  "xlinkArcrole",
  "xlinkHref",
  "xlinkRole",
  "xlinkShow",
  "xlinkTitle",
  "xlinkType",
  "xmlBase",
  "xmlLang",
  "xmlns",
  "xmlnsXlink",
  "xmlSpace",
  "y",
  "y1",
  "y2",
  "yChannelSelector",
  "z",
  "zoomAndPan"
], C1 = qt([
  {
    name: "name",
    input: zs,
    inputProps: { options: Ot(g1, !1) }
  },
  { name: "value" }
]), f1 = ({ confirm: t }) => {
  const e = T("common");
  return /* @__PURE__ */ r(G, { icon: /* @__PURE__ */ r(ua, {}), onClick: t, color: "green", appearance: "primary", size: "xs", children: e("apply") });
}, b1 = (t) => {
  const { store: e } = t.componentData, n = !!t.getComputeType(), o = M(
    () => e.htmlAttributes ? [...e.htmlAttributes] : e.htmlAttributes,
    [e]
  ), [i, a] = A(o), [s, l] = A(!1), c = m((u) => {
    a(u), l(!0);
  }, []), d = m(() => {
    e.htmlAttributes = i, l(!1);
  }, [e, i]);
  return E(() => {
    a(o), l(!1);
  }, [o, e]), /* @__PURE__ */ h(F, { children: [
    /* @__PURE__ */ r(_, { ...t, children: s && /* @__PURE__ */ r(f1, { confirm: d }) }),
    !n && /* @__PURE__ */ r(Gt, { data: i ?? [], onChange: c, columns: C1 })
  ] });
}, v1 = w("RawAttributesInput", b1), tn = b(_t)`
  && {
    height: 23px;
    display: flex;
    align-items: center;
    width: 100%;

    .rs-checkbox-checker {
      padding-left: 0;
      margin-left: -10px;
    }
  }
`, wn = (t) => {
  const { value: e, onChange: n } = t;
  return /* @__PURE__ */ r(_, { ...t, children: /* @__PURE__ */ r(tn, { checked: !!e, onChange: (o, i) => n(i) }) });
}, w1 = b(ie)`
  && {
    background-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill-opacity=".05"><path d="M8 0h8v8H8zM0 8h8v8H0z"/></svg>');
    background-color: ${({ color: t }) => t ?? "var(--rs-btn-default-bg)"};
  }
`, y1 = b(Q.Button)`
  && {
    background-color: var(--rs-btn-default-bg) !important;
    position: absolute;
    inset-inline-end: 0;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    padding: 6px 8px;
  }
`;
function x1(t) {
  const { r: e, g: n, b: o, a: i } = t;
  return `rgba(${e}, ${n}, ${o}, ${i})`;
}
function k1(t) {
  const e = /^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+(?:\.\d+)?))?\)$/, [, n, o, i, a] = e.exec(t) || [];
  return { r: Number(n), g: Number(o), b: Number(i), a: Number(a) };
}
const S1 = (t) => {
  const { value: e, onChange: n, onClean: o } = t, i = k1(e ?? "rgba(255, 255, 255, 0)");
  return /* @__PURE__ */ r(_, { ...t, children: /* @__PURE__ */ h(Q, { inside: !0, style: { width: "100%" }, size: "xs", children: [
    /* @__PURE__ */ r(fe, { placement: "auto", trigger: "hover", speaker: /* @__PURE__ */ r(Zt, { children: /* @__PURE__ */ r(Fa, { color: i, onChange: (s) => n(x1(s)) }) }), enterable: !0, children: /* @__PURE__ */ r(w1, { color: e, readOnly: !0 }) }),
    /* @__PURE__ */ r(y1, { onClick: o, children: /* @__PURE__ */ r(de, {}) })
  ] }) });
}, L1 = (t) => {
  const { onChange: e, onClean: n } = t;
  let { value: o } = t;
  return typeof o == "string" && (o = new Date(o)), /* @__PURE__ */ r(_, { ...t, children: /* @__PURE__ */ r(
    Qn,
    {
      editable: !1,
      cleanable: !0,
      placement: "auto",
      value: o ?? null,
      onChange: e,
      onClean: n,
      size: "xs"
    }
  ) });
}, nn = (t) => {
  const e = T("common");
  return /* @__PURE__ */ r(xt, { hint: e("edit"), icon: /* @__PURE__ */ r(V, { icon: Ra }), ...t });
}, M1 = (t) => {
  const e = T("common");
  return /* @__PURE__ */ r(xt, { hint: e("clone"), icon: /* @__PURE__ */ r(ma, {}), ...t });
}, Ve = (t) => {
  const e = T("common");
  return /* @__PURE__ */ r(xt, { hint: e("remove"), icon: /* @__PURE__ */ r(de, {}), ...t });
};
function on(t) {
  return M(() => aa(t), [t]).get();
}
const [
  /**
   * **Internal use only.**
   */
  Qe,
  /**
   * **Internal use only.**
   */
  E1
] = _e("ActionDataContext"), rn = ({ width: t, ...e }) => /* @__PURE__ */ r(Ji, { ...e, style: { width: t } }), A1 = [
  { label: "True", value: !0 },
  { label: "False", value: !1 }
], T1 = ({ name: t }) => {
  var i;
  const e = Qe(), n = m((a) => {
    const s = Jt({}, e.args);
    delete s[t], typeof a < "u" && (s[t] = a), e.args = s;
  }, [e, t]), o = m(() => {
    n(void 0);
  }, [n]);
  return /* @__PURE__ */ r(
    rn,
    {
      onClean: o,
      data: A1,
      searchable: !1,
      value: ((i = e.args) == null ? void 0 : i[t]) ?? "",
      onSelect: n,
      size: "sm",
      width: "100%"
    }
  );
}, P1 = w("InputBoolean", T1), F1 = ({ name: t }) => {
  var a;
  const e = Qe(), n = typeof ((a = e.args) == null ? void 0 : a[t]) < "u" ? Number(e.args[t]) : "", o = m((s) => {
    const l = Jt({}, e.args);
    delete l[t], (typeof s == "string" || typeof s == "number") && (l[t] = Number(s)), e.args = l;
  }, [e, t]), i = m(() => {
    o(null);
  }, [o]);
  return /* @__PURE__ */ h(Q, { size: "sm", children: [
    /* @__PURE__ */ r(bt, { value: n, onChange: o, onReset: i, size: "sm" }),
    /* @__PURE__ */ r(Q.Button, { onClick: i, children: /* @__PURE__ */ r(de, {}) })
  ] });
}, R1 = w("InputNumber", F1), D1 = ({ name: t }) => {
  var i, a;
  const e = Qe(), n = ((a = (i = e.args) == null ? void 0 : i[t]) == null ? void 0 : a.toString()) ?? "";
  return /* @__PURE__ */ r(Q, { size: "sm", children: /* @__PURE__ */ r(ie, { value: n, onChange: (s) => e.args = Jt({}, e.args, { [t]: s }) }) });
}, I1 = w("InputString", D1), B1 = (t) => {
  switch (t) {
    case "string":
      return I1;
    case "number":
      return R1;
    case "boolean":
      return P1;
  }
}, V1 = ({ data: t }) => {
  const [e, n] = t, o = B1(n);
  return /* @__PURE__ */ h(z, { children: [
    /* @__PURE__ */ r("label", { children: e }),
    /* @__PURE__ */ r(o, { name: e })
  ] });
}, z1 = w("ArgumentItem", V1), N1 = b(H)`
  padding: 5px !important;
  border-radius: 0 !important;
  outline: 0 !important;
  color: var(--rs-btn-subtle-text) !important;

  &:focus {
    box-shadow: none;
    background-color: initial;
  }
`, H1 = () => {
  const t = Qe();
  E(() => () => {
    lo(t.args) && delete t.args;
  }, [t.args]);
}, $1 = () => {
  const t = W(), e = Qe(), n = m(() => t.findAction(e), [e, t]), o = on(n), [i, a] = Yn((l) => !l, !1), s = i ? io : wt;
  return H1(), Object.keys(o.params).length ? /* @__PURE__ */ h("div", { onMouseDown: (l) => l.stopPropagation(), children: [
    /* @__PURE__ */ r(eo.Collapse, { in: i, unmountOnExit: !0, children: /* @__PURE__ */ r(z, { gap: 1, style: { marginBlock: 8, paddingInline: 10 }, children: Object.entries(o.params).map((l, c) => /* @__PURE__ */ r(z1, { data: l }, c)) }) }),
    /* @__PURE__ */ r(N1, { block: !0, onClick: a, children: /* @__PURE__ */ h(F, { children: [
      Ba("actions.arguments"),
      /* @__PURE__ */ r(s, { style: { marginTop: -2 } })
    ] }) })
  ] }) : null;
}, O1 = w("ArgumentList", $1), j1 = ({ data: t, onRemove: e }) => {
  const n = y(), o = W(), i = t.type === "code", a = () => {
    const s = o.form.actions[t.name];
    if (!s) {
      console.error(`Cannot find custom action: '${t.name}'`);
      return;
    }
    const l = { name: t.name, actionDefinition: s };
    n.editCodeAction(l);
  };
  return /* @__PURE__ */ h(E1, { value: t, children: [
    /* @__PURE__ */ h(se, { style: { justifyContent: "space-between", padding: 8 }, children: [
      /* @__PURE__ */ r("b", { style: { color: "violet", marginLeft: 5 }, children: `${t.name || "Action"}` }),
      /* @__PURE__ */ h(me, { size: "xs", children: [
        i && /* @__PURE__ */ r(nn, { onClick: a }),
        /* @__PURE__ */ r(Ve, { onClick: e })
      ] })
    ] }),
    /* @__PURE__ */ r(O1, {})
  ] });
}, W1 = w("ActionItem", j1), _1 = b(to)`
  ${Mo}
  && {
    box-shadow: none;
  }
`, Z1 = b(to.Item)`
  ${Lo}
  && {
    overflow: hidden;
    padding: 0;
    box-shadow: none;
    flex-direction: column;
    align-items: initial;
  }

  &.rs-list-item-helper {
    outline: 2px solid var(--rs-btn-primary-bg);
  }
`;
function U1({ data: t, index: e, onRemove: n }) {
  const o = m(() => n(e), [e, n]);
  return /* @__PURE__ */ r(Z1, { index: e, children: /* @__PURE__ */ r(W1, { data: t, onRemove: o }) });
}
const K1 = (t) => {
  var a;
  const e = t.annotation.key, n = (a = t.componentData.store.events) == null ? void 0 : a[e], o = m((s) => n == null ? void 0 : n.splice(s, 1), [n]), i = m((s) => {
    if (!n || !(s != null && s.oldIndex || s != null && s.newIndex))
      return;
    const l = n[s.oldIndex];
    n.splice(s.oldIndex, 1), n.splice(s.newIndex, 0, l);
  }, [n]);
  return n != null && n.length ? /* @__PURE__ */ r(_1, { sortable: !0, onSort: i, children: n.map((s, l) => /* @__PURE__ */ r(U1, { index: l, data: s, onRemove: o }, s[Qr])) }) : null;
}, J1 = w("ActionList", K1), G1 = ({ onSelect: t, annotation: e }) => {
  var u;
  const n = W(), o = y(), i = (u = o.oneSelected) == null ? void 0 : u.store, a = e.key, s = n.form.actionNames, l = T("actions"), c = () => {
    t(), i && o.addCodeAction((p) => {
      Ne.addEventHandler(i, a, { name: p.name, type: "code" });
    });
  }, d = (p) => /* @__PURE__ */ r(
    B.Item,
    {
      onClick: () => t({ name: p, type: "code" }),
      style: { position: "relative", display: "flex", justifyContent: "space-between" },
      children: /* @__PURE__ */ r("span", { style: { whiteSpace: "break-spaces" }, children: p })
    },
    p
  );
  return /* @__PURE__ */ h(B.Menu, { title: l("code"), children: [
    s == null ? void 0 : s.map(d),
    !!(s != null && s.length) && /* @__PURE__ */ r(B.Item, { disabled: !0, children: /* @__PURE__ */ r(Gi, { style: { marginTop: 0, marginBottom: 0 } }) }),
    /* @__PURE__ */ r(B.Item, { children: l("addCodeAction"), icon: /* @__PURE__ */ r(Ge, {}), onClick: c })
  ] });
}, q1 = w("CodeActionsList", G1), X1 = ({ onSelect: t }) => {
  const e = W(), n = T("actions"), o = Object.keys(e.commonActions).map(
    (i) => /* @__PURE__ */ r(B.Item, { children: i, onClick: () => t({ name: i, type: "common" }) }, i)
  );
  return /* @__PURE__ */ r(B.Menu, { title: n("common"), children: o });
}, Y1 = ({ onSelect: t }) => {
  const e = W(), n = T("actions"), o = e.formViewerPropsStore.actions;
  if (!o)
    return null;
  const i = Object.keys(o).map(
    (a) => /* @__PURE__ */ r(B.Item, { children: a, onClick: () => t({ name: a, type: "custom" }) }, a)
  );
  return /* @__PURE__ */ r(B.Menu, { title: n("custom"), children: i });
}, Q1 = Le(({ onSelect: t, annotation: e, ...n }, o) => /* @__PURE__ */ r(Zt, { ref: o, ...n, full: !0, children: /* @__PURE__ */ h(B.Menu, { children: [
  /* @__PURE__ */ r(X1, { onSelect: t, annotation: e }),
  /* @__PURE__ */ r(q1, { onSelect: t, annotation: e }),
  /* @__PURE__ */ r(Y1, { onSelect: t, annotation: e })
] }) })), el = (t) => {
  const e = T("actions"), { componentData: n, annotation: o } = t, i = n.store, a = o.key, s = q(null), l = m((c) => {
    var d;
    (d = s.current) == null || d.close(), c && Ne.addEventHandler(i, a, c);
  }, [s, i, a]);
  return /* @__PURE__ */ r(
    fe,
    {
      placement: "leftStart",
      ref: s,
      trigger: "click",
      speaker: /* @__PURE__ */ r(Q1, { onSelect: l, annotation: o }),
      children: /* @__PURE__ */ r(G, { icon: /* @__PURE__ */ r(Ge, {}), size: "sm", children: e("addAction") })
    }
  );
}, tl = w("AddActionButton", el), nl = b.div`
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 20px;
`, ol = b.h6`
  margin-left: 10px;
`, rl = (t) => {
  const e = t.annotation.key;
  return /* @__PURE__ */ h(nl, { children: [
    /* @__PURE__ */ r(ol, { children: e }),
    /* @__PURE__ */ r(J1, { ...t }),
    /* @__PURE__ */ r(tl, { ...t })
  ] });
}, il = (t) => {
  const e = W(), { id: n, value: o, onChange: i, showError: a } = t, [s, l] = A(!1), [c, d] = A(o), u = T("propertiesEditor");
  E(() => {
    d(o), l(!1);
  }, [o]);
  const p = m((k) => e.reduceScreen((L, D) => D.key === k ? L + 1 : L, 0) === 0 && k.length > 0, [e]), g = m((k) => {
    const L = p(k);
    let D;
    if (!L && k !== o) {
      const Z = k.length > 0 ? "keyMustBeUnique" : "keyMustNotBeEmpty";
      D = u(Z);
    }
    a == null || a(D), l(L), d(k);
  }, [o, u, a, p]), f = m(() => {
    s && (i(c), l(!1));
  }, [s, i, c]), v = m((k) => {
    k.key === "Enter" && s && f();
  }, [s, f]), x = M(() => u("applyKey"), [u]);
  return /* @__PURE__ */ h(Q, { size: "xs", children: [
    /* @__PURE__ */ r(ie, { id: n, value: c, onChange: g, onKeyDown: v }),
    /* @__PURE__ */ r(ue, { hint: x, children: /* @__PURE__ */ r(Q.Button, { disabled: !s, onClick: f, children: /* @__PURE__ */ r(
      V,
      {
        icon: Va,
        color: s ? "green" : void 0
      }
    ) }) })
  ] });
}, al = (t) => /* @__PURE__ */ r(_, { ...t, children: /* @__PURE__ */ r(il, { ...t }) }), sl = w("KeyInput", al), ll = b(qi)`
  width: 100%;
`, cl = ({ data: t }, e) => {
  const n = t.map((o) => ({
    value: o.value,
    label: o.label
  }));
  return e.forEach((o) => {
    n.find((i) => i.value === o) || n.push({ value: o, label: co(o) });
  }), n;
}, dl = (t) => {
  const { value: e, onChange: n, annotation: o, onClean: i } = t, a = cl(o, e);
  return /* @__PURE__ */ r(_, { ...t, children: /* @__PURE__ */ r(
    ll,
    {
      value: e ?? [],
      data: a,
      onChange: n,
      onClean: i,
      cleanable: !0,
      creatable: !0,
      size: "xs",
      placement: "auto"
    }
  ) });
}, ul = b(bt)`
  .rs-input-group-addon {
    padding: 1px 8px !important;
  }
`, ml = (t) => {
  const { value: e, onChange: n, onClean: o, annotation: i, componentData: a } = t, s = m((p) => {
    typeof p == "string" && (p = Number(p), p = isNaN(p) ? 0 : p), n(p);
  }, [n]), { calculateEditorProps: l, ...c } = i.editorProps ?? {}, d = {
    ...c,
    ...(l == null ? void 0 : l(a)) ?? {},
    value: typeof e == "number" ? e : null
  };
  return /* @__PURE__ */ r(_, { ...t, children: /* @__PURE__ */ r(ul, { ...d, onChange: s, size: "xs", postfix: /* @__PURE__ */ r(de, { onClick: o, style: { cursor: "pointer" } }) }) });
}, yn = (t, e) => {
  try {
    return JSON.stringify(t, null, e);
  } catch {
    return;
  }
}, hl = (t) => {
  const { value: e, onChange: n, onClean: o, annotation: i } = t, a = y(), s = M(() => (so(e) ? yn(e, 2) : e) ?? "", [e]), l = M(() => {
    var d;
    return e ? ((d = yn(e)) == null ? void 0 : d.substring(0, 50)) ?? "Error" : "";
  }, [e]), c = m(() => {
    const d = `${t.componentData.key}.${i.name}`;
    a.editJsonCode(i.key, d, s, n);
  }, [i.key, i.name, a, n, t.componentData.key, s]);
  return /* @__PURE__ */ r(_, { ...t, children: /* @__PURE__ */ h(Q, { inside: !0, size: "xs", children: [
    /* @__PURE__ */ r(ie, { value: l, onClick: c, readOnly: !0, color: "var(--rs-btn-ghost-text)" }),
    /* @__PURE__ */ r(Q.Button, { onClick: e ? o : c, children: e ? /* @__PURE__ */ r(de, {}) : /* @__PURE__ */ r(ro, {}) })
  ] }) });
}, pl = w("ObjectInput", hl), gl = b(Be)`
  width: 100%;
`, Cl = ({ data: t }, e) => (yt(e) || t.find((n) => n.value === e || n.label === e) || t.push({ value: e, label: e }), t), an = (t) => {
  const { value: e, onChange: n, annotation: o, onClean: i } = t, a = Cl(o, e);
  return /* @__PURE__ */ r(_, { ...t, children: /* @__PURE__ */ r(
    gl,
    {
      value: e ?? t.annotation.default ?? "",
      data: a,
      onChange: n,
      onClean: i,
      block: !0,
      cleanable: !0,
      creatable: !0,
      size: "xs",
      ...t.annotation.editorProps,
      placement: "autoVerticalEnd"
    }
  ) });
}, fl = b.div`
  display: flex;
  gap: 10px;
  justify-content: space-between;
  align-items: center;
  flex: 1;

  .rs-radio-group {
    width: 100%;
    justify-content: space-evenly;
  }

  .rs-radio-group-picker .rs-radio-inline {
    padding: 0;
  }

  .rs-radio-checker {
    min-height: 27px;
    max-height: 27px;
    margin: 0 7px !important;

    label {
      line-height: 14px !important;
      padding: 4px 0 !important;
    }
  }
`, sn = ({ label: t, items: e, style: n, ...o }) => /* @__PURE__ */ h(fl, { style: n, children: [
  !!t && /* @__PURE__ */ r("label", { children: t }),
  /* @__PURE__ */ r(Xi, { ...o, size: "xs", inline: !0, appearance: "picker", children: e == null ? void 0 : e.map(({ value: i, label: a }, s) => /* @__PURE__ */ r(Yi, { value: i, children: a ?? i }, s)) })
] }), bl = (t) => {
  const { value: e, onChange: n, annotation: o } = t;
  return /* @__PURE__ */ r(_, { ...t, children: /* @__PURE__ */ r(sn, { items: o.data, onChange: n, value: e }) });
}, vl = (t) => {
  var d;
  const e = t.componentData.store, n = (u) => {
    if (!e.renderWhen) {
      e.renderWhen = { value: u };
      return;
    }
    e.renderWhen.value = u;
  }, o = m(() => {
    var u;
    return ((u = e.renderWhen) == null ? void 0 : u.fnSource) ?? "";
  }, [e]), i = m(() => {
    var u;
    return (u = e.renderWhen) == null ? void 0 : u.computeType;
  }, [e]), a = m((u) => u === "function" ? !!o() : !1, [o]), s = m((u) => {
    e.renderWhen ?? (e.renderWhen = {}), e.renderWhen.fnSource = u, e.renderWhen.computeType = "function";
  }, [e]), l = m(() => {
    e.renderWhen && (e.renderWhen.computeType = void 0);
  }, [e]), c = {
    annotation: t.annotation,
    componentData: t.componentData,
    getComputeCode: o,
    getComputeType: i,
    setComputeCode: s,
    disableCompute: l,
    hasComputeCode: a
  };
  return /* @__PURE__ */ r(_, { ...c, children: /* @__PURE__ */ r(ie, { value: ((d = e.renderWhen) == null ? void 0 : d.value) ?? "", onChange: n, size: "xs" }) });
}, wl = w("RenderWhenEditor", vl), De = "other", Eo = ["px", "%", "em", "vw", "vh"], ln = ["max-content", "min-content", "fit-content", "auto"], yl = Ot([...Eo, ...ln, De], !1);
function xl(t) {
  if (!t)
    return {};
  if (ln.includes(t))
    return { unit: t };
  const e = t.match(/^([+-]?(?:\d+|\d*\.\d+))([a-z]{2,4}|%)$/i);
  if (!e)
    return { value: t, unit: De };
  const n = parseFloat(e[1]), o = e[2];
  return Eo.includes(o) ? { value: n, unit: o } : { value: `${n}${o}`, unit: De };
}
const Bt = (t) => typeof t < "u" && !ln.includes(t);
function kl(t, e) {
  if (e !== De && typeof t == "string") {
    const n = t.match(/[+-]?\d+(\.\d+)?/);
    return parseFloat((n == null ? void 0 : n[0]) ?? "10");
  }
  return t;
}
const xn = (t, e) => {
  const n = kl(t, e);
  return `${Bt(e) ? n : ""}${e === De ? "" : e}`;
}, Sl = b.div`
  display: flex;
  gap: 5px;
  justify-content: space-between;
  align-items: center;
`, Ll = b(Be)`
  width: auto;

  &.withValue {
    width: min-content;
    min-width: 78px;
  }
`, Ml = (t) => {
  const { value: e, onChange: n, onClean: o } = t, { value: i, unit: a } = xl(e), s = (d) => n(xn(d, a)), l = (d) => d && n(xn(i ?? 10, d)), c = a === De ? /* @__PURE__ */ r(ie, { value: i, size: "xs", onChange: s }) : /* @__PURE__ */ r(bt, { value: i, size: "xs", onChange: s });
  return /* @__PURE__ */ r(_, { ...t, children: /* @__PURE__ */ h(Sl, { children: [
    Bt(a) && c,
    /* @__PURE__ */ r(
      Ll,
      {
        value: a ?? "",
        onChange: l,
        data: yl,
        className: N({ withValue: Bt(a) }),
        creatable: !0,
        placement: "bottomEnd",
        size: "xs",
        onClean: o
      }
    )
  ] }) });
}, El = b.div`
  display: inline-grid;
  vertical-align: top;
  align-items: center;
  position: relative;
  width: 100%;

  &::after,
  & > textarea {
    min-width: 1em !important;
    width: auto !important;
    height: 100% !important;
    grid-area: 2 / 1;
    resize: none !important;
    max-height: 6em !important;
  }

  &::after {
    content: attr(data-contents) ' ';
    visibility: hidden;
    // text behaviour must match with textarea
    font-size: inherit !important;
    white-space: pre-wrap;
    overflow-wrap: break-word;
  }

  button {
    position: absolute;
    top: 4px;
    right: 14px;
    color: var(--rs-text-secondary);
    width: 12px;
    height: 12px;
  }
`, Al = ({ onClick: t }) => {
  const e = T("propertiesEditor"), n = M(() => e("clean"), [e]);
  return /* @__PURE__ */ r(ue, { hint: n, children: /* @__PURE__ */ r("button", { className: N(["rs-picker-clean", "rs-btn-close"]), onClick: t, children: /* @__PURE__ */ r(de, {}) }) });
}, Tl = (t) => {
  const { value: e = "", annotation: n, onChange: o, onClean: i } = t, a = q(null), s = q(null);
  return E(() => {
    const l = s.current;
    l && (l.dataset.contents = e);
  }, [e]), E(() => {
    const l = a.current, c = s.current;
    if (l && c) {
      const d = window.getComputedStyle(l);
      c.style.lineHeight = d.lineHeight, c.style.fontSize = d.fontSize;
    }
  }, []), /* @__PURE__ */ r(_, { ...t, children: /* @__PURE__ */ h(El