not-bulma 1.2.67 → 1.2.69

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.
Files changed (4) hide show
  1. package/package.json +1 -1
  2. package/src/frame/components/form/form.helpers.js +228 -194
  3. package/src/frame/components/form/form.svelte +1 -2
  4. package/src/frame/components/table/notTableCell.svelte +5 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "not-bulma",
3
- "version": "1.2.67",
3
+ "version": "1.2.69",
4
4
  "description": "not-* family UI components on Bulma CSS Framework",
5
5
  "main": "src/index.js",
6
6
  "svelte": "src/index.js",
package/src/frame/components/form/form.helpers.js CHANGED
@@ -1,246 +1,280 @@
1
- import notCommon from '../../common';
1
+ import notCommon from "../../common";
2
2
 
3
3
  const DEFAULT_FIELD = {
4
- label: '',
5
- placeholder: '',
6
- enabled: true,
7
- visible: true,
8
- required: true,
9
- validated: false,
10
- valid: false,
11
- errors: false
4
+ label: "",
5
+ placeholder: "",
6
+ enabled: true,
7
+ visible: true,
8
+ required: true,
9
+ validated: false,
10
+ valid: false,
11
+ errors: false,
12
12
  };
13
13
 
14
14
  /**
15
- * Creates field manifest
16
- * @param {string} type name/type of the field
17
- * @param {Object} mutation mutation to manifest from library
18
- * @param {Object} VARIANTS store which contains named lists of field value variants
19
- * @param {Object} FIELDS store which contains named lists of field manifests
20
- * @return {Object} field manifest
21
- **/
15
+ * Creates field manifest
16
+ * @param {string} type name/type of the field
17
+ * @param {Object} mutation mutation to manifest from library
18
+ * @param {Object} VARIANTS store which contains named lists of field value variants
19
+ * @param {Object} FIELDS store which contains named lists of field manifests
20
+ * @return {Object} field manifest
21
+ **/
22
22
  function fieldInit(type, mutation = {}, VARIANTS, FIELDS) {
23
- let field = { ...DEFAULT_FIELD };
24
- //getting field core manifest
25
- if (FIELDS.contains(type)) {
26
- field = {
27
- ...field,
28
- ...FIELDS.get(type)
29
- };
30
- }
31
- //adding mutations
32
- if (mutation) {
33
- field = {
34
- ...field,
35
- ...mutation
36
- };
37
- }
38
- //adding variants list to field from VARIANTS store
39
- if (
40
- notCommon.objHas(field, 'variantsSource') &&
41
- VARIANTS.contains(field.variantsSource)
42
- ) {
43
- field.variants = VARIANTS.get(field.variantsSource);
44
- }else{
45
- if(!field.variants || field.variants.length === 0 ){
46
- field.variants = [];
23
+ let field = { ...DEFAULT_FIELD };
24
+ //getting field core manifest
25
+ if (FIELDS.contains(type)) {
26
+ field = {
27
+ ...field,
28
+ ...FIELDS.get(type),
29
+ };
47
30
  }
48
- }
49
- return field;
31
+ //adding mutations
32
+ if (mutation) {
33
+ field = {
34
+ ...field,
35
+ ...mutation,
36
+ };
37
+ }
38
+ //adding variants list to field from VARIANTS store
39
+ if (
40
+ notCommon.objHas(field, "variantsSource") &&
41
+ VARIANTS.contains(field.variantsSource)
42
+ ) {
43
+ field.variants = VARIANTS.get(field.variantsSource);
44
+ } else {
45
+ if (!field.variants || field.variants.length === 0) {
46
+ field.variants = [];
47
+ }
48
+ }
49
+ return field;
50
50
  }
51
51
 
52
52
  /**
53
- * Initialization of form structure object
54
- * @param {object} form form structure object
55
- * @param {string|Array<string>} fieldName name of the field type if string, array of strings = subform
56
- * @param {Object} VARIANTS store which contains named lists of field value variants
57
- * @param {Object} FIELDS store which contains named lists of field manifests
58
- * @param {Object} formFieldsOptions form wide options
59
- * @returns {Object} form structure object
60
- **/
61
- function initFormByField(form = {}, fieldName = [], VARIANTS, FIELDS, formFieldsOptions, data) {
62
- if (Array.isArray(fieldName)) {
63
- fieldName.forEach(subFormFieldName => initFormByField(form, subFormFieldName, VARIANTS, FIELDS, formFieldsOptions, data));
64
- } else {
65
- let opts = {};
66
- if (formFieldsOptions && notCommon.objHas(formFieldsOptions, 'mutations') && notCommon.objHas(formFieldsOptions.mutations, fieldName)) {
67
- opts = formFieldsOptions.mutations[fieldName]; //option mutation for field
68
- }
69
- if (data && notCommon.objHas(data, fieldName)) {
70
- opts.value = data[fieldName];
71
- }
72
- form[fieldName] = fieldInit(fieldName, opts, VARIANTS, FIELDS);
73
- //if form readonly, marking every field as readonly
74
- if (formFieldsOptions && formFieldsOptions.readonly) {
75
- form[fieldName].readonly = true;
53
+ * Initialization of form structure object
54
+ * @param {object} form form structure object
55
+ * @param {string|Array<string>} fieldName name of the field type if string, array of strings = subform
56
+ * @param {Object} VARIANTS store which contains named lists of field value variants
57
+ * @param {Object} FIELDS store which contains named lists of field manifests
58
+ * @param {Object} formFieldsOptions form wide options
59
+ * @returns {Object} form structure object
60
+ **/
61
+ function initFormByField(
62
+ form = {},
63
+ fieldName = [],
64
+ VARIANTS,
65
+ FIELDS,
66
+ formFieldsOptions,
67
+ data
68
+ ) {
69
+ if (Array.isArray(fieldName)) {
70
+ fieldName.forEach((subFormFieldName) =>
71
+ initFormByField(
72
+ form,
73
+ subFormFieldName,
74
+ VARIANTS,
75
+ FIELDS,
76
+ formFieldsOptions,
77
+ data
78
+ )
79
+ );
80
+ } else {
81
+ let opts = {};
82
+ if (
83
+ formFieldsOptions &&
84
+ notCommon.objHas(formFieldsOptions, "mutations") &&
85
+ notCommon.objHas(formFieldsOptions.mutations, fieldName)
86
+ ) {
87
+ opts = formFieldsOptions.mutations[fieldName]; //option mutation for field
88
+ }
89
+ if (data && notCommon.objHas(data, fieldName)) {
90
+ opts.value = data[fieldName];
91
+ }
92
+ form[fieldName] = fieldInit(fieldName, opts, VARIANTS, FIELDS);
93
+ //if form readonly, marking every field as readonly
94
+ if (formFieldsOptions && formFieldsOptions.readonly) {
95
+ form[fieldName].readonly = true;
96
+ }
76
97
  }
77
- }
78
- return form;
98
+ return form;
79
99
  }
80
100
 
81
101
  /**
82
- * Marking field as invalid by own validator
83
- * @param {Object} form form structure object
84
- * @param {string} fieldName name of the field
85
- * @param {any} value value of field
86
- * @param {Array<string>} errors list of errors
87
- * @return {Object} form structure object
88
- **/
102
+ * Marking field as invalid by own validator
103
+ * @param {Object} form form structure object
104
+ * @param {string} fieldName name of the field
105
+ * @param {any} value value of field
106
+ * @param {Array<string>} errors list of errors
107
+ * @return {Object} form structure object
108
+ **/
89
109
  function setFieldInvalid(form, fieldName, value, errors) {
90
- form[fieldName].errors = [...errors];
91
- form[fieldName].validated = true;
92
- form[fieldName].valid = false;
93
- form[fieldName].value = value;
94
- return form;
110
+ form[fieldName].errors = [...errors];
111
+ form[fieldName].validated = true;
112
+ form[fieldName].valid = false;
113
+ form[fieldName].value = value;
114
+ return form;
95
115
  }
96
116
 
97
117
  /**
98
- * Marking field as valid by own validator
99
- * @param {Object} form form structure object
100
- * @param {string} fieldName name of the field
101
- * @param {any} value value of field
102
- * @return {Object} form structure object
103
- **/
118
+ * Marking field as valid by own validator
119
+ * @param {Object} form form structure object
120
+ * @param {string} fieldName name of the field
121
+ * @param {any} value value of field
122
+ * @return {Object} form structure object
123
+ **/
104
124
  function setFieldValid(form, fieldName, value) {
105
- form[fieldName].errors = false;
106
- form[fieldName].validated = true;
107
- form[fieldName].valid = true;
108
- form[fieldName].value = value;
109
- let some = false;
110
- for (let fname in form) {
111
- if (fname !== fieldName) {
112
- if (Array.isArray(form[fname].errors) && form[fname].errors.length === 0) {
113
- form[fname].errors = false;
114
- }
115
- if (form[fname].errors !== false) {
116
- some = true;
117
- break;
118
- }
125
+ form[fieldName].errors = false;
126
+ form[fieldName].validated = true;
127
+ form[fieldName].valid = true;
128
+ form[fieldName].value = value;
129
+ let some = false;
130
+ for (let fname in form) {
131
+ if (fname !== fieldName) {
132
+ if (
133
+ Array.isArray(form[fname].errors) &&
134
+ form[fname].errors.length === 0
135
+ ) {
136
+ form[fname].errors = false;
137
+ }
138
+ if (form[fname].errors !== false) {
139
+ some = true;
140
+ break;
141
+ }
142
+ }
119
143
  }
120
- }
121
- return form;
144
+ return form;
122
145
  }
123
146
 
124
147
  /**
125
- * Checks if field has errors
126
- * @param {Object} form form structure object
127
- * @param {string} fieldName name of the field
128
- * @returns {boolean} true - valid, false -invalid
129
- **/
148
+ * Checks if field has errors
149
+ * @param {Object} form form structure object
150
+ * @param {string} fieldName name of the field
151
+ * @returns {boolean} true - valid, false -invalid
152
+ **/
130
153
  function isFieldValid(form, fieldName) {
131
- return !Array.isArray(form[fieldName].errors);
154
+ return !Array.isArray(form[fieldName].errors);
132
155
  }
133
156
 
134
157
  /**
135
- * Form level validator error in this field
136
- * @param {Object} form form structure object
137
- * @param {string} fieldName name of the field
138
- * @param {Array<string>} errors list of errors
139
- * @return {Object} form structure object
140
- **/
158
+ * Form level validator error in this field
159
+ * @param {Object} form form structure object
160
+ * @param {string} fieldName name of the field
161
+ * @param {Array<string>} errors list of errors
162
+ * @return {Object} form structure object
163
+ **/
141
164
  function setFormFieldInvalid(form, fieldName, errors) {
142
- form[fieldName].formErrors = [...errors];
143
- form[fieldName].validated = true;
144
- form[fieldName].inputStarted = true;
145
- form[fieldName].valid = false;
146
- form[fieldName].formLevelError = true;
147
- return form;
165
+ form[fieldName].formErrors = [...errors];
166
+ form[fieldName].validated = true;
167
+ form[fieldName].inputStarted = true;
168
+ form[fieldName].valid = false;
169
+ form[fieldName].formLevelError = true;
170
+ return form;
148
171
  }
149
172
  /**
150
- * Form level validator success in this field
151
- * @param {Object} form form structure object
152
- * @param {string} fieldName name of the field
153
- * @return {Object} form structure object
154
- **/
173
+ * Form level validator success in this field
174
+ * @param {Object} form form structure object
175
+ * @param {string} fieldName name of the field
176
+ * @return {Object} form structure object
177
+ **/
155
178
  function setFormFieldValid(form, fieldName) {
156
- form[fieldName].formErrors = false;
157
- form[fieldName].validated = true;
158
- form[fieldName].valid = true;
159
- form[fieldName].formLevelError = false;
160
- return form;
179
+ form[fieldName].formErrors = false;
180
+ form[fieldName].validated = true;
181
+ form[fieldName].valid = true;
182
+ form[fieldName].formLevelError = false;
183
+ return form;
161
184
  }
162
185
 
163
186
  /**
164
- * Updates fields and form error labels
165
- * @param {Object} form form structure object
166
- * @param {Object} validationStatus results of validation
167
- **/
187
+ * Updates fields and form error labels
188
+ * @param {Object} form form structure object
189
+ * @param {Object} validationStatus results of validation
190
+ **/
168
191
  function updateFormValidationStatus(
169
- {
170
- form,
171
- formErrors,
172
- formHasErrors,
173
- fieldsHasErrors,
174
- validationStatus
175
- } /* FormValidationSession.getCompleteResult() */
192
+ {
193
+ form,
194
+ formErrors,
195
+ formHasErrors,
196
+ fieldsHasErrors,
197
+ validationStatus,
198
+ } /* FormValidationSession.getCompleteResult() */
176
199
  ) {
177
- formHasErrors = false;
178
- fieldsHasErrors = false;
179
- if (Array.isArray(validationStatus.form) && validationStatus.form.length) {
180
- formErrors.splice(0, formErrors.length, ...validationStatus.form);
181
- formHasErrors = true;
182
- } else {
183
- formErrors.splice(0, formErrors.length);
184
- }
185
- formErrors = formErrors;
186
- if (validationStatus.fields) {
187
- for (let fieldName in validationStatus.fields) {
188
- if (Array.isArray(validationStatus.fields[fieldName]) && validationStatus.fields[fieldName].length) {
189
- setFormFieldInvalid(form, fieldName, validationStatus.fields[fieldName]);
190
- fieldsHasErrors = true;
191
- } else {
192
- setFormFieldValid(form, fieldName);
193
- }
200
+ formHasErrors = false;
201
+ fieldsHasErrors = false;
202
+ if (Array.isArray(validationStatus.form) && validationStatus.form.length) {
203
+ formErrors.splice(0, formErrors.length, ...validationStatus.form);
204
+ formHasErrors = true;
205
+ } else {
206
+ formErrors.splice(0, formErrors.length);
207
+ }
208
+ formErrors = formErrors;
209
+ if (validationStatus.fields) {
210
+ for (let fieldName in validationStatus.fields) {
211
+ if (
212
+ Array.isArray(validationStatus.fields[fieldName]) &&
213
+ validationStatus.fields[fieldName].length
214
+ ) {
215
+ setFormFieldInvalid(
216
+ form,
217
+ fieldName,
218
+ validationStatus.fields[fieldName]
219
+ );
220
+ fieldsHasErrors = true;
221
+ } else {
222
+ setFormFieldValid(form, fieldName);
223
+ }
224
+ }
194
225
  }
195
- }
196
226
  }
197
227
 
198
228
  function setFieldsVisibility(form, fieldsList, val) {
199
- if (Array.isArray(fieldsList)) {
200
- Object.keys(form).forEach(fieldName => {
201
- form[fieldName].visible = fieldsList.includes(fieldName) ? val : !val;
202
- });
203
- return true;
204
- }
205
- return false;
229
+ if (Array.isArray(fieldsList)) {
230
+ Object.keys(form).forEach((fieldName) => {
231
+ form[fieldName].visible = fieldsList.includes(fieldName)
232
+ ? val
233
+ : !val;
234
+ });
235
+ return true;
236
+ }
237
+ return false;
206
238
  }
207
239
 
208
240
  function setFieldValue(form, fieldName, value) {
209
- if (notCommon.objHas(form, fieldName)) {
210
- form[fieldName].value = value;
211
- return true;
212
- }
213
- return false;
241
+ if (notCommon.objHas(form, fieldName)) {
242
+ form[fieldName].value = value;
243
+ return true;
244
+ }
245
+ return false;
214
246
  }
215
247
 
216
- function fieldIsVisibleAndFilled(form, fieldName){
217
- return notCommon.objHas(form, fieldName) &&
218
- form[fieldName].enabled &&
219
- form[fieldName].visible &&
220
- typeof form[fieldName].value !== 'undefined';
248
+ function fieldIsVisibleAndFilled(form, fieldName) {
249
+ return (
250
+ notCommon.objHas(form, fieldName) &&
251
+ form[fieldName].enabled &&
252
+ form[fieldName].visible &&
253
+ typeof form[fieldName].value !== "undefined"
254
+ );
221
255
  }
222
256
 
223
257
  function collectData(fields, form) {
224
- let result = {};
225
- fields.flat().forEach((fieldName) => {
226
- if (fieldIsVisibleAndFilled(form, fieldName)) {
227
- result[fieldName] = form[fieldName].value;
228
- }
229
- });
230
- return result;
258
+ let result = {};
259
+ fields.flat().forEach((fieldName) => {
260
+ if (fieldIsVisibleAndFilled(form, fieldName)) {
261
+ result[fieldName] = form[fieldName].value;
262
+ }
263
+ });
264
+ return result;
231
265
  }
232
266
 
233
267
  export default {
234
- fieldInit,
235
- initFormByField,
236
- setFieldInvalid,
237
- setFieldValid,
238
- isFieldValid,
239
- setFormFieldInvalid,
240
- setFormFieldValid,
241
- updateFormValidationStatus,
242
- fieldIsVisibleAndFilled,
243
- setFieldsVisibility,
244
- setFieldValue,
245
- collectData
268
+ fieldInit,
269
+ initFormByField,
270
+ setFieldInvalid,
271
+ setFieldValid,
272
+ isFieldValid,
273
+ setFormFieldInvalid,
274
+ setFormFieldValid,
275
+ updateFormValidationStatus,
276
+ fieldIsVisibleAndFilled,
277
+ setFieldsVisibility,
278
+ setFieldValue,
279
+ collectData,
246
280
  };
package/src/frame/components/form/form.svelte CHANGED
@@ -47,7 +47,7 @@
47
47
  export let WAITING_TEXT = "Отправка данных на сервер";
48
48
 
49
49
  //form labels
50
- export let title = "Форма";
50
+ export let title = "";
51
51
  export let description = "";
52
52
  //if you want button on top
53
53
  export let buttonsFirst = false;
@@ -219,7 +219,6 @@
219
219
  {#if description}
220
220
  <h6 class="subtitle is-6">{$LOCALE[description]}</h6>
221
221
  {/if}
222
-
223
222
  {#if buttonsFirst}
224
223
  <div class="buttons is-grouped is-centered">
225
224
  {#if cancel.enabled}
package/src/frame/components/table/notTableCell.svelte CHANGED
@@ -37,7 +37,11 @@
37
37
  export let helpers = {};
38
38
  </script>
39
39
 
40
- <td class={field.hideOnMobile ? "is-hidden-touch" : ""} {title}>
40
+ <td
41
+ class={(field.hideOnMobile ? " is-hidden-touch " : "") +
42
+ (field.classes ? ` ${field.classes} ` : "")}
43
+ {title}
44
+ >
41
45
  {#if field.type === "link"}
42
46
  <UILinks values={notPath.get(field.path, item, helpers)} />
43
47
  {:else if field.type === "button"}