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

React Form Library Drag and Drop.

var ji = Object.defineProperty;
var Wi = (t, e, n) => e in t ? ji(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
var M = (t, e, n) => (Wi(t, typeof e != "symbol" ? e + "" : e, n), n), Ht = (t, e, n) => {
  if (!e.has(t))
    throw TypeError("Cannot " + n);
};
var G = (t, e, n) => (Ht(t, e, "read from private field"), n ? n.call(t) : e.get(t)), fe = (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);
}, Ie = (t, e, n, o) => (Ht(t, e, "write to private field"), o ? o.call(t, n) : e.set(t, n), n);
var ct = (t, e, n) => (Ht(t, e, "access private method"), n);
import { jsx as i, jsxs as f, Fragment as D } from "@emotion/react/jsx-runtime";
import w from "@emotion/styled";
import { createNonNullableContext as Ae, forwardRef as Te, namedObserver as k, useStore as j, toLabeledValues as en, useComponentData as _, KeySymbol as _i, ComponentStore as Je, ActionEventArgsDeclaration as Ki, IFormDataDeclaration as Ui, isPromise as Zi, DataValidator as Gi, isProperty as Ln, isValidatorPropertyBlockType as Ot, createAnnotation as St, className as Ji, cfDisableStyles as _e, cfDisableWrapperStyles as Lt, useTooltipType as tn, cfDisableActionEditors as qi, ComponentDataProvider as Pe, key as Yi, cfDisableMainComponentProperties as Xi, cfDisableStyleProperties as Qi, cfDisableTooltipProperties as ea, cfDisableAdditionalProperties as ta, cfDisableStylesForClassNameEditor as na, cfEnableInlineStylesEditor as oa, useModalComponentData as ra, useModalType as uo, isContainer as Xe, boolean as mo, timeFormat as jt, createProperty as ia, getValidatorPropertyBlockType as En, globalDefaultLanguage as ho, Language as le, BiDi as be, findLanguage as aa, definePreset as sa, getKey as la, ComponentData as ca, nameObservable as Qe, BuilderView as po, ActionDefinition as go, treeForEach as Wt, cfComponentIsPreset as yt, cfDisableComponentRemove as Co, PersistedFormVersion as da, screenModel as Mn, cfHideFromComponentPalette as ua, initFormFields as ma, CalculableResult as ye, generateUniqueName as ha, AsyncFunction as nn, calculatePropertyValue as pa, getFluentCompatibleId as ga, testFluentLocalization as Ca, getFluentData as fa, nameAutorun as Ne, DefaultWrapper as ba, checkSlotCondition as An, groupBy as ya, ComponentTree as qe, TemplateField as va, slotModel as wa, node as ka, toArray as xa, findTreeElementDepth as Sa, emotionCache as Tn, loadResource as fo, unloadResource as La, ViewerPropsProvider as Ea, StoreProvider as Ma, useDisposable as Aa, Store as Ta, FormViewerPropsStore as Pa, ComponentState as Fa, getChildren as Ra, useViewerProps as Da, BuilderModeProvider as Ia, FormViewer as Na, oneOf as bo, useErrorModel as za, tooltipType as Ba, SuppressResizeObserverErrors as Va } from "@react-form-builder/core";
import { BuilderView as f3 } from "@react-form-builder/core";
import * as y from "react";
import { useState as P, useEffect as T, useCallback as u, useMemo as v, cloneElement as yo, useRef as J, useReducer as $a, createElement as Ha, Component as Oa, useImperativeHandle as ja, Suspense as Wa } from "react";
import { useToaster as _a, Message as Et, Checkbox as on, Table as Mt, InputPicker as et, IconButton as X, InputNumber as At, Input as de, Button as z, Form as Y, Tooltip as Tt, Whisper as Fe, InputGroup as te, TagInput as Ka, Popover as rn, DatePicker as vo, SelectPicker as Ua, Animation as wo, ButtonGroup as pe, List as ko, Dropdown as O, Divider as Za, RadioGroup as Ga, Radio as Ja, TagPicker as qa, Schema as vt, CustomProvider as Ya, Modal as se, Nav as xo, Loader as Xa } from "rsuite";
import { cx as U, css as tt } from "@emotion/css";
import { observer as Qa } from "mobx-react";
import { useTranslation as I, initReactI18next as es } from "react-i18next";
import { Resizable as ts } from "re-resizable";
import { upperFirst as So, isEqual as ns, isObject as Lo, assign as an, isEmpty as Eo, startCase as sn, isUndefined as Pt, merge as os, debounce as rs, isNumber as is, toUpper as Mo, replace as as, camelCase as ss, isEqualWith as ls } from "lodash-es";
import { computed as cs, makeAutoObservable as nt, runInAction as Pn, observable as Ve, action as Ye, reaction as ln, autorun as ze, makeObservable as ds } from "mobx";
import { Plus as Re, Close as he, Icon as Ft, Code as Ao, Check as us, Copy as ms, ArrowUpLine as To, ArrowDownLine as Rt, RemindFill as hs, SortUp as ps, SortDown as gs, ArrowRightLine as Cs, Export as fs, Import as bs, FileDownload as ys, FileUpload as vs, Search as ws, ExpandOutline as ks, CollaspedOutline as xs } from "@rsuite/icons";
import * as Po from "@fortawesome/free-solid-svg-icons/faCode.js";
import * as Ss from "@fortawesome/free-solid-svg-icons/faGlobe.js";
import * as dt from "@fortawesome/free-solid-svg-icons/faMarker.js";
import { css as Ke, CacheProvider as Ls } from "@emotion/react";
import { RgbaColorPicker as Es } from "react-colorful";
import { faMarker as Ms, faGlobe as As, faBars as Ts } from "@fortawesome/free-solid-svg-icons";
import Fn, { t as Ps } from "i18next";
import * as Fs from "@fortawesome/free-solid-svg-icons/faCheck.js";
import { constrainedEditor as Rs } from "constrained-editor-plugin";
import Ds, { loader as Is } from "@monaco-editor/react";
import "monaco-editor";
import { format as Fo, parse as Ns } from "date-fns";
import zs from "i18next-browser-languagedetector";
import Bs from "i18next-resources-to-backend";
import Vs from "date-fns/locale/ar-EG/index.js";
import $s from "date-fns/locale/de/index.js";
import Hs from "date-fns/locale/en-US/index.js";
import Os from "date-fns/locale/es/index.js";
import js from "date-fns/locale/fa-IR/index.js";
import Ws from "date-fns/locale/fr/index.js";
import Ro from "date-fns/locale/hi/index.js";
import _s from "date-fns/locale/it/index.js";
import Ks from "date-fns/locale/ja/index.js";
import Us from "date-fns/locale/ko/index.js";
import Do from "date-fns/locale/sr/index.js";
import Zs from "date-fns/locale/zh-CN/index.js";
import { arEG as Gs, deDE as Js, enUS as Io, itIT as qs, faIR as Ys, frFR as Xs, esES as Qs, jaJP as el, koKR as tl, zhCN as nl } from "rsuite/esm/locales/index.js";
import * as ol from "@fortawesome/free-solid-svg-icons/faBookmark.js";
import * as No from "@fortawesome/free-solid-svg-icons/faPlay.js";
import { useDrag as rl, useDrop as zo, useDragLayer as ot, DndProvider as il } from "react-dnd";
import { getEmptyImage as al, HTML5Backend as sl } from "react-dnd-html5-backend";
import { createPortal as ll } from "react-dom";
import * as cl from "@fortawesome/free-regular-svg-icons/faClone.js";
import * as dl from "@fortawesome/free-regular-svg-icons/faTrashAlt.js";
import Bo from "scroll-into-view-if-needed";
import * as ul from "@fortawesome/free-regular-svg-icons/faBookmark.js";
import * as ml from "@fortawesome/free-solid-svg-icons/faRedo.js";
import * as Kt from "@fortawesome/free-solid-svg-icons/faSave.js";
import * as hl from "@fortawesome/free-solid-svg-icons/faUndo.js";
import * as pl from "@fortawesome/free-solid-svg-icons/faTrash.js";
import { saveAs as gl } from "file-saver";
import Vo from "jszip";
import * as $o from "@fortawesome/free-solid-svg-icons/faPaintBrush.js";
import * as Cl from "@fortawesome/free-solid-svg-icons/faMoon.js";
import * as fl from "@fortawesome/free-solid-svg-icons/faSun.js";
import * as bl from "@fortawesome/free-solid-svg-icons/faDesktop.js";
import * as yl from "@fortawesome/free-solid-svg-icons/faMobile.js";
import * as vl from "@fortawesome/free-solid-svg-icons/faTablet.js";
import * as Ho from "@fortawesome/free-solid-svg-icons/faSpellCheck.js";
import * as wl from "@fortawesome/free-solid-svg-icons/faList.js";
import * as kl from "@fortawesome/free-solid-svg-icons/faPlusCircle.js";
import * as xl from "@fortawesome/free-solid-svg-icons/faSitemap.js";
import * as Sl from "@fortawesome/free-solid-svg-icons/faSlidersH.js";
import * as Ll from "@fortawesome/free-solid-svg-icons/faBolt.js";
import * as El from "@fortawesome/free-solid-svg-icons/faCircle.js";
const [
  /**
   * **Internal use only.**
   */
  S,
  /**
   * **Internal use only.**
   */
  Ml
] = Ae("BuildStoreContext"), ue = (t, e) => {
  e.displayName = t;
  const n = e, o = `FE_${t}`;
  return function(a) {
    var g;
    const l = (g = S().props.customization) == null ? void 0 : g[t];
    if (!l)
      return /* @__PURE__ */ i(n, { ...a, className: U(o, a.className) });
    if (l.hidden)
      return null;
    const { style: c, customRenderer: d } = l, m = U(o, a == null ? void 0 : a.className, l.className, tt`${c}`, t), h = /* @__PURE__ */ i(n, { ...a, className: m });
    return d ? d(h, e, a) : h;
  };
}, q = (t, e) => ue(t, Qa(e)), rt = () => {
  const [t, e] = P(), n = _a();
  return T(() => {
    if (!t)
      return;
    const o = t.placement || "bottomEnd", r = t.type || "info";
    n.push(/* @__PURE__ */ i(Et, { type: r, title: t.title, children: t.message }), {
      placement: o
    }), e(void 0);
  }, [t, n]), e;
}, cn = () => {
  const t = S(), { t: e } = I(), n = rt();
  return (o) => {
    t.save(o).then(() => n({ type: "success", message: e("leftMenu.formSaved") })).catch((r) => {
      console.error(r), n({ type: "error", message: e("leftMenu.formSaveError") });
    });
  };
}, Al = (t) => {
  t.preventDefault(), t.stopPropagation();
}, Tl = {
  default: [
    [{ key: "Delete" }, "deleteSelectedAction"],
    [{ key: "d", ctrl: !0 }, "cloneOneSelectedAction"],
    [{ key: "s", ctrl: !0 }, "saveFormAction"],
    [{ key: "z", ctrl: !0 }, "undoAction"],
    [{ key: "z", ctrl: !0, shift: !0 }, "redoAction"],
    [{ key: "y", ctrl: !0 }, "redoAction"]
  ],
  macos: [
    [{ key: "Delete" }, "deleteSelectedAction"],
    [{ key: "d", meta: !0 }, "cloneOneSelectedAction"],
    [{ key: "s", meta: !0 }, "saveFormAction"],
    [{ key: "z", meta: !0, shift: !0 }, "redoAction"],
    [{ key: "z", meta: !0 }, "undoAction"]
  ]
}, Pl = () => navigator.userAgent.indexOf("Mac") === -1 ? "default" : "macos", Fl = (t) => {
  const e = Pl(), o = Tl[e].find(([r]) => !(r.key.toLowerCase() !== t.key.toLowerCase() || !!r.alt !== t.altKey || !!r.shift !== t.shiftKey || !!r.ctrl !== t.ctrlKey || !!r.meta !== t.metaKey));
  return o == null ? void 0 : o[1];
}, Rl = () => {
  const t = S(), e = cn();
  return v(() => ({
    deleteSelectedAction: () => {
      t.deleteSelectedComponents();
    },
    cloneOneSelectedAction: () => {
      const n = t.oneSelected;
      n && t.clone(n);
    },
    saveFormAction: () => {
      e();
    },
    undoAction: () => {
      t.undoer.undo();
    },
    redoAction: () => {
      t.undoer.redo();
    }
  }), [t, e]);
}, Dl = () => {
  const t = Rl();
  return u((e) => {
    if (document.activeElement !== document.body)
      return;
    const n = Fl(e);
    if (n) {
      const o = t[n];
      o && (Al(e), o());
    }
  }, [t]);
}, [
  Oo,
  Il
] = Ae("LicenseContext"), { Cell: Nl } = Mt, Dt = w(Nl)`
  padding: 0;

  & .rs-table-cell-content {
    padding: 9px 3px;
  }
`, zl = w(on)`
  & .rs-checkbox-wrapper {
    left: 4px;
    top: 6px;
  }
`, Bl = ({ rowData: t, dataKey: e, rowIndex: n, onChange: o, type: r, ...a }) => {
  const s = t[e] ?? "", l = r === "number" ? At : de, c = u((d) => {
    t[e] = d, o == null || o(d, e, n);
  }, [e, o, t, n]);
  return /* @__PURE__ */ i(Dt, { ...a, children: /* @__PURE__ */ i(l, { value: s, onChange: c, size: "sm" }) });
}, u3 = ({ rowData: t, dataKey: e, rowIndex: n, onChange: o, ...r }) => {
  const a = t[e] ?? !1, s = u((l, c) => {
    t[e] = c, o == null || o(c, e, n);
  }, [e, o, t, n]);
  return /* @__PURE__ */ i(Dt, { ...r, children: /* @__PURE__ */ i(zl, { inline: !0, checked: a, onChange: s }) });
}, Vl = ({ rowData: t, dataKey: e, rowIndex: n, options: o, onChange: r, ...a }) => {
  const s = t[e] ?? "", l = u((c) => {
    t[e] = c, r == null || r(c, e, n);
  }, [e, r, t, n]);
  return /* @__PURE__ */ i(Dt, { ...a, children: /* @__PURE__ */ i(
    et,
    {
      value: s,
      data: o,
      onChange: l,
      cleanable: !1,
      creatable: !0,
      block: !0,
      size: "sm",
      placement: "auto"
    }
  ) });
}, $l = ({ rowData: t, rowIndex: e, onAction: n, icon: o, ...r }) => {
  const a = u(() => n(e), [n, e]);
  return /* @__PURE__ */ i(Dt, { ...r, children: /* @__PURE__ */ i(
    X,
    {
      appearance: "subtle",
      size: "sm",
      onClick: a,
      icon: o
    }
  ) });
}, { ErrorMessage: Hl } = Y, { Column: Ol, HeaderCell: jl } = Mt, Wl = { marginTop: 10 }, _l = w(Mt)`
  .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;
    }
  }
`, Kl = /* @__PURE__ */ i(he, {}), jo = (t) => {
  const [e, n] = P({}), [o, r] = P(!1), {
    // eslint-disable-next-line react-perf/jsx-no-new-array-as-prop
    data: a = [],
    onChange: s,
    columns: l,
    label: c,
    errorMessage: d,
    autoAdd: m,
    hideHeader: h,
    onAdd: g,
    onRemove: C,
    ...p
  } = t, { autoHeight: b, maxHeight: x } = e, L = h ? 0 : t.headerHeight ?? 40, R = t.rowHeight ?? 46, A = t.maxRows ?? 5, E = a.length <= A, K = t.renderEmpty ? L + R : 0, ee = L + R * A, ge = a.length > A ? ee : K, Q = u((re) => {
    if (m) {
      const Sn = re[re.length - 1];
      (!Sn || Object.values(Sn).some((Oi) => Oi)) && re.push({});
    }
    s == null || s(re);
  }, [m, s]), Ce = u(() => {
    n({
      autoHeight: E,
      maxHeight: ge
    });
  }, [ge, E]), lt = u(() => {
    Q == null || Q([...a, {}]), r(!0), Ce(), g == null || g(a.length);
  }, [a, Q, Ce, g]), N = u((re) => {
    a.splice(re, 1), Q == null || Q(a), Ce(), C == null || C(re);
  }, [a, Q, Ce, C]), B = u(() => Q == null ? void 0 : Q([...a]), [Q, a]), oe = u(() => l == null ? void 0 : l.map(
    (re) => yo(re, { onChange: B })
  ), [l, B]), Hi = u(() => {
    const re = {};
    return o && (re.y = Number.MAX_SAFE_INTEGER, r(!1)), re;
  }, [o]);
  return T(Ce, []), /* @__PURE__ */ f("div", { children: [
    !!c && /* @__PURE__ */ i("label", { children: c }),
    /* @__PURE__ */ f(
      _l,
      {
        data: a,
        headerHeight: L,
        rowHeight: R,
        height: x,
        autoHeight: b,
        shouldUpdateScroll: Hi,
        className: U({ hideHeader: h }),
        ...p,
        children: [
          oe(),
          /* @__PURE__ */ f(Ol, { width: 34, children: [
            /* @__PURE__ */ i(jl, { children: /* @__PURE__ */ i("div", {}) }),
            /* @__PURE__ */ i($l, { onAction: N, icon: Kl })
          ] })
        ]
      }
    ),
    !!d && /* @__PURE__ */ i(Hl, { show: !!d, placement: "bottomStart", children: d }),
    !m && /* @__PURE__ */ i(z, { appearance: "default", size: "sm", onClick: lt, style: Wl, block: !0, children: /* @__PURE__ */ i(Re, {}) })
  ] });
}, { Column: Ul, HeaderCell: Zl } = Mt, Wo = (t) => t.map(({ name: e, input: n, title: o, inputProps: r = {} }) => {
  const a = n ?? Bl;
  return /* @__PURE__ */ f(Ul, { flexGrow: 1, children: [
    /* @__PURE__ */ i(Zl, { children: o ?? So(e) }),
    /* @__PURE__ */ i(a, { dataKey: e, ...r })
  ] }, e);
});
let Gl = 0;
function Jl(t) {
  const e = ++Gl;
  return t ? `${t}${e}` : `${e}`;
}
function _o(t) {
  const e = J(null);
  return e.current || (e.current = Jl(t)), e.current;
}
const [
  /**
   * **Internal use only.**
   */
  ql,
  /**
   * **Internal use only.**
   */
  dn
] = Ae("TooltipPlacementContext"), Rn = w.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;
  }
`, ce = ({ hint: t, children: e, ...n }) => {
  const o = ql(), r = n.placement ?? o, a = v(() => /* @__PURE__ */ i(Tt, { children: t }), [t]);
  return t ? /* @__PURE__ */ i(Fe, { speaker: a, placement: r, trigger: "hover", children: e }) : /* @__PURE__ */ i(D, { children: e });
}, It = ({ hint: t, children: e, ...n }) => t ? /* @__PURE__ */ i(ce, { hint: t, children: /* @__PURE__ */ i(Rn, { ...n, hinted: !0, children: e }) }) : /* @__PURE__ */ i(Rn, { ...n, children: e }), Nt = ({ hint: t, hintPlacement: e, ...n }) => /* @__PURE__ */ i(ce, { hint: t, placement: e ?? "bottom", children: /* @__PURE__ */ i(X, { ...n, size: "xs" }) }), F = (t) => {
  const [e, { exists: n }] = I();
  return (o) => {
    const r = `${t}.${o}`;
    return n(r) ? e(r) : "";
  };
}, un = 5, H = w.div`
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: ${({ gap: t }) => t ?? un}px;
`, ne = w.div`
  display: flex;
  gap: ${({ gap: t }) => t ?? un}px;
  ${({ stretchElements: t }) => t && "& > * { flex: 1; }"};
  ${({ spaceBetween: t }) => t && "justify-content: space-between"};
`, Ko = w.div`
  display: flex;
  gap: 10px;
  justify-content: space-between;
  align-items: center;

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

    :hover {
      background-color: var(--rs-btn-default-hover-bg);
    }
  }
`, zt = w.div`
  ${Zo}
`, mn = w.div`
  ${Go}
  ${({ clickable: t = !1 }) => t && Yl}
`, Xl = (t) => {
  if (t != null && t.icon) {
    const [e, n, , , o] = t.icon;
    return { width: e, height: n, svgPathData: o };
  }
  return t;
}, Ql = Te(({ faIcon: t, size: e, ...n }, o) => {
  const { width: r, height: a, svgPathData: s } = Xl(t);
  return /* @__PURE__ */ i(
    "svg",
    {
      viewBox: `0 0 ${r} ${a}`,
      width: `${e ?? 1}em`,
      height: `${e ?? 1}em`,
      fill: "currentColor",
      ...n,
      ref: o,
      children: /* @__PURE__ */ i("path", { d: s })
    }
  );
}), W = Te(({ icon: t, size: e, ...n }, o) => /* @__PURE__ */ i(Ft, { as: Ql, ref: o, faIcon: t, size: e, ...n })), hn = (t, e) => {
  const n = F(`annotation.${t.key}`), o = F(`${e}.${t.key}`), r = u((l) => o(l) || n(l), [n, o]), a = v(() => t.hint ?? r("hint"), [t.hint, r]), s = v(() => r("name") || t.name, [t.name, r]);
  return v(() => ({
    hint: a,
    label: s
  }), [a, s]);
}, ec = w(X)`
  min-width: 24px;
  margin-inline-end: -6px;
`, tc = { alignItems: "center" }, nc = {
  disabled: {
    hint: "neitherCalculableNorLocalizable",
    icon: dt,
    color: "var(--rs-btn-default-disabled-bg)"
  },
  calculation: {
    hint: "editCalculable",
    color: "var(--rs-btn-primary-bg)",
    icon: Po
  },
  localization: {
    hint: "editLocalizable",
    color: "var(--rs-btn-primary-bg)",
    icon: Ss
  },
  calculable: {
    hint: "hintCalculable",
    icon: dt
  },
  localizable: {
    hint: "hintLocalizable",
    icon: dt
  },
  calculableAndLocalizable: {
    hint: "hintCalculableAndLocalizable",
    icon: dt
  }
}, oc = (t) => {
  const { annotation: e, getComputeCode: n, setComputeCode: o, disableCompute: r, getComputeType: a, hasComputeCode: s, componentData: l } = t, c = S(), d = !e.calculable && !e.localizable, m = F("propertiesEditor.codeButton"), h = a(), g = v(() => {
    const x = h === "function" && s("function"), L = h === "localization" && s("localization");
    return d ? "disabled" : x ? "calculation" : L ? "localization" : e.calculable && e.localizable ? "calculableAndLocalizable" : e.calculable ? "calculable" : e.localizable ? "localizable" : "disabled";
  }, [e.calculable, e.localizable, d, s, h]), C = v(() => {
    const { hint: x, icon: L, color: R } = nc[g];
    return { icon: L, color: R, hint: m(x) };
  }, [g, m]), p = u(() => c.currentEditable = new li(
    r,
    o,
    n,
    a,
    s,
    e,
    l.key
  ), [e, l.key, r, n, a, s, o, c]), b = v(() => /* @__PURE__ */ i(W, { icon: C.icon, color: C.color }), [C.icon, C.color]);
  return /* @__PURE__ */ i(ce, { hint: C.hint, children: /* @__PURE__ */ i(
    ec,
    {
      onClick: p,
      disabled: d,
      icon: b,
      size: "xs",
      appearance: "subtle"
    }
  ) });
}, rc = q("PropertyCodeButton", oc), ic = ue("PropertyLabel", It), ac = { width: "100%" }, sc = (t) => /* @__PURE__ */ i("div", { style: ac, ...t }), lc = ue("PropertyInput", sc), cc = w.div`
  min-width: 18px;
`, pn = (t) => {
  const { children: e, className: n, style: o, label: r, hint: a, required: s, leftButton: l } = t, c = _o("id-"), d = v(() => U({ required: s }), [s]);
  return /* @__PURE__ */ f(Ko, { style: o, className: n, children: [
    /* @__PURE__ */ f(ne, { gap: 10, style: tc, children: [
      l ?? /* @__PURE__ */ i(cc, {}),
      /* @__PURE__ */ i(ic, { htmlFor: c, hint: a, className: d, children: /* @__PURE__ */ i(D, { children: r }) })
    ] }),
    !!e && /* @__PURE__ */ i(lc, { children: yo(e, { id: c }) })
  ] });
}, dc = (t) => {
  const { annotation: e, children: n, style: o, value: r } = t, { className: a, ...s } = t, l = t.componentData.model.type, c = v(() => e.calculable || e.localizable ? /* @__PURE__ */ i(rc, { ...s }) : void 0, [e.calculable, e.localizable, s]), { hint: d, label: m } = hn(e, l), h = !ns(r, e.default), g = [a, h ? "valueModified" : ""].filter((C) => !!C).join(" ");
  return /* @__PURE__ */ i(
    pn,
    {
      style: o,
      className: g,
      required: e.required,
      hint: d,
      label: m,
      leftButton: c,
      children: n
    }
  );
}, V = ue("LabeledProperty", dc), uc = [{ name: "value" }, { name: "label" }], mc = (t) => {
  const { value: e, onChange: n, annotation: o, componentData: r } = t, { onAdd: a, onRemove: s, columns: l, calculateEditorProps: c } = o.editorProps ?? {}, d = j(), m = v(() => Wo(l ?? uc), [l]), h = u((p) => {
    a == null || a(p, r, d);
  }, [d, r, a]), g = u((p) => {
    s == null || s(p, r, d);
  }, [d, r, s]), C = (c == null ? void 0 : c(r, n)) ?? {};
  return /* @__PURE__ */ f(D, { children: [
    /* @__PURE__ */ i(V, { ...t }),
    /* @__PURE__ */ i(
      jo,
      {
        data: e,
        onChange: n,
        columns: m,
        onRemove: g,
        onAdd: h,
        ...C
      }
    )
  ] });
}, hc = k("ArrayInput", mc), Jo = (t) => {
  const { onClick: e, hint: n, className: o } = t, r = v(() => U(["rs-picker-clean", "rs-btn-close", o]), [o]);
  return /* @__PURE__ */ i(ce, { hint: n, children: /* @__PURE__ */ i("button", { className: r, onClick: e, children: /* @__PURE__ */ i(he, {}) }) });
}, gn = (t) => {
  const { onClick: e, className: n } = t, o = F("propertiesEditor"), r = v(() => o("clean"), [o]);
  return /* @__PURE__ */ i(Jo, { hint: r, onClick: e, className: n });
}, Dn = (t, e) => {
  try {
    return JSON.stringify(t, null, e);
  } catch {
    return;
  }
}, pc = (t) => {
  const { value: e, onChange: n, onClean: o, onValidate: r, editorKey: a, editorTitle: s } = t, l = S(), c = v(() => (Lo(e) ? Dn(e, 2) : e) ?? "", [e]), d = v(() => {
    var h;
    return e ? ((h = Dn(e)) == null ? void 0 : h.substring(0, 50)) ?? "Error" : "";
  }, [e]), m = u(() => {
    l.editJsonCode(a, s, c, n, r);
  }, [l, a, s, n, c, r]);
  return /* @__PURE__ */ f(te, { inside: !0, size: "xs", children: [
    /* @__PURE__ */ i(de, { value: d, onClick: m, readOnly: !0, color: "var(--rs-btn-ghost-text)" }),
    /* @__PURE__ */ i(te.Button, { onClick: e ? o : m, children: e ? /* @__PURE__ */ i(he, {}) : /* @__PURE__ */ i(Ao, {}) })
  ] });
}, gc = w(H)`
  overflow-y: auto;
  max-height: 160px;
`, Cc = w.div`
  display: flex;
  margin-left: 4px;
  margin-bottom: 4px;
  margin-top: 4px;
`, fc = w.div`
  display: flex;
  justify-content: end;
`, In = tt`
  color: var(--rs-text-primary);
`, bc = (t) => {
  const e = JSON.parse(t);
  if (typeof e != "object" || Array.isArray(e))
    throw new Error("The value must be an object");
}, yc = { marginTop: 10 }, vc = {
  marginLeft: 4,
  marginBottom: 4,
  marginTop: 4
}, wc = (t) => {
  const { value: e, onChange: n, onClean: o, annotation: r } = t, a = F("propertiesEditor"), s = v(() => e ?? [], [e]), l = u((p, b) => {
    const x = [...s];
    x[b] = p, n(x);
  }, [n, s]), c = u(() => {
    n == null || n([...s, {}]);
  }, [n, s]), d = u((p) => {
    s.splice(p, 1), n == null || n([...s]);
  }, [n, s]), m = v(() => s.map((p, b) => (x) => l(x, b)), [s, l]), h = v(() => s.map((p, b) => () => l({}, b)), [s, l]), g = v(() => s.map((p, b) => () => d(b)), [s, d]), C = s.map((p, b) => {
    const x = `${t.componentData.key}.${r.name}[${b}]`;
    return /* @__PURE__ */ f(Cc, { style: vc, children: [
      /* @__PURE__ */ i(
        pc,
        {
          editorKey: x,
          editorTitle: x,
          value: p,
          onChange: m[b],
          onClean: h[b],
          onValidate: bc
        }
      ),
      /* @__PURE__ */ i(Jo, { onClick: g[b], hint: a("removeRow"), className: In })
    ] }, x);
  });
  return /* @__PURE__ */ f(D, { children: [
    /* @__PURE__ */ i(V, { ...t, children: /* @__PURE__ */ i(fc, { children: /* @__PURE__ */ i(gn, { onClick: o, className: In }) }) }),
    /* @__PURE__ */ i(gc, { gap: 0, children: C }),
    /* @__PURE__ */ i(z, { appearance: "default", size: "sm", onClick: c, style: yc, block: !0, children: /* @__PURE__ */ i(Re, {}) })
  ] });
}, kc = { width: "100%" }, xc = (t) => {
  const { value: e, onChange: n, onClean: o } = t, r = F("propertiesEditor");
  return /* @__PURE__ */ i(V, { ...t, children: /* @__PURE__ */ i(
    Ka,
    {
      value: e ?? "",
      onChange: n,
      onClean: o,
      block: !0,
      size: "xs",
      style: kc,
      placeholder: r("setInputHint")
    }
  ) });
}, Sc = [
  "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"
], Lc = Wo([
  {
    name: "name",
    input: Vl,
    inputProps: { options: en(Sc, !1) }
  },
  { name: "value" }
]), Ec = /* @__PURE__ */ i(us, {}), Mc = ({ confirm: t }) => {
  const e = F("common");
  return /* @__PURE__ */ i(X, { icon: Ec, onClick: t, color: "green", appearance: "primary", size: "xs", children: e("apply") });
}, Ac = (t) => {
  const { store: e } = t.componentData, n = !!t.getComputeType(), o = v(
    () => e.htmlAttributes ? [...e.htmlAttributes] : e.htmlAttributes,
    [e]
  ), [r, a] = P(o), [s, l] = P(!1), c = r ?? [], d = u((h) => {
    a(h), l(!0);
  }, []), m = u(() => {
    e.htmlAttributes = r, l(!1);
  }, [e, r]);
  return T(() => {
    a(o), l(!1);
  }, [o, e]), /* @__PURE__ */ f(D, { children: [
    /* @__PURE__ */ i(V, { ...t, children: s && /* @__PURE__ */ i(Mc, { confirm: m }) }),
    !n && /* @__PURE__ */ i(jo, { data: c, onChange: d, columns: Lc })
  ] });
}, Tc = k("RawAttributesInput", Ac), Bt = w(on)`
  && {
    height: 23px;
    display: flex;
    align-items: center;
    width: 100%;

    .rs-checkbox-checker {
      padding-left: 0;
      margin-left: -10px;
    }
  }
`, Pc = w.div`
  display: flex;

  .rs-picker-clean.rs-btn-close {
    color: var(--rs-text-secondary);
  }
`, Fc = (t) => {
  const { id: e, value: n, onChange: o, onClean: r } = t, a = u((s, l) => {
    o(l);
  }, [o]);
  return /* @__PURE__ */ f(Pc, { children: [
    /* @__PURE__ */ i(Bt, { id: e, checked: !!n, onChange: a }),
    /* @__PURE__ */ i(gn, { onClick: r })
  ] });
}, Ut = (t) => /* @__PURE__ */ i(V, { ...t, children: /* @__PURE__ */ i(Fc, { ...t }) }), Rc = w(de)`
  && {
    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)"};
  }
`, Dc = w(te.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 Ic(t) {
  const { r: e, g: n, b: o, a: r } = t;
  return `rgba(${e}, ${n}, ${o}, ${r})`;
}
function Nc(t) {
  const e = /^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+(?:\.\d+)?))?\)$/, [, n, o, r, a] = e.exec(t) || [];
  return { r: Number(n), g: Number(o), b: Number(r), a: Number(a) };
}
const zc = { width: "100%" }, Bc = (t) => {
  const { value: e, onChange: n, onClean: o } = t, r = v(() => Nc(e ?? "rgba(255, 255, 255, 0)"), [e]), a = u((l) => n(Ic(l)), [n]), s = v(() => /* @__PURE__ */ i(rn, { children: /* @__PURE__ */ i(Es, { color: r, onChange: a }) }), [r, a]);
  return /* @__PURE__ */ i(V, { ...t, children: /* @__PURE__ */ f(te, { inside: !0, style: zc, size: "xs", children: [
    /* @__PURE__ */ i(Fe, { placement: "auto", trigger: "hover", speaker: s, enterable: !0, children: /* @__PURE__ */ i(Rc, { color: e, readOnly: !0 }) }),
    /* @__PURE__ */ i(Dc, { onClick: o, children: /* @__PURE__ */ i(he, {}) })
  ] }) });
}, it = w(et)`
  width: 100%;
`, Vc = (t) => {
  const { availableComponents: e } = S(), { value: n, onChange: o, annotation: r, onClean: a } = t, { filter: s = void 0, ...l } = { ...t.annotation.editorProps }, c = v(() => Object.values(e).flatMap((d) => d).filter((d) => (s == null ? void 0 : s(d)) ?? !0).map((d) => ({ value: d.model.type, label: d.model.name })), [e, s]);
  return /* @__PURE__ */ i(V, { ...t, children: /* @__PURE__ */ i(
    it,
    {
      value: n ?? r.default ?? "",
      data: c,
      onChange: o,
      onClean: a,
      block: !0,
      cleanable: !0,
      size: "xs",
      ...l,
      placement: "autoVerticalEnd",
      "data-testid": `${t.annotation.key}-component-by-filter-picker`
    }
  ) });
}, $c = w.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;
  }
`, qo = (t) => {
  const { value: e = "", annotation: n, onChange: o, onClean: r } = t, a = J(null), s = J(null);
  return T(() => {
    const l = s.current;
    l && (l.dataset.contents = e);
  }, [e]), T(() => {
    const l = a.current, c = s.current;
    if (l && c) {
      const d = globalThis.getComputedStyle(l);
      c.style.lineHeight = d.lineHeight, c.style.fontSize = d.fontSize;
    }
  }, []), /* @__PURE__ */ f($c, { ref: s, "data-testid": `resizable-string-input-${t.annotation.key}`, children: [
    /* @__PURE__ */ i(
      de,
      {
        ref: a,
        rows: 1,
        name: n.key,
        value: e,
        onChange: o,
        size: "xs",
        as: "textarea",
        ...t.annotation.editorProps
      }
    ),
    /* @__PURE__ */ i(gn, { onClick: r })
  ] });
}, Yo = (t) => /* @__PURE__ */ i(V, { ...t, children: /* @__PURE__ */ i(qo, { ...t }) }), Hc = (t) => {
  const { componentData: e } = t, n = e.store.dataKey, o = u((a) => {
    e.store.dataKey = a;
  }, [e]), r = u(() => {
    e.store.dataKey = void 0;
  }, [e]);
  return /* @__PURE__ */ i(Yo, { ...t, value: n, onChange: o, onClean: r });
}, Oc = (t) => {
  const { onChange: e, onClean: n } = t;
  let { value: o } = t;
  return typeof o == "string" && (o = new Date(o)), /* @__PURE__ */ i(V, { ...t, children: /* @__PURE__ */ i(
    vo,
    {
      editable: !1,
      cleanable: !0,
      placement: "auto",
      value: o ?? null,
      onChange: e,
      onClean: n,
      size: "xs"
    }
  ) });
}, jc = (t) => {
  var a;
  const { store: e } = t.componentData, n = (a = e.disableDataBinding) == null ? void 0 : a.value, o = u((s) => {
    e.disableDataBinding = { value: s };
  }, [e]), r = u(() => {
    e.disableDataBinding = void 0;
  }, [e]);
  return /* @__PURE__ */ i(Ut, { ...t, value: n, onChange: o, onClean: r });
}, Wc = /* @__PURE__ */ i(W, { icon: Ms }), Cn = (t) => {
  const e = F("common");
  return /* @__PURE__ */ i(Nt, { hint: e("edit"), icon: Wc, ...t });
}, _c = /* @__PURE__ */ i(ms, {}), Kc = (t) => {
  const e = F("common");
  return /* @__PURE__ */ i(Nt, { hint: e("clone"), icon: _c, ...t });
}, Uc = /* @__PURE__ */ i(he, {}), ve = (t) => {
  const e = F("common");
  return /* @__PURE__ */ i(Nt, { hint: e("remove"), icon: Uc, ...t });
};
function Xo(t) {
  return v(() => cs(t), [t]).get();
}
const [
  /**
   * **Internal use only.**
   */
  De,
  /**
   * **Internal use only.**
   */
  Zc
] = Ae("ActionDataContext"), fn = ({ width: t, ...e }) => {
  const n = v(() => ({ width: t }), [t]);
  return /* @__PURE__ */ i(Ua, { ...e, style: n });
}, Gc = [
  { label: "True", value: !0 },
  { label: "False", value: !1 }
], Jc = ({ name: t }) => {
  var r;
  const e = De(), n = u((a) => {
    const s = an({}, e.args);
    delete s[t], typeof a < "u" && (s[t] = a), e.args = s;
  }, [e, t]), o = u(() => {
    n(void 0);
  }, [n]);
  return /* @__PURE__ */ i(
    fn,
    {
      onClean: o,
      data: Gc,
      searchable: !1,
      value: ((r = e.args) == null ? void 0 : r[t]) ?? "",
      onSelect: n,
      size: "sm",
      width: "100%"
    }
  );
}, qc = k("InputBoolean", Jc);
class bn {
  /**
   * Constructor.
   * @param header the function editor header.
   * @param onSave the callback function called when the source code is saved.
   * @param onClose the callback function called when the editor is closed.
   * @param onCompile the callback function called at compile time.
   * @param source the source code.
   * @param beginContextLine the context line before the source code.
   * @param endContextLine the context line after the source code.
   */
  constructor(e, n, o, r, a, s, l) {
    this.header = e, this.onSave = n, this.onClose = o, this.onCompile = r, this.source = a, this.beginContextLine = s, this.endContextLine = l;
  }
}
const [
  /**
   * **Internal use only.**
   */
  Yc,
  /**
   * **Internal use only.**
   */
  Xc
] = Ae("EventHandlerItemContext"), Qc = { borderStyle: "dashed" }, Qo = `/**
 * @param {ActionEventArgs} e the action arguments.
 * @param {} args the action parameters arguments.
 * @param {Array} userArgs the rest parameters passed to the function from the user code.
 */
async function ArgumentCallback(e, args, ...userArgs) {`, er = "}", e1 = (t) => `${Qo}${t}${er}`, t1 = (t) => {
  var a;
  const e = De(), n = (a = e == null ? void 0 : e.args) == null ? void 0 : a[t], o = n == null ? void 0 : n.body, r = u((s) => {
    e.args ?? (e.args = {}), e.args[t] = { type: "fn", body: s };
  }, [e, t]);
  return v(() => [o, r], [r, o]);
}, n1 = ({ name: t }) => {
  const e = S(), [n, o] = t1(t), { t: r } = I(), a = _(), s = De(), l = Yc(), c = `${l.eventName}[${l.index}]`, d = `${r("bottomPanel.editCodeAction")}: ${a.key}.${c} ${s.name}:${t}`, m = u(() => o(void 0), [o]), h = u(() => {
    e.currentEditable = void 0;
  }, [e]), g = u((p) => {
    try {
      const b = e1(p);
      return { error: !1, result: new Function("e", "args", b)() };
    } catch (b) {
      return { error: !0, exceptions: [b] };
    }
  }, []), C = u(() => {
    const p = new bn(
      d,
      o,
      h,
      g,
      n || "",
      Qo,
      er
    );
    e.editFunction(p);
  }, [e, h, g, o, d, n]);
  return /* @__PURE__ */ f(ne, { children: [
    /* @__PURE__ */ i(z, { onClick: C, size: "xs", appearance: "ghost", block: !0, style: Qc, children: r("annotation.code.hint") }),
    !!n && /* @__PURE__ */ i(ve, { onClick: m })
  ] });
}, o1 = k("InputFunction", n1), r1 = ({ name: t }) => {
  var a;
  const e = De(), n = typeof ((a = e.args) == null ? void 0 : a[t]) < "u" ? Number(e.args[t]) : "", o = u((s) => {
    const l = an({}, e.args);
    delete l[t], (typeof s == "string" || typeof s == "number") && (l[t] = Number(s)), e.args = l;
  }, [e, t]), r = u(() => {
    o(null);
  }, [o]);
  return /* @__PURE__ */ f(te, { size: "sm", children: [
    /* @__PURE__ */ i(At, { value: n, onChange: o, onReset: r, size: "sm" }),
    /* @__PURE__ */ i(te.Button, { onClick: r, children: /* @__PURE__ */ i(he, {}) })
  ] });
}, i1 = k("InputNumber", r1), a1 = ({ name: t }) => {
  var r, a;
  const e = De(), n = ((a = (r = e.args) == null ? void 0 : r[t]) == null ? void 0 : a.toString()) ?? "", o = u((s) => e.args = an({}, e.args, { [t]: s }), [e, t]);
  return /* @__PURE__ */ i(te, { size: "sm", children: /* @__PURE__ */ i(de, { value: n, onChange: o }) });
}, s1 = k("InputString", a1), l1 = (t) => {
  switch (t) {
    case "string":
      return s1;
    case "number":
      return i1;
    case "boolean":
      return qc;
    case "function":
      return o1;
  }
}, c1 = ({ data: t }) => {
  const [e, n] = t, o = l1(n);
  return /* @__PURE__ */ f(H, { children: [
    /* @__PURE__ */ i("label", { children: e }),
    /* @__PURE__ */ i(o, { name: e })
  ] });
}, d1 = k("ArgumentItem", c1), u1 = w(z)`
  padding: 5px !important;
  border-radius: 0 !important;
  outline: 0 !important;
  color: var(--rs-btn-subtle-text) !important;

  &:focus {
    box-shadow: none;
    background-color: initial;
  }
`, m1 = () => {
  const t = De();
  T(() => () => {
    Eo(t.args) && delete t.args;
  }, [t.args]);
}, h1 = { marginBlock: 8, paddingInline: 10 }, p1 = { marginTop: -2 }, g1 = () => {
  const t = j(), e = De(), n = u(() => t.findAction(e), [e, t]), o = Xo(n), [r, a] = $a((c) => !c, !1), s = r ? To : Rt, l = u((c) => c.stopPropagation(), []);
  return m1(), Object.keys(o.params).length ? /* @__PURE__ */ f("div", { onMouseDown: l, children: [
    /* @__PURE__ */ i(wo.Collapse, { in: r, unmountOnExit: !0, children: /* @__PURE__ */ i(H, { gap: 1, style: h1, children: Object.entries(o.params).map((c, d) => /* @__PURE__ */ i(d1, { data: c }, d)) }) }),
    /* @__PURE__ */ i(u1, { block: !0, onClick: a, children: /* @__PURE__ */ f(D, { children: [
      Ps("actions.arguments"),
      /* @__PURE__ */ i(s, { style: p1 })
    ] }) })
  ] }) : null;
}, C1 = k("ArgumentList", g1), f1 = { justifyContent: "space-between", padding: 8 }, b1 = { color: "violet", marginLeft: 5 }, y1 = ({ action: t, onRemove: e }) => {
  const n = S(), o = j(), { name: r, type: a } = t, s = a === "code", l = u(() => {
    const c = o.form.actions[r];
    if (!c) {
      console.error(`Cannot find custom action: '${r}'`);
      return;
    }
    const d = { name: r, actionDefinition: c };
    n.editCodeAction(d);
  }, [n, r, o.form.actions]);
  return /* @__PURE__ */ f(Zc, { value: t, children: [
    /* @__PURE__ */ f(ne, { style: f1, children: [
      /* @__PURE__ */ i("b", { style: b1, children: `${r || "Action"}` }),
      /* @__PURE__ */ f(pe, { size: "xs", children: [
        s && /* @__PURE__ */ i(Cn, { onClick: l }),
        /* @__PURE__ */ i(ve, { onClick: e })
      ] })
    ] }),
    /* @__PURE__ */ i(C1, {})
  ] });
}, v1 = k("ActionItem", y1), w1 = w(ko)`
  ${Go}
  && {
    box-shadow: none;
  }
`, k1 = w(ko.Item)`
  ${Zo}
  && {
    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);
  }
`, x1 = ({ action: t, index: e, onRemove: n, eventName: o }) => {
  const r = u(() => n(e), [e, n]), a = v(() => ({
    index: e,
    eventName: o
  }), [o, e]);
  return /* @__PURE__ */ i(Xc, { value: a, children: /* @__PURE__ */ i(k1, { index: e, children: /* @__PURE__ */ i(v1, { action: t, onRemove: r }) }) });
}, S1 = k("ActionListItem", x1), L1 = (t) => {
  var a;
  const e = t.annotation.key, n = (a = t.componentData.store.events) == null ? void 0 : a[e], o = u((s) => n == null ? void 0 : n.splice(s, 1), [n]), r = u((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__ */ i(w1, { sortable: !0, onSort: r, children: n.map((s, l) => /* @__PURE__ */ i(S1, { index: l, action: s, onRemove: o, eventName: e }, s[_i])) }) : null;
}, E1 = k("ActionList", L1), M1 = { position: "relative", display: "flex", justifyContent: "space-between" }, A1 = { whiteSpace: "break-spaces" }, T1 = { marginTop: 0, marginBottom: 0 }, P1 = /* @__PURE__ */ i(Re, {}), F1 = ({ onSelect: t, annotation: e }) => {
  var h;
  const n = j(), o = S(), r = (h = o.oneSelected) == null ? void 0 : h.store, a = e.key, s = n.form.actionNames, l = F("actions"), c = u(() => {
    t(), r && o.addCodeAction((g) => {
      Je.addEventHandler(r, a, { name: g.name, type: "code" });
    });
  }, [t, r, o, a]), d = u((g) => () => t({ name: g, type: "code" }), [t]), m = u((g) => /* @__PURE__ */ i(O.Item, { onClick: d(g), style: M1, children: /* @__PURE__ */ i("span", { style: A1, children: g }) }, g), [d]);
  return /* @__PURE__ */ f(O.Menu, { title: l("code"), eventKey: "code", children: [
    s == null ? void 0 : s.map(m),
    !!(s != null && s.length) && /* @__PURE__ */ i(O.Item, { disabled: !0, children: /* @__PURE__ */ i(Za, { style: T1 }) }),
    /* @__PURE__ */ i(O.Item, { icon: P1, onClick: c, children: l("addCodeAction") })
  ] });
}, R1 = k("CodeActionsList", F1), D1 = ({ onSelect: t }) => {
  const e = j(), n = F("actions"), o = u((a) => () => t({ name: a, type: "common" }), [t]), r = v(() => Object.keys(e.commonActions).map((a) => /* @__PURE__ */ i(O.Item, { onClick: o(a), children: a }, a)), [o, e.commonActions]);
  return /* @__PURE__ */ i(O.Menu, { title: n("common"), eventKey: "common", children: r });
}, I1 = ({ onSelect: t }) => {
  const e = j(), n = F("actions"), { actions: o } = e.formViewerPropsStore, r = u((s) => () => t({ name: s, type: "custom" }), [t]), a = v(() => Object.keys(o ?? []).map((s) => /* @__PURE__ */ i(O.Item, { eventKey: `c