@formio/js 5.2.3 → 5.2.4-rc.0

package/lib/cjs/components/datamap/editForm/DataMap.edit.display.js

@@ -3,19 +3,19 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = [
     {
         key: 'placeholder',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'tabindex',
-        ignore: true
+        ignore: true,
     },
     {
         type: 'textfield',
         label: 'Label for Key column',
         key: 'keyLabel',
-        tooltip: 'Provide a label text for Key column (otherwise \'Key\' will be used)',
+        tooltip: "Provide a label text for Key column (otherwise 'Key' will be used)",
         weight: 404,
-        input: true
+        input: true,
     },
     {
         type: 'checkbox',
@@ -23,7 +23,7 @@ exports.default = [
         key: 'disableAddingRemovingRows',
         tooltip: 'Check if you want to hide Add Another button and Remove Row button',
         weight: 405,
-        input: true
+        input: true,
     },
     {
         type: 'checkbox',
@@ -31,7 +31,7 @@ exports.default = [
         key: 'keyBeforeValue',
         tooltip: 'Check if you would like to show the Key before the Value column.',
         weight: 406,
-        input: true
+        input: true,
     },
     {
         type: 'textfield',
@@ -43,6 +43,6 @@ exports.default = [
         input: true,
         customConditional(context) {
             return !context.data.disableAddingRemovingRows;
-        }
-    }
+        },
+    },
 ];

package/lib/cjs/components/datetime/DateTime.form.js

@@ -18,27 +18,27 @@ function default_1(...extend) {
     return Components_1.default.baseEditForm([
         {
             key: 'display',
-            components: DateTime_edit_display_1.default
+            components: DateTime_edit_display_1.default,
         },
         {
             label: 'Date',
             key: 'date',
             weight: 1,
-            components: DateTime_edit_date_1.default
+            components: DateTime_edit_date_1.default,
         },
         {
             label: 'Time',
             key: 'time',
             weight: 2,
-            components: DateTime_edit_time_1.default
+            components: DateTime_edit_time_1.default,
         },
         {
             key: 'data',
-            components: DateTime_edit_data_1.default
+            components: DateTime_edit_data_1.default,
         },
         {
             key: 'validation',
-            components: DateTime_edit_validation_1.default
+            components: DateTime_edit_validation_1.default,
         },
     ], ...extend);
 }

package/lib/cjs/components/datetime/DateTime.js

@@ -33,7 +33,7 @@ class DateTimeComponent extends Input_1.default {
                 yearRows: 4,
                 yearColumns: 5,
                 minDate: null,
-                maxDate: null
+                maxDate: null,
             },
             timePicker: {
                 hourStep: 1,
@@ -41,7 +41,7 @@ class DateTimeComponent extends Input_1.default {
                 showMeridian: true,
                 readonlyInput: false,
                 mousewheel: true,
-                arrowkeys: true
+                arrowkeys: true,
             },
             customOptions: {},
         }, ...extend);
@@ -53,36 +53,51 @@ class DateTimeComponent extends Input_1.default {
             icon: 'calendar',
             documentation: '/userguide/form-building/advanced-components#date-and-time',
             weight: 40,
-            schema: DateTimeComponent.schema()
+            schema: DateTimeComponent.schema(),
         };
     }
     static get serverConditionSettings() {
         return DateTimeComponent.conditionOperatorsSettings;
     }
     static get conditionOperatorsSettings() {
-        return Object.assign(Object.assign({}, super.conditionOperatorsSettings), { operators: ['isDateEqual', 'isNotDateEqual', 'isEmpty', 'isNotEmpty', 'dateLessThan', 'dateGreaterThan', 'dateLessThanOrEqual', 'dateGreaterThanOrEqual'], valueComponent(classComp) {
+        return Object.assign(Object.assign({}, super.conditionOperatorsSettings), { operators: [
+                'isDateEqual',
+                'isNotDateEqual',
+                'isEmpty',
+                'isNotEmpty',
+                'dateLessThan',
+                'dateGreaterThan',
+                'dateLessThanOrEqual',
+                'dateGreaterThanOrEqual',
+            ], valueComponent(classComp) {
                 return Object.assign(Object.assign({}, classComp), { type: 'datetime' });
             } });
     }
     static savedValueTypes(schema) {
         schema = schema || {};
-        return (0, utils_2.getComponentSavedTypes)(schema) || [utils_2.componentValueTypes.date];
+        return ((0, utils_2.getComponentSavedTypes)(schema) || [
+            utils_2.componentValueTypes.date,
+        ]);
     }
     constructor(component, options, data) {
         super(component, options, data);
-        const timezone = (this.component.timezone || this.options.timezone);
+        const timezone = this.component.timezone || this.options.timezone;
         const time24hr = !lodash_1.default.get(this.component, 'timePicker.showMeridian', true);
         // Change the format to map to the settings.
         if (!this.component.enableDate) {
             this.component.format = this.component.format.replace(/yyyy-MM-dd /g, '');
         }
-        else if (this.component.enableDate && !/[yMd]/.test(this.component.format) && this.builderMode) {
+        else if (this.component.enableDate &&
+            !/[yMd]/.test(this.component.format) &&
+            this.builderMode) {
             this.component.format = `yyyy-MM-dd ${this.component.format}`;
         }
         if (!this.component.enableTime) {
             this.component.format = this.component.format.replace(/ hh:mm a$/g, '');
         }
-        else if (this.component.enableTime && !/[mhH]/.test(this.component.format) && this.builderMode) {
+        else if (this.component.enableTime &&
+            !/[mhH]/.test(this.component.format) &&
+            this.builderMode) {
             this.component.format = `${this.component.format} hh:mm a`;
         }
         else if (time24hr) {
@@ -101,13 +116,11 @@ class DateTimeComponent extends Input_1.default {
                 customOptions = {};
             }
         }
-        /* eslint-disable camelcase */
         this.component.widget = Object.assign({ type: 'calendar', timezone, displayInTimezone: lodash_1.default.get(this.component, 'displayInTimezone', 'viewer'), locale: this.options.language, useLocaleSettings: lodash_1.default.get(this.component, 'useLocaleSettings', false), allowInput: lodash_1.default.get(this.component, 'allowInput', true), mode: 'single', enableTime: lodash_1.default.get(this.component, 'enableTime', true), noCalendar: !lodash_1.default.get(this.component, 'enableDate', true), format: this.component.format, hourIncrement: lodash_1.default.get(this.component, 'timePicker.hourStep', 1), minuteIncrement: lodash_1.default.get(this.component, 'timePicker.minuteStep', 5), time_24hr: time24hr, readOnly: this.options.readOnly, minDate: lodash_1.default.get(this.component, 'datePicker.minDate'), disabledDates: lodash_1.default.get(this.component, 'datePicker.disable'), disableWeekends: lodash_1.default.get(this.component, 'datePicker.disableWeekends'), disableWeekdays: lodash_1.default.get(this.component, 'datePicker.disableWeekdays'), disableFunction: lodash_1.default.get(this.component, 'datePicker.disableFunction'), maxDate: lodash_1.default.get(this.component, 'datePicker.maxDate') }, customOptions);
         // update originalComponent to include widget and other updated settings
         // it is done here since these settings depend on properties present after the component is initialized
         // originalComponent is used to restore the component (and widget) after evaluating field logic
         this.originalComponent = (0, utils_2.fastCloneDeep)(this.component);
-        /* eslint-enable camelcase */
     }
     get defaultSchema() {
         return DateTimeComponent.schema();
@@ -127,7 +140,7 @@ class DateTimeComponent extends Input_1.default {
         return utils_1.default.convertFormatToMoment(this.component.format);
     }
     isEmpty(value = this.dataValue) {
-        if (value && (value.toString() === 'Invalid Date')) {
+        if (value && value.toString() === 'Invalid Date') {
             return true;
         }
         return super.isEmpty(value);
@@ -137,8 +150,8 @@ class DateTimeComponent extends Input_1.default {
         return result === 'Invalid date' ? input : result;
     }
     isEqual(valueA, valueB = this.dataValue) {
-        return (this.isEmpty(valueA) && this.isEmpty(valueB))
-            || moment_1.default.utc(valueA).format(this.momentFormat) === moment_1.default.utc(valueB).format(this.momentFormat);
+        return ((this.isEmpty(valueA) && this.isEmpty(valueB)) ||
+            moment_1.default.utc(valueA).format(this.momentFormat) === moment_1.default.utc(valueB).format(this.momentFormat));
     }
     createWrapper() {
         return false;
@@ -159,12 +172,14 @@ class DateTimeComponent extends Input_1.default {
         const timezone = this.timezone;
         if (value && !this.attached && timezone) {
             if (Array.isArray(value) && this.component.multiple) {
-                return value.map(item => lodash_1.default.trim(utils_1.default.momentDate(item, format, timezone, options).format(format))).join(', ');
+                return value
+                    .map((item) => lodash_1.default.trim(utils_1.default.momentDate(item, format, timezone, options).format(format)))
+                    .join(', ');
             }
             return lodash_1.default.trim(utils_1.default.momentDate(value, format, timezone, options).format(format));
         }
         if (Array.isArray(value) && this.component.multiple) {
-            return value.map(item => lodash_1.default.trim((0, moment_1.default)(item).format(format))).join(', ');
+            return value.map((item) => lodash_1.default.trim((0, moment_1.default)(item).format(format))).join(', ');
         }
         return (value ? lodash_1.default.trim((0, moment_1.default)(value).format(format)) : value) || '';
     }

package/lib/cjs/components/datetime/editForm/DateTime.edit.data.js

@@ -7,9 +7,10 @@ exports.default = [
         key: 'defaultDate',
         label: 'Default Date',
         placeholder: 'moment()',
-        tooltip: 'You can use Moment.js functions to set the default value to a specific date. For example: \n \n moment().subtract(10, \'days\')',
-        weight: 6
-    }, {
+        tooltip: "You can use Moment.js functions to set the default value to a specific date. For example: \n \n moment().subtract(10, 'days')",
+        weight: 6,
+    },
+    {
         type: 'textarea',
         as: 'json',
         editor: 'ace',

package/lib/cjs/components/datetime/editForm/DateTime.edit.date.js

@@ -12,7 +12,7 @@ exports.default = [
         key: 'enableDate',
         label: 'Enable Date Input',
         weight: 0,
-        tooltip: 'Enables date input for this field.'
+        tooltip: 'Enables date input for this field.',
     },
     {
         type: 'tags',
@@ -22,9 +22,9 @@ exports.default = [
         placeholder: '(yyyy-MM-dd) or (yyyy-MM-dd - yyyy-MM-dd)',
         tooltip: 'Add dates that you want to blacklist. For example: \n \n 2025-02-21',
         validate: {
-            custom: 'if (_.isEmpty(input)) {\n  return true;\n}\nconst dates = _.isArray(input) ?\ninput : input.split(component.delimeter);\nconst isValid = _.every(dates, (data) => \n  !!data.match(/\\d{4}-\\d{2}-\\d{2}/g));\nvalid = isValid || \'Invalid date\';'
+            custom: "if (_.isEmpty(input)) {\n  return true;\n}\nconst dates = _.isArray(input) ?\ninput : input.split(component.delimeter);\nconst isValid = _.every(dates, (data) => \n  !!data.match(/\\d{4}-\\d{2}-\\d{2}/g));\nvalid = isValid || 'Invalid date';",
         },
-        weight: 21
+        weight: 21,
     },
     {
         type: 'panel',
@@ -45,16 +45,16 @@ exports.default = [
                 key: 'datePicker.disableFunction',
                 label: 'Disabling dates by a function',
                 description: 'For more information check out the <a href="https://flatpickr.js.org/examples/#disabling-dates" target="_blank" rel="noopener noreferrer">Docs</a>',
-                weight: 22
+                weight: 22,
             },
             {
                 type: 'htmlelement',
                 tag: 'div',
                 content: '<h4>Example</h4>' +
                     `<pre>// Disable all weekends<br>date.getDay() === 0 || date.getDay() === 6</pre>
-          `
-            }
-        ]
+          `,
+            },
+        ],
     },
     {
         type: 'checkbox',
@@ -62,7 +62,7 @@ exports.default = [
         key: 'datePicker.disableWeekends',
         label: 'Disable weekends',
         tooltip: 'Check to disable weekends',
-        weight: 23
+        weight: 23,
     },
     {
         type: 'checkbox',
@@ -70,6 +70,6 @@ exports.default = [
         key: 'datePicker.disableWeekdays',
         label: 'Disable weekdays',
         tooltip: 'Check to disable weekdays',
-        weight: 23
-    }
+        weight: 23,
+    },
 ];

package/lib/cjs/components/datetime/editForm/DateTime.edit.display.js

@@ -15,9 +15,9 @@ exports.default = [
                 { label: 'of Viewer', value: 'viewer' },
                 { label: 'of Submission', value: 'submission' },
                 { label: 'of Location', value: 'location' },
-                { label: 'UTC', value: 'utc' }
-            ]
-        }
+                { label: 'UTC', value: 'utc' },
+            ],
+        },
     },
     {
         type: 'select',
@@ -31,12 +31,17 @@ exports.default = [
         valueProperty: 'name',
         dataSrc: 'url',
         data: {
-            url: '{{options.cdnUrl}}/timezones.json'
+            url: '{{options.cdnUrl}}/timezones.json',
         },
         template: '<span>{{ item.label }}</span>',
         conditional: {
-            json: { '===': [{ var: 'data.displayInTimezone' }, 'location'] }
-        }
+            json: {
+                '===': [
+                    { var: 'data.displayInTimezone' },
+                    'location',
+                ],
+            },
+        },
     },
     {
         type: 'checkbox',
@@ -44,7 +49,7 @@ exports.default = [
         key: 'useLocaleSettings',
         label: 'Use Locale Settings',
         tooltip: 'Use locale settings to display date and time.',
-        weight: 51
+        weight: 51,
     },
     {
         type: 'checkbox',
@@ -52,7 +57,7 @@ exports.default = [
         key: 'allowInput',
         label: 'Allow Manual Input',
         tooltip: 'Check this if you would like to allow the user to manually enter in the date.',
-        weight: 51
+        weight: 51,
     },
     {
         type: 'textfield',
@@ -62,7 +67,7 @@ exports.default = [
         placeholder: 'Format',
         description: 'Use formats provided by <a href="https://github.com/angular-ui/bootstrap/tree/master/src/dateparser/docs#uibdateparsers-format-codes" target="_blank" rel="noopener noreferrer">DateParser Codes</a>',
         tooltip: 'The date format for displaying the datetime value.',
-        weight: 52
+        weight: 52,
     },
     {
         type: 'editgrid',
@@ -72,7 +77,7 @@ exports.default = [
         description: 'You can specify few buttons which will be shown above the calendar. Use Label to specify the name of the button and onClick to specify which date/time will be set when user clicks the button. E.g, date = new Date()',
         templates: {
             header: '<div class="row">\n  <div class="col-sm-3">Label</div>\n  <div class="col-sm-6">onClick</div>\n</div>',
-            row: '<div class="row">\n      <div class="col-sm-3">\n        {{ flattenedComponents.label.getView(row.label) }}\n      </div>\n      <div class="col-sm-6">\n        {{ flattenedComponents.onClick.getView(row.onClick) }}\n      </div>\n      {% if (!instance.disabled) { %}\n        <div class="col-sm-3">\n          <div class="btn-group pull-right">\n            <button class="btn btn-default btn-light btn-sm editRow"><i class="{{ iconClass("edit") }}"></i></button>\n            {% if (!instance.hasRemoveButtons || instance.hasRemoveButtons()) { %}\n              <button class="btn btn-danger btn-sm removeRow"><i class="{{ iconClass("trash") }}"></i></button>\n            {% } %}\n          </div>\n        </div>\n      {% } %}\n    </div>'
+            row: '<div class="row">\n      <div class="col-sm-3">\n        {{ flattenedComponents.label.getView(row.label) }}\n      </div>\n      <div class="col-sm-6">\n        {{ flattenedComponents.onClick.getView(row.onClick) }}\n      </div>\n      {% if (!instance.disabled) { %}\n        <div class="col-sm-3">\n          <div class="btn-group pull-right">\n            <button class="btn btn-default btn-light btn-sm editRow"><i class="{{ iconClass("edit") }}"></i></button>\n            {% if (!instance.hasRemoveButtons || instance.hasRemoveButtons()) { %}\n              <button class="btn btn-danger btn-sm removeRow"><i class="{{ iconClass("trash") }}"></i></button>\n            {% } %}\n          </div>\n        </div>\n      {% } %}\n    </div>',
         },
         components: [
             {
@@ -81,8 +86,8 @@ exports.default = [
                 type: 'textfield',
                 input: true,
                 validate: {
-                    required: true
-                }
+                    required: true,
+                },
             },
             {
                 label: 'onClick',
@@ -91,10 +96,10 @@ exports.default = [
                 editor: 'ace',
                 input: true,
                 validate: {
-                    required: true
-                }
-            }
+                    required: true,
+                },
+            },
         ],
-        defaultValue: []
-    }
+        defaultValue: [],
+    },
 ];

package/lib/cjs/components/datetime/editForm/DateTime.edit.time.js

@@ -7,7 +7,7 @@ exports.default = [
         key: 'enableTime',
         label: 'Enable Time Input',
         tooltip: 'Enables time input for this field.',
-        weight: 0
+        weight: 0,
     },
     {
         type: 'number',
@@ -15,7 +15,7 @@ exports.default = [
         key: 'timePicker.hourStep',
         label: 'Hour Step Size',
         tooltip: 'The number of hours to increment/decrement in the time picker.',
-        weight: 10
+        weight: 10,
     },
     {
         type: 'number',
@@ -23,7 +23,7 @@ exports.default = [
         key: 'timePicker.minuteStep',
         label: 'Minute Step Size',
         tooltip: 'The number of minutes to increment/decrement in the time picker.',
-        weight: 20
+        weight: 20,
     },
     {
         type: 'checkbox',
@@ -31,6 +31,6 @@ exports.default = [
         key: 'timePicker.showMeridian',
         label: '12 Hour Time (AM/PM)',
         tooltip: 'Display time in 12 hour time with AM/PM.',
-        weight: 30
-    }
+        weight: 30,
+    },
 ];

package/lib/cjs/components/datetime/editForm/DateTime.edit.validation.js

@@ -8,7 +8,7 @@ exports.default = [
         label: 'Use Input to add moment.js for minDate',
         persistent: false,
         weight: 10,
-        tooltip: 'Enables to use input for moment functions instead of calendar.'
+        tooltip: 'Enables to use input for moment functions instead of calendar.',
     },
     {
         label: 'Minimum Date',
@@ -57,7 +57,7 @@ exports.default = [
         label: 'Use Input to add moment.js for maxDate',
         persistent: false,
         weight: 20,
-        tooltip: 'Enables to use input for moment functions instead of calendar.'
+        tooltip: 'Enables to use input for moment functions instead of calendar.',
     },
     {
         label: 'Maximum Date',
@@ -101,5 +101,5 @@ exports.default = [
         enableTime: false,
         skipMerge: true,
         weight: 20,
-    }
+    },
 ];

package/lib/cjs/components/day/Day.form.js

@@ -19,7 +19,7 @@ function default_1(...extend) {
     return Components_1.default.baseEditForm([
         {
             key: 'display',
-            components: Day_edit_display_1.default
+            components: Day_edit_display_1.default,
         },
         {
             key: 'data',
@@ -27,25 +27,25 @@ function default_1(...extend) {
         },
         {
             key: 'validation',
-            components: Day_edit_validation_1.default
+            components: Day_edit_validation_1.default,
         },
         {
             key: 'day',
             label: 'Day',
             weight: 3,
-            components: Day_edit_day_1.default
+            components: Day_edit_day_1.default,
         },
         {
             key: 'month',
             label: 'Month',
             weight: 3,
-            components: Day_edit_month_1.default
+            components: Day_edit_month_1.default,
         },
         {
             key: 'year',
             label: 'Year',
             weight: 3,
-            components: Day_edit_year_1.default
+            components: Day_edit_year_1.default,
         },
     ], ...extend);
 }