@stubber/form-fields 1.4.6 → 1.5.0
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/README.md +61 -295
- package/dist/fields2/FieldLabel.svelte +8 -0
- package/dist/fields2/FieldLabel.svelte.d.ts +20 -0
- package/dist/fields2/FieldMessage.svelte +16 -0
- package/dist/fields2/FieldMessage.svelte.d.ts +20 -0
- package/dist/fields2/Form.svelte +29 -0
- package/dist/fields2/Form.svelte.d.ts +23 -0
- package/dist/fields2/fileserver.d.ts +15 -0
- package/dist/fields2/fileserver.js +52 -0
- package/dist/fields2/form-field.svelte +10 -0
- package/dist/fields2/form-field.svelte.d.ts +20 -0
- package/dist/fields2/interfaces.d.ts +207 -0
- package/dist/fields2/interfaces.js +82 -0
- package/dist/fields2/sub/array-builder-field.svelte +110 -0
- package/dist/fields2/sub/array-builder-field.svelte.d.ts +27 -0
- package/dist/fields2/sub/checkbox-autocomplete.svelte +56 -0
- package/dist/fields2/sub/checkbox-autocomplete.svelte.d.ts +27 -0
- package/dist/fields2/sub/checkbox-field.svelte +41 -0
- package/dist/fields2/sub/checkbox-field.svelte.d.ts +28 -0
- package/dist/fields2/sub/code-field.svelte +146 -0
- package/dist/fields2/sub/code-field.svelte.d.ts +27 -0
- package/dist/fields2/sub/contact-selector-field.svelte +84 -0
- package/dist/fields2/sub/contact-selector-field.svelte.d.ts +30 -0
- package/dist/fields2/sub/currency-field.svelte +197 -0
- package/dist/fields2/sub/currency-field.svelte.d.ts +29 -0
- package/dist/fields2/sub/data-indication-field.svelte +19 -0
- package/dist/fields2/sub/data-indication-field.svelte.d.ts +23 -0
- package/dist/fields2/sub/date-field.svelte +31 -0
- package/dist/fields2/sub/date-field.svelte.d.ts +23 -0
- package/dist/fields2/sub/date-time-field.svelte +31 -0
- package/dist/fields2/sub/date-time-field.svelte.d.ts +23 -0
- package/dist/fields2/sub/email-field.svelte +40 -0
- package/dist/fields2/sub/email-field.svelte.d.ts +23 -0
- package/dist/fields2/sub/field-builder-field.svelte +525 -0
- package/dist/fields2/sub/field-builder-field.svelte.d.ts +23 -0
- package/dist/fields2/sub/file-field.svelte +150 -0
- package/dist/fields2/sub/file-field.svelte.d.ts +27 -0
- package/dist/fields2/sub/grid-field.svelte +54 -0
- package/dist/fields2/sub/grid-field.svelte.d.ts +30 -0
- package/dist/fields2/sub/heading-field.svelte +28 -0
- package/dist/fields2/sub/heading-field.svelte.d.ts +28 -0
- package/dist/fields2/sub/hidden-field.svelte +142 -0
- package/dist/fields2/sub/hidden-field.svelte.d.ts +37 -0
- package/dist/fields2/sub/hidden-location-field.svelte +23 -0
- package/dist/fields2/sub/hidden-location-field.svelte.d.ts +23 -0
- package/dist/fields2/sub/html-field.svelte +22 -0
- package/dist/fields2/sub/html-field.svelte.d.ts +27 -0
- package/dist/fields2/sub/json-editor-bound.svelte +17 -0
- package/dist/fields2/sub/json-editor-bound.svelte.d.ts +65 -0
- package/dist/fields2/sub/jsoneditor-field.svelte +23 -0
- package/dist/fields2/sub/jsoneditor-field.svelte.d.ts +27 -0
- package/dist/fields2/sub/map-field.svelte +144 -0
- package/dist/fields2/sub/map-field.svelte.d.ts +28 -0
- package/dist/fields2/sub/multi-checkbox-field.svelte +83 -0
- package/dist/fields2/sub/multi-checkbox-field.svelte.d.ts +34 -0
- package/dist/fields2/sub/multistep-field.svelte +70 -0
- package/dist/fields2/sub/multistep-field.svelte.d.ts +24 -0
- package/dist/fields2/sub/note-field.svelte +18 -0
- package/dist/fields2/sub/note-field.svelte.d.ts +23 -0
- package/dist/fields2/sub/number-field.svelte +77 -0
- package/dist/fields2/sub/number-field.svelte.d.ts +29 -0
- package/dist/fields2/sub/object-builder-field.svelte +123 -0
- package/dist/fields2/sub/object-builder-field.svelte.d.ts +28 -0
- package/dist/fields2/sub/qr-code-scanner-field.svelte +86 -0
- package/dist/fields2/sub/qr-code-scanner-field.svelte.d.ts +23 -0
- package/dist/fields2/sub/radio-field.svelte +69 -0
- package/dist/fields2/sub/radio-field.svelte.d.ts +30 -0
- package/dist/fields2/sub/screenrecorder-field.svelte +182 -0
- package/dist/fields2/sub/screenrecorder-field.svelte.d.ts +27 -0
- package/dist/fields2/sub/screenshot-field.svelte +165 -0
- package/dist/fields2/sub/screenshot-field.svelte.d.ts +26 -0
- package/dist/fields2/sub/scroll-and-read-display-field.svelte +92 -0
- package/dist/fields2/sub/scroll-and-read-display-field.svelte.d.ts +29 -0
- package/dist/fields2/sub/section-field.svelte +27 -0
- package/dist/fields2/sub/section-field.svelte.d.ts +26 -0
- package/dist/fields2/sub/select-field.svelte +138 -0
- package/dist/fields2/sub/select-field.svelte.d.ts +34 -0
- package/dist/fields2/sub/selectresource-field.svelte +69 -0
- package/dist/fields2/sub/selectresource-field.svelte.d.ts +29 -0
- package/dist/fields2/sub/signature-field.svelte +84 -0
- package/dist/fields2/sub/signature-field.svelte.d.ts +23 -0
- package/dist/fields2/sub/slider-field.svelte +28 -0
- package/dist/fields2/sub/slider-field.svelte.d.ts +28 -0
- package/dist/fields2/sub/smart-text-field.svelte +245 -0
- package/dist/fields2/sub/smart-text-field.svelte.d.ts +36 -0
- package/dist/fields2/sub/telephone-field.svelte +68 -0
- package/dist/fields2/sub/telephone-field.svelte.d.ts +26 -0
- package/dist/fields2/sub/text-field.svelte +46 -0
- package/dist/fields2/sub/text-field.svelte.d.ts +27 -0
- package/dist/fields2/sub/voicenote-field.svelte +161 -0
- package/dist/fields2/sub/voicenote-field.svelte.d.ts +26 -0
- package/dist/fields2/utils.d.ts +9 -0
- package/dist/fields2/utils.js +116 -0
- package/dist/fields2/validations/validate_field.d.ts +11 -0
- package/dist/fields2/validations/validate_field.js +121 -0
- package/package.json +6 -9
|
@@ -0,0 +1,207 @@
|
|
|
1
|
+
import type { Socket } from "socket.io-client";
|
|
2
|
+
import type { Writable } from "svelte/store";
|
|
3
|
+
import type { UploadedFile } from "./fileserver";
|
|
4
|
+
import type { IGridField } from "./sub/grid-field.svelte";
|
|
5
|
+
import GridField from "./sub/grid-field.svelte";
|
|
6
|
+
import type { IArrayBuilderField } from "./sub/array-builder-field.svelte";
|
|
7
|
+
import ArrayBuilderField from "./sub/array-builder-field.svelte";
|
|
8
|
+
import type { ICheckboxAutocompleteField } from "./sub/checkbox-autocomplete.svelte";
|
|
9
|
+
import CheckboxAutocomplete from "./sub/checkbox-autocomplete.svelte";
|
|
10
|
+
import type { ICheckboxField } from "./sub/checkbox-field.svelte";
|
|
11
|
+
import CheckboxField from "./sub/checkbox-field.svelte";
|
|
12
|
+
import type { IContactSelectorField } from "./sub/contact-selector-field.svelte";
|
|
13
|
+
import ContactSelectorField from "./sub/contact-selector-field.svelte";
|
|
14
|
+
import type { ICurrencyField } from "./sub/currency-field.svelte";
|
|
15
|
+
import CurrencyField from "./sub/currency-field.svelte";
|
|
16
|
+
import DataIndicationField, { type IDataIndicationField } from "./sub/data-indication-field.svelte";
|
|
17
|
+
import type { IDateField } from "./sub/date-field.svelte";
|
|
18
|
+
import DateField from "./sub/date-field.svelte";
|
|
19
|
+
import type { IDateTimeField } from "./sub/date-time-field.svelte";
|
|
20
|
+
import DateTimeField from "./sub/date-time-field.svelte";
|
|
21
|
+
import type { IEmailField } from "./sub/email-field.svelte";
|
|
22
|
+
import EmailField from "./sub/email-field.svelte";
|
|
23
|
+
import FieldBuilderField, { type IFieldBuilderField } from "./sub/field-builder-field.svelte";
|
|
24
|
+
import FileField, { type IFileField } from "./sub/file-field.svelte";
|
|
25
|
+
import HeadingField, { type IHeadingField } from "./sub/heading-field.svelte";
|
|
26
|
+
import HiddenField, { type IHiddenField } from "./sub/hidden-field.svelte";
|
|
27
|
+
import type { IHiddenLocationField } from "./sub/hidden-location-field.svelte";
|
|
28
|
+
import HiddenLocationField from "./sub/hidden-location-field.svelte";
|
|
29
|
+
import HtmlField, { type IHTMLField } from "./sub/html-field.svelte";
|
|
30
|
+
import JSONEditorField, { type IJSONEditorField } from "./sub/jsoneditor-field.svelte";
|
|
31
|
+
import type { IMapField } from "./sub/map-field.svelte";
|
|
32
|
+
import MapField from "./sub/map-field.svelte";
|
|
33
|
+
import type { INumberField } from "./sub/number-field.svelte";
|
|
34
|
+
import NumberField from "./sub/number-field.svelte";
|
|
35
|
+
import type { ISectionField } from "./sub/section-field.svelte";
|
|
36
|
+
import SectionField from "./sub/section-field.svelte";
|
|
37
|
+
import type { ISelectField } from "./sub/select-field.svelte";
|
|
38
|
+
import SelectField from "./sub/select-field.svelte";
|
|
39
|
+
import type { ISliderField } from "./sub/slider-field.svelte";
|
|
40
|
+
import SliderField from "./sub/slider-field.svelte";
|
|
41
|
+
import type { ITextField } from "./sub/text-field.svelte";
|
|
42
|
+
import TextField from "./sub/text-field.svelte";
|
|
43
|
+
import type { ITelephoneField } from "./sub/telephone-field.svelte";
|
|
44
|
+
import TelephoneField from "./sub/telephone-field.svelte";
|
|
45
|
+
import NoteField, { type INoteField } from "./sub/note-field.svelte";
|
|
46
|
+
import type { IMultistepField } from "./sub/multistep-field.svelte";
|
|
47
|
+
import MultistepField from "./sub/multistep-field.svelte";
|
|
48
|
+
import ObjectBuilderField, { type IObjectBuilderField } from "./sub/object-builder-field.svelte";
|
|
49
|
+
import type { IRadioField } from "./sub/radio-field.svelte";
|
|
50
|
+
import RadioField from "./sub/radio-field.svelte";
|
|
51
|
+
import type { IMultiCheckboxField } from "./sub/multi-checkbox-field.svelte";
|
|
52
|
+
import MultiCheckboxField from "./sub/multi-checkbox-field.svelte";
|
|
53
|
+
import QrCodeScannerField, { type IQRCodeScannerField } from "./sub/qr-code-scanner-field.svelte";
|
|
54
|
+
import ScrollAndReadDisplayField, { type IScrollAndReadDisplayField } from "./sub/scroll-and-read-display-field.svelte";
|
|
55
|
+
import type { IVoicenoteField } from "./sub/voicenote-field.svelte";
|
|
56
|
+
import VoicenoteField from "./sub/voicenote-field.svelte";
|
|
57
|
+
import SignatureField, { type ISignatureField } from "./sub/signature-field.svelte";
|
|
58
|
+
import type { ISmartTextField } from "./sub/smart-text-field.svelte";
|
|
59
|
+
import SmartTextField from "./sub/smart-text-field.svelte";
|
|
60
|
+
import type { IScreenshotField } from "./sub/screenshot-field.svelte";
|
|
61
|
+
import ScreenshotField from "./sub/screenshot-field.svelte";
|
|
62
|
+
import CodeField from "./sub/code-field.svelte";
|
|
63
|
+
import type { ICodeField } from "./sub/code-field.svelte";
|
|
64
|
+
import type { IScreenRecorderField } from "./sub/screenrecorder-field.svelte";
|
|
65
|
+
import ScreenrecorderField from "./sub/screenrecorder-field.svelte";
|
|
66
|
+
import SelectresourceField, { type ISelectResourceField } from "./sub/selectresource-field.svelte";
|
|
67
|
+
export interface IBaseField<TParams> {
|
|
68
|
+
__key?: string;
|
|
69
|
+
name?: string;
|
|
70
|
+
title?: string;
|
|
71
|
+
hide_label?: boolean;
|
|
72
|
+
help?: string;
|
|
73
|
+
details?: {
|
|
74
|
+
keyname?: string;
|
|
75
|
+
datapath?: string;
|
|
76
|
+
};
|
|
77
|
+
validations?: Validation[];
|
|
78
|
+
conditions?: string[];
|
|
79
|
+
initvalue?: {
|
|
80
|
+
has_default?: boolean;
|
|
81
|
+
default?: any;
|
|
82
|
+
has_override?: boolean;
|
|
83
|
+
override?: any;
|
|
84
|
+
};
|
|
85
|
+
without_value_details?: boolean;
|
|
86
|
+
params?: TParams;
|
|
87
|
+
}
|
|
88
|
+
export type IField = ITextField | INoteField | INumberField | ICheckboxField | ICheckboxAutocompleteField | ISectionField | IMultistepField | IArrayBuilderField | IGridField | ISelectField | ISelectResourceField | IContactSelectorField | ICurrencyField | IDataIndicationField | IDateField | IDateTimeField | IEmailField | ISliderField | IFieldBuilderField | IJSONEditorField | IFileField | IHeadingField | IHiddenField | IHiddenLocationField | IHTMLField | IMapField | ITelephoneField | IObjectBuilderField | IRadioField | IMultiCheckboxField | IQRCodeScannerField | IScrollAndReadDisplayField | IVoicenoteField | ISignatureField | ISmartTextField | IScreenshotField | IScreenRecorderField | ICodeField;
|
|
89
|
+
export type FieldType = IField["fieldtype"];
|
|
90
|
+
export declare const fields: {
|
|
91
|
+
text: typeof TextField;
|
|
92
|
+
number: typeof NumberField;
|
|
93
|
+
section: typeof SectionField;
|
|
94
|
+
checkbox: typeof CheckboxField;
|
|
95
|
+
checkbox_autocomplete: typeof CheckboxAutocomplete;
|
|
96
|
+
arraybuilder: typeof ArrayBuilderField;
|
|
97
|
+
grid: typeof GridField;
|
|
98
|
+
select: typeof SelectField;
|
|
99
|
+
selectresource: typeof SelectresourceField;
|
|
100
|
+
slider: typeof SliderField;
|
|
101
|
+
contactselector: typeof ContactSelectorField;
|
|
102
|
+
currency: typeof CurrencyField;
|
|
103
|
+
dataindication: typeof DataIndicationField;
|
|
104
|
+
date: typeof DateField;
|
|
105
|
+
datetime: typeof DateTimeField;
|
|
106
|
+
email: typeof EmailField;
|
|
107
|
+
fieldbuilder: typeof FieldBuilderField;
|
|
108
|
+
jsoneditor: typeof JSONEditorField;
|
|
109
|
+
file: typeof FileField;
|
|
110
|
+
heading: typeof HeadingField;
|
|
111
|
+
hidden: typeof HiddenField;
|
|
112
|
+
hiddenlocation: typeof HiddenLocationField;
|
|
113
|
+
html: typeof HtmlField;
|
|
114
|
+
map: typeof MapField;
|
|
115
|
+
telephone: typeof TelephoneField;
|
|
116
|
+
note: typeof NoteField;
|
|
117
|
+
multistep: typeof MultistepField;
|
|
118
|
+
objectbuilder: typeof ObjectBuilderField;
|
|
119
|
+
radio: typeof RadioField;
|
|
120
|
+
multicheckbox: typeof MultiCheckboxField;
|
|
121
|
+
qrcodescanner: typeof QrCodeScannerField;
|
|
122
|
+
scrollandreaddisplay: typeof ScrollAndReadDisplayField;
|
|
123
|
+
voicenote: typeof VoicenoteField;
|
|
124
|
+
signature: typeof SignatureField;
|
|
125
|
+
smart_text: typeof SmartTextField;
|
|
126
|
+
screenshot: typeof ScreenshotField;
|
|
127
|
+
screenrecorder: typeof ScreenrecorderField;
|
|
128
|
+
code: typeof CodeField;
|
|
129
|
+
};
|
|
130
|
+
export interface IFormDependencies {
|
|
131
|
+
file?: {
|
|
132
|
+
upload_url: string;
|
|
133
|
+
};
|
|
134
|
+
map?: {
|
|
135
|
+
mapboxAccessToken: string;
|
|
136
|
+
mapboxStylesheetUrl: string;
|
|
137
|
+
};
|
|
138
|
+
clienthub?: {
|
|
139
|
+
socket: Socket;
|
|
140
|
+
updateAuth: (auth_token: string) => void;
|
|
141
|
+
};
|
|
142
|
+
stubber?: {
|
|
143
|
+
orguuid: string;
|
|
144
|
+
stubref?: string;
|
|
145
|
+
};
|
|
146
|
+
[key: string]: any;
|
|
147
|
+
}
|
|
148
|
+
export interface IInitialForm {
|
|
149
|
+
spec: {
|
|
150
|
+
fields: Record<string, IField>;
|
|
151
|
+
};
|
|
152
|
+
data?: Record<string, any>;
|
|
153
|
+
}
|
|
154
|
+
export type IFieldType = keyof typeof fields;
|
|
155
|
+
export interface IBuiltField<T = {}> {
|
|
156
|
+
id: string;
|
|
157
|
+
formStore: Writable<any>;
|
|
158
|
+
attachmentsStore: Writable<UploadedFile[]>;
|
|
159
|
+
formDependencies?: IFormDependencies;
|
|
160
|
+
fieldtype: IFieldType;
|
|
161
|
+
data_path: string;
|
|
162
|
+
label: string;
|
|
163
|
+
hide_label: boolean;
|
|
164
|
+
help: string | undefined;
|
|
165
|
+
hidden: boolean;
|
|
166
|
+
sub_fields?: Writable<IBuiltField<any>>[];
|
|
167
|
+
validations?: Validation[];
|
|
168
|
+
conditions?: string[];
|
|
169
|
+
errors?: IValidationResult[] | Record<string, IValidationResult[]>;
|
|
170
|
+
without_value_details: boolean;
|
|
171
|
+
min?: number;
|
|
172
|
+
max?: number;
|
|
173
|
+
step?: number;
|
|
174
|
+
get validation_result(): IValidationResult | undefined;
|
|
175
|
+
get value(): any;
|
|
176
|
+
set value(val: any);
|
|
177
|
+
params?: T;
|
|
178
|
+
}
|
|
179
|
+
export declare const component_for: (f: IBuiltField) => typeof TextField | typeof NumberField | typeof SectionField | typeof CheckboxField | typeof CheckboxAutocomplete | typeof ArrayBuilderField | typeof GridField | typeof SelectField | typeof SelectresourceField | typeof SliderField | typeof ContactSelectorField | typeof CurrencyField | typeof DataIndicationField | typeof DateField | typeof DateTimeField | typeof EmailField | typeof FieldBuilderField | typeof JSONEditorField | typeof FileField | typeof HeadingField | typeof HiddenField | typeof HiddenLocationField | typeof HtmlField | typeof MapField | typeof TelephoneField | typeof NoteField | typeof MultistepField | typeof ObjectBuilderField | typeof RadioField | typeof MultiCheckboxField | typeof QrCodeScannerField | typeof ScrollAndReadDisplayField | typeof VoicenoteField | typeof SignatureField | typeof SmartTextField | typeof ScreenshotField | typeof ScreenrecorderField | typeof CodeField;
|
|
180
|
+
export interface IBaseValidation {
|
|
181
|
+
invalid_message?: string;
|
|
182
|
+
}
|
|
183
|
+
export interface IRequiredValidation extends IBaseValidation {
|
|
184
|
+
validationtype: "required";
|
|
185
|
+
}
|
|
186
|
+
export interface IRexegValidation extends IBaseValidation {
|
|
187
|
+
validationtype: "regex";
|
|
188
|
+
params: {
|
|
189
|
+
regex: string;
|
|
190
|
+
};
|
|
191
|
+
}
|
|
192
|
+
export interface IJsonataValidation extends IBaseValidation {
|
|
193
|
+
validationtype: "jsonata";
|
|
194
|
+
params: {
|
|
195
|
+
jsonata: string;
|
|
196
|
+
};
|
|
197
|
+
}
|
|
198
|
+
export type Validation = IRequiredValidation | IRexegValidation | IJsonataValidation;
|
|
199
|
+
export type ValidationType = Validation["validationtype"];
|
|
200
|
+
export declare const validation_types: ValidationType[];
|
|
201
|
+
export interface IValidationResult {
|
|
202
|
+
type: "error" | "info";
|
|
203
|
+
message: string;
|
|
204
|
+
}
|
|
205
|
+
export type ValidationTree = {
|
|
206
|
+
[key: string]: ValidationTree | IValidationResult[] | undefined;
|
|
207
|
+
};
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
import GridField from "./sub/grid-field.svelte";
|
|
2
|
+
import ArrayBuilderField from "./sub/array-builder-field.svelte";
|
|
3
|
+
import CheckboxAutocomplete from "./sub/checkbox-autocomplete.svelte";
|
|
4
|
+
import CheckboxField from "./sub/checkbox-field.svelte";
|
|
5
|
+
import ContactSelectorField from "./sub/contact-selector-field.svelte";
|
|
6
|
+
import CurrencyField from "./sub/currency-field.svelte";
|
|
7
|
+
import DataIndicationField, {} from "./sub/data-indication-field.svelte";
|
|
8
|
+
import DateField from "./sub/date-field.svelte";
|
|
9
|
+
import DateTimeField from "./sub/date-time-field.svelte";
|
|
10
|
+
import EmailField from "./sub/email-field.svelte";
|
|
11
|
+
import FieldBuilderField, {} from "./sub/field-builder-field.svelte";
|
|
12
|
+
import FileField, {} from "./sub/file-field.svelte";
|
|
13
|
+
import HeadingField, {} from "./sub/heading-field.svelte";
|
|
14
|
+
import HiddenField, {} from "./sub/hidden-field.svelte";
|
|
15
|
+
import HiddenLocationField from "./sub/hidden-location-field.svelte";
|
|
16
|
+
import HtmlField, {} from "./sub/html-field.svelte";
|
|
17
|
+
import JSONEditorField, {} from "./sub/jsoneditor-field.svelte";
|
|
18
|
+
import MapField from "./sub/map-field.svelte";
|
|
19
|
+
import NumberField from "./sub/number-field.svelte";
|
|
20
|
+
import SectionField from "./sub/section-field.svelte";
|
|
21
|
+
import SelectField from "./sub/select-field.svelte";
|
|
22
|
+
import SliderField from "./sub/slider-field.svelte";
|
|
23
|
+
import TextField from "./sub/text-field.svelte";
|
|
24
|
+
import TelephoneField from "./sub/telephone-field.svelte";
|
|
25
|
+
import NoteField, {} from "./sub/note-field.svelte";
|
|
26
|
+
import MultistepField from "./sub/multistep-field.svelte";
|
|
27
|
+
import ObjectBuilderField, {} from "./sub/object-builder-field.svelte";
|
|
28
|
+
import RadioField from "./sub/radio-field.svelte";
|
|
29
|
+
import MultiCheckboxField from "./sub/multi-checkbox-field.svelte";
|
|
30
|
+
import QrCodeScannerField, {} from "./sub/qr-code-scanner-field.svelte";
|
|
31
|
+
import ScrollAndReadDisplayField, {} from "./sub/scroll-and-read-display-field.svelte";
|
|
32
|
+
import VoicenoteField from "./sub/voicenote-field.svelte";
|
|
33
|
+
import SignatureField, {} from "./sub/signature-field.svelte";
|
|
34
|
+
import SmartTextField from "./sub/smart-text-field.svelte";
|
|
35
|
+
import ScreenshotField from "./sub/screenshot-field.svelte";
|
|
36
|
+
import CodeField from "./sub/code-field.svelte";
|
|
37
|
+
import ScreenrecorderField from "./sub/screenrecorder-field.svelte";
|
|
38
|
+
import SelectresourceField, {} from "./sub/selectresource-field.svelte";
|
|
39
|
+
export const fields = {
|
|
40
|
+
text: TextField,
|
|
41
|
+
number: NumberField,
|
|
42
|
+
section: SectionField,
|
|
43
|
+
checkbox: CheckboxField,
|
|
44
|
+
checkbox_autocomplete: CheckboxAutocomplete,
|
|
45
|
+
arraybuilder: ArrayBuilderField,
|
|
46
|
+
grid: GridField,
|
|
47
|
+
select: SelectField,
|
|
48
|
+
selectresource: SelectresourceField,
|
|
49
|
+
slider: SliderField,
|
|
50
|
+
contactselector: ContactSelectorField,
|
|
51
|
+
currency: CurrencyField,
|
|
52
|
+
dataindication: DataIndicationField,
|
|
53
|
+
date: DateField,
|
|
54
|
+
datetime: DateTimeField,
|
|
55
|
+
email: EmailField,
|
|
56
|
+
fieldbuilder: FieldBuilderField,
|
|
57
|
+
jsoneditor: JSONEditorField,
|
|
58
|
+
file: FileField,
|
|
59
|
+
heading: HeadingField,
|
|
60
|
+
hidden: HiddenField,
|
|
61
|
+
hiddenlocation: HiddenLocationField,
|
|
62
|
+
html: HtmlField,
|
|
63
|
+
map: MapField,
|
|
64
|
+
telephone: TelephoneField,
|
|
65
|
+
note: NoteField,
|
|
66
|
+
multistep: MultistepField,
|
|
67
|
+
objectbuilder: ObjectBuilderField,
|
|
68
|
+
radio: RadioField,
|
|
69
|
+
multicheckbox: MultiCheckboxField,
|
|
70
|
+
qrcodescanner: QrCodeScannerField,
|
|
71
|
+
scrollandreaddisplay: ScrollAndReadDisplayField,
|
|
72
|
+
voicenote: VoicenoteField,
|
|
73
|
+
signature: SignatureField,
|
|
74
|
+
smart_text: SmartTextField,
|
|
75
|
+
screenshot: ScreenshotField,
|
|
76
|
+
screenrecorder: ScreenrecorderField,
|
|
77
|
+
code: CodeField,
|
|
78
|
+
};
|
|
79
|
+
export const component_for = (f) => {
|
|
80
|
+
return fields[f.fieldtype];
|
|
81
|
+
};
|
|
82
|
+
export const validation_types = ["required", "regex", "jsonata"];
|
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
<script context="module">export const array_builder_field_param_spec = {
|
|
2
|
+
spec: {
|
|
3
|
+
fields: {
|
|
4
|
+
new_entry_field: {
|
|
5
|
+
fieldtype: "fieldbuilder",
|
|
6
|
+
help: "Field definition for new entries in the array."
|
|
7
|
+
}
|
|
8
|
+
}
|
|
9
|
+
}
|
|
10
|
+
};
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<script>import { Button } from "@stubber/ui/button";
|
|
14
|
+
import * as Collapsible from "@stubber/ui/collapsible";
|
|
15
|
+
import { get as get_store_value } from "svelte/store";
|
|
16
|
+
import FieldLabel from "../FieldLabel.svelte";
|
|
17
|
+
import FieldMessage from "../FieldMessage.svelte";
|
|
18
|
+
import FormField from "../form-field.svelte";
|
|
19
|
+
import { build_field } from "../utils";
|
|
20
|
+
export let fieldStore;
|
|
21
|
+
const new_entry_field = $fieldStore?.params?.new_entry_field || {
|
|
22
|
+
fieldtype: "text"
|
|
23
|
+
};
|
|
24
|
+
const update_sub_fields = (new_value) => {
|
|
25
|
+
const field = $fieldStore;
|
|
26
|
+
field.sub_fields = new_value.map((_value, index) => {
|
|
27
|
+
return build_field(
|
|
28
|
+
field.formStore,
|
|
29
|
+
field.attachmentsStore,
|
|
30
|
+
field.formDependencies,
|
|
31
|
+
index.toString(),
|
|
32
|
+
{
|
|
33
|
+
...new_entry_field,
|
|
34
|
+
title: `${new_entry_field.title || field.label} ${index + 1}`,
|
|
35
|
+
without_value_details: true
|
|
36
|
+
},
|
|
37
|
+
field.data_path
|
|
38
|
+
);
|
|
39
|
+
});
|
|
40
|
+
};
|
|
41
|
+
$: array_value = $fieldStore.value || [];
|
|
42
|
+
let last_value = array_value;
|
|
43
|
+
$: {
|
|
44
|
+
if (array_value !== last_value) {
|
|
45
|
+
last_value = array_value;
|
|
46
|
+
update_sub_fields(array_value);
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
if (array_value && array_value.length > 0) {
|
|
50
|
+
update_sub_fields(array_value);
|
|
51
|
+
}
|
|
52
|
+
const add_value = () => {
|
|
53
|
+
const new_value = [...array_value, null];
|
|
54
|
+
$fieldStore.value = new_value;
|
|
55
|
+
};
|
|
56
|
+
const remove_value = (index) => {
|
|
57
|
+
if (!Array.isArray(array_value)) {
|
|
58
|
+
return;
|
|
59
|
+
}
|
|
60
|
+
const new_value = array_value.filter((_, i) => i !== index);
|
|
61
|
+
$fieldStore.value = new_value;
|
|
62
|
+
};
|
|
63
|
+
const move_value_up = (index) => {
|
|
64
|
+
if (index > 0) {
|
|
65
|
+
const new_value = [...array_value];
|
|
66
|
+
[new_value[index - 1], new_value[index]] = [new_value[index], new_value[index - 1]];
|
|
67
|
+
$fieldStore.value = new_value;
|
|
68
|
+
}
|
|
69
|
+
};
|
|
70
|
+
const move_value_down = (index) => {
|
|
71
|
+
if (index < array_value.length - 1) {
|
|
72
|
+
const new_value = [...array_value];
|
|
73
|
+
[new_value[index + 1], new_value[index]] = [new_value[index], new_value[index + 1]];
|
|
74
|
+
$fieldStore.value = new_value;
|
|
75
|
+
}
|
|
76
|
+
};
|
|
77
|
+
</script>
|
|
78
|
+
|
|
79
|
+
<Collapsible.Root open={true} class="w-full">
|
|
80
|
+
<Collapsible.Trigger asChild let:builder>
|
|
81
|
+
<Button builders={[builder]} variant="ghost" class="w-full justify-between pl-0">
|
|
82
|
+
<FieldLabel {fieldStore} />
|
|
83
|
+
<FieldMessage {fieldStore} />
|
|
84
|
+
|
|
85
|
+
<i class="fa fa-sort" />
|
|
86
|
+
</Button>
|
|
87
|
+
</Collapsible.Trigger>
|
|
88
|
+
<Collapsible.Content class="flex flex-col gap-y-1 pl-2">
|
|
89
|
+
{#each $fieldStore.sub_fields || [] as sub_field, index (get_store_value(sub_field).id)}
|
|
90
|
+
<div class="flex items-center space-x-2 w-full">
|
|
91
|
+
<!-- up and down sort buttons -->
|
|
92
|
+
<div class="flex flex-col items-center space-y-1">
|
|
93
|
+
<Button variant="ghost" class="h-6 w-6 p-2" on:click={() => move_value_up(index)}>
|
|
94
|
+
<i class="fa fa-chevron-up" />
|
|
95
|
+
</Button>
|
|
96
|
+
<Button variant="ghost" class="h-6 w-6 p-2" on:click={() => move_value_down(index)}>
|
|
97
|
+
<i class="fa fa-chevron-down" />
|
|
98
|
+
</Button>
|
|
99
|
+
</div>
|
|
100
|
+
<FormField fieldStore={sub_field} />
|
|
101
|
+
<Button variant="destructive" class="h-6 w-6 p-2" on:click={() => remove_value(index)}>
|
|
102
|
+
<i class="fa fa-trash" />
|
|
103
|
+
</Button>
|
|
104
|
+
</div>
|
|
105
|
+
{/each}
|
|
106
|
+
<Button size="icon" variant="outline" on:click={add_value}>
|
|
107
|
+
<i class="fa fa-plus" />
|
|
108
|
+
</Button>
|
|
109
|
+
</Collapsible.Content>
|
|
110
|
+
</Collapsible.Root>
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { SvelteComponent } from "svelte";
|
|
2
|
+
import type { Writable } from "svelte/store";
|
|
3
|
+
import type { IBaseField, IBuiltField, IField, IInitialForm } from "../interfaces";
|
|
4
|
+
export interface IArrayBuilderFieldParams {
|
|
5
|
+
new_entry_field?: IField;
|
|
6
|
+
}
|
|
7
|
+
export declare const array_builder_field_param_spec: IInitialForm;
|
|
8
|
+
export interface IArrayBuilderField extends IBaseField<IArrayBuilderFieldParams> {
|
|
9
|
+
fieldtype: "arraybuilder";
|
|
10
|
+
}
|
|
11
|
+
declare const __propDef: {
|
|
12
|
+
props: {
|
|
13
|
+
fieldStore: Writable<IBuiltField<IArrayBuilderFieldParams>>;
|
|
14
|
+
};
|
|
15
|
+
events: {
|
|
16
|
+
[evt: string]: CustomEvent<any>;
|
|
17
|
+
};
|
|
18
|
+
slots: {};
|
|
19
|
+
exports?: {} | undefined;
|
|
20
|
+
bindings?: string | undefined;
|
|
21
|
+
};
|
|
22
|
+
export type ArrayBuilderFieldProps = typeof __propDef.props;
|
|
23
|
+
export type ArrayBuilderFieldEvents = typeof __propDef.events;
|
|
24
|
+
export type ArrayBuilderFieldSlots = typeof __propDef.slots;
|
|
25
|
+
export default class ArrayBuilderField extends SvelteComponent<ArrayBuilderFieldProps, ArrayBuilderFieldEvents, ArrayBuilderFieldSlots> {
|
|
26
|
+
}
|
|
27
|
+
export {};
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
<script context="module"></script>
|
|
2
|
+
|
|
3
|
+
<script>import { Button } from "@stubber/ui/button";
|
|
4
|
+
import { Label } from "@stubber/ui/label";
|
|
5
|
+
import * as Popover from "@stubber/ui/popover";
|
|
6
|
+
import * as RadioGroup from "@stubber/ui/radio-group";
|
|
7
|
+
import CheckboxField, {} from "./checkbox-field.svelte";
|
|
8
|
+
import SmartTextField, {} from "./smart-text-field.svelte";
|
|
9
|
+
import { isEqual } from "lodash-es";
|
|
10
|
+
export let fieldStore;
|
|
11
|
+
$fieldStore.without_value_details = true;
|
|
12
|
+
let selected_option = $fieldStore.value === void 0 || typeof $fieldStore.value === "boolean" || isEqual($fieldStore.value, $fieldStore.params?.checkedvalue || true) ? "Checkbox" : "Smart Text";
|
|
13
|
+
const options = ["Checkbox", "Smart Text"];
|
|
14
|
+
function select_option(new_option) {
|
|
15
|
+
selected_option = new_option;
|
|
16
|
+
switch (selected_option) {
|
|
17
|
+
case "Checkbox":
|
|
18
|
+
$fieldStore.value = false;
|
|
19
|
+
break;
|
|
20
|
+
case "Smart Text":
|
|
21
|
+
$fieldStore.value = "";
|
|
22
|
+
break;
|
|
23
|
+
default:
|
|
24
|
+
break;
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
</script>
|
|
28
|
+
|
|
29
|
+
<div class="w-full flex items-start space-x-2">
|
|
30
|
+
<Popover.Root>
|
|
31
|
+
<Popover.Trigger let:builder asChild>
|
|
32
|
+
<Button builders={[builder]} class="w-5 h-5 p-0" variant="outline">
|
|
33
|
+
<i class="fa fa-chevron-down" />
|
|
34
|
+
</Button>
|
|
35
|
+
</Popover.Trigger>
|
|
36
|
+
<Popover.Content>
|
|
37
|
+
<RadioGroup.Root value={selected_option} onValueChange={select_option}>
|
|
38
|
+
{#each options as option}
|
|
39
|
+
<div class="flex items-center space-x-2">
|
|
40
|
+
<RadioGroup.Item value={option} id={option} />
|
|
41
|
+
<Label for={option}>{option}</Label>
|
|
42
|
+
</div>
|
|
43
|
+
{/each}
|
|
44
|
+
</RadioGroup.Root>
|
|
45
|
+
</Popover.Content>
|
|
46
|
+
</Popover.Root>
|
|
47
|
+
{#if selected_option === "Smart Text"}
|
|
48
|
+
<div class="w-full">
|
|
49
|
+
<SmartTextField {fieldStore} />
|
|
50
|
+
</div>
|
|
51
|
+
{:else}
|
|
52
|
+
<div class="w-full">
|
|
53
|
+
<CheckboxField {fieldStore} />
|
|
54
|
+
</div>
|
|
55
|
+
{/if}
|
|
56
|
+
</div>
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { SvelteComponent } from "svelte";
|
|
2
|
+
import type { Writable } from "svelte/store";
|
|
3
|
+
import type { IBaseField, IBuiltField } from "../interfaces";
|
|
4
|
+
export interface ICheckboxAutocompleteFieldParams extends ICheckboxFieldParams, ISmartTextFieldParams {
|
|
5
|
+
}
|
|
6
|
+
export interface ICheckboxAutocompleteField extends IBaseField<ICheckboxAutocompleteFieldParams> {
|
|
7
|
+
fieldtype: "checkbox_autocomplete";
|
|
8
|
+
}
|
|
9
|
+
import { type ICheckboxFieldParams } from "./checkbox-field.svelte";
|
|
10
|
+
import { type ISmartTextFieldParams } from "./smart-text-field.svelte";
|
|
11
|
+
declare const __propDef: {
|
|
12
|
+
props: {
|
|
13
|
+
fieldStore: Writable<IBuiltField<ICheckboxAutocompleteFieldParams>>;
|
|
14
|
+
};
|
|
15
|
+
events: {
|
|
16
|
+
[evt: string]: CustomEvent<any>;
|
|
17
|
+
};
|
|
18
|
+
slots: {};
|
|
19
|
+
exports?: {} | undefined;
|
|
20
|
+
bindings?: string | undefined;
|
|
21
|
+
};
|
|
22
|
+
export type CheckboxAutocompleteProps = typeof __propDef.props;
|
|
23
|
+
export type CheckboxAutocompleteEvents = typeof __propDef.events;
|
|
24
|
+
export type CheckboxAutocompleteSlots = typeof __propDef.slots;
|
|
25
|
+
export default class CheckboxAutocomplete extends SvelteComponent<CheckboxAutocompleteProps, CheckboxAutocompleteEvents, CheckboxAutocompleteSlots> {
|
|
26
|
+
}
|
|
27
|
+
export {};
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
<script context="module">export const checkbox_field_param_spec = {
|
|
2
|
+
spec: {
|
|
3
|
+
fields: {
|
|
4
|
+
checkedvalue: {
|
|
5
|
+
fieldtype: "jsoneditor",
|
|
6
|
+
initvalue: { has_default: true, default: true }
|
|
7
|
+
},
|
|
8
|
+
uncheckedvalue: {
|
|
9
|
+
fieldtype: "jsoneditor",
|
|
10
|
+
initvalue: { has_default: true, default: false }
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
}
|
|
14
|
+
};
|
|
15
|
+
</script>
|
|
16
|
+
|
|
17
|
+
<script>import { Checkbox } from "@stubber/ui/checkbox";
|
|
18
|
+
import { Label } from "@stubber/ui/label";
|
|
19
|
+
import { isEqual } from "lodash-es";
|
|
20
|
+
import FieldMessage from "../FieldMessage.svelte";
|
|
21
|
+
import { set_value_details } from "../utils";
|
|
22
|
+
export let fieldStore;
|
|
23
|
+
let field = $fieldStore;
|
|
24
|
+
set_value_details(field, "label", field.label);
|
|
25
|
+
$: checked = isEqual($fieldStore.value, field.params?.checkedvalue || true);
|
|
26
|
+
const on_change = (new_value) => {
|
|
27
|
+
const checked_value = field.params?.checkedvalue ?? true;
|
|
28
|
+
const unchecked_value = field.params?.uncheckedvalue ?? false;
|
|
29
|
+
if (new_value === true) {
|
|
30
|
+
field.value = checked_value;
|
|
31
|
+
} else {
|
|
32
|
+
field.value = unchecked_value;
|
|
33
|
+
}
|
|
34
|
+
};
|
|
35
|
+
</script>
|
|
36
|
+
|
|
37
|
+
<div class="w-full flex items-center space-x-2">
|
|
38
|
+
<Checkbox {checked} onCheckedChange={on_change} />
|
|
39
|
+
<Label>{field.label}</Label>
|
|
40
|
+
</div>
|
|
41
|
+
<FieldMessage {fieldStore} />
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { SvelteComponent } from "svelte";
|
|
2
|
+
import type { Writable } from "svelte/store";
|
|
3
|
+
import type { IBaseField, IBuiltField, IInitialForm } from "../interfaces";
|
|
4
|
+
export interface ICheckboxFieldParams {
|
|
5
|
+
checkedvalue?: any;
|
|
6
|
+
uncheckedvalue?: any;
|
|
7
|
+
}
|
|
8
|
+
export interface ICheckboxField extends IBaseField<ICheckboxFieldParams> {
|
|
9
|
+
fieldtype: "checkbox";
|
|
10
|
+
}
|
|
11
|
+
export declare const checkbox_field_param_spec: IInitialForm;
|
|
12
|
+
declare const __propDef: {
|
|
13
|
+
props: {
|
|
14
|
+
fieldStore: Writable<IBuiltField<ICheckboxFieldParams>>;
|
|
15
|
+
};
|
|
16
|
+
events: {
|
|
17
|
+
[evt: string]: CustomEvent<any>;
|
|
18
|
+
};
|
|
19
|
+
slots: {};
|
|
20
|
+
exports?: {} | undefined;
|
|
21
|
+
bindings?: string | undefined;
|
|
22
|
+
};
|
|
23
|
+
export type CheckboxFieldProps = typeof __propDef.props;
|
|
24
|
+
export type CheckboxFieldEvents = typeof __propDef.events;
|
|
25
|
+
export type CheckboxFieldSlots = typeof __propDef.slots;
|
|
26
|
+
export default class CheckboxField extends SvelteComponent<CheckboxFieldProps, CheckboxFieldEvents, CheckboxFieldSlots> {
|
|
27
|
+
}
|
|
28
|
+
export {};
|