@velis/dynamicforms
Version:
Data entry boilerplate components and a RESTful API consumer
1,495 lines • 136 kB
JavaScript
var Jt = Object.defineProperty, en = Object.defineProperties;
var tn = Object.getOwnPropertyDescriptors;
var ht = Object.getOwnPropertySymbols;
var nn = Object.prototype.hasOwnProperty, rn = Object.prototype.propertyIsEnumerable;
var qe = (n, e, t) => e in n ? Jt(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, k = (n, e) => {
for (var t in e || (e = {}))
nn.call(e, t) && qe(n, t, e[t]);
if (ht)
for (var t of ht(e))
rn.call(e, t) && qe(n, t, e[t]);
return n;
}, fe = (n, e) => en(n, tn(e));
var a = (n, e, t) => qe(n, typeof e != "symbol" ? e + "" : e, t);
var w = (n, e, t) => new Promise((r, s) => {
var o = (d) => {
try {
l(t.next(d));
} catch (u) {
s(u);
}
}, i = (d) => {
try {
l(t.throw(d));
} catch (u) {
s(u);
}
}, l = (d) => d.done ? r(d.value) : Promise.resolve(d.value).then(o, i);
l((t = t.apply(n, e)).next());
});
import { DfDateTime as sn, DfCheckbox as on, DfRtfEditor as an, DfColor as ln, DfFile as un, DfInput as cn, DfSelect as dn, DfTextArea as mn, DynamicFormsInputs as fn, VuetifyComponents as hn } from "@dynamicforms/vuetify-inputs";
import pn, { notify as Ot } from "@kyvg/vue3-notification";
import { isString as he, isObjectLike as gn, isBoolean as yn, upperFirst as wn, camelCase as bn, toLower as Ke, cloneDeep as He, findIndex as Ge, find as vn, size as _n, includes as et, map as Cn, keys as Sn, filter as pt, clone as Dn, mapValues as kn, debounce as $n, sum as On } from "lodash-es";
import { inject as Q, provide as J, defineComponent as $, resolveComponent as z, createBlock as C, openBlock as h, withCtx as L, createElementVNode as R, normalizeClass as ee, createElementBlock as S, createCommentVNode as T, createVNode as N, renderSlot as le, reactive as oe, h as we, ref as A, onMounted as Re, onUnmounted as tt, computed as g, mergeDefaults as nt, unref as p, isRef as K, mergeProps as de, watch as ye, resolveDynamicComponent as ue, nextTick as Fe, onBeforeMount as Ln, normalizeProps as Lt, guardReactiveProps as Rt, createTextVNode as pe, toDisplayString as B, Fragment as G, renderList as se, onUpdated as rt, withModifiers as ve, normalizeStyle as ge, getCurrentInstance as Nt, onBeforeUpdate as Rn, toRefs as Nn, shallowRef as Tn } from "vue";
import { VIcon as An } from "vuetify/components/VIcon";
import En, { AxiosError as In } from "axios";
import { VInput as st } from "vuetify/components/VInput";
import { VAlert as Tt } from "vuetify/components/VAlert";
import { VCol as ot, VRow as At, VContainer as Pn, VSpacer as Vn } from "vuetify/components/VGrid";
import { format as Hn, parseISO as Fn } from "date-fns";
import xn from "vue-ionicon";
import { VBtn as Et } from "vuetify/components/VBtn";
import { VCard as Ne, VCardTitle as Te, VCardText as Ae, VCardActions as it } from "vuetify/components/VCard";
import { VSwitch as Un } from "vuetify/components/VSwitch";
import { VExpandTransition as It } from "vuetify/components/transitions";
import { VForm as jn } from "vuetify/components/VForm";
import { VLayout as Qe } from "vuetify/components/VLayout";
import { VDialog as Pt } from "vuetify/components/VDialog";
import Bn from "resize-observer-polyfill";
import { VCheckbox as Mn } from "vuetify/components/VCheckbox";
import { VColorPicker as qn } from "vuetify/components/VColorPicker";
import { VFileInput as Gn } from "vuetify/components/VFileInput";
import { VList as Wn, VListItem as zn, VListItemTitle as Kn } from "vuetify/components/VList";
import { VMain as Qn } from "vuetify/components/VMain";
import { VMenu as Xn } from "vuetify/components/VMenu";
import { VProgressLinear as Yn } from "vuetify/components/VProgressLinear";
import { VProgressCircular as Zn } from "vuetify/components/VProgressCircular";
import { VTextarea as Jn } from "vuetify/components/VTextarea";
import { VTextField as er } from "vuetify/components/VTextField";
import { useRoute as tr } from "vue-router";
const U = (n) => window.gettext ? window.gettext(n) : n, ce = (n, e) => window.interpolate ? window.interpolate(n, e, !0) : n.replace(/%\(\w+\)s/g, (t) => String(e[t.slice(2, -2)]));
function nr() {
return { gettext: U, interpolate: ce };
}
let rr = 0;
const sr = [
"HEADER",
"ROW_START",
"ROW_END",
"FIELD_START",
"FIELD_END",
"FORM_HEADER",
"FORM_FOOTER",
"ROW_CLICK",
"ROW_RIGHT_CLICK",
"VALUE_CHANGED"
];
function Pe(n, e, t) {
const r = t == null ? void 0 : t.dialog;
return r && r.resolvePromise && r.close && (r.resolvePromise({ action: n, payload: e, extraData: t, dialog: r }), r.close()), !0;
}
function _e(n) {
return `action${wn(bn(Ke(n)))}`;
}
class W {
constructor(e, t) {
a(this, "name");
a(this, "uniqueId");
a(this, "position");
a(this, "fieldName");
a(this, "label");
a(this, "labelAvailable");
a(this, "icon");
a(this, "iconAvailable");
a(this, "displayStyle");
a(this, "payload");
a(this, "title");
a(this, "extra_data");
const r = ++rr, s = e.name, o = e.position;
(!he(s) || !/^[a-zA-Z-_]+$/.test(s)) && console.warn(
`Action name must be a valid string, matching [a-zA-Z-_]+. Got ${s}. Impossible to construct handler function name`,
e
);
const i = !he(e.label) || e.label.length === 0 ? null : e.label, l = !he(e.icon) || e.icon.length === 0 ? null : e.icon, d = ["asButton", "showLabel", "showIcon"];
function u(v) {
if (v == null || !gn(v)) return null;
const D = d.reduce((O, E) => (yn(v[E]) && (O[E] = v[E]), O), {});
return Object.keys(D).length === 0 ? null : D;
}
function c(v, D) {
if (e.displayStyle == null) return;
const O = u(e.displayStyle[D]);
O && (v[D] = O);
}
const f = u(e.displayStyle) || {};
c(f, "xl"), c(f, "lg"), c(f, "md"), c(f, "sm"), c(f, "xs"), sr.indexOf(o) === -1 && console.warn(`Action position ${o} not known`, e);
const y = e instanceof W ? e.fieldName : e.field_name, b = !he(y) || y.length === 0 ? null : y, _ = !he(e.title) || e.title.length === 0 ? null : e.title, m = _e(e.name);
this[m] = e[m], Object.defineProperties(this, {
name: { get() {
return s;
}, enumerable: !0 },
uniqueId: { get() {
return r;
}, enumerable: !1 },
position: { get() {
return o;
}, enumerable: !0 },
fieldName: { get() {
return b;
}, enumerable: !0 },
label: { get() {
return i;
}, enumerable: !0 },
labelAvailable: { get() {
return i != null;
}, enumerable: !0 },
icon: { get() {
return l;
}, enumerable: !0 },
iconAvailable: { get() {
return l != null;
}, enumerable: !0 },
displayStyle: { get() {
return f;
}, enumerable: !0 },
title: { get() {
return _;
}, enumerable: !0 },
extra_data: { get() {
var v;
return (v = e.extra_data) != null ? v : {};
}, enumerable: !0 },
payload: { get() {
return t;
}, enumerable: !0 }
// elementType & bindAttrs, entire action.action concept:
// action.py && actionsHandler.decorateActions, added by brontes, modified by velis
// not sure this is necessary: I have only found one instance of action declaration in python and
// it's just so a dialog can be shown. Doubt it even worked at any time. Also that same thing is now
// solved via parent components declaring action handler methods
});
}
static closeAction(e = {}) {
return new W(k({
name: "close",
label: U("Close"),
icon: "close-outline",
displayStyle: { asButton: !0, showLabel: !0, showIcon: !0 },
position: "FORM_FOOTER"
}, e));
}
static yesAction(e = {}) {
return new W(k({
name: "yes",
label: U("Yes"),
icon: "thumbs-up-outline",
displayStyle: { asButton: !0, showLabel: !0, showIcon: !0 },
position: "FORM_FOOTER"
}, e));
}
static noAction(e = {}) {
return new W(k({
name: "no",
label: U("No"),
icon: "thumbs-down-outline",
displayStyle: { asButton: !0, showLabel: !0, showIcon: !0 },
position: "FORM_FOOTER"
}, e));
}
}
class V {
constructor(e, t) {
a(this, "actions");
a(this, "filterCache");
a(this, "payload");
this.actions = Object.values(e).reduce((r, s) => {
if (s == null) return r;
const o = s.name;
return o == null ? (console.error("Action has no name and will not be added to the list", s), r) : (s instanceof W && (t === void 0 || s.payload === t) ? r[o] = s : r[o] = new W(s, t), r);
}, {}), this.filterCache = {}, Object.defineProperties(this, { payload: { get() {
return t;
}, enumerable: !0 } });
}
get actionsList() {
return Object.values(this.actions);
}
get length() {
return this.actionsList.length;
}
*[Symbol.iterator]() {
for (const e of this.actionsList)
yield e;
}
hasAction(e) {
return this.actionsList.some((t) => t.uniqueId === e.uniqueId);
}
/**
* filters actions to include only those rendering at given position
* @param position
* @param fieldName
* @returns {FilteredActions}
*/
filter(e, t = null) {
const r = e + (t ? `|${t}` : "");
return this.filterCache[r] === void 0 && (this.filterCache[r] = new V(
Object.values(this.actions).filter((s) => s.position === e && (s.fieldName == null || s.fieldName === t)).reduce((s, o) => (s[o.name] = this.actions[o.name], s), {})
)), this.filterCache[r];
}
get header() {
return this.filter("HEADER");
}
get rowStart() {
return this.filter("ROW_START");
}
get rowEnd() {
return this.filter("ROW_END");
}
get rowClick() {
return this.filter("ROW_CLICK");
}
get rowRightClick() {
return this.filter("ROW_RIGHT_CLICK");
}
fieldAll(e) {
const t = this.filter("FIELD_START", e), r = this.filter("FIELD_END", e), s = [...t.actionsList, ...r.actionsList];
return new V(s);
}
fieldStart(e) {
return this.filter("FIELD_START", e);
}
fieldEnd(e) {
return this.filter("FIELD_END", e);
}
get formHeader() {
return this.filter("FORM_HEADER");
}
get formFooter() {
return this.filter("FORM_FOOTER");
}
get valueChanged() {
return this.filter("VALUE_CHANGED");
}
}
class or {
}
function ie(n, e = !0) {
const t = Q("actionHandler", void 0), r = n != null ? n : Q("payload", {});
class s {
constructor() {
a(this, "handlers", new or());
a(this, "register", (u, c) => (this.handlers[u] = c, this));
a(this, "call", (u, c) => w(this, null, function* () {
const f = yield this.recursiveCall(u, r.value, c, e), y = yield this.resolveAction(u, c);
return f || y;
}));
a(this, "recursiveCall", (u, c, f, y = !0) => w(this, null, function* () {
var b, _;
return y ? (yield this.executeHandler(u, c, f)) || ((b = yield t == null ? void 0 : t.recursiveCall(u, c, f, y)) != null ? b : !1) : ((_ = yield t == null ? void 0 : t.recursiveCall(u, c, f, y)) != null ? _ : !1) || (yield this.executeHandler(u, c, f));
}));
a(this, "executeHandler", (u, c, f) => w(this, null, function* () {
var b, _, m, v, D, O, E;
if (u instanceof V) {
for (const te of u) {
const Ie = k(k({}, (b = te.payload) == null ? void 0 : b["$extra-data"]), f);
if (yield (m = (_ = this.handlers)[te.name]) == null ? void 0 : m.call(_, te, c, Ie)) return !0;
}
return !1;
}
const y = k(k({}, (v = u.payload) == null ? void 0 : v["$extra-data"]), f);
return (E = (O = (D = this.handlers)[u.name]) == null ? void 0 : O.call(D, u, c, y)) != null ? E : !1;
}));
// eslint-disable-next-line class-methods-use-this
a(this, "resolveAction", (u, c) => w(this, null, function* () {
var y, b, _, m, v;
if (u instanceof V) {
for (const D of u) {
const O = k(k({}, (y = D.payload) == null ? void 0 : y["$extra-data"]), c);
if (yield (b = D == null ? void 0 : D[_e(D.name)]) == null ? void 0 : b.call(D, D, D.payload, O)) return !0;
}
return !1;
}
const f = k(k({}, (_ = u.payload) == null ? void 0 : _["$extra-data"]), c);
return (v = (m = u == null ? void 0 : u[_e(u.name)]) == null ? void 0 : m.call(u, u, u.payload, f)) != null ? v : !1;
}));
}
}
const o = new s(), i = o.call, l = o.register;
return J("actionHandler", o), { registerHandler: l, callHandler: i, handler: o };
}
var Ce = /* @__PURE__ */ ((n) => (n[n.SUPPRESS = 1] = "SUPPRESS", n[n.HIDDEN = 5] = "HIDDEN", n[n.INVISIBLE = 8] = "INVISIBLE", n[n.FULL = 10] = "FULL", n))(Ce || {});
const gt = 10;
((n) => {
function e(s) {
return s.toUpperCase() === "SUPPRESS" ? 1 : s.toUpperCase() === "HIDDEN" ? 5 : s.toUpperCase() === "INVISIBLE" ? 8 : gt;
}
n.fromString = e;
function t(s) {
const o = typeof s == "number" ? s : n.fromString(s);
return Object.values(n).includes(o) ? o : gt;
}
n.fromAny = t;
function r(s) {
const o = typeof s == "number" ? s : n.fromString(s);
return Object.values(n).includes(o);
}
n.isDefined = r;
})(Ce || (Ce = {}));
Object.freeze(Ce);
const F = Ce, ir = ["onClick"], ar = {
key: 0,
style: { display: "inline-block", float: "right", "vertical-align": "middle" }
}, lr = ["onClick"], ur = {
style: { display: "inline-block", "max-width": "95%" },
class: "notification-title"
}, cr = ["innerHTML"], dr = {
style: { display: "inline-block", "max-width": "95%" },
class: "notification-content"
}, mr = ["innerHTML"], Vt = /* @__PURE__ */ $({
__name: "df-notifications",
props: {
width: { default: 350 },
position: { default: "top center" }
},
setup(n) {
return (e, t) => {
const r = z("notifications");
return h(), C(r, {
width: e.width,
position: e.position
}, {
body: L(({ item: s, close: o }) => [
R("div", {
class: ee(["vue-notification", s.type]),
onClick: (i) => s.data.onNotificationClose(s, o, !0)
}, [
R("div", null, [
s.data.duration === -1 ? (h(), S("div", ar, [
R("button", {
type: "button",
class: "close",
onClick: (i) => s.data.onNotificationClose(s, o)
}, [
N(An, { icon: "mdi-window-close" })
], 8, lr)
])) : T("", !0),
R("div", ur, [
R("div", {
innerHTML: s.title
}, null, 8, cr)
]),
R("div", dr, [
R("div", {
style: { "margin-left": "0.4em" },
innerHTML: s.text
}, null, 8, mr)
])
])
], 10, ir)
]),
_: 1
}, 8, ["width", "position"]);
};
}
}), fr = /* @__PURE__ */ $({
__name: "df-app",
setup(n) {
return (e, t) => {
const r = z("ModalView");
return h(), S("div", null, [
N(Vt),
N(r),
le(e.$slots, "default")
]);
};
}
});
var xe;
((n) => {
function e(r) {
return r.type === "group";
}
n.isGroupTemplate = e;
function t(r) {
return "rows" in r;
}
n.isLayoutTemplate = t;
})(xe || (xe = {}));
var Se = /* @__PURE__ */ ((n) => (n[n.SMALL = 1] = "SMALL", n[n.MEDIUM = 2] = "MEDIUM", n[n.LARGE = 3] = "LARGE", n[n.X_LARGE = 4] = "X_LARGE", n[n.DEFAULT = 0] = "DEFAULT", n))(Se || {});
const yt = 0;
((n) => {
const e = ["large", "lg", "modal-lg"], t = ["medium", "md", "modal-md"], r = ["small", "sm", "modal-sm"], s = ["x-large", "xl", "modal-xl"];
function o(l) {
return l === void 0 ? yt : e.includes(l) ? 3 : t.includes(l) ? 2 : r.includes(l) ? 1 : s.includes(l) ? 4 : yt;
}
n.fromString = o;
function i(l) {
const d = typeof l == "number" ? l : n.fromString(l);
return Object.values(n).includes(d);
}
n.isDefined = i;
})(Se || (Se = {}));
Object.freeze(Se);
const x = Se;
class hr {
constructor(e) {
a(this, "inputType");
a(this, "fieldCSSClass");
a(this, "pattern");
a(this, "min");
a(this, "max");
a(this, "minLength");
a(this, "maxLength");
a(this, "step");
a(this, "size");
a(this, "formDateFormat");
a(this, "formTimeFormat");
a(this, "multiple");
a(this, "allowTags");
a(this, "formComponentDef");
var t, r;
this.inputType = e.input_type, this.fieldCSSClass = e.field_class, this.pattern = e.pattern, this.min = e.min, this.max = e.max, this.minLength = (t = e.min_length) != null ? t : 0, this.maxLength = (r = e.max_length) != null ? r : 1e20, this.step = e.step, this.size = e.size, this.formDateFormat = e.form_date_format, this.formTimeFormat = e.form_time_format, this.multiple = e.multiple, this.allowTags = e.allow_tags, this.formComponentDef = e.form_component_def;
}
}
class at {
constructor(e) {
a(this, "uuid");
a(this, "name");
a(this, "label");
a(this, "placeholder");
a(this, "align");
a(this, "visibility");
a(this, "renderParams");
a(this, "readOnly");
a(this, "componentName");
a(this, "helpText");
a(this, "choices");
a(this, "ajax");
a(this, "widthClasses");
a(this, "allowNull");
a(this, "renderKey");
a(this, "conditionalVisibility");
this.renderKey = 0, Object.defineProperties(this, {
fieldDef: { get() {
return e;
}, enumerable: !1 },
uuid: { get() {
return e.uuid;
}, enumerable: !0 },
name: { get() {
return e.name;
}, enumerable: !0 },
label: { get() {
return e.label;
}, enumerable: !0 },
placeholder: { get() {
return e.placeholder;
}, enumerable: !0 },
align: {
get() {
return e.alignment === "decimal" ? "right" : e.alignment;
},
enumerable: !0
},
visibility: { get() {
return F.fromAny(e.visibility.form);
}, enumerable: !0 },
renderParams: { get() {
return new hr(e.render_params);
}, enumerable: !0 },
readOnly: { get() {
return e.read_only === !0;
}, enumerable: !0 },
componentName: {
get() {
return e.render_params.form_component_name;
},
enumerable: !0,
configurable: !0
},
choices: { get() {
return e.choices;
}, enumerable: !0 },
ajax: { get() {
return e.ajax;
}, enumerable: !0 },
colspan: { get() {
return e.colspan;
}, enumerable: !0, configurable: !0 },
helpText: { get() {
return e.help_text;
}, enumerable: !0 },
allowNull: { get() {
return e.allow_null;
}, enumerable: !0 },
conditionalVisibility: { get() {
return e.conditional_visibility;
}, enumerable: !0 }
});
}
get isVisible() {
return this.visibility !== F.SUPPRESS && this.visibility !== F.HIDDEN;
}
setVisibility(e) {
let t;
F.isDefined(e) ? t = F.fromAny(e) : e ? t = F.FULL : t = F.HIDDEN, t !== this.fieldDef.visibility.form && (this.fieldDef.visibility.form = t, this.renderKey++);
}
}
let Ht;
class Ft extends at {
constructor(t, r, s) {
super(s);
a(this, "layoutFieldComponentName");
a(this, "colspan");
let o = 0;
Object.defineProperty(this, "layoutFieldComponentName", {
get() {
return r.component_name || "FormField";
},
enumerable: !0,
configurable: !0
}), Object.defineProperty(this, "colspan", {
get() {
return r.colspan || 1;
},
enumerable: !0,
configurable: !0
}), Object.defineProperty(this, "renderKey", {
get() {
return o;
},
set(i) {
o = i, t.renderKey++;
},
enumerable: !0
});
}
}
class xt extends Ft {
constructor(t, r, s) {
var e = (...si) => (super(...si), a(this, "title"), a(this, "layout"), this);
if (s == null) {
const o = {
uuid: crypto.randomUUID(),
name: null,
label: "",
placeholder: "",
alignment: "left",
visibility: { form: F.FULL, table: F.SUPPRESS },
render_params: {
input_type: "",
form_component_name: "df-form-layout"
},
read_only: !0,
choices: [],
colspan: 1,
help_text: "",
allow_null: !1
};
e(t, r, o);
} else
e(t, r, s);
Object.defineProperty(this, "layoutFieldComponentName", {
get() {
return r.component_name || "FormFieldGroup";
},
enumerable: !0,
configurable: !0
}), Object.defineProperty(this, "title", { get() {
return r.title;
}, enumerable: !0 }), Object.defineProperty(
this,
"layout",
{ get() {
return new Ht(r.layout);
}, enumerable: !0 }
), Object.defineProperty(
this,
"componentName",
{ get() {
return "FormFieldGroup";
}, enumerable: !0, configurable: !0 }
);
}
}
function pr(n, e, t) {
switch (e.type) {
case "column":
return new Ft(n, e, t);
case "group":
return new xt(n, e, t);
default:
throw Error(`Unknown layout column type "${e.type}"`);
}
}
class gr {
constructor(e, t, r) {
a(this, "renderKey");
a(this, "columns");
a(this, "componentName");
this.columns = e.columns.map((s) => {
const o = pr(this, s, r[s.field]);
return t[s.field] = o, o;
}), this.renderKey = 0, Object.defineProperty(this, "componentName", { get() {
return e.component_name;
}, enumerable: !0 });
}
get anyVisible() {
return this.columns.reduce((e, t) => e || t.isVisible, !1);
}
}
class lt {
constructor(e) {
a(this, "fields");
a(this, "rows");
a(this, "componentName");
a(this, "fieldName");
a(this, "size");
e === void 0 ? (this.fields = {}, this.rows = [], Object.defineProperty(this, "size", { get() {
return x.DEFAULT;
}, enumerable: !0 })) : (this.fields = {}, this.rows = e.rows.map((t) => new gr(t, this.fields, e.fields)), Object.keys(e.fields).forEach((t) => {
t in this.fields || (this.fields[t] = new at(e.fields[t]));
}), Object.defineProperty(this, "componentName", { get() {
return e.component_name;
}, enumerable: !0 }), Object.defineProperty(this, "size", { get() {
return x.fromString(e.size);
}, enumerable: !0 }));
}
}
Ht = lt;
function yr(n) {
return n instanceof xt;
}
function Xe(n) {
const e = [];
return n.fields && e.push(...Object.values(n.fields)), xe.isLayoutTemplate(n) && n.rows.forEach((t) => {
var r;
(r = t.columns) == null || r.forEach((s) => {
xe.isGroupTemplate(s) && s.layout && s.field == null ? e.push(...Xe(s.layout)) : yr(s) && s.layout && s.field == null && e.push(...Xe(s.layout));
});
}), e;
}
class X {
constructor(e, t) {
a(this, "$extra-data");
this.setData(e, t);
}
static create(e, t) {
return oe(new X(e, t));
}
addExtraData(e) {
const t = k(k({}, this["$extra-data"]), e);
Object.defineProperty(this, "$extra-data", { get() {
return t;
}, enumerable: !1, configurable: !0 });
}
clear() {
Object.getOwnPropertyNames(this).forEach((e) => {
delete this[e];
});
}
setData(e, t) {
let r = {}, s = {};
return e == null || (e instanceof X ? [r, s] = this.copyWithProperties(e) : t != null && t.fields && Xe(t).forEach((o) => {
if (o.visibility !== F.SUPPRESS) {
if (o.readOnly && o.name != null && !o.name.endsWith("-display"))
r[o.name] = { get() {
return e[o.name];
}, enumerable: !1, configurable: !0 };
else if (o.name != null) {
const i = this;
i[o.name] = e[o.name], Object.defineProperty(i, `set${o.name}Value`, {
get() {
return function(d) {
i[o.name] = d;
};
},
enumerable: !1,
configurable: !0
});
}
}
})), Object.defineProperty(this, "$extra-data", { get() {
return s;
}, enumerable: !1, configurable: !0 }), Object.defineProperties(this, r), Object.defineProperty(this, "_properties", { get() {
return r;
}, enumerable: !1, configurable: !0 }), this;
}
replaceData(e, t) {
return this.clear(), this.setData(e, t);
}
copyWithProperties(e) {
return Object.entries(e).forEach(([t, r]) => {
this[t] = r;
}), [
He(e._properties),
// eslint-disable-line no-underscore-dangle
He(e["$extra-data"])
];
}
}
let wr = 0;
class Ye {
// Function to reject the promise
constructor(e, t, r, s, o) {
/* Base dialog definition */
a(this, "title");
a(this, "body");
a(this, "options");
a(this, "actions");
a(this, "actionHandlers");
a(this, "dialogId");
// Unique dialog ID
a(this, "_topOfTheStack");
// true when this dialog is the first one
/* API functions */
a(this, "close");
// API function to close this dialog from calling code
/* Support declarations */
a(this, "promise");
// The promise which will be resolved when the dialog closes
a(this, "resolvePromise");
// function to resolve the promise
a(this, "rejectPromise");
this.title = e, this.body = t, this.options = r, this.actions = s, this.actionHandlers = o, this.dialogId = ++wr, this.close = () => null, this.promise = new Promise(() => {
}), this.resolvePromise = () => null, this.rejectPromise = () => null;
}
get topOfTheStack() {
return this._topOfTheStack || !1;
}
set topOfTheStack(e) {
this._topOfTheStack = e;
}
}
function We(n, e) {
if (e == null) return null;
if (typeof e == "string")
return () => we("span", null, e);
if (e instanceof V)
return () => we(z("DfActions"), { slot: n, actions: e });
if (e && "componentName" in e && "props" in e) {
const t = he(e.componentName) ? z(e.componentName) : e.componentName;
return () => we(t, k({ slot: n }, e.props));
}
return e;
}
const Ut = /* @__PURE__ */ $({
methods: {
renderFunction(n, e, t, r, s, o) {
return we(
// Jure 16.3.2023 types don't match here, but the code works. Too green to be able to fix
// @ts-ignore
z("DfModalDialog"),
{ show: !0, options: s || {}, key: n, actionHandlers: o },
{
title: We("title", e),
body: We("body", t),
actions: We("actions", r)
}
);
}
}
});
class br {
constructor() {
a(this, "list");
a(this, "currentRef");
this.list = [], this.currentRef = A(null);
}
setCurrent() {
const e = this.list.length ? this.list[this.list.length - 1] : null;
this.currentRef.value !== e && (this.currentRef.value = e);
}
get current() {
return this.currentRef.value;
}
push(e, t) {
const r = Ge(this.list, { dialogId: t });
if (r !== -1)
e.dialogId = t, this.list[r] = e, r === this.list.length - 1 && (e.topOfTheStack = !0);
else {
if (this.list.length && (this.list[this.list.length - 1].topOfTheStack = !1), e.actions instanceof V) {
const o = X.create(e.actions.payload || X.create());
o.addExtraData({ dialog: e }), e.actions = new V(e.actions.actions, o);
}
this.list.push(e), e.topOfTheStack = !0;
}
const s = this;
return e.close = () => s.pop(e.dialogId), e.promise = new Promise((o, i) => {
e.resolvePromise = o, e.rejectPromise = i;
}), this.setCurrent(), e.dialogId;
}
getDialogFromId(e) {
const t = Ge(this.list, { dialogId: e });
return t !== -1 ? this.list[t] : null;
}
pop(e) {
const t = Ge(this.list, { dialogId: e });
t !== -1 && (this.list.splice(t, 1), this.list.length && t === this.list.length && (this.list[this.list.length - 1].topOfTheStack = !0)), this.setCurrent();
}
isCurrentDialogPromise(e) {
var t;
return ((t = this.current) == null ? void 0 : t.promise) === e;
}
getDialogDefFromPromise(e) {
return vn(this.list, { promise: e });
}
}
const ae = new br();
let vr = 0;
const ne = [], _r = $({
name: "ModalView",
mixins: [Ut],
setup() {
const n = ++vr;
return Re(() => {
ne.push(n), ne.length > 1 && ne.indexOf(n) > 0 && console.warn("Multiple instances of ModalView placed in VDom. there should be only one!", ne);
}), tt(() => {
const e = ne.indexOf(n);
e > -1 && ne.splice(e, 1);
}), { uniqueId: n };
},
render() {
const n = ae.current, e = n == null ? void 0 : n.dialogId;
return !n || ne.indexOf(this.uniqueId) !== 0 ? we("div", { key: e }) : this.renderFunction(
e,
n.title,
n.body,
n.actions,
n.options,
n.actionHandlers
);
}
}), wt = { size: x.DEFAULT }, Z = {
get isInstalled() {
return ne.length > 0;
},
getDialogDefinition(n) {
return n instanceof Promise ? ae.getDialogDefFromPromise(n) : ae.getDialogFromId(n);
},
fromRenderFunctions(n, e) {
return ae.push(e, n);
},
fromFormDefinition(n) {
const e = n.layout, t = n.payload, r = n.actions, s = n.actionHandlers, o = n.errors;
return this.message(
n.title,
{
componentName: n.layout.componentName,
props: { layout: e, payload: t, actions: r, errors: o }
},
r.formFooter,
{ size: e.size || x.DEFAULT },
s
);
},
message(n, e, t, r, s) {
if (t)
for (const i of t) {
const l = _e(i.name);
i[l] || (i[l] = Pe);
}
const o = new Ye(
n,
e,
r || wt,
t || new V({ close: W.closeAction({ actionClose: Pe }) }),
s
);
return ae.push(o), o.promise;
},
yesNo(n, e, t, r) {
const s = new Ye(
n,
e,
r || wt,
t || new V({
yes: W.yesAction({ actionYes: Pe }),
no: W.noAction({ actionNo: Pe })
})
);
return ae.push(s), s.promise;
}
};
var De = /* @__PURE__ */ ((n) => (n[n.Label = 0] = "Label", n[n.Filter = 1] = "Filter", n[n.Data = 2] = "Data", n))(De || {});
((n) => {
n.headerRows = [
0,
1
/* Filter */
];
function e(r) {
return Object.values(n).includes(r);
}
n.isDefined = e;
function t(r) {
return n.headerRows.includes(r);
}
n.isTHead = t;
})(De || (De = {}));
Object.freeze(De);
const j = De, ut = { showLabelOrHelpText: !0, handlers: void 0, dialogHandlers: void 0 };
function Y(n, e) {
const t = g({
get() {
return n.modelValue;
},
set(d) {
e("update:modelValue", d);
}
}), r = g(() => n.errors || []), s = g(() => r.value.length), o = g(() => n.showLabelOrHelpText ? n.field.label : ""), i = g(() => n.showLabelOrHelpText ? n.field.helpText : ""), l = g(() => ({
label: o.value,
"error-messages": r.value,
"error-count": s.value + 10,
// +10 so that it can show "rules" error messages
hint: i.value,
"persistent-hint": !0,
"hide-details": "auto"
}));
return {
value: t,
errorsList: r,
errorsDisplayCount: s,
label: o,
helpText: i,
baseBinds: l
};
}
const Cr = /* @__PURE__ */ $({
__name: "date-time",
props: /* @__PURE__ */ nt({
field: {},
actions: {},
errors: {},
showLabelOrHelpText: { type: Boolean },
modelValue: {},
handlers: {},
dialogHandlers: {}
}, ut),
emits: ["onValueConfirmed", "update:modelValue"],
setup(n, { emit: e }) {
const t = n, r = e, { value: s, baseBinds: o } = Y(t, r), i = g(() => t.field.renderParams.inputType), l = g(() => t.field.renderParams.formDateFormat), d = g(() => t.field.renderParams.formTimeFormat);
return (u, c) => (h(), C(p(sn), {
modelValue: p(s),
"onUpdate:modelValue": c[0] || (c[0] = (f) => K(s) ? s.value = f : null),
label: p(o).label,
errors: p(o)["error-messages"],
hint: p(o).hint,
"persistent-hint": p(o)["persistent-hint"],
clearable: !0,
"input-type": i.value,
"display-format-date": l.value,
"display-format-time": d.value
}, null, 8, ["modelValue", "label", "errors", "hint", "persistent-hint", "input-type", "display-format-date", "display-format-time"]));
}
}), Sr = /* @__PURE__ */ $({
__name: "df-checkbox",
props: /* @__PURE__ */ nt({
field: {},
actions: {},
errors: {},
showLabelOrHelpText: { type: Boolean },
modelValue: {},
handlers: {},
dialogHandlers: {}
}, ut),
emits: ["update:modelValue"],
setup(n, { emit: e }) {
const t = n, r = e, { value: s, baseBinds: o } = Y(t, r);
return (i, l) => (h(), C(p(on), de({
modelValue: p(s),
"onUpdate:modelValue": l[0] || (l[0] = (d) => K(s) ? s.value = d : null),
"allow-null": t.field.allowNull,
class: i.field.renderParams.fieldCSSClass,
name: i.field.name,
enabled: !i.field.readOnly
}, p(o)), null, 16, ["modelValue", "allow-null", "class", "name", "enabled"]));
}
}), Dr = /* @__PURE__ */ $({
__name: "df-ckeditor",
props: /* @__PURE__ */ nt({
field: {},
actions: {},
errors: {},
showLabelOrHelpText: { type: Boolean },
modelValue: {},
handlers: {},
dialogHandlers: {}
}, ut),
emits: ["update:modelValue"],
setup(n, { emit: e }) {
const t = n, r = e, { baseBinds: s, value: o } = Y(t, r);
return (i, l) => (h(), C(p(an), {
modelValue: p(o),
"onUpdate:modelValue": l[0] || (l[0] = (d) => K(o) ? o.value = d : null),
label: p(s).label,
errors: p(s)["error-messages"],
hint: p(s).hint,
"persistent-hint": p(s)["persistent-hint"],
"hide-details": p(s)["hide-details"]
}, null, 8, ["modelValue", "label", "errors", "hint", "persistent-hint", "hide-details"]));
}
}), kr = /* @__PURE__ */ $({
__name: "df-color",
props: {
field: {},
actions: {},
errors: {},
showLabelOrHelpText: { type: Boolean },
modelValue: {},
handlers: {},
dialogHandlers: {}
},
emits: ["update:modelValue"],
setup(n, { emit: e }) {
const t = n, r = e, { value: s, baseBinds: o } = Y(t, r);
return (i, l) => (h(), C(p(ln), de({
modelValue: p(s),
"onUpdate:modelValue": l[0] || (l[0] = (d) => K(s) ? s.value = d : null),
class: i.field.renderParams.fieldCSSClass,
name: i.field.name,
errors: p(o)["error-messages"],
enabled: !i.field.readOnly
}, p(o)), null, 16, ["modelValue", "class", "name", "errors", "enabled"]));
}
}), bt = 250, vt = new Promise(() => {
});
class $r {
constructor() {
a(this, "activeRequests");
a(this, "requestCounter");
a(this, "apiClient");
a(this, "dialogPromise");
this.activeRequests = {}, this.requestCounter = 0, this.dialogPromise = vt;
}
addRequest() {
const e = ++this.requestCounter;
return this.activeRequests[e] = (/* @__PURE__ */ new Date()).getTime(), { requestId: e, timestamp: this.activeRequests[e] };
}
removeRequest(e) {
e && (delete this.activeRequests[e], this.progressDialogCheck());
}
loading() {
return Object.keys(this.activeRequests).length;
}
get isShowingProgress() {
return Z.getDialogDefinition(this.dialogPromise) != null;
}
oldestActiveRequest() {
const e = this.activeRequests, t = Object.keys(e);
if (t.length === 0) return { requestId: null, timestamp: null, age: null };
const r = Number(t[0]);
return {
requestId: r,
timestamp: e[r],
age: (/* @__PURE__ */ new Date()).getTime() - e[r]
};
}
progressDialogCheck() {
return w(this, null, function* () {
if (!Z.isInstalled) return;
const e = this.oldestActiveRequest(), t = e.age ? e.age : -1;
if (t >= bt && !this.isShowingProgress)
this.show();
else if (t >= bt && this.isShowingProgress) {
if (!this.apiClient) return;
const r = yield this.apiClient.get(
"/dynamicforms/progress/",
{ headers: { "x-df-timestamp": e.timestamp } }
);
if (this.isShowingProgress) {
const o = Z.getDialogDefinition(this.dialogPromise).body;
o.props != null && (o.props.progress = Number(r.data.value), o.props.label = r.data.comment);
}
} else this.loading() === 0 && this.isShowingProgress && this.hide();
});
}
show() {
console.log(
ce(U(
// eslint-disable-next-line vue/max-len
"Showing progress: We have %(active_requests)s active requests to server oldest is %(age)s old with timestamp %(timestamp)s"
), {
active_requests: this.loading(),
age: this.oldestActiveRequest().age,
timestamp: this.oldestActiveRequest().timestamp
})
);
const e = U("Performing operation");
this.dialogPromise = Z.message(
e,
{ componentName: "LoadingIndicator", props: { loading: !0, label: null, progress: null } }
);
}
hide() {
const e = Z.getDialogDefinition(this.dialogPromise);
e != null && e.close(), this.dialogPromise = vt;
}
}
const ke = new $r();
window.setInterval(() => {
ke.progressDialogCheck();
}, 250);
const Or = 2083, P = En.create({
xsrfCookieName: "csrftoken",
xsrfHeaderName: "X-CSRFToken"
});
ke.apiClient = P;
function re(n) {
let e = n.data;
return typeof e == "string" && (e = new String(e)), e && Object.defineProperty(
e,
"$response-object",
{ get() {
return n;
}, enumerable: !1, configurable: !1 }
), e;
}
P.interceptors.request.use((n) => {
var t, r, s;
const e = (t = n.showProgress) != null ? t : !0;
if (n.headers["x-df-axios"] = "axios", !((r = n.url) != null && r.includes("/dynamicforms/progress")) && !((s = n.url) != null && s.includes("unpkg.com")) && e) {
const o = ke.addRequest();
n.sequence = o.requestId, n.headers["x-df-timestamp"] = o.timestamp;
}
if (Ke(n.method) === "get" && _n(n.url) > Or && et(Cn(Sn(n.headers), (o) => Ke(o)), "x-viewmode")) {
const o = "Your request exceeds maximum length";
console.error(o), new AbortController().abort(o);
}
return n;
});
P.interceptors.response.use(
(n) => (ke.removeRequest(n.config.sequence), n),
(n) => (ke.removeRequest(n.config.sequence), Promise.reject(n))
);
const Lr = /* @__PURE__ */ $({
__name: "df-file",
props: {
field: {},
actions: {},
errors: {},
showLabelOrHelpText: { type: Boolean },
modelValue: {},
handlers: {},
dialogHandlers: {}
},
emits: ["update:modelValue"],
setup(n, { emit: e }) {
const t = n, r = e, { value: s, baseBinds: o } = Y(t, r), i = {
upload: (l, d) => w(this, null, function* () {
const u = new FormData();
u.append("file", l, l.name);
const c = yield P.post(
"/dynamicforms/preupload-file/",
u,
{
showProgress: !1,
onUploadProgress: function(y) {
var b;
y.event.lengthComputable && d != null && d(y.loaded, (b = y.total) != null ? b : 0);
}
}
);
return console.log(c.data.identifier), c.data.identifier;
}),
delete: (l) => w(this, null, function* () {
return yield P.delete(`/dynamicforms/preupload-file/${encodeURIComponent(l)}/`), Promise.resolve();
}),
touch: (l) => w(this, null, function* () {
return console.log("Touching file:", l), Promise.resolve();
})
};
return (l, d) => (h(), C(p(un), {
modelValue: p(s),
"onUpdate:modelValue": d[0] || (d[0] = (u) => K(s) ? s.value = u : null),
comms: i,
class: ee(l.field.renderParams.fieldCSSClass),
name: l.field.name,
label: p(o).label,
errors: p(o)["error-messages"],
enabled: !l.field.readOnly,
hint: p(o).hint
}, null, 8, ["modelValue", "class", "name", "label", "errors", "enabled", "hint"]));
}
}), Rr = /* @__PURE__ */ $({
__name: "df-input",
props: {
field: {},
actions: {},
errors: {},
showLabelOrHelpText: { type: Boolean },
modelValue: {},
handlers: {},
dialogHandlers: {}
},
emits: ["update:modelValue"],
setup(n, { emit: e }) {
const t = n, r = e, { value: s, baseBinds: o } = Y(t, r), i = g(() => t.field.renderParams.inputType);
return (l, d) => (h(), C(p(cn), de({
modelValue: p(s),
"onUpdate:modelValue": d[0] || (d[0] = (u) => K(s) ? s.value = u : null),
class: l.field.renderParams.fieldCSSClass,
name: l.field.name,
errors: p(o)["error-messages"],
enabled: !l.field.readOnly,
"input-type": i.value,
step: l.field.renderParams.step,
min: l.field.renderParams.min,
max: l.field.renderParams.max
}, p(o)), null, 16, ["modelValue", "class", "name", "errors", "enabled", "input-type", "step", "min", "max"]));
}
});
var $e = /* @__PURE__ */ ((n) => (n[n.TABLE = 1] = "TABLE", n[n.FORM = 2] = "FORM", n[n.DIALOG = 3] = "DIALOG", n))($e || {});
((n) => {
function e(r) {
return r.toUpperCase() === "TABLE" ? 1 : r.toUpperCase() === "FORM" ? 2 : r.toUpperCase() === "DIALOG" ? 3 : 1;
}
n.fromString = e;
function t(r) {
const s = typeof r == "number" ? r : n.fromString(r);
return Object.values(n).includes(s);
}
n.isDefined = t;
})($e || ($e = {}));
Object.freeze($e);
const q = $e;
function jt(n) {
if (n)
return n.split(".").reduce((e, t) => {
var r;
return (r = e[t]) != null ? r : {};
}, window);
}
var Oe = /* @__PURE__ */ ((n) => (n[n.ASC = 1] = "ASC", n[n.DESC = 2] = "DESC", n[n.UNORDERED = 0] = "UNORDERED", n))(Oe || {});
((n) => {
function e(r) {
return r.toLowerCase().includes("asc") ? 1 : r.toLowerCase().includes("desc") ? 2 : 0;
}
n.fromString = e;
function t(r) {
return Object.values(n).includes(r);
}
n.isDefined = t;
})(Oe || (Oe = {}));
Object.freeze(Oe);
const I = Oe;
class Bt {
/**
* Column ordering management utility
*
* @param orderingString: e.g. ordering asc seg-1
* @param orderingArray: a common array (created in columns.js) containing all order segments
* @param column: TableColumn reference to the column itself. Needed for error messages below
*/
constructor(e, t, r) {
a(this, "direction");
a(this, "changeCounter");
// TODO: Jure 2.2023 not sure it's needed any more in Vue3?
a(this, "column");
// TableColumn
a(this, "orderingArray");
// reference to containing array
a(this, "isOrderable");
a(this, "isOrdered");
a(this, "segment");
this.direction = I.fromString(e), this.changeCounter = 0;
const s = /seg-(\d+)/.exec(e), o = s != null ? Number(s[1]) : 0;
t.length = Math.max(t.length, o), o && t.splice(o - 1, 1, this), Object.defineProperties(this, {
column: { get() {
return r;
}, enumerable: !1 },
orderingArray: { get() {
return t;
}, enumerable: !1 },
isOrderable: { get() {
return e.includes("ordering");
}, enumerable: !0 },
isOrdered: {
get() {
return this.isOrderable && this.segment > 0 && this.direction !== I.UNORDERED;
},
enumerable: !0
},
segment: { get() {
return this.isOrderable && t.indexOf(this) + 1 || null;
}, enumerable: !0 }
});
}
/**
* cycles field ordering 'asc' -> 'desc' -> 'unsorted'
*/
cycleOrdering() {
this.isOrdered ? this.direction === I.ASC ? this.direction = I.DESC : this.direction = I.UNORDERED : this.direction = I.ASC;
}
/**
* sets column sort sequence and direction
* @param direction: one of "asc", "desc" or "unsorted"
* @param sequence: integer. if none is provided, existing sequence # will be used
* or 1 if column was unsorted
*/
setSorted(e, t) {
let r = t || (this.segment > 0 ? this.segment : 1);
if (r > this.orderingArray.length + 1 && (r = this.orderingArray.length + 1), this.isOrderable)
I.isDefined(e) ? (this.segment && this.orderingArray.splice(this.segment - 1, 1), e !== I.UNORDERED && this.orderingArray.splice(r - 1, 0, this), this.direction = e) : console.warn(`unknown sort direction "${e}" for the column ${this.column.name}. not doing anything`);
else throw new Error(`column ${this.column.name} is not orderable, but you are trying to set its order direction.`);
}
handleColumnHeaderClick(e) {
if (this.isOrderable) {
if (!e.altKey) if (e.ctrlKey && e.shiftKey)
this.setSorted(I.UNORDERED);
else if (e.ctrlKey)
this.setSorted(this.direction === I.ASC ? I.DESC : I.ASC, 1);
else if (e.shiftKey) {
const r = this.segment || this.orderingArray.length + 1, s = this.direction === I.ASC ? I.DESC : I.ASC;
this.setSorted(s, r);
} else
this.cycleOrdering(), this.orderingArray.splice(0, this.orderingArray.length), this.setSorted(this.direction, 1);
this.changeCounter++;
}
}
calculateOrderingValue(e) {
const t = this.orderingArray.map((r) => ({ name: r.column.name, direction: r.direction }));
return e ? e(t) : t.map((r) => (r.direction === I.ASC ? "" : "-") + r.name);
}
calculateOrderingFunction(e) {
const t = this.orderingArray.map((r) => ({ name: r.column.name, direction: r.direction }));
return e ? e(t) : t;
}
}
class Be {
constructor(e, t) {
a(this, "name");
a(this, "label");
a(this, "align");
a(this, "visibility");
a(this, "renderParams");
a(this, "maxWidth");
a(this, "ordering");
a(this, "_maxWidth");
a(this, "layout");
a(this, "CSSClass");
a(this, "CSSClassHead");
a(this, "renderComponentName");
a(this, "renderDecoratorFunction");
a(this, "formFieldInstance");
var o;
this._maxWidth = 0, e.ordering = e.ordering || "", this.ordering = new Bt(e.ordering, t, this), this.layout = null;
const r = ((o = e.render_params) == null ? void 0 : o.table) || "";
let s = this.renderDecoratorPlain;
if (r && r.substring(0, 13) === "df-tablecell-")
switch (r.substring(13)) {
case "bool":
s = this.renderDecoratorBool;
break;
case "link":
s = this.renderDecoratorLink;
break;
case "email":
s = this.renderDecoratorEmail;
break;
case "file":
s = this.renderDecoratorFile;
break;
case "ipaddr":
s = this.renderDecoratorIP;
break;
case "color":
s = this.renderDecoratorColor;
break;
}
else r && r.substring(0, 1) !== "#" && (s = jt(r));
Object.defineProperties(this, {
name: { get() {
return e.name;
}, enumerable: !0 },
label: { get() {
return e.label;
}, enumerable: !0 },
align: {
get() {
return e.alignment === "decimal" ? "right" : e.alignment;
},
enumerable: !0
},
visibility: { get() {
return F.fromAny(e.visibility.table);
}, enumerable: !0 },
CSSClass: { get() {
return e.table_classes || "";
}, enumerable: !0 },
CSSClassHead: { get() {
return this.ordering.isOrderable && "ordering" || "";
}, enumerable: !0 },
renderParams: { get() {
return e.render_params;
}, enumerable: !0 },
renderComponentName: {
get() {
return r && r.substring(0, 1) === "#" ? r.substring(1) : "";
},
enumerable: !0
},
renderDecoratorFunction: {
get() {
return (i, l) => s.apply(this, [i, l]);
},
enumerable: !0
},
maxWidth: { get() {
return this._maxWidth;
}, enumerable: !0 }
});
}
setLayout(e) {
this.layout = e;
}
setMaxWidth(e) {
e > this._maxWidth && (this._maxWidth = e);
}
/* eslint-disable-next-line @typescript-eslint/no-unused-vars */
renderDecoratorPlain(e, t) {
return e[this.name];
}
renderDecoratorColor(e, t) {
return t ? this.renderDecoratorPlain(e, t) : `<div style="display: inline-block; width: 1.25em; height: 1.25em; background-color: ${e[this.name]}"/>`;
}
renderDecoratorBool(e, t) {
if (t)
return this.renderDecoratorPlain(e, t);
const r = e[this.name];
return r === null ? "null" : `<span style="color: ${r ? "green" : "red"};">${r ? "✔" : "✘"}</span>`;
}
renderDecoratorLink(e, t) {
return t ? this.renderDecoratorPlain(e, t) : `<a href="${e[this.name]}">${e[this.name]}</a>`;
}
renderDecoratorEmail(e, t) {
if (t) return this.renderDecoratorPlain(e, t);
const r = e[this.name], s = r.includes("<") ? r.substring(0, r.indexOf("<")).trim() : r;
return `<a href="mailto:${r}">${s}</a>`;
}
renderDecoratorFile(e, t) {
if (t) return this.renderDecoratorPlain(e, t);
const r = e[this.name];
if (r) {
const s = `(function(e) {
e.preventDefault();
e.stopPropagation();
window.open('${r.replace(/\/$/, "")}', '_blank');
})`.replace(/\s+/g, " "), o = r.replace(/^.*[\\/]/, "");
return `<a href="javascript:void(0)" onclick="${s}(event)">${o}</a>`;
}
return null;
}
renderDecoratorIP(e, t) {
if (t) return this.renderDecoratorPlain(e, t);
let r = e[this.name];
const s = r.split(".");
return s.length === 4 && (r = s.map((o) => `${o.length < 3 ? `<span style="opacity: .5">${"000".slice(o.length - 3)}</span>` : ""}<span>${o}</span>`).join(".")), `<code>${r}</code>`;
}
}
class Ze extends Array {
constructor(e, t) {
if (super(), !(e && t)) return;
const r = oe([]), s = e.map((o) => new Be(t[o], r));
for (let o = r.length - 1; o >= 0; o--)
r[o] || r.splice(o, 1);
this.push(...s);
}
}
class Ue {
// any because I can't eliminate the other class members for the indexed access decl
constructor(e) {
a(this, "items");
a(this, "length");
Object.defineProperties(this, {
items: { get() {
re