@jsonforms/vue-vuetify
Version:
Vue Vuetify renderers for JSON Forms
1,348 lines • 264 kB
JavaScript
var __defProp = Object.defineProperty;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
import { computeLabel, getCombinatorTranslations, defaultJsonFormsI18nState, combinatorDefaultTranslations, getArrayTranslations, arrayDefaultTranslations, isDescriptionHidden, getFirstPrimitiveProp, Resolve, composePaths, createAjv as createAjv$1, createLabelDescriptionFrom, createControlElement, findUISchema, createDefaultValue, rankWith, uiTypeIs, and, isObjectArray, getControlPath, isObjectArrayWithNesting, isCategorization, categorizationHasCategory, optionIs, isLayout, schemaTypeIs, addI18nKeyToPrefix, getI18nKeyPrefix, Generate, encode, findMatchingUISchema, createCombinatorRenderInfos, isAllOfControl, isAnyOfControl, or, isObjectArrayControl, isPrimitiveArrayControl, schemaMatches, hasType, schemaSubPathMatches, isObjectControl, isOneOfControl, isBooleanControl, isDateControl, isDateTimeControl, isEnumControl, isIntegerControl, isStringControl, isMultiLineControl, isNumberControl, isOneOfEnumControl, formatIs, isRangeControl, hasOption, isTimeControl } from "@jsonforms/core";
import { rendererProps, useJsonFormsLabel, DispatchRenderer, useJsonFormsArrayControl, useJsonFormsCategorization, useJsonFormsLayout, JsonForms, useJsonFormsAllOfControl, useJsonFormsAnyOfControl, useJsonFormsMultiEnumControl, useJsonFormsControlWithDetail, useJsonFormsOneOfControl, useJsonFormsControl, useJsonFormsEnumControl, useJsonFormsOneOfEnumControl } from "@jsonforms/vue";
import { inject, computed, ref, provide, defineComponent, resolveComponent, openBlock, createBlock, mergeProps, withCtx, createTextVNode, toDisplayString, createCommentVNode, createElementBlock, createVNode, createElementVNode, normalizeProps, guardReactiveProps, renderSlot, Fragment, renderList, normalizeClass, normalizeStyle, withModifiers, withKeys, markRaw, unref, resolveDirective, withDirectives, createSlots, resolveDynamicComponent } from "vue";
import { VLabel, VBadge, VTooltip, VIcon, VList, VListItem, VListItemTitle, VAvatar, VRow, VCol, VToolbar, VToolbarTitle, VBtn, VSpacer, VContainer, VVirtualScroll, VCard, VCardActions, VCardTitle, VCardText, VDialog, VExpansionPanels, VExpansionPanel, VExpansionPanelTitle, VExpansionPanelText, VTabs, VTab, VWindow, VWindowItem, VStepper, VStepperHeader, VStepperItem, VDivider, VStepperWindowItem, VStepperWindow, VStepperActions, VTable, VCheckbox, VInput, VField, VSelect, VCombobox, VSwitch, VTextField, VMenu, VDatePicker, VConfirmEdit, VHover, VTextarea, VRadioGroup, VRadio, VSlider, VAutocomplete } from "vuetify/components";
import cloneDeep from "lodash/cloneDeep";
import debounce from "lodash/debounce";
import get from "lodash/get";
import isPlainObject from "lodash/isPlainObject";
import merge from "lodash/merge";
import mergeWith from "lodash/mergeWith";
import dayjs from "dayjs";
import customParseFormat from "dayjs/plugin/customParseFormat";
import localeData from "dayjs/plugin/localeData";
import localizedFormat from "dayjs/plugin/localizedFormat";
import timezone from "dayjs/plugin/timezone";
import utc from "dayjs/plugin/utc";
import "ajv";
import findIndex from "lodash/findIndex";
import { VStepperVertical, VStepperVerticalItem } from "vuetify/labs/VStepperVertical";
import { useDisplay, useLocale } from "vuetify";
import startCase from "lodash/startCase";
import isEqual from "lodash/isEqual";
import omit from "lodash/omit";
import isEmpty from "lodash/isEmpty";
import isObject from "lodash/isObject";
import { vMaska, Mask } from "maska";
import { VTimePicker } from "vuetify/labs/VTimePicker";
import { VNumberInput } from "vuetify/labs/VNumberInput";
import every from "lodash/every";
import isArray from "lodash/isArray";
import isString from "lodash/isString";
const aliases$1 = {
itemAdd: "fas fa-plus",
itemMoveUp: "fas fa-arrow-up",
itemMoveDown: "fas fa-arrow-down",
itemDelete: "fas fa-trash",
calendarClock: "fas fa-calendar",
clock: "far fa-clock",
passwordHide: "far fa-eye-slash",
passwordShow: "far fa-eye",
validationError: "fas fa-circle-exclamation"
};
const aliases = {
itemAdd: "mdi-plus",
itemMoveUp: "mdi-arrow-up",
itemMoveDown: "mdi-arrow-down",
itemDelete: "mdi-delete",
calendarClock: "mdi-calendar-clock",
clock: "mdi-clock-outline",
passwordHide: "mdi-eye-off",
passwordShow: "mdi-eye",
validationError: "mdi-alert-circle-outline"
};
const defaultStyles = {
control: {
root: "control",
input: "input"
},
verticalLayout: {
root: "vertical-layout",
item: "vertical-layout-item"
},
horizontalLayout: {
root: "horizontal-layout",
item: "horizontal-layout-item"
},
group: {
root: "group",
label: "group-label",
item: "group-item",
bare: "group-bare",
alignLeft: "group-align-left"
},
arrayList: {
root: "array-list",
toolbar: "array-list-toolbar",
title: "array-list-title",
validationIcon: "array-list-validation",
addButton: "array-list-add",
label: "array-list-label",
noData: "array-list-no-data",
item: "array-list-item",
itemHeader: "array-list-item-header",
itemLabel: "array-list-item-label",
itemContent: "array-list-item-content",
itemMoveUp: "array-list-item-move-up",
itemMoveDown: "array-list-item-move-down",
itemDelete: "array-list-item-delete"
},
listWithDetail: {
root: "list-with-detail",
toolbar: "list-with-detail-toolbar",
addButton: "list-with-detail-add",
label: "list-with-detail-label",
noData: "list-with-detail-no-data",
item: "list-with-detail-item",
itemLabel: "list-with-detail-item-label",
itemContent: "list-with-detail-item-content",
itemMoveUp: "list-with-detail-item-move-up",
itemMoveDown: "list-with-detail-item-move-down",
itemDelete: "list-with-detail-item-delete"
},
label: {
root: "label-element"
},
categorization: {
root: "categorization"
}
};
const createEmptyStyles = () => ({
control: {},
verticalLayout: {},
horizontalLayout: {},
group: {},
arrayList: {},
listWithDetail: {},
label: {},
categorization: {}
});
const useStyles = (element) => {
var _a, _b;
const userStyles = inject("styles", defaultStyles);
if (!((_a = element == null ? void 0 : element.options) == null ? void 0 : _a.styles)) {
return userStyles;
}
const styles = createEmptyStyles();
if (userStyles) {
merge(styles, userStyles);
} else {
merge(styles, defaultStyles);
}
if ((_b = element == null ? void 0 : element.options) == null ? void 0 : _b.styles) {
merge(styles, element.options.styles);
}
return styles;
};
const classes = (strings, ...variables) => {
return strings.reduce((acc, curr, index) => {
return `${acc}${curr}${variables[index] || ""}`;
}, "").trim();
};
const mergeStyles = (stylesA, stylesB) => {
const styles = cloneDeep(stylesA);
mergeWith(styles, stylesB, (aValue, bValue) => {
if (typeof aValue === "string" && typeof bValue === "string") {
return `${aValue} ${bValue}`;
}
return void 0;
});
return styles;
};
const IconSymbol = Symbol.for("vuetify:icons");
const useControlAppliedOptions = (input) => {
return computed(
() => merge(
{},
cloneDeep(input.control.value.config),
cloneDeep(input.control.value.uischema.options)
)
);
};
const useLayoutAppliedOptions = (input) => {
return computed(
() => merge(
{},
cloneDeep(input.layout.value.config),
cloneDeep(input.layout.value.uischema.options)
)
);
};
const useComputedLabel = (input, appliedOptions) => {
return computed(() => {
var _a;
return computeLabel(
input.control.value.label,
input.control.value.required,
!!((_a = appliedOptions.value) == null ? void 0 : _a.hideRequiredAsterisk)
);
});
};
const useVuetifyLabel = (input) => {
const styles = useStyles(input.label.value.uischema);
const appliedOptions = computed(
() => merge(
{},
cloneDeep(input.label.value.config),
cloneDeep(input.label.value.uischema.options)
)
);
const vuetifyProps = (path) => {
var _a;
const props = get((_a = appliedOptions.value) == null ? void 0 : _a.vuetify, path);
return props && isPlainObject(props) ? props : {};
};
return {
...input,
appliedOptions,
vuetifyProps,
styles
};
};
const useVuetifyControl = (input, adaptValue = (v) => v, debounceWait) => {
const touched = ref(false);
const changeEmitter = typeof debounceWait === "number" && input.handleChange ? debounce(input.handleChange, debounceWait) : input.handleChange;
const onChange = (value) => {
if (changeEmitter) {
changeEmitter(input.control.value.path, adaptValue(value));
}
};
const appliedOptions = useControlAppliedOptions(input);
const isFocused = ref(false);
const handleFocus = () => {
isFocused.value = true;
};
const handleBlur = () => {
touched.value = true;
isFocused.value = false;
};
const filteredErrors = computed(() => {
return touched.value || !appliedOptions.value.enableFilterErrorsBeforeTouch ? input.control.value.errors : "";
});
const persistentHint = () => {
var _a;
return !isDescriptionHidden(
input.control.value.visible,
input.control.value.description,
isFocused.value,
!!((_a = appliedOptions.value) == null ? void 0 : _a.showUnfocusedDescription)
);
};
const computedLabel = useComputedLabel(input, appliedOptions);
const controlWrapper = computed(() => {
const { id, description, errors, label, visible, required } = input.control.value;
return { id, description, errors, label, visible, required };
});
const styles = useStyles(input.control.value.uischema);
const vuetifyProps = (path) => {
var _a;
const props = get((_a = appliedOptions.value) == null ? void 0 : _a.vuetify, path);
return props && isPlainObject(props) ? props : {};
};
const overwrittenControl = computed(() => {
return {
...input.control.value,
errors: filteredErrors.value
};
});
const rawErrors = computed(() => input.control.value.errors);
return {
...input,
control: overwrittenControl,
styles,
isFocused,
appliedOptions,
controlWrapper,
onChange,
vuetifyProps,
persistentHint,
computedLabel,
touched,
handleBlur,
handleFocus,
rawErrors
};
};
const useCombinatorTranslations = (input) => {
var _a;
const jsonforms = inject("jsonforms");
const translations = getCombinatorTranslations(
((_a = jsonforms == null ? void 0 : jsonforms.i18n) == null ? void 0 : _a.translate) ?? defaultJsonFormsI18nState.translate,
combinatorDefaultTranslations,
input.control.value.i18nKeyPrefix,
input.control.value.label
);
const overwrittenControl = computed(() => {
return {
...input.control.value,
translations
};
});
return {
...input,
control: overwrittenControl
};
};
const useJsonForms = () => {
const jsonforms = inject("jsonforms");
if (!jsonforms) {
throw new Error(
"'jsonforms couldn't be injected. Are you within JSON Forms?"
);
}
return jsonforms;
};
const useTranslator = () => {
const jsonforms = useJsonForms();
if (!jsonforms.i18n || !jsonforms.i18n.translate) {
throw new Error(
"'jsonforms i18n couldn't be injected. Are you within JSON Forms?"
);
}
const translate = computed(() => {
return jsonforms.i18n.translate;
});
return translate;
};
const useVuetifyLayout = (input) => {
const appliedOptions = useLayoutAppliedOptions(input);
const vuetifyProps = (path) => {
var _a;
const props = get((_a = appliedOptions.value) == null ? void 0 : _a.vuetify, path);
return props && isPlainObject(props) ? props : {};
};
return {
...input,
styles: useStyles(input.layout.value.uischema),
appliedOptions,
vuetifyProps
};
};
const useVuetifyArrayControl = (input) => {
var _a;
const appliedOptions = useControlAppliedOptions(input);
const computedLabel = useComputedLabel(input, appliedOptions);
const vuetifyProps = (path) => {
var _a2;
const props = get((_a2 = appliedOptions.value) == null ? void 0 : _a2.vuetify, path);
return props && isPlainObject(props) ? props : {};
};
const childLabelForIndex = (index) => {
var _a2;
if (index === null) {
return "";
}
const childLabelProp = ((_a2 = input.control.value.uischema.options) == null ? void 0 : _a2.childLabelProp) ?? getFirstPrimitiveProp(input.control.value.schema);
if (!childLabelProp) {
return `${index}`;
}
const labelValue = Resolve.data(
input.control.value.data,
composePaths(`${index}`, childLabelProp)
);
if (labelValue === void 0 || labelValue === null || Number.isNaN(labelValue)) {
return "";
}
return `${labelValue}`;
};
const filteredChildErrors = computed(() => {
var _a2;
const filtered = ((_a2 = appliedOptions.value) == null ? void 0 : _a2.enableFilterErrorsBeforeTouch) ? [] : input.control.value.childErrors;
return filtered;
});
const jsonforms = inject("jsonforms");
const translations = getArrayTranslations(
((_a = jsonforms == null ? void 0 : jsonforms.i18n) == null ? void 0 : _a.translate) ?? defaultJsonFormsI18nState.translate,
arrayDefaultTranslations,
input.control.value.i18nKeyPrefix,
input.control.value.label
);
const overwrittenControl = computed(() => {
return {
...input.control.value,
childErrors: filteredChildErrors.value,
translations
};
});
return {
...input,
control: overwrittenControl,
styles: useStyles(input.control.value.uischema),
appliedOptions,
childLabelForIndex,
computedLabel,
vuetifyProps,
rawChildErrors: input.control.value.childErrors
};
};
const useVuetifyBasicControl = (input) => {
const appliedOptions = useControlAppliedOptions(input);
const vuetifyProps = (path) => {
var _a;
const props = get((_a = appliedOptions.value) == null ? void 0 : _a.vuetify, path);
return props && isPlainObject(props) ? props : {};
};
return {
...input,
styles: useStyles(input.control.value.uischema),
appliedOptions,
vuetifyProps
};
};
const useAjv = () => {
var _a;
const jsonforms = useJsonForms();
return (_a = jsonforms.core) == null ? void 0 : _a.ajv;
};
const useNested = (element) => {
const nestedInfo = inject("jsonforms.nestedInfo", { level: 0 });
if (element) {
provide("jsonforms.nestedInfo", {
level: nestedInfo.level + 1,
parentElement: element
});
}
return nestedInfo;
};
const useIcons = () => {
const iconSet = computed(() => {
const icons = inject(IconSymbol);
if (!icons) throw new Error("Missing Vuetify Icons provide!");
let result = aliases;
const overrides = icons.aliases;
if (icons.defaultSet === "fa") {
result = aliases$1;
}
return overrides ? { ...result, ...overrides } : result;
});
return {
current: iconSet
};
};
dayjs.extend(customParseFormat);
dayjs.extend(utc);
dayjs.extend(timezone);
dayjs.extend(localeData);
dayjs.extend(localizedFormat);
const expandLocaleFormat = (format) => {
return format.replace(/\b(LT|LTS|L{1,4})\b/g, function(match, p1) {
switch (p1) {
case "LT":
case "LTS":
case "L":
case "LL":
case "LLL":
case "LLLL":
return dayjs.localeData().longDateFormat(p1);
default:
return match;
}
});
};
const parseDateTime = (data, format) => {
if (!data) {
return null;
}
const dayjsData = dayjs(data, format);
if (!dayjsData.isValid()) {
return null;
}
return dayjsData;
};
const convertDayjsToMaskaFormat = (dayjsFormat) => {
function* nextKey(preservedKeys) {
let currentCharCode = "A".charCodeAt(0);
while (currentCharCode <= 65535) {
const currentChar = String.fromCharCode(currentCharCode);
if (!preservedKeys.includes(currentChar)) {
yield currentChar;
}
currentCharCode++;
}
}
function RegExpLiteral(str) {
return str.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
}
class Tokens {
constructor(preservedKeys) {
__publicField(this, "tokens");
__publicField(this, "charGenerator");
this.tokens = {};
this.charGenerator = nextKey(preservedKeys);
}
getTokens() {
return this.tokens;
}
getTokenKey(token) {
const entry2 = Object.entries(this.tokens).find(
(entry22) => entry22[1].pattern.toString() === token.pattern.toString() && entry22[1].optional === token.optional
);
if (entry2) {
return entry2[0];
}
throw new Error(
"Key for pattern " + token.pattern.toString() + " not found."
);
}
registerToken(token) {
const entry2 = Object.entries(this.tokens).find(
(entry22) => entry22[1].pattern.toString() === token.pattern.toString() && entry22[1].optional === token.optional
);
if (entry2) {
return entry2[0];
}
const key = this.charGenerator.next().value;
this.tokens[key] = token;
return key;
}
}
const dayjsTokens = [
"YYYY",
// Four-digit year - example: 2001
"YY",
//Two-digit year - example: 01
"M",
// Month, beginning at 1 - example: 1-12
"MM",
// Month, 2-digits - example: 01-12
"MMM",
// The abbreviated month name - example: Jan-Dec
"MMMM",
// The full month name - example: January-December
"D",
// Day of month - example: 1-31
"DD",
// Day of month, 2-digits - example: 01-31
"H",
// Hours - example: 0-23
"HH",
// Hours, 2-digits - example: 00-23
"h",
// Hours, 12-hour clock - example: 1-12
"hh",
// Hours, 12-hour clock, 2-digits - example: 01-12
"m",
// Minutes - example: 0-59
"mm",
// Minutes, 2-digits - example: 00-59
"s",
// Seconds - example: 0-59
"ss",
// Seconds, 2-digits - example: 00-59
"S",
// Hundreds of milliseconds, 1-digit - example: 0-9
"SS",
// Tens of milliseconds, 2-digits - example: 00-99
"SSS",
// Milliseconds, 3-digits - example: 000-999
"Z",
// Offset from UTC - example: -05:00
"ZZ",
// Compact offset from UTC, 2-digits - example: -0500
"A",
// Post or ante meridiem, upper-case - example: AM PM
"a",
// Post or ante meridiem, lower-case - example: am pm,
"X",
// Unix timestamp - example 1410715640.579,
"x"
// Unix ms timestamp - example 1410715640579
].sort((a, b) => b.length - a.length);
const parts = dayjsFormat.split(new RegExp(`(${dayjsTokens.join("|")})`)).filter(Boolean);
const reservedChars = parts.filter((part) => !dayjsTokens.includes(part)).join("");
const tokens = new Tokens(reservedChars);
tokens.registerToken({ pattern: /[0-9]/ });
tokens.registerToken({ pattern: /1/ });
tokens.registerToken({ pattern: /[0-2]/ });
tokens.registerToken({ pattern: /[0-2]/, optional: true });
tokens.registerToken({ pattern: /[0-1]/ });
tokens.registerToken({ pattern: /[1-9]/ });
let escapedMonths = dayjs.monthsShort().map((month) => RegExpLiteral(month));
let regexPattern = `\\b(${escapedMonths.join("|")})\\b`;
tokens.registerToken({ pattern: new RegExp(regexPattern, "i") });
escapedMonths = dayjs.months().map((month) => RegExpLiteral(month));
regexPattern = `\\b(${escapedMonths.join("|")})\\b`;
tokens.registerToken({ pattern: new RegExp(regexPattern, "i") });
tokens.registerToken({ pattern: /[1-3]/ });
tokens.registerToken({ pattern: /[0-1]/, optional: true });
tokens.registerToken({ pattern: /[0-9]/, optional: true });
tokens.registerToken({ pattern: /[0-3]/ });
tokens.registerToken({ pattern: /[0-3]/, optional: true });
tokens.registerToken({ pattern: /[0-5]/ });
tokens.registerToken({ pattern: /[ap]/ });
tokens.registerToken({ pattern: /m/ });
tokens.registerToken({ pattern: /[AP]/ });
tokens.registerToken({ pattern: /M/ });
tokens.registerToken({ pattern: /[+-]/ });
tokens.registerToken({ pattern: /[0-4]/ });
tokens.registerToken({ pattern: /:/ });
tokens.registerToken({ pattern: /[.]/ });
tokens.registerToken({ pattern: /[.]/, optional: true });
const tokenFunction = (value) => {
let index = 0;
const result = [];
for (const part of parts) {
if (!part || part === "") {
continue;
}
if (index > value.length) {
break;
}
if (part === "YYYY") {
result.push({ pattern: /[0-9]/ });
result.push({ pattern: /[0-9]/ });
result.push({ pattern: /[0-9]/ });
result.push({ pattern: /[0-9]/ });
index += 4;
} else if (part === "YY" || part == "SS") {
result.push({ pattern: /[0-9]/ });
result.push({ pattern: /[0-9]/ });
index += 2;
} else if (part === "M") {
result.push({ pattern: /1/ });
if (value.charAt(index) === "1") {
if (/[0-2]/.test(value.charAt(index + 1))) {
result.push({ pattern: /[0-2]/ });
index += 1;
} else if (value.charAt(index + 1) === "") {
result.push({ pattern: /[0-2]/, optional: true });
}
}
index += 1;
} else if (part === "MM" || part == "hh") {
result.push({ pattern: /[0-1]/ });
result.push(
value.charAt(index) === "0" ? { pattern: /[1-9]/ } : { pattern: /[0-2]/ }
);
index += 2;
} else if (part === "MMM") {
const escapedMonths2 = dayjs.monthsShort().map((month) => RegExpLiteral(month));
const regexPattern2 = `\\b(${escapedMonths2.join("|")})\\b`;
result.push({ pattern: new RegExp(regexPattern2, "i") });
let monthSpecified = false;
for (const month of dayjs.monthsShort()) {
if (index < value.length && value.substring(index).startsWith(month)) {
index += month.length;
monthSpecified = true;
break;
}
}
if (!monthSpecified) {
break;
}
} else if (part === "MMMM") {
const escapedMonths2 = dayjs.months().map((month) => RegExpLiteral(month));
const regexPattern2 = `\\b(${escapedMonths2.join("|")})\\b`;
result.push({ pattern: new RegExp(regexPattern2, "i") });
let monthSpecified = false;
for (const month of dayjs.months()) {
if (index < value.length && value.substring(index).startsWith(month)) {
index += month.length;
monthSpecified = true;
break;
}
}
if (!monthSpecified) {
break;
}
} else if (part === "D") {
result.push({ pattern: /[1-9]/ });
if (/[1-3]/.test(value.charAt(index))) {
if (value.charAt(index) === "3") {
if (/[0-1]/.test(value.charAt(index + 1))) {
result.push({ pattern: /[0-1]/ });
index += 1;
} else if (value.charAt(index + 1) === "") {
result.push({ pattern: /[0-1]/, optional: true });
}
} else {
if (/\d/.test(value.charAt(index + 1))) {
result.push({ pattern: /[0-9]/ });
index += 1;
} else if (value.charAt(index + 1) === "") {
result.push({ pattern: /[0-9]/, optional: true });
}
}
}
index += 1;
} else if (part === "DD") {
result.push({ pattern: /[0-3]/ });
if (value.charAt(index) === "3") {
result.push({ pattern: /[0-1]/ });
} else if (value.charAt(index) === "0") {
result.push({ pattern: /[1-9]/ });
} else {
result.push({ pattern: /[0-9]/ });
}
index += 2;
} else if (part == "H") {
result.push({ pattern: /[0-9]/ });
if (value.charAt(index) === "2") {
if (/[0-3]/.test(value.charAt(index + 1))) {
result.push({ pattern: /[0-3]/ });
index += 1;
} else if (value.charAt(index + 1) === "") {
result.push({ pattern: /[0-3]/, optional: true });
}
} else if (value.charAt(index) === "1") {
if (/\d/.test(value.charAt(index + 1))) {
result.push({ pattern: /[0-9]/ });
index += 1;
} else if (value.charAt(index + 1) === "") {
result.push({ pattern: /[0-9]/, optional: true });
}
}
index += 1;
} else if (part == "HH") {
result.push({ pattern: /[0-2]/ });
if (/[0-1]/.test(value.charAt(index))) {
result.push({ pattern: /[0-9]/ });
} else if (value.charAt(index) === "2") {
result.push({ pattern: /[0-3]/ });
}
index += 2;
} else if (part == "h") {
result.push({ pattern: /[1-9]/ });
if (value.charAt(index) === "1") {
if (/[0-2]/.test(value.charAt(index + 1))) {
result.push({ pattern: /[0-2]/ });
index += 1;
} else if (value.charAt(index + 1) === "") {
result.push({ pattern: /[0-2]/, optional: true });
}
}
index += 1;
} else if (part == "m" || part == "s") {
result.push({ pattern: /[0-9]/ });
if (/[1-5]/.test(value.charAt(index))) {
if (/\d/.test(value.charAt(index + 1))) {
result.push({ pattern: /[0-9]/ });
index += 1;
} else if (value.charAt(index + 1) === "") {
result.push({ pattern: /[0-9]/, optional: true });
}
}
index += 1;
} else if (part == "mm" || part == "ss") {
result.push({ pattern: /[0-5]/ });
result.push({ pattern: /[0-9]/ });
index += 2;
} else if (part == "a") {
result.push({ pattern: /[ap]/ });
result.push({ pattern: /m/ });
index += 2;
} else if (part == "A") {
result.push({ pattern: /[AP]/ });
result.push({ pattern: /M/ });
index += 2;
} else if (part == "Z" || part == "ZZ") {
result.push({ pattern: /[+-]/ });
result.push({ pattern: /[0-1]/ });
if (value.charAt(index + 1) === "0") {
result.push({ pattern: /[0-9]/ });
} else if (value.charAt(index + 1) === "1") {
result.push(
value.charAt(index) === "+" ? { pattern: /[0-4]/ } : { pattern: /[0-2]/ }
);
}
if (part === "Z") {
result.push({ pattern: /:/ });
index += 1;
}
result.push({ pattern: /[0-5]/ });
result.push({ pattern: /[0-9]/ });
index += 5;
} else if (part == "S") {
result.push({ pattern: /[0-9]/ });
index += 1;
} else if (part == "SSS") {
result.push({ pattern: /[0-9]/ });
result.push({ pattern: /[0-9]/ });
result.push({ pattern: /[0-9]/ });
index += 3;
} else if (part == "X") {
const times = 13;
for (let i = 0; i < times; i++) {
result.push({ pattern: /[0-9]/ });
}
index += times;
} else if (part == "x") {
const times = 10;
for (let i = 0; i < times; i++) {
result.push({ pattern: /[0-9]/ });
}
if (value.charAt(index + times) === ".") {
result.push({ pattern: /[.]/ });
index += 1;
for (let i = 0; i < 3; i++) {
if (/\d/.test(value.charAt(index + times + 1 + i))) {
result.push({ pattern: /[0-9]/ });
index += 1;
} else if (value.charAt(index + times + 1 + i) === "") {
result.push({ pattern: /[0-9]/, optional: true });
break;
}
}
} else if (value.charAt(index + times) === "") {
result.push({ pattern: /[.]/, optional: true });
}
index += times;
} else {
result.push(part);
index += part.length;
}
}
const mask = result.map(
(part) => typeof part === "string" ? part : tokens.getTokenKey(part)
).join("");
return mask;
};
return { mask: tokenFunction, tokens: tokens.getTokens() };
};
const createAjv = (options) => {
const ajv = createAjv$1(options);
ajv.addFormat("password", () => true);
return ajv;
};
const labelRenderer$1 = defineComponent({
name: "label-renderer",
components: {
VLabel
},
props: {
...rendererProps()
},
setup(props) {
return useVuetifyLabel(useJsonFormsLabel(props));
}
});
const _export_sfc = (sfc, props) => {
const target = sfc.__vccOpts || sfc;
for (const [key, val] of props) {
target[key] = val;
}
return target;
};
function _sfc_render$C(_ctx, _cache, $props, $setup, $data, $options) {
const _component_v_label = resolveComponent("v-label");
return _ctx.label.visible ? (openBlock(), createBlock(_component_v_label, mergeProps({
key: 0,
class: _ctx.styles.label.root
}, _ctx.vuetifyProps("v-label")), {
default: withCtx(() => [
createTextVNode(toDisplayString(_ctx.label.text), 1)
]),
_: 1
}, 16, ["class"])) : createCommentVNode("", true);
}
const labelRenderer = /* @__PURE__ */ _export_sfc(labelRenderer$1, [["render", _sfc_render$C]]);
const _sfc_main$4 = defineComponent({
name: "validation-badge",
components: {
VBadge,
VTooltip
},
props: {
errors: {
required: true,
type: Array
},
bordered: {
type: Boolean,
default: false
},
color: {
type: String,
default: "error"
},
inline: {
type: Boolean,
default: false
},
offsetX: {
type: [Number, String],
default: void 0
},
offsetY: {
type: [Number, String],
default: void 0
},
floating: {
type: Boolean,
default: false
}
},
computed: {
tooltipMessages() {
const error = [];
for (const e of this.errors) {
const errorObject = e;
const index = findIndex(error, { schemaPath: errorObject.schemaPath });
if (errorObject.message) {
if (index == -1) {
error.push({
schemaPath: errorObject.schemaPath,
instancePath: errorObject.instancePath,
labels: [
createLabelDescriptionFrom(
createControlElement(errorObject.instancePath),
errorObject.schema
).text
],
message: errorObject.message
});
} else {
error[index].labels.push(
createLabelDescriptionFrom(
createControlElement(errorObject.instancePath),
errorObject.schema
).text
);
}
}
}
return error.map((v) => v.labels.join(",") + ": " + v.message);
}
}
});
const _hoisted_1$a = /* @__PURE__ */ createElementVNode("p", null, "Validation Errors", -1);
function _sfc_render$B(_ctx, _cache, $props, $setup, $data, $options) {
const _component_v_badge = resolveComponent("v-badge");
const _component_v_tooltip = resolveComponent("v-tooltip");
return openBlock(), createElementBlock("div", null, [
_ctx.errors.length > 0 ? (openBlock(), createBlock(_component_v_tooltip, {
key: 0,
bottom: ""
}, {
activator: withCtx(({ props }) => [
createVNode(_component_v_badge, {
color: _ctx.color,
bordered: _ctx.bordered,
inline: _ctx.inline,
offsetX: _ctx.offsetX,
offsetY: _ctx.offsetY,
floating: _ctx.floating
}, {
badge: withCtx(() => [
createTextVNode(toDisplayString(_ctx.errors.length), 1)
]),
default: withCtx(() => [
createElementVNode("div", normalizeProps(guardReactiveProps(props)), [
renderSlot(_ctx.$slots, "default")
], 16)
]),
_: 2
}, 1032, ["color", "bordered", "inline", "offsetX", "offsetY", "floating"])
]),
default: withCtx(() => [
_hoisted_1$a,
(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.tooltipMessages, (message, index) => {
return openBlock(), createElementBlock("p", {
key: `${index}`,
class: "mb-0"
}, toDisplayString(message), 1);
}), 128))
]),
_: 3
})) : renderSlot(_ctx.$slots, "default", { key: 1 })
]);
}
const ValidationBadge = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["render", _sfc_render$B]]);
const _sfc_main$3 = defineComponent({
name: "validation-icon",
components: {
ValidationBadge,
VIcon
},
props: {
errors: {
required: true,
type: Array
}
},
setup() {
const icons = useIcons();
return { icons };
}
});
function _sfc_render$A(_ctx, _cache, $props, $setup, $data, $options) {
const _component_v_icon = resolveComponent("v-icon");
const _component_validation_badge = resolveComponent("validation-badge");
return _ctx.errors && _ctx.errors.length > 0 ? (openBlock(), createBlock(_component_validation_badge, {
key: 0,
errors: _ctx.errors,
floating: ""
}, {
default: withCtx(() => [
createVNode(_component_v_icon, { color: "error" }, {
default: withCtx(() => [
createTextVNode(toDisplayString(_ctx.icons.current.value.validationError), 1)
]),
_: 1
})
]),
_: 1
}, 8, ["errors"])) : createCommentVNode("", true);
}
const ValidationIcon = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render$A]]);
const controlRenderer$S = defineComponent({
name: "list-with-detail-renderer",
components: {
DispatchRenderer,
VList,
VListItem,
VListItemTitle,
VAvatar,
VRow,
VCol,
VToolbar,
VToolbarTitle,
VTooltip,
VBtn,
VIcon,
VSpacer,
VContainer,
VVirtualScroll,
ValidationIcon,
ValidationBadge
},
props: {
...rendererProps()
},
setup(props) {
const selectedIndex = ref(void 0);
const icons = useIcons();
return {
...useVuetifyArrayControl(useJsonFormsArrayControl(props)),
selectedIndex,
icons
};
},
computed: {
dataLength() {
return this.control.data ? this.control.data.length : 0;
},
foundUISchema() {
return findUISchema(
this.control.uischemas,
this.control.schema,
this.control.uischema.scope,
this.control.path,
void 0,
this.control.uischema
);
},
arraySchema() {
return Resolve.schema(
this.control.rootSchema,
this.control.uischema.scope,
this.control.rootSchema
);
}
},
methods: {
composePaths,
createDefaultValue,
addButtonClick() {
this.addItem(
this.control.path,
createDefaultValue(this.control.schema, this.control.rootSchema)
)();
},
moveUpClick(event, toMove) {
var _a;
event.stopPropagation();
(_a = this.moveUp) == null ? void 0 : _a.call(this, this.control.path, toMove)();
},
moveDownClick(event, toMove) {
var _a;
event.stopPropagation();
(_a = this.moveDown) == null ? void 0 : _a.call(this, this.control.path, toMove)();
},
removeItemsClick(event, toDelete) {
var _a;
event.stopPropagation();
(_a = this.removeItems) == null ? void 0 : _a.call(this, this.control.path, toDelete)();
},
childErrors(index) {
return this.control.childErrors.filter(
(e) => e.instancePath.startsWith(
this.composePaths(this.control.path, `${index}`)
)
);
}
}
});
const _hoisted_1$9 = { class: "text-h6" };
function _sfc_render$z(_ctx, _cache, $props, $setup, $data, $options) {
const _component_v_toolbar_title = resolveComponent("v-toolbar-title");
const _component_v_spacer = resolveComponent("v-spacer");
const _component_validation_icon = resolveComponent("validation-icon");
const _component_v_icon = resolveComponent("v-icon");
const _component_v_btn = resolveComponent("v-btn");
const _component_v_tooltip = resolveComponent("v-tooltip");
const _component_v_toolbar = resolveComponent("v-toolbar");
const _component_v_col = resolveComponent("v-col");
const _component_v_row = resolveComponent("v-row");
const _component_v_avatar = resolveComponent("v-avatar");
const _component_validation_badge = resolveComponent("validation-badge");
const _component_v_list_item_title = resolveComponent("v-list-item-title");
const _component_v_list_item = resolveComponent("v-list-item");
const _component_v_virtual_scroll = resolveComponent("v-virtual-scroll");
const _component_v_list = resolveComponent("v-list");
const _component_dispatch_renderer = resolveComponent("dispatch-renderer");
const _component_v_container = resolveComponent("v-container");
return _ctx.control.visible ? (openBlock(), createBlock(_component_v_container, {
key: 0,
"fill-height": "",
class: normalizeClass(_ctx.styles.listWithDetail.root)
}, {
default: withCtx(() => [
createVNode(_component_v_row, null, {
default: withCtx(() => [
createVNode(_component_v_col, { class: "pa-0" }, {
default: withCtx(() => [
createVNode(_component_v_toolbar, {
flat: "",
class: normalizeClass(_ctx.styles.listWithDetail.toolbar)
}, {
default: withCtx(() => [
createVNode(_component_v_toolbar_title, {
class: normalizeClass(_ctx.styles.listWithDetail.label)
}, {
default: withCtx(() => [
createTextVNode(toDisplayString(_ctx.computedLabel), 1)
]),
_: 1
}, 8, ["class"]),
createVNode(_component_v_spacer),
_ctx.control.childErrors.length > 0 ? (openBlock(), createBlock(_component_validation_icon, {
key: 0,
errors: _ctx.control.childErrors
}, null, 8, ["errors"])) : createCommentVNode("", true),
createVNode(_component_v_tooltip, { bottom: "" }, {
activator: withCtx(({ props }) => [
createVNode(_component_v_btn, mergeProps({
icon: "",
variant: "text",
elevation: "0",
small: "",
"aria-label": _ctx.control.translations.addAriaLabel
}, props, {
class: _ctx.styles.listWithDetail.addButton,
onClick: _ctx.addButtonClick,
disabled: !_ctx.control.enabled || _ctx.appliedOptions.restrict && _ctx.arraySchema !== void 0 && _ctx.arraySchema.maxItems !== void 0 && _ctx.dataLength >= _ctx.arraySchema.maxItems
}), {
default: withCtx(() => [
createVNode(_component_v_icon, null, {
default: withCtx(() => [
createTextVNode(toDisplayString(_ctx.icons.current.value.itemAdd), 1)
]),
_: 1
})
]),
_: 2
}, 1040, ["aria-label", "class", "onClick", "disabled"])
]),
default: withCtx(() => [
createTextVNode(" " + toDisplayString(_ctx.control.translations.addTooltip), 1)
]),
_: 1
})
]),
_: 1
}, 8, ["class"])
]),
_: 1
})
]),
_: 1
}),
_ctx.dataLength === 0 ? (openBlock(), createBlock(_component_v_row, {
key: 0,
class: normalizeClass(_ctx.styles.listWithDetail.noData)
}, {
default: withCtx(() => [
createVNode(_component_v_col, null, {
default: withCtx(() => [
createTextVNode(toDisplayString(_ctx.control.translations.noDataMessage), 1)
]),
_: 1
})
]),
_: 1
}, 8, ["class"])) : (openBlock(), createBlock(_component_v_row, { key: 1 }, {
default: withCtx(() => [
createVNode(_component_v_col, { class: "flex-shrink-1 flex-grow-0 pa-0" }, {
default: withCtx(() => [
createVNode(_component_v_list, {
selected: _ctx.selectedIndex,
"onUpdate:selected": _cache[0] || (_cache[0] = ($event) => _ctx.selectedIndex = $event)
}, {
default: withCtx(() => [
createVNode(_component_v_virtual_scroll, {
items: _ctx.control.data,
"item-height": 64,
"min-height": `${4 * 64}`,
"max-height": `${6 * 64}`,
"min-width": _ctx.appliedOptions.showSortButtons ? 350 : 250,
"max-width": "350"
}, {
default: withCtx(({ index }) => [
createVNode(_component_v_list_item, {
dense: "",
value: index,
class: normalizeClass(_ctx.styles.listWithDetail.item)
}, {
prepend: withCtx(({ isSelected }) => [
createVNode(_component_validation_badge, {
overlap: "",
bordered: "",
errors: _ctx.childErrors(index),
style: { "margin-right": "8px" }
}, {
default: withCtx(() => [
createVNode(_component_v_avatar, {
size: "40",
"aria-label": "Index",
color: isSelected ? "primary" : void 0
}, {
default: withCtx(() => [
createElementVNode("span", null, toDisplayString(index + 1), 1)
]),
_: 2
}, 1032, ["color"])
]),
_: 2
}, 1032, ["errors"])
]),
append: withCtx(() => [
_ctx.appliedOptions.showSortButtons ? (openBlock(), createBlock(_component_v_tooltip, {
key: 0,
bottom: ""
}, {
activator: withCtx(({ props }) => [
createVNode(_component_v_btn, mergeProps(props, {
icon: "",
variant: "text",
elevation: "0",
small: "",
class: ["ma-0", _ctx.styles.listWithDetail.itemMoveUp],
"aria-label": _ctx.control.translations.upAriaLabel,
disabled: index <= 0 || !_ctx.control.enabled,
onClick: ($event) => _ctx.moveUpClick($event, index)
}), {
default: withCtx(() => [
createVNode(_component_v_icon, { class: "notranslate" }, {
default: withCtx(() => [
createTextVNode(toDisplayString(_ctx.icons.current.value.itemMoveUp), 1)
]),
_: 1
})
]),
_: 2
}, 1040, ["aria-label", "disabled", "class", "onClick"])
]),
default: withCtx(() => [
createTextVNode(" " + toDisplayString(_ctx.control.translations.up), 1)
]),
_: 2
}, 1024)) : createCommentVNode("", true),
_ctx.appliedOptions.showSortButtons ? (openBlock(), createBlock(_component_v_tooltip, {
key: 1,
bottom: ""
}, {
activator: withCtx(({ props }) => [
createVNode(_component_v_btn, mergeProps(props, {
icon: "",
variant: "text",
elevation: "0",
small: "",
class: ["ma-0", _ctx.styles.listWithDetail.itemMoveDown],
"aria-label": _ctx.control.translations.downAriaLabel,
disabled: index >= _ctx.dataLength - 1 || !_ctx.control.enabled,
onClick: ($event) => _ctx.moveDownClick($event, index)
}), {
default: withCtx(() => [
createVNode(_component_v_icon, { class: "notranslate" }, {
default: withCtx(() => [
createTextVNode(toDisplayString(_ctx.icons.current.value.itemMoveDown), 1)
]),
_: 1
})
]),
_: 2
}, 1040, ["aria-label", "disabled", "class", "onClick"])
]),
default: withCtx(() => [
createTextVNode(" " + toDisplayString(_ctx.control.translations.down), 1)
]),
_: 2
}, 1024)) : createCommentVNode("", true),
createVNode(_component_v_tooltip, { bottom: "" }, {
activator: withCtx(({ props }) => [
createVNode(_component_v_btn, mergeProps(props, {
icon: "",
variant: "text",
elevation: "0",
small: "",
class: ["ma-0", _ctx.styles.listWithDetail.itemDelete],
"aria-label": _ctx.control.translations.removeAriaLabel,
onClick: ($event) => _ctx.removeItemsClick($event, [index]),
disabled: !_ctx.control.enabled || _ctx.appliedOptions.restrict && _ctx.arraySchema !== void 0 && _ctx.arraySchema.minItems !== void 0 && _ctx.dataLength <= _ctx.arraySchema.minItems
}), {
default: withCtx(() => [
createVNode(_component_v_icon, { class: "notranslate" }, {
default: withCtx(() => [
createTextVNode(toDisplayString(_ctx.icons.current.value.itemDelete), 1)
]),
_: 1
})
]),
_: 2
}, 1040, ["aria-label", "class", "onClick", "disabled"])
]),
default: withCtx(() => [
createTextVNode(" " + toDisplayString(_ctx.control.translations.removeTooltip), 1)
]),
_: 2
}, 1024)
]),
default: withCtx(() => [
createVNode(_component_v_list_item_title, null, {
default: withCtx(() => [
createVNode(_component_v_tooltip, { bottom: "" }, {
activator: withCtx(({ props }) => [
createElementVNode("span", mergeProps(props, {
class: _ctx.styles.listWithDetail.itemLabel
}), toDisplayString(_ctx.childLabelForIndex(index)), 17)
]),
default: withCtx(() => [
createTextVNode(" " + toDisplayString(_ctx.childLabelForIndex(index)), 1)
]),
_: 2
}, 1024)
]),
_: 2
}, 1024)
]),
_: 2
}, 1032, ["value", "class"])
]),
_: 1
}, 8, ["items", "min-width"])
]),
_: 1
}, 8, ["selected"])
]),
_: 1
}),
_ctx.selectedIndex === void 0 ? (openBlock(), createBlock(_component_v_col, {
key: 0,
class: "flex-grow-1"
}, {
default: withCtx(() => [
createElem