vlite3 1.4.5 → 1.4.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/AppShell/AppShellLayoutStorefront.vue.d.ts +4 -17
- package/components/AppShell/AppShellLayoutStorefront.vue.js +116 -152
- package/components/AvatarUploader/AvatarUploader.vue.d.ts +1 -1
- package/components/AvatarUploader/AvatarUploader.vue.js +1 -1
- package/components/CategoryManager/CategoryManager.vue2.js +1 -1
- package/components/Chat/ChatInterface.vue.js +1 -1
- package/components/Comment/CommentEditor.vue.js +1 -1
- package/components/FilePicker/FilePickerDropzone.vue.d.ts +27 -0
- package/components/FilePicker/FilePickerDropzone.vue.js +117 -0
- package/components/FilePicker/FilePickerDropzone.vue2.js +4 -0
- package/components/FilePicker/FilePickerInput.vue.d.ts +22 -0
- package/components/FilePicker/FilePickerInput.vue.js +147 -0
- package/components/FilePicker/FilePickerInput.vue2.js +4 -0
- package/components/FilePicker/FilePreview.vue.d.ts +21 -0
- package/components/FilePicker/FilePreview.vue.js +95 -0
- package/components/FilePicker/FilePreview.vue2.js +4 -0
- package/components/FilePicker/composables/useFileProcessing.d.ts +65 -0
- package/components/FilePicker/composables/useFileProcessing.js +141 -0
- package/components/FilePicker/index.d.ts +2 -2
- package/components/FilePicker/{FilePicker.vue.d.ts → index.vue.d.ts} +11 -18
- package/components/FilePicker/index.vue.js +131 -0
- package/components/FilePicker/index.vue2.js +4 -0
- package/components/FilePicker/types.d.ts +17 -0
- package/components/FilePicker/utils.d.ts +23 -0
- package/components/FilePicker/utils.js +37 -0
- package/components/Form/AccordionView.vue.d.ts +26 -0
- package/components/Form/AccordionView.vue.js +219 -0
- package/components/Form/AccordionView.vue2.js +4 -0
- package/components/Form/FormField.vue.js +2 -2
- package/components/Form/FormFields.vue.js +2 -2
- package/components/Form/TableRow.vue.d.ts +18 -0
- package/components/Form/TableRow.vue.js +88 -0
- package/components/Form/TableRow.vue2.js +4 -0
- package/components/Form/TableView.vue.d.ts +23 -0
- package/components/Form/TableView.vue.js +88 -0
- package/components/Form/TableView.vue2.js +4 -0
- package/components/Form/composables/useCustomFieldRows.d.ts +52 -0
- package/components/Form/composables/useCustomFieldRows.js +77 -0
- package/components/Form/index.d.ts +1 -1
- package/components/Form/{CustomFields.vue.d.ts → index.vue.d.ts} +5 -6
- package/components/Form/index.vue.js +7 -0
- package/components/Form/index.vue2.js +141 -0
- package/components/Form/rowHelpers.d.ts +45 -0
- package/components/Form/rowHelpers.js +40 -0
- package/components/IconPicker.vue.d.ts +2 -2
- package/components/Screen/ScreenFilter.vue.js +1 -1
- package/components/ThumbnailSelector/ThumbnailSelector.vue.js +1 -1
- package/components/ThumbnailSelector/ThumbnailSelector.vue2.js +1 -1
- package/components/index.d.ts +1 -1
- package/index.js +2 -2
- package/package.json +1 -1
- package/style.css +1 -1
- package/components/FilePicker/FilePicker.vue.js +0 -437
- package/components/FilePicker/FilePicker.vue2.js +0 -4
- package/components/Form/CustomFields.vue.js +0 -7
- package/components/Form/CustomFields.vue2.js +0 -465
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
import { defineComponent as V, useSlots as $, useAttrs as B, computed as n, ref as D, openBlock as u, createElementBlock as N, normalizeClass as C, createElementVNode as E, renderSlot as R, unref as i, createBlock as F } from "vue";
|
|
2
|
+
import U from "./FilePickerInput.vue.js";
|
|
3
|
+
import M from "./FilePickerDropzone.vue.js";
|
|
4
|
+
import { useFileProcessing as L } from "./composables/useFileProcessing.js";
|
|
5
|
+
import { $t as d } from "../../utils/i18n.js";
|
|
6
|
+
const j = ["multiple", "accept", "data-testid"], O = /* @__PURE__ */ V({
|
|
7
|
+
name: "FilePicker",
|
|
8
|
+
__name: "index",
|
|
9
|
+
props: {
|
|
10
|
+
modelValue: { default: null },
|
|
11
|
+
multiSelect: { type: Boolean, default: !1 },
|
|
12
|
+
fileTypes: { default: () => [] },
|
|
13
|
+
returnFormat: { default: "file" },
|
|
14
|
+
loading: { type: Boolean, default: !1 },
|
|
15
|
+
disabled: { type: Boolean, default: !1 },
|
|
16
|
+
maxSize: {},
|
|
17
|
+
maxFiles: {},
|
|
18
|
+
variant: { default: "dropzone" },
|
|
19
|
+
placeholder: {},
|
|
20
|
+
placeholderI18n: {},
|
|
21
|
+
textI18n: {},
|
|
22
|
+
size: { default: "md" },
|
|
23
|
+
rounded: { default: "md" },
|
|
24
|
+
allowRename: { type: Boolean, default: !1 }
|
|
25
|
+
},
|
|
26
|
+
emits: ["update:modelValue", "change", "error"],
|
|
27
|
+
setup(l, { emit: h }) {
|
|
28
|
+
const t = l, k = h;
|
|
29
|
+
$();
|
|
30
|
+
const c = B(), s = (a, r, g) => {
|
|
31
|
+
const y = g ? d(a, g) : d(a);
|
|
32
|
+
return y !== a ? y : r;
|
|
33
|
+
}, m = n(
|
|
34
|
+
() => t.placeholderI18n ? d(t.placeholderI18n) : t.placeholder !== void 0 ? t.placeholder : s("vlite.filePicker.selectFile", "Select file...")
|
|
35
|
+
), b = n(() => t.textI18n ? d(t.textI18n) : s("vlite.filePicker.clickToUpload", "Click to upload")), x = n(() => s("vlite.filePicker.dragAndDrop", "or drag and drop")), w = n(() => s("vlite.filePicker.addMore", "Add more")), f = n(() => s("vlite.filePicker.unknownFile", "Unknown File")), S = n(() => s("vlite.filePicker.enterFileName", "Enter file name")), P = n(() => s("vlite.filePicker.renameFile", "Rename file")), p = D(null), e = L(
|
|
36
|
+
{
|
|
37
|
+
// Getters (not snapshots) — see the long-form note in the composable
|
|
38
|
+
// file. The composable's `computed`s must read these at evaluation
|
|
39
|
+
// time so Vue's reactivity tracking picks up changes when the parent
|
|
40
|
+
// updates `modelValue` after an emit.
|
|
41
|
+
modelValue: () => t.modelValue,
|
|
42
|
+
multiSelect: () => t.multiSelect,
|
|
43
|
+
fileTypes: () => t.fileTypes,
|
|
44
|
+
maxSize: () => t.maxSize,
|
|
45
|
+
maxFiles: () => t.maxFiles,
|
|
46
|
+
returnFormat: () => t.returnFormat,
|
|
47
|
+
disabled: () => t.disabled,
|
|
48
|
+
loading: () => t.loading,
|
|
49
|
+
unknownFileFallback: () => f.value
|
|
50
|
+
},
|
|
51
|
+
k
|
|
52
|
+
), I = (a) => {
|
|
53
|
+
const r = a.target;
|
|
54
|
+
r.files && e.processFiles(r.files), r.value = "";
|
|
55
|
+
}, z = n(() => {
|
|
56
|
+
if (!e.hasValue.value) return "";
|
|
57
|
+
const a = e.displayFiles.value, r = a[0]?.fileName || f.value;
|
|
58
|
+
return !t.multiSelect || a.length <= 1 ? r : `${r} +${a.length - 1}`;
|
|
59
|
+
}), v = n(
|
|
60
|
+
() => c["data-testid"] || "filepicker"
|
|
61
|
+
), A = n(() => {
|
|
62
|
+
const a = c;
|
|
63
|
+
return a["data-testid"] ? `${a["data-testid"]}-input` : a.name ? `filepicker-input-${a.name}` : "filepicker-input";
|
|
64
|
+
}), o = () => e.triggerInput(p.value), T = n(() => e.acceptAttribute.value);
|
|
65
|
+
return (a, r) => (u(), N("div", {
|
|
66
|
+
class: C(["vl-file-picker w-full min-w-0", { "vl-file-picker--input": l.variant === "input" }])
|
|
67
|
+
}, [
|
|
68
|
+
E("input", {
|
|
69
|
+
ref_key: "fileInput",
|
|
70
|
+
ref: p,
|
|
71
|
+
type: "file",
|
|
72
|
+
multiple: l.multiSelect,
|
|
73
|
+
accept: T.value,
|
|
74
|
+
class: "hidden",
|
|
75
|
+
"data-testid": A.value,
|
|
76
|
+
onChange: I
|
|
77
|
+
}, null, 40, j),
|
|
78
|
+
R(a.$slots, "trigger", {
|
|
79
|
+
trigger: o,
|
|
80
|
+
isDragging: !1,
|
|
81
|
+
isLoading: l.loading || i(e).isProcessing.value,
|
|
82
|
+
files: i(e).displayFiles.value
|
|
83
|
+
}, () => [
|
|
84
|
+
l.variant === "input" ? (u(), F(U, {
|
|
85
|
+
key: 0,
|
|
86
|
+
"display-files": i(e).displayFiles.value,
|
|
87
|
+
"first-display-file": i(e).firstDisplayFile.value,
|
|
88
|
+
"has-value": i(e).hasValue.value,
|
|
89
|
+
"multi-select": l.multiSelect,
|
|
90
|
+
loading: l.loading,
|
|
91
|
+
"is-processing": i(e).isProcessing.value,
|
|
92
|
+
disabled: l.disabled,
|
|
93
|
+
"display-placeholder": m.value,
|
|
94
|
+
"accepted-file-summary": i(e).acceptedFileSummary.value,
|
|
95
|
+
size: l.size,
|
|
96
|
+
rounded: l.rounded,
|
|
97
|
+
"get-preview-src": i(e).getPreviewSrc,
|
|
98
|
+
"data-testid": v.value,
|
|
99
|
+
"trigger-aria-label": z.value || m.value,
|
|
100
|
+
"on-trigger": o,
|
|
101
|
+
"on-clear": i(e).clearAll
|
|
102
|
+
}, null, 8, ["display-files", "first-display-file", "has-value", "multi-select", "loading", "is-processing", "disabled", "display-placeholder", "accepted-file-summary", "size", "rounded", "get-preview-src", "data-testid", "trigger-aria-label", "on-clear"])) : (u(), F(M, {
|
|
103
|
+
key: 1,
|
|
104
|
+
"display-files": i(e).displayFiles.value,
|
|
105
|
+
"has-value": i(e).hasValue.value,
|
|
106
|
+
"multi-select": l.multiSelect,
|
|
107
|
+
"max-files": l.maxFiles,
|
|
108
|
+
loading: l.loading,
|
|
109
|
+
"is-processing": i(e).isProcessing.value,
|
|
110
|
+
disabled: l.disabled,
|
|
111
|
+
"allow-rename": l.allowRename,
|
|
112
|
+
"file-types": l.fileTypes,
|
|
113
|
+
"display-text": b.value,
|
|
114
|
+
"drag-and-drop-label": x.value,
|
|
115
|
+
"enter-file-name-label": S.value,
|
|
116
|
+
"rename-file-label": P.value,
|
|
117
|
+
"add-more-label": w.value,
|
|
118
|
+
"data-testid": v.value,
|
|
119
|
+
"get-preview-src": i(e).getPreviewSrc,
|
|
120
|
+
"on-trigger": o,
|
|
121
|
+
"on-remove": i(e).removeFile,
|
|
122
|
+
"on-rename": i(e).handleFileNameChange,
|
|
123
|
+
"on-drop": i(e).processFiles
|
|
124
|
+
}, null, 8, ["display-files", "has-value", "multi-select", "max-files", "loading", "is-processing", "disabled", "allow-rename", "file-types", "display-text", "drag-and-drop-label", "enter-file-name-label", "rename-file-label", "add-more-label", "data-testid", "get-preview-src", "on-remove", "on-rename", "on-drop"]))
|
|
125
|
+
])
|
|
126
|
+
], 2));
|
|
127
|
+
}
|
|
128
|
+
});
|
|
129
|
+
export {
|
|
130
|
+
O as default
|
|
131
|
+
};
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Public type for a single file value managed by FilePicker.
|
|
3
|
+
*
|
|
4
|
+
* Mirrors the original FilePicker.vue `FilePickerValue` interface exactly
|
|
5
|
+
* so the public API is preserved. Importing consumers (Form, useFileUpload,
|
|
6
|
+
* the GraphQL transform pipeline) continue to work without changes.
|
|
7
|
+
*/
|
|
8
|
+
export interface FilePickerValue {
|
|
9
|
+
fileName: string;
|
|
10
|
+
fileType: string;
|
|
11
|
+
fileSize: number;
|
|
12
|
+
file: File | null;
|
|
13
|
+
base64: string;
|
|
14
|
+
isUrl?: boolean;
|
|
15
|
+
}
|
|
16
|
+
/** Single file or array (for multiSelect). Null when no file is set. */
|
|
17
|
+
export type FilePickerModelValue = FilePickerValue | FilePickerValue[] | null;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { FilePickerValue } from './types';
|
|
2
|
+
/**
|
|
3
|
+
* Human-readable file size. Returns empty string for 0 / unknown so the
|
|
4
|
+
* caller can hide the meta line when not applicable.
|
|
5
|
+
*/
|
|
6
|
+
export declare const formatFileSize: (bytes: number) => string;
|
|
7
|
+
/** Lowercased file extension, or empty string if none. */
|
|
8
|
+
export declare const getFileExtension: (fileName?: string) => string;
|
|
9
|
+
/** Whether the file should render an `<img>` preview rather than an icon. */
|
|
10
|
+
export declare const isImageFile: (file: FilePickerValue) => boolean;
|
|
11
|
+
/**
|
|
12
|
+
* Lucide icon name for a given file based on its mime / extension.
|
|
13
|
+
* Falls back to a generic file icon.
|
|
14
|
+
*/
|
|
15
|
+
export declare const getFileIcon: (file: FilePickerValue) => string;
|
|
16
|
+
/** Read a File as a base64 data URL via FileReader. */
|
|
17
|
+
export declare const readFileAsBase64: (file: File) => Promise<string>;
|
|
18
|
+
/**
|
|
19
|
+
* Normalize a model value (which may be a URL string for pre-existing files)
|
|
20
|
+
* into a `FilePickerValue` for display purposes. URLs are split to extract
|
|
21
|
+
* the file name; real objects are passed through unchanged.
|
|
22
|
+
*/
|
|
23
|
+
export declare const normalizeForDisplay: (val: any, unknownFallback: string) => FilePickerValue;
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
const l = (e) => {
|
|
2
|
+
if (!e) return "";
|
|
3
|
+
const i = 1024, t = ["Bytes", "KB", "MB", "GB", "TB"], s = Math.floor(Math.log(e) / Math.log(i));
|
|
4
|
+
return parseFloat((e / Math.pow(i, s)).toFixed(2)) + " " + t[s];
|
|
5
|
+
}, n = (e = "") => e.split("?")[0].split("#")[0].split(".").pop()?.toLowerCase() || "", o = (e) => {
|
|
6
|
+
const i = e.fileType || "", t = n(e.fileName || e.base64 || "");
|
|
7
|
+
return i.startsWith("image/") || e.base64?.startsWith("data:image/") || ["apng", "avif", "gif", "jpg", "jpeg", "png", "svg", "webp"].includes(t);
|
|
8
|
+
}, a = (e) => {
|
|
9
|
+
const i = e.fileType || "", t = n(e.fileName || e.base64 || "");
|
|
10
|
+
return o(e) ? "lucide:image" : i.includes("pdf") || t === "pdf" || i.includes("word") || i.includes("document") || ["doc", "docx", "odt", "rtf"].includes(t) ? "lucide:file-text" : i.includes("spreadsheet") || i.includes("excel") || ["csv", "xls", "xlsx", "ods"].includes(t) ? "lucide:table" : i.includes("presentation") || ["ppt", "pptx", "odp", "key"].includes(t) ? "lucide:presentation" : i.startsWith("video/") || ["mp4", "mov", "webm", "avi", "mkv"].includes(t) ? "lucide:file-video" : i.startsWith("audio/") || ["mp3", "wav", "ogg", "m4a"].includes(t) ? "lucide:file-audio" : ["zip", "rar", "7z", "tar", "gz"].includes(t) ? "lucide:file-archive" : ["js", "ts", "vue", "html", "css", "json", "xml"].includes(t) ? "lucide:file-code" : "lucide:file";
|
|
11
|
+
}, d = (e) => new Promise((i, t) => {
|
|
12
|
+
const s = new FileReader();
|
|
13
|
+
s.readAsDataURL(e), s.onload = () => {
|
|
14
|
+
typeof s.result == "string" ? i(s.result) : t(new Error("Failed to read file as base64"));
|
|
15
|
+
}, s.onerror = (r) => t(r);
|
|
16
|
+
}), u = (e, i) => {
|
|
17
|
+
if (typeof e == "string") {
|
|
18
|
+
const t = e.split("/").pop() || i;
|
|
19
|
+
return {
|
|
20
|
+
fileName: decodeURIComponent(t),
|
|
21
|
+
fileType: "unknown",
|
|
22
|
+
fileSize: 0,
|
|
23
|
+
file: null,
|
|
24
|
+
base64: e,
|
|
25
|
+
isUrl: !0
|
|
26
|
+
};
|
|
27
|
+
}
|
|
28
|
+
return e;
|
|
29
|
+
};
|
|
30
|
+
export {
|
|
31
|
+
l as formatFileSize,
|
|
32
|
+
n as getFileExtension,
|
|
33
|
+
a as getFileIcon,
|
|
34
|
+
o as isImageFile,
|
|
35
|
+
u as normalizeForDisplay,
|
|
36
|
+
d as readFileAsBase64
|
|
37
|
+
};
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { InputVariant, InputSize, InputRounded } from '../../types';
|
|
2
|
+
import { IForm, IFormFieldChangePayload } from './types';
|
|
3
|
+
import { CustomFieldRow, RowHelpers } from './rowHelpers';
|
|
4
|
+
interface Props {
|
|
5
|
+
rows: CustomFieldRow[];
|
|
6
|
+
schema: IForm[];
|
|
7
|
+
draggable: boolean;
|
|
8
|
+
disabled: boolean;
|
|
9
|
+
readonly: boolean;
|
|
10
|
+
isUpdate: boolean;
|
|
11
|
+
variant: InputVariant;
|
|
12
|
+
size: InputSize;
|
|
13
|
+
rounded: InputRounded;
|
|
14
|
+
canRemoveRow: boolean;
|
|
15
|
+
canAddRow: boolean;
|
|
16
|
+
helpers: RowHelpers;
|
|
17
|
+
accordionTitleKey?: string;
|
|
18
|
+
itemName: string;
|
|
19
|
+
emptyTitle: string;
|
|
20
|
+
emptyDescription: string;
|
|
21
|
+
onFieldChange: (rowIndex: number, fieldName: string, payload: IFormFieldChangePayload) => void;
|
|
22
|
+
onRemoveRow: (index: number) => void;
|
|
23
|
+
onDragUpdate: (rows: CustomFieldRow[]) => void;
|
|
24
|
+
}
|
|
25
|
+
declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
|
|
26
|
+
export default _default;
|
|
@@ -0,0 +1,219 @@
|
|
|
1
|
+
import { defineComponent as S, ref as E, watch as j, openBlock as a, createElementBlock as s, createVNode as h, unref as i, withCtx as b, Fragment as k, renderList as U, isMemoSame as K, createBlock as f, resolveDynamicComponent as $, createTextVNode as D, toDisplayString as y, createCommentVNode as o, createElementVNode as u, normalizeClass as w, withModifiers as q } from "vue";
|
|
2
|
+
import { VueDraggable as L } from "vue-draggable-plus";
|
|
3
|
+
import M from "../Accordion/AccordionItem.vue.js";
|
|
4
|
+
import O from "./FormField.vue.js";
|
|
5
|
+
import z from "../Label.vue.js";
|
|
6
|
+
import H from "../Button.vue.js";
|
|
7
|
+
import p from "../Icon.vue.js";
|
|
8
|
+
import { renderLabel as x } from "./rowHelpers.js";
|
|
9
|
+
import { $t as v } from "../../utils/i18n.js";
|
|
10
|
+
const G = { class: "custom-fields-accordion min-w-0 w-full" }, J = ["onClick"], P = { class: "flex items-center flex-1 py-3 px-4 min-w-0" }, Q = { class: "font-medium flex-1 text-left truncate mr-4 min-w-0" }, W = { class: "flex items-center gap-2 flex-none" }, X = {
|
|
11
|
+
key: 0,
|
|
12
|
+
class: "text-destructive flex items-center justify-center rounded-full bg-destructive/10 w-6 h-6"
|
|
13
|
+
}, Y = {
|
|
14
|
+
key: 0,
|
|
15
|
+
class: "grid gap-4 min-w-0"
|
|
16
|
+
}, Z = {
|
|
17
|
+
key: 0,
|
|
18
|
+
class: "text-destructive ml-0.5"
|
|
19
|
+
}, I = {
|
|
20
|
+
key: 0,
|
|
21
|
+
class: "text-destructive ml-0.5"
|
|
22
|
+
}, _ = {
|
|
23
|
+
key: 1,
|
|
24
|
+
class: "mt-1 text-xs text-destructive"
|
|
25
|
+
}, ee = {
|
|
26
|
+
key: 0,
|
|
27
|
+
class: "col-span-1 flex justify-end"
|
|
28
|
+
}, te = {
|
|
29
|
+
key: 0,
|
|
30
|
+
class: "flex flex-col items-center justify-center py-6 text-center border border-border rounded bg-muted/5 mt-2"
|
|
31
|
+
}, le = { class: "text-sm font-medium text-foreground" }, ae = { class: "text-xs text-muted-foreground mt-1" }, he = /* @__PURE__ */ S({
|
|
32
|
+
__name: "AccordionView",
|
|
33
|
+
props: {
|
|
34
|
+
rows: {},
|
|
35
|
+
schema: {},
|
|
36
|
+
draggable: { type: Boolean },
|
|
37
|
+
disabled: { type: Boolean },
|
|
38
|
+
readonly: { type: Boolean },
|
|
39
|
+
isUpdate: { type: Boolean },
|
|
40
|
+
variant: {},
|
|
41
|
+
size: {},
|
|
42
|
+
rounded: {},
|
|
43
|
+
canRemoveRow: { type: Boolean },
|
|
44
|
+
canAddRow: { type: Boolean },
|
|
45
|
+
helpers: {},
|
|
46
|
+
accordionTitleKey: {},
|
|
47
|
+
itemName: {},
|
|
48
|
+
emptyTitle: {},
|
|
49
|
+
emptyDescription: {},
|
|
50
|
+
onFieldChange: { type: Function },
|
|
51
|
+
onRemoveRow: { type: Function },
|
|
52
|
+
onDragUpdate: { type: Function }
|
|
53
|
+
},
|
|
54
|
+
setup(e) {
|
|
55
|
+
const d = e, c = E([]), g = E([]), N = (r) => {
|
|
56
|
+
c.value.includes(r) ? c.value = c.value.filter((n) => n !== r) : (g.value.includes(r) || g.value.push(r), c.value = [...c.value, r]);
|
|
57
|
+
}, C = (r, m) => d.accordionTitleKey && r[d.accordionTitleKey] ? String(r[d.accordionTitleKey]) : `${d.itemName} #${m + 1}`;
|
|
58
|
+
return j(
|
|
59
|
+
() => [d.helpers.errors, d.rows],
|
|
60
|
+
() => {
|
|
61
|
+
const r = d.rows.map((l, F) => d.helpers.hasRowErrors(F) ? l._id : null).filter((l) => l !== null);
|
|
62
|
+
if (r.length === 0) return;
|
|
63
|
+
const m = /* @__PURE__ */ new Set([...c.value, ...r]);
|
|
64
|
+
c.value = Array.from(m);
|
|
65
|
+
const n = /* @__PURE__ */ new Set([...g.value, ...r]);
|
|
66
|
+
g.value = Array.from(n);
|
|
67
|
+
},
|
|
68
|
+
{ deep: !0, immediate: !0 }
|
|
69
|
+
), (r, m) => (a(), s("div", G, [
|
|
70
|
+
h(i(L), {
|
|
71
|
+
"model-value": e.rows,
|
|
72
|
+
"onUpdate:modelValue": e.onDragUpdate,
|
|
73
|
+
disabled: !e.draggable || e.disabled || e.readonly,
|
|
74
|
+
animation: 150,
|
|
75
|
+
handle: ".drag-handle",
|
|
76
|
+
"ghost-class": "opacity-50",
|
|
77
|
+
class: "space-y-2 min-w-0"
|
|
78
|
+
}, {
|
|
79
|
+
default: b(() => [
|
|
80
|
+
(a(!0), s(k, null, U(e.rows, (n, l, F, R) => {
|
|
81
|
+
const V = [
|
|
82
|
+
n,
|
|
83
|
+
e.disabled,
|
|
84
|
+
e.readonly,
|
|
85
|
+
e.isUpdate,
|
|
86
|
+
e.draggable,
|
|
87
|
+
l,
|
|
88
|
+
e.helpers.getRowErrorsHash(l),
|
|
89
|
+
e.helpers.hasRowErrors(l),
|
|
90
|
+
c.value.includes(n._id)
|
|
91
|
+
];
|
|
92
|
+
if (R && R.key === n._id && K(R, V)) return R;
|
|
93
|
+
const B = (a(), f(M, {
|
|
94
|
+
key: n._id,
|
|
95
|
+
item: { id: n._id, title: C(n, l) },
|
|
96
|
+
"is-open": c.value.includes(n._id),
|
|
97
|
+
variant: "solid",
|
|
98
|
+
onToggle: N,
|
|
99
|
+
class: "bg-white min-w-0"
|
|
100
|
+
}, {
|
|
101
|
+
trigger: b(({ open: t, toggle: T, triggerClass: A }) => [
|
|
102
|
+
u("div", {
|
|
103
|
+
class: w(["flex items-stretch w-full min-w-0", [A, "!p-0 overflow-hidden"]]),
|
|
104
|
+
onClick: T
|
|
105
|
+
}, [
|
|
106
|
+
e.draggable && !e.disabled && !e.readonly ? (a(), s("div", {
|
|
107
|
+
key: 0,
|
|
108
|
+
class: w([
|
|
109
|
+
"w-12 flex-none flex items-center justify-center border-r border-border bg-muted/5 drag-handle transition-colors",
|
|
110
|
+
e.disabled ? "cursor-not-allowed opacity-50" : "cursor-grab active:cursor-grabbing hover:bg-muted/10 text-muted-foreground hover:text-foreground"
|
|
111
|
+
]),
|
|
112
|
+
onClick: m[0] || (m[0] = q(() => {
|
|
113
|
+
}, ["stop"]))
|
|
114
|
+
}, [
|
|
115
|
+
h(p, {
|
|
116
|
+
icon: "lucide:grip-vertical",
|
|
117
|
+
class: "w-4 h-4"
|
|
118
|
+
})
|
|
119
|
+
], 2)) : o("", !0),
|
|
120
|
+
u("div", P, [
|
|
121
|
+
u("span", Q, y(C(n, l)), 1),
|
|
122
|
+
u("div", W, [
|
|
123
|
+
e.helpers.hasRowErrors(l) ? (a(), s("div", X, [
|
|
124
|
+
h(p, {
|
|
125
|
+
icon: "lucide:alert-circle",
|
|
126
|
+
class: "w-4 h-4"
|
|
127
|
+
})
|
|
128
|
+
])) : o("", !0),
|
|
129
|
+
h(p, {
|
|
130
|
+
icon: "lucide:chevron-down",
|
|
131
|
+
class: w(["w-4 h-4 transition-transform duration-200", { "rotate-180": t }])
|
|
132
|
+
}, null, 8, ["class"])
|
|
133
|
+
])
|
|
134
|
+
])
|
|
135
|
+
], 10, J)
|
|
136
|
+
]),
|
|
137
|
+
content: b(() => [
|
|
138
|
+
g.value.includes(n._id) ? (a(), s("div", Y, [
|
|
139
|
+
(a(!0), s(k, null, U(e.schema, (t) => (a(), s("div", {
|
|
140
|
+
key: t.name,
|
|
141
|
+
class: "col-span-1 flex flex-col min-w-0"
|
|
142
|
+
}, [
|
|
143
|
+
e.helpers.isFieldVisible(l, t) ? (a(), s(k, { key: 0 }, [
|
|
144
|
+
(t.label || t.labelI18n) && e.helpers.getResolvedType(t, l) !== "switch" && e.helpers.getResolvedType(t, l) !== "check" && e.helpers.getResolvedType(t, l) !== "customFields" && e.helpers.getResolvedType(t, l) !== "choiceBox" ? (a(), f(z, {
|
|
145
|
+
key: 0,
|
|
146
|
+
class: "mb-2 block text-sm font-medium"
|
|
147
|
+
}, {
|
|
148
|
+
default: b(() => [
|
|
149
|
+
typeof i(x)(t.labelI18n ? i(v)(t.labelI18n) : t.label) != "string" ? (a(), f($(i(x)(t.labelI18n ? i(v)(t.labelI18n) : t.label)), { key: 0 })) : (a(), s(k, { key: 1 }, [
|
|
150
|
+
D(y(t.labelI18n ? i(v)(t.labelI18n) : t.label) + " ", 1),
|
|
151
|
+
t.required ? (a(), s("span", Z, "*")) : o("", !0)
|
|
152
|
+
], 64))
|
|
153
|
+
]),
|
|
154
|
+
_: 2
|
|
155
|
+
}, 1024)) : o("", !0),
|
|
156
|
+
u("div", {
|
|
157
|
+
class: w(["relative min-w-0", [
|
|
158
|
+
e.helpers.getResolvedType(t, l) === "check" || e.helpers.getResolvedType(t, l) === "switch" && t.props?.switchVariant === "basic" ? "w-auto flex items-center" : "w-full"
|
|
159
|
+
]])
|
|
160
|
+
}, [
|
|
161
|
+
h(O, {
|
|
162
|
+
field: { ...t, props: { ...t.props || {} } },
|
|
163
|
+
value: e.helpers.getFieldValue(l, t.name),
|
|
164
|
+
values: n,
|
|
165
|
+
errors: e.helpers.errors,
|
|
166
|
+
error: e.helpers.getFieldError(l, t.name),
|
|
167
|
+
variant: e.variant,
|
|
168
|
+
size: e.size,
|
|
169
|
+
rounded: e.rounded,
|
|
170
|
+
disabled: e.disabled || e.helpers.isFieldDisabled(l, t),
|
|
171
|
+
readonly: e.readonly || e.helpers.isFieldReadonly(l, t),
|
|
172
|
+
isUpdate: e.isUpdate,
|
|
173
|
+
onChange: (T) => e.onFieldChange(l, t.name, T)
|
|
174
|
+
}, null, 8, ["field", "value", "values", "errors", "error", "variant", "size", "rounded", "disabled", "readonly", "isUpdate", "onChange"]),
|
|
175
|
+
e.helpers.getResolvedType(t, l) === "check" || e.helpers.getResolvedType(t, l) === "switch" && t.props?.switchVariant === "basic" ? (a(), f(z, {
|
|
176
|
+
key: 0,
|
|
177
|
+
class: "ml-2 text-sm font-medium cursor-pointer"
|
|
178
|
+
}, {
|
|
179
|
+
default: b(() => [
|
|
180
|
+
typeof i(x)(t.labelI18n ? i(v)(t.labelI18n) : t.label) != "string" ? (a(), f($(i(x)(t.labelI18n ? i(v)(t.labelI18n) : t.label)), { key: 0 })) : (a(), s(k, { key: 1 }, [
|
|
181
|
+
D(y(t.labelI18n ? i(v)(t.labelI18n) : t.label) + " ", 1),
|
|
182
|
+
t.required ? (a(), s("span", I, "*")) : o("", !0)
|
|
183
|
+
], 64))
|
|
184
|
+
]),
|
|
185
|
+
_: 2
|
|
186
|
+
}, 1024)) : o("", !0)
|
|
187
|
+
], 2),
|
|
188
|
+
e.helpers.getFieldError(l, t.name) ? (a(), s("p", _, y(e.helpers.getFieldError(l, t.name)), 1)) : o("", !0)
|
|
189
|
+
], 64)) : o("", !0)
|
|
190
|
+
]))), 128)),
|
|
191
|
+
e.canRemoveRow ? (a(), s("div", ee, [
|
|
192
|
+
h(H, {
|
|
193
|
+
type: "button",
|
|
194
|
+
variant: "secondary",
|
|
195
|
+
size: "xs",
|
|
196
|
+
icon: "lucide:trash-2",
|
|
197
|
+
disabled: e.disabled || e.readonly,
|
|
198
|
+
onClick: (t) => e.onRemoveRow(l)
|
|
199
|
+
}, null, 8, ["disabled", "onClick"])
|
|
200
|
+
])) : o("", !0)
|
|
201
|
+
])) : o("", !0)
|
|
202
|
+
]),
|
|
203
|
+
_: 2
|
|
204
|
+
}, 1032, ["item", "is-open"]));
|
|
205
|
+
return B.memo = V, B;
|
|
206
|
+
}, m, 1), 128))
|
|
207
|
+
]),
|
|
208
|
+
_: 1
|
|
209
|
+
}, 8, ["model-value", "onUpdate:modelValue", "disabled"]),
|
|
210
|
+
e.rows.length === 0 ? (a(), s("div", te, [
|
|
211
|
+
u("p", le, y(e.emptyTitle), 1),
|
|
212
|
+
u("p", ae, y(e.emptyDescription), 1)
|
|
213
|
+
])) : o("", !0)
|
|
214
|
+
]));
|
|
215
|
+
}
|
|
216
|
+
});
|
|
217
|
+
export {
|
|
218
|
+
he as default
|
|
219
|
+
};
|
|
@@ -7,7 +7,7 @@ import V from "../Input.vue.js";
|
|
|
7
7
|
/* empty css */
|
|
8
8
|
import W from "../Switch.vue.js";
|
|
9
9
|
import X from "../CheckBox.vue.js";
|
|
10
|
-
import Y from "../FilePicker/
|
|
10
|
+
import Y from "../FilePicker/index.vue.js";
|
|
11
11
|
import Z from "../AvatarUploader/AvatarUploader.vue.js";
|
|
12
12
|
import _ from "../ThumbnailSelector/ThumbnailSelector.vue.js";
|
|
13
13
|
import ee from "../TagInput/TagInput.vue.js";
|
|
@@ -17,7 +17,7 @@ import le from "../DatePicker.vue.js";
|
|
|
17
17
|
import ie from "../DateRangePicker.vue.js";
|
|
18
18
|
import te from "../ColorPicker/ColorPicker.vue.js";
|
|
19
19
|
import re from "../IconPicker.vue.js";
|
|
20
|
-
import ne from "./
|
|
20
|
+
import ne from "./index.vue.js";
|
|
21
21
|
import de from "../ChoiceBox/ChoiceBox.vue.js";
|
|
22
22
|
import oe from "../RichTextEditor/RichTextEditor.vue.js";
|
|
23
23
|
/* empty css */
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import o from "./FormFields.vue2.js";
|
|
2
2
|
/* empty css */
|
|
3
3
|
import r from "../../_virtual/_plugin-vue_export-helper.js";
|
|
4
|
-
const
|
|
4
|
+
const p = /* @__PURE__ */ r(o, [["__scopeId", "data-v-539d8be7"]]);
|
|
5
5
|
export {
|
|
6
|
-
|
|
6
|
+
p as default
|
|
7
7
|
};
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { IForm, IFormFieldChangePayload } from './types';
|
|
2
|
+
import { CustomFieldRow, RowHelpers } from './rowHelpers';
|
|
3
|
+
interface Props {
|
|
4
|
+
row: CustomFieldRow;
|
|
5
|
+
rowIndex: number;
|
|
6
|
+
fields: IForm[];
|
|
7
|
+
draggable: boolean;
|
|
8
|
+
disabled: boolean;
|
|
9
|
+
readonly: boolean;
|
|
10
|
+
isUpdate: boolean;
|
|
11
|
+
showRowNumbers: boolean;
|
|
12
|
+
canRemoveRow: boolean;
|
|
13
|
+
helpers: RowHelpers;
|
|
14
|
+
onFieldChange: (rowIndex: number, fieldName: string, payload: IFormFieldChangePayload) => void;
|
|
15
|
+
onRemoveRow: (index: number) => void;
|
|
16
|
+
}
|
|
17
|
+
declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
18
|
+
export default _default;
|
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
import { defineComponent as x, computed as s, withMemo as h, openBlock as o, createElementBlock as n, normalizeClass as u, createVNode as m, createCommentVNode as l, toDisplayString as y, Fragment as v, renderList as f, createBlock as R, unref as d } from "vue";
|
|
2
|
+
import I from "./FormField.vue.js";
|
|
3
|
+
import C from "../Icon.vue.js";
|
|
4
|
+
import F from "../Button.vue.js";
|
|
5
|
+
import { resolveFieldType as i } from "./utils/form.utils.js";
|
|
6
|
+
const k = {
|
|
7
|
+
key: 1,
|
|
8
|
+
class: "w-10 flex-none flex items-center justify-center text-xs text-muted-foreground border-r border-border bg-muted/20"
|
|
9
|
+
}, B = {
|
|
10
|
+
key: 2,
|
|
11
|
+
class: "w-10 flex-none flex items-center justify-center border-l border-border bg-muted/20"
|
|
12
|
+
}, z = /* @__PURE__ */ x({
|
|
13
|
+
__name: "TableRow",
|
|
14
|
+
props: {
|
|
15
|
+
row: {},
|
|
16
|
+
rowIndex: {},
|
|
17
|
+
fields: {},
|
|
18
|
+
draggable: { type: Boolean },
|
|
19
|
+
disabled: { type: Boolean },
|
|
20
|
+
readonly: { type: Boolean },
|
|
21
|
+
isUpdate: { type: Boolean },
|
|
22
|
+
showRowNumbers: { type: Boolean },
|
|
23
|
+
canRemoveRow: { type: Boolean },
|
|
24
|
+
helpers: {},
|
|
25
|
+
onFieldChange: { type: Function },
|
|
26
|
+
onRemoveRow: { type: Function }
|
|
27
|
+
},
|
|
28
|
+
setup(e) {
|
|
29
|
+
const t = e, c = s(() => t.draggable && !t.disabled && !t.readonly), w = s(() => t.helpers.getRowErrorsHash(t.rowIndex));
|
|
30
|
+
return (U, a) => h([e.row, e.disabled, e.readonly, e.isUpdate, e.showRowNumbers, e.canRemoveRow, e.draggable, e.rowIndex, w.value], () => (o(), n("div", { class: "flex group bg-white transition-colors min-w-0" }, [
|
|
31
|
+
c.value ? (o(), n("div", {
|
|
32
|
+
key: 0,
|
|
33
|
+
class: u([
|
|
34
|
+
"w-10 flex-none flex items-center justify-center border-r border-border bg-muted/5 drag-handle transition-colors",
|
|
35
|
+
e.disabled ? "cursor-not-allowed opacity-50" : "cursor-grab active:cursor-grabbing hover:bg-muted/10 text-muted-foreground hover:text-foreground"
|
|
36
|
+
])
|
|
37
|
+
}, [
|
|
38
|
+
m(C, {
|
|
39
|
+
icon: "lucide:grip-vertical",
|
|
40
|
+
class: "w-4 h-4"
|
|
41
|
+
})
|
|
42
|
+
], 2)) : l("", !0),
|
|
43
|
+
e.showRowNumbers ? (o(), n("div", k, y(e.rowIndex + 1), 1)) : l("", !0),
|
|
44
|
+
(o(!0), n(v, null, f(e.fields, (r, b) => (o(), n("div", {
|
|
45
|
+
key: r.name,
|
|
46
|
+
class: u(["flex-1 min-w-0 relative", { "border-l border-border": b > 0 }])
|
|
47
|
+
}, [
|
|
48
|
+
e.helpers.isFieldVisible(e.rowIndex, r) ? (o(), R(I, {
|
|
49
|
+
key: 0,
|
|
50
|
+
field: {
|
|
51
|
+
...r,
|
|
52
|
+
props: {
|
|
53
|
+
...d(i)(r, e.helpers.getRowContext(e.rowIndex)) === "multiSelect" ? { showControls: !1, wrap: !1 } : {},
|
|
54
|
+
...r.props || {},
|
|
55
|
+
...d(i)(r, e.helpers.getRowContext(e.rowIndex)) === "file" || d(i)(r, e.helpers.getRowContext(e.rowIndex)) === "fileUploader" ? { variant: "input" } : {}
|
|
56
|
+
},
|
|
57
|
+
label: void 0
|
|
58
|
+
},
|
|
59
|
+
value: e.helpers.getFieldValue(e.rowIndex, r.name),
|
|
60
|
+
values: e.row,
|
|
61
|
+
errors: e.helpers.errors,
|
|
62
|
+
error: e.helpers.getFieldError(e.rowIndex, r.name),
|
|
63
|
+
variant: "transparent",
|
|
64
|
+
size: "sm",
|
|
65
|
+
rounded: "none",
|
|
66
|
+
disabled: e.disabled || e.helpers.isFieldDisabled(e.rowIndex, r),
|
|
67
|
+
readonly: e.readonly || e.helpers.isFieldReadonly(e.rowIndex, r),
|
|
68
|
+
isUpdate: e.isUpdate,
|
|
69
|
+
class: "w-full h-full min-h-[40px]",
|
|
70
|
+
onChange: (g) => e.onFieldChange(e.rowIndex, r.name, g)
|
|
71
|
+
}, null, 8, ["field", "value", "values", "errors", "error", "disabled", "readonly", "isUpdate", "onChange"])) : l("", !0)
|
|
72
|
+
], 2))), 128)),
|
|
73
|
+
e.canRemoveRow ? (o(), n("div", B, [
|
|
74
|
+
m(F, {
|
|
75
|
+
type: "button",
|
|
76
|
+
variant: "ghost",
|
|
77
|
+
size: "xs",
|
|
78
|
+
icon: "lucide:trash-2",
|
|
79
|
+
disabled: e.disabled || e.readonly,
|
|
80
|
+
onClick: a[0] || (a[0] = (r) => e.onRemoveRow(e.rowIndex))
|
|
81
|
+
}, null, 8, ["disabled"])
|
|
82
|
+
])) : l("", !0)
|
|
83
|
+
])), a, 1);
|
|
84
|
+
}
|
|
85
|
+
});
|
|
86
|
+
export {
|
|
87
|
+
z as default
|
|
88
|
+
};
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { IForm, IFormFieldChangePayload } from './types';
|
|
2
|
+
import { CustomFieldRow, RowHelpers } from './rowHelpers';
|
|
3
|
+
interface Props {
|
|
4
|
+
rows: CustomFieldRow[];
|
|
5
|
+
schema: IForm[];
|
|
6
|
+
columnHeaders: string[];
|
|
7
|
+
visibleSchemaFields: IForm[];
|
|
8
|
+
draggable: boolean;
|
|
9
|
+
disabled: boolean;
|
|
10
|
+
readonly: boolean;
|
|
11
|
+
isUpdate: boolean;
|
|
12
|
+
showRowNumbers: boolean;
|
|
13
|
+
canRemoveRow: boolean;
|
|
14
|
+
canAddRow: boolean;
|
|
15
|
+
helpers: RowHelpers;
|
|
16
|
+
emptyTitle: string;
|
|
17
|
+
emptyDescription: string;
|
|
18
|
+
onFieldChange: (rowIndex: number, fieldName: string, payload: IFormFieldChangePayload) => void;
|
|
19
|
+
onRemoveRow: (index: number) => void;
|
|
20
|
+
onDragUpdate: (rows: CustomFieldRow[]) => void;
|
|
21
|
+
}
|
|
22
|
+
declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
23
|
+
export default _default;
|