@progress/kendo-spreadsheet-common 1.0.0-develop.5 → 1.0.0-develop.7

package/dist/index-esm.js

@@ -1,4 +1,3 @@
-import { localeInfo, parseDate as parseDate$1, format, toString } from '@progress/kendo-intl';
 import { drawing, parseColor, geometry, drawDOM } from '@progress/kendo-drawing';
 import { dayOfWeek, getDate, addDays, firstDayOfMonth } from '@progress/kendo-date-math';
 import { browser } from '@progress/kendo-common';
@@ -945,6 +944,49 @@ SHEETREF.print = function() {
     return "#SHEET";
 };
 
+/* eslint-disable key-spacing */
+const messages = {};
+messages.view = {
+    nameBox: "Name Box",
+    errors: {
+        openUnsupported: "Unsupported format. Please select an .xlsx file.",
+        shiftingNonblankCells: "Cannot insert cells due to data loss possibility. Select another insert location or delete the data from the end of your worksheet.",
+        insertColumnWhenRowIsSelected: "Cannot insert column when all columns are selected.",
+        insertRowWhenColumnIsSelected: "Cannot insert row when all rows are selected.",
+        filterRangeContainingMerges: "Cannot create a filter within a range containing merges",
+        sortRangeContainingMerges: "Cannot sort a range containing merges",
+        cantSortMultipleSelection: "Cannot sort multiple selection",
+        cantSortNullRef: "Cannot sort empty selection",
+        cantSortMixedCells: "Cannot sort range containing cells of mixed shapes",
+        validationError: "The value that you entered violates the validation rules set on the cell.",
+        cannotModifyDisabled: "Cannot modify disabled cells.",
+        insertRowBelowLastRow: "Cannot insert row below the last row.",
+        insertColAfterLastCol: "Cannot insert column to the right of the last column."
+    },
+    tabs: {
+        home: "Home",
+        insert: "Insert",
+        data: "Data"
+    }
+};
+
+messages.menus = {
+    "cut"          : "Cut",
+    "copy"         : "Copy",
+    "paste"        : "Paste",
+    "merge"        : "Merge",
+    "unmerge"      : "Unmerge",
+    "delete"       : "Delete",
+    "hide"         : "Hide",
+    "unhide"       : "Unhide",
+    "bringToFront" : "Bring to front",
+    "sendToBack"   : "Send to back"
+};
+
+messages.workbook = {
+    defaultSheetName: "Sheet"
+};
+
 const options = {
     name: "Spreadsheet",
     toolbar: true,
@@ -960,7 +1002,7 @@ const options = {
         forceProxy: false,
         proxyURL: "",
     },
-    messages: {},
+    messages: messages,
     pdf: {
         // which part of the workbook to be exported
         area: "workbook",
@@ -1354,18 +1396,18 @@ class CalcError {
     }
 }
 
-const localeValue = { current: 'en' };
+let intlValue = {};
 
-const locale = value => {
+const intl = (value) => {
     if (value) {
-        localeValue.current = value;
+        intlValue = value;
     } else {
-        return localeValue.current;
+        return intlValue;
     }
 };
 
 const culture = () => {
-    return localeInfo(locale())
+    return intl().localeInfo();
 };
 
 function createKendoObj(calc, CalcError, Ref, CellRef, RangeRef) {
@@ -2993,9 +3035,10 @@ function parseDate(str, format) {
     if (format) {
         format = formatting.makeDateFormat(format);
     }
-    return parseDate$1(str, format)
-        || parseDate$1(str)
-        || parseDate$1(str, [
+    const parseExactDate = intl().parseDate;
+    return parseExactDate(str, format)
+        || parseExactDate(str)
+        || parseExactDate(str, [
             "MMMM dd yyyy",
             "MMMM dd yy",
             "MMM dd yyyy",
@@ -12733,10 +12776,6 @@ const ALL_PROPERTIES = propertyBagSpec.reduce(function(a, spec) {
     return a;
 }, [ "borderTop", "borderRight", "borderBottom", "borderLeft" ]);
 
-const kendoFormat = function(fmt, ...values) {
-    return format(fmt, values, locale())
-};
-
 /* eslint-disable no-param-reassign */
 
 let TRANSPOSE_FORMAT = "_matrix({0})";
@@ -12756,13 +12795,13 @@ function compileValidation(sheet, row, col, validation) {
             if (validation.from.indexOf("{") > -1) {
                 validation.from = validation.from.replace(/\"/g,"").replace("{","\"").replace("}", "\"");
             }
-            validation.from = kendoFormat(TRANSPOSE_FORMAT, validation.from);
+            validation.from = intl().format(TRANSPOSE_FORMAT, validation.from);
             validation.fromIsListValue = true;
         }
         if (validation.dataType === "date") {
             parsedFromDate = calc.runtime.parseDate(validation.from);
             if (parsedFromDate) {
-                validation.from = kendoFormat(DATE_FORMAT, validation.from);
+                validation.from = intl().format(DATE_FORMAT, validation.from);
                 validation.fromIsDateValue = true;
             }
         }
@@ -12772,7 +12811,7 @@ function compileValidation(sheet, row, col, validation) {
         if (validation.dataType === "date") {
             parsedToDate = calc.runtime.parseDate(validation.to);
             if (parsedToDate) {
-                validation.to = kendoFormat(DATE_FORMAT, validation.to);
+                validation.to = intl().format(DATE_FORMAT, validation.to);
                 validation.toIsDateValue = true;
             }
         }
@@ -12786,7 +12825,7 @@ function compileValidation(sheet, row, col, validation) {
         comparer = validationExport.validationComparers[validation.comparerType];
     }
     if (!comparer) {
-        throw kendoFormat("'{0}' comparer is not implemented.", validation.comparerType);
+        throw intl().format("'{0}' comparer is not implemented.", validation.comparerType);
     }
     validationHandler = function(valueToCompare) { //add 'valueFormat' arg when add isDate comparer
         let toValue = this.to && (this.to_value || this.to_value === 0) ? this.to_value : undefined;
@@ -12852,7 +12891,7 @@ class Validation {
         let dataType = this.dataType;
         let type = this.type;
         let comparerType = this.comparerType;
-        return kendoFormat(format, from, to, fromFormula, toFormula, dataType, type, comparerType);
+        return intl().format(format, from, to, fromFormula, toFormula, dataType, type, comparerType);
     }
     _setMessages() {
         this.title = "";
@@ -13249,7 +13288,8 @@ let Range$1 = class Range {
                     }
                 }
                 if (type === "date") {
-                    value = toString(serialToDate(value), culture().calendar.patterns.d, locale());
+                    const intlVal = intl();
+                    value = intlVal.toString(serialToDate(value), culture().calendar.patterns.d, intlVal.locale);
                 } else if (type === "percent") {
                     value = calc.runtime.limitPrecision(value * 100) + "%";
                 } else if (typeof value == "string" &&
@@ -14736,49 +14776,6 @@ function notEqual(oldRect, newRect) {
     return oldRect && (oldRect.top !== newRect.top || oldRect.left !== newRect.left);
 }
 
-/* eslint-disable key-spacing */
-const messages = {};
-messages.view = {
-    nameBox: "Name Box",
-    errors: {
-        openUnsupported: "Unsupported format. Please select an .xlsx file.",
-        shiftingNonblankCells: "Cannot insert cells due to data loss possibility. Select another insert location or delete the data from the end of your worksheet.",
-        insertColumnWhenRowIsSelected: "Cannot insert column when all columns are selected.",
-        insertRowWhenColumnIsSelected: "Cannot insert row when all rows are selected.",
-        filterRangeContainingMerges: "Cannot create a filter within a range containing merges",
-        sortRangeContainingMerges: "Cannot sort a range containing merges",
-        cantSortMultipleSelection: "Cannot sort multiple selection",
-        cantSortNullRef: "Cannot sort empty selection",
-        cantSortMixedCells: "Cannot sort range containing cells of mixed shapes",
-        validationError: "The value that you entered violates the validation rules set on the cell.",
-        cannotModifyDisabled: "Cannot modify disabled cells.",
-        insertRowBelowLastRow: "Cannot insert row below the last row.",
-        insertColAfterLastCol: "Cannot insert column to the right of the last column."
-    },
-    tabs: {
-        home: "Home",
-        insert: "Insert",
-        data: "Data"
-    }
-};
-
-messages.menus = {
-    "cut"          : "Cut",
-    "copy"         : "Copy",
-    "paste"        : "Paste",
-    "merge"        : "Merge",
-    "unmerge"      : "Unmerge",
-    "delete"       : "Delete",
-    "hide"         : "Hide",
-    "unhide"       : "Unhide",
-    "bringToFront" : "Bring to front",
-    "sendToBack"   : "Send to back"
-};
-
-messages.workbook = {
-    defaultSheetName: "Sheet"
-};
-
 const ampRegExp = /&/g,
     ltRegExp = /</g,
     quoteRegExp = /"/g,
@@ -17377,15 +17374,17 @@ filtersObj = {
     };
 });
 
-culture().calendar.months.format.wide.forEach(function(month, index) {
-    DynamicFilter.prototype[month.toLowerCase()] = function(value) {
-        if (value instanceof Date) {
-            return value.getMonth() === index;
-        }
+const initDynamicFilter = () => {
+    culture().calendar.months.format.wide.forEach(function(month, index) {
+        DynamicFilter.prototype[month.toLowerCase()] = function(value) {
+            if (value instanceof Date) {
+                return value.getMonth() === index;
+            }
 
-        return false;
-    };
-});
+            return false;
+        };
+    });
+};
 
 function quarter(value) {
     var month = value.getMonth() + 1;
@@ -20487,7 +20486,7 @@ function Borders() {
     //                 if (options.useGridFormat) {
     //                     if (value != null) {
     //                         if (col.format) {
-    //                             value = kendoFormat(col.format, value);
+    //                             value = intl().format(col.format, value);
     //                         } else {
     //                             value += "";
     //                         }
@@ -21785,13 +21784,13 @@ class FormulaInput extends Widget {
         if (this._isFormula() && !this._navigated) {
             value = ((this._tokenContext() || {}).token || {}).value;
 
-            this.filter(value);
+            const data = this.filter(value);
 
-            if (!value || !this.formulaSource.length) {
+            if (!value || !data.length) {
                 popup.close();
             } else {
                 popup[popup.visible() ? "position" : "open"]();
-                this.list.focusFirst();
+                setTimeout(() => { this.list.focusFirst(); }, 0);
             }
         }
 
@@ -21934,7 +21933,11 @@ class FormulaInput extends Widget {
             return;
         }
 
-        this.list.data(this.formulaSource.filter((item) => String(item.value).startsWith(value)));
+        const data = this.formulaSource.filter((item) => String(item.value).startsWith(value.toLowerCase()));
+
+        this.list.data(data);
+
+        return data;
     }
 
     hide() {
@@ -22115,8 +22118,10 @@ class FormulaInput extends Widget {
         if (width > element.offsetWidth) {
             element.style.width = width + 'px';
         }
-        if (height > element.offsetHeight) {
-            element.style.height = height + 'px';
+
+        const activeCellOutlineWidth = 1;
+        if (height - activeCellOutlineWidth > element.offsetHeight) {
+            element.style.height = (height - activeCellOutlineWidth) + 'px';
         }
 
         this._sync();
@@ -25904,7 +25909,7 @@ async function readSheet(zip, file, sheet, strings, styles) {
                         } else if (type === "b") {
                             value = value === "1";
                         } else if (type === "d") {
-                            value = parseDate$1(value);
+                            value = intl().parseDate(value);
                         }
 
                         if (value != null) {
@@ -26047,7 +26052,7 @@ async function readDrawings(zip, file, sheet) {
     let relationships = await readRelationships(zip, relsFile);
 
     if (relationships.byType.image) {
-        await Object.keys(relationships.byId).forEach(async function(id) {
+        for (const id of Object.keys(relationships.byId)) {
             let img = relative_file(file, relationships.byId[id]);
             let type = getContentType(img);
 
@@ -26059,7 +26064,7 @@ async function readDrawings(zip, file, sheet) {
                     : new window.Blob([ data ], { type: type });
                 relationships.byId[id] = sheet._workbook.addImage(blob);
             }
-        });
+        }
     }
 
     let cdr, ref, width, height;
@@ -26754,7 +26759,7 @@ function excelToPixels(val) {
     return val / 9525;
 }
 
-/* eslint-disable no-nested-ternary */
+/* eslint-disable no-undef */
 
 const events$1 = [
     "cut",
@@ -27062,6 +27067,7 @@ class Workbook extends Observable {
         let insertIndex = typeof options.index === "number" ? options.index : that._sheets.length;
         let sheetName;
         let sheets = that._sheets;
+        const messages = this.options.messages;
 
         let getUniqueSheetName = function(sheetNameSuffix) {
             sheetNameSuffix = sheetNameSuffix ? sheetNameSuffix : 1;
@@ -27259,33 +27265,33 @@ class Workbook extends Observable {
         this._imgID = 0;
     }
 
-    // _loadImages() {
-    //     let self = this;
-    //     let ids = Object.keys(self._images);
-    //     let count = ids.length;
-    //     if (count) {
-    //         ids.forEach(function(id){
-    //             let img = self._images[id];
-    //             if (!img.blob) {
-    //                 loadBinary(img.url, function(data, type) {
-    //                     // XXX: can we do something better in case of error?
-    //                     if (data != null) {
-    //                         img.blob = new Blob([ data ], { type: type });
-    //                         delete img.url;
-    //                     }
-    //                     next();
-    //                 });
-    //             }
-    //         });
-    //     } else {
-    //         next();
-    //     }
-    //     function next() {
-    //         if (--count <= 0) {
-    //             self.activeSheet().triggerChange({ layout: true });
-    //         }
-    //     }
-    // },
+    _loadImages() {
+        let self = this;
+        let ids = Object.keys(self._images);
+        let count = ids.length;
+        if (count) {
+            ids.forEach(function(id){
+                let img = self._images[id];
+                if (!img.blob) {
+                    loadBinary(img.url, function(data, type) {
+                        // XXX: can we do something better in case of error?
+                        if (data != null) {
+                            img.blob = new Blob([ data ], { type: type });
+                            delete img.url;
+                        }
+                        next();
+                    });
+                }
+            });
+        } else {
+            next();
+        }
+        function next() {
+            if (--count <= 0) {
+                self.activeSheet().triggerChange({ layout: true });
+            }
+        }
+    }
 
     fromJSON(json) {
         if (json.sheets) {
@@ -27303,7 +27309,7 @@ class Workbook extends Observable {
                     }
                     this._images[id] = { url: json.images[id] };
                 }, this);
-                // this._loadImages();
+                this._loadImages();
             }
 
             for (let idx = 0; idx < json.sheets.length; idx++) {
@@ -27370,47 +27376,42 @@ class Workbook extends Observable {
                 return sheet.toJSON();
             }, this),
             names: names,
+            images: {},
             columnWidth: this.options.columnWidth,
             rowHeight: this.options.rowHeight
         };
     }
 
     saveJSON() {
-        // PoC only
-        window.console.log('`saveJSON` function not implemented');
-        // let self = this;
-        // let deferred = new $.Deferred();
-        // let data = self.toJSON();
-        // let ids = Object.keys(self._images).filter(function(id) {
-        //     return self.usesImage(id) === 1;
-        // });
-        // let count = ids.length;
-        // data.images = {};
-        // if (count) {
-        //     ids.forEach(function(id) {
-        //         let img = self._images[id];
-        //         if (img.blob) {
-        //             let reader = new FileReader();
-        //             reader.onload = function() {
-        //                 data.images[id] = reader.result;
-        //                 next();
-        //             };
-        //             reader.readAsDataURL(img.blob);
-        //         } else {
-        //             data.images[id] = img.url;
-        //             next();
-        //         }
-        //     });
-        // } else {
-        //     next();
-        // }
-        // return deferred.promise();
+        let self = this;
+        let data = self.toJSON();
+        let ids = Object.keys(self._images).filter(function(id) {
+            return self.usesImage(id) === 1;
+        });
+        let count = ids.length;
 
-        // function next() {
-        //     if (--count <= 0) {
-        //         deferred.resolve(data);
-        //     }
-        // }
+        const promises = [];
+
+        if (count) {
+            ids.forEach(function(id) {
+                let img = self._images[id];
+                if (img.blob) {
+                    const promise = new Promise((resolve) => {
+                        let reader = new FileReader();
+                        reader.onload = function() {
+                            data.images[id] = reader.result;
+                            resolve();
+                        };
+                        reader.readAsDataURL(img.blob);
+                    });
+                    promises.push(promise);
+                } else {
+                    data.images[id] = img.url;
+                }
+            });
+        }
+
+        return Promise.all(promises).then(() => data);
     }
 
     fromFile(file) {
@@ -27745,11 +27746,12 @@ const events = [
 
 class Spreadsheet extends Widget {
     constructor(element, options$1) {
-        super(element, Object.assign({}, options, options$1));
+        super(element, deepExtend({}, options, options$1));
         this.events = events;
         this.bind(this.events, this.options);
 
-        locale(this.options.locale);
+        intl({ locale: this.options.locale, ...this.options.intl });
+        initDynamicFilter();
 
         this._view = new View(this.element, {
             messages: this.options.messages.view,

package/dist/index.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@progress/kendo-intl'), require('@progress/kendo-drawing'), require('@progress/kendo-date-math'), require('@progress/kendo-common'), require('@progress/jszip-esm')) :
-    typeof define === 'function' && define.amd ? define(['exports', '@progress/kendo-intl', '@progress/kendo-drawing', '@progress/kendo-date-math', '@progress/kendo-common', '@progress/jszip-esm'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.KendoSpreadsheetCommon = {}, global.KendoIntl, global.KendoDrawing, global.KendoDateMath, global.KendoCommon, global.JSZip));
-})(this, (function (exports, kendoIntl, kendoDrawing, kendoDateMath, kendoCommon, JSZip) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@progress/kendo-drawing'), require('@progress/kendo-date-math'), require('@progress/kendo-common'), require('@progress/jszip-esm')) :
+    typeof define === 'function' && define.amd ? define(['exports', '@progress/kendo-drawing', '@progress/kendo-date-math', '@progress/kendo-common', '@progress/jszip-esm'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.KendoSpreadsheetCommon = {}, global.KendoDrawing, global.KendoDateMath, global.KendoCommon, global.JSZip));
+})(this, (function (exports, kendoDrawing, kendoDateMath, kendoCommon, JSZip) { 'use strict';
 
     /* eslint-disable camelcase */
     /* eslint-disable no-nested-ternary */
@@ -945,6 +945,49 @@
         return "#SHEET";
     };
 
+    /* eslint-disable key-spacing */
+    const messages = {};
+    messages.view = {
+        nameBox: "Name Box",
+        errors: {
+            openUnsupported: "Unsupported format. Please select an .xlsx file.",
+            shiftingNonblankCells: "Cannot insert cells due to data loss possibility. Select another insert location or delete the data from the end of your worksheet.",
+            insertColumnWhenRowIsSelected: "Cannot insert column when all columns are selected.",
+            insertRowWhenColumnIsSelected: "Cannot insert row when all rows are selected.",
+            filterRangeContainingMerges: "Cannot create a filter within a range containing merges",
+            sortRangeContainingMerges: "Cannot sort a range containing merges",
+            cantSortMultipleSelection: "Cannot sort multiple selection",
+            cantSortNullRef: "Cannot sort empty selection",
+            cantSortMixedCells: "Cannot sort range containing cells of mixed shapes",
+            validationError: "The value that you entered violates the validation rules set on the cell.",
+            cannotModifyDisabled: "Cannot modify disabled cells.",
+            insertRowBelowLastRow: "Cannot insert row below the last row.",
+            insertColAfterLastCol: "Cannot insert column to the right of the last column."
+        },
+        tabs: {
+            home: "Home",
+            insert: "Insert",
+            data: "Data"
+        }
+    };
+
+    messages.menus = {
+        "cut"          : "Cut",
+        "copy"         : "Copy",
+        "paste"        : "Paste",
+        "merge"        : "Merge",
+        "unmerge"      : "Unmerge",
+        "delete"       : "Delete",
+        "hide"         : "Hide",
+        "unhide"       : "Unhide",
+        "bringToFront" : "Bring to front",
+        "sendToBack"   : "Send to back"
+    };
+
+    messages.workbook = {
+        defaultSheetName: "Sheet"
+    };
+
     const options = {
         name: "Spreadsheet",
         toolbar: true,
@@ -960,7 +1003,7 @@
             forceProxy: false,
             proxyURL: "",
         },
-        messages: {},
+        messages: messages,
         pdf: {
             // which part of the workbook to be exported
             area: "workbook",
@@ -1354,18 +1397,18 @@
         }
     }
 
-    const localeValue = { current: 'en' };
+    let intlValue = {};
 
-    const locale = value => {
+    const intl = (value) => {
         if (value) {
-            localeValue.current = value;
+            intlValue = value;
         } else {
-            return localeValue.current;
+            return intlValue;
         }
     };
 
     const culture = () => {
-        return kendoIntl.localeInfo(locale())
+        return intl().localeInfo();
     };
 
     function createKendoObj(calc, CalcError, Ref, CellRef, RangeRef) {
@@ -2993,9 +3036,10 @@
         if (format) {
             format = formatting.makeDateFormat(format);
         }
-        return kendoIntl.parseDate(str, format)
-            || kendoIntl.parseDate(str)
-            || kendoIntl.parseDate(str, [
+        const parseExactDate = intl().parseDate;
+        return parseExactDate(str, format)
+            || parseExactDate(str)
+            || parseExactDate(str, [
                 "MMMM dd yyyy",
                 "MMMM dd yy",
                 "MMM dd yyyy",
@@ -12733,10 +12777,6 @@
         return a;
     }, [ "borderTop", "borderRight", "borderBottom", "borderLeft" ]);
 
-    const kendoFormat = function(fmt, ...values) {
-        return kendoIntl.format(fmt, values, locale())
-    };
-
     /* eslint-disable no-param-reassign */
 
     let TRANSPOSE_FORMAT = "_matrix({0})";
@@ -12756,13 +12796,13 @@
                 if (validation.from.indexOf("{") > -1) {
                     validation.from = validation.from.replace(/\"/g,"").replace("{","\"").replace("}", "\"");
                 }
-                validation.from = kendoFormat(TRANSPOSE_FORMAT, validation.from);
+                validation.from = intl().format(TRANSPOSE_FORMAT, validation.from);
                 validation.fromIsListValue = true;
             }
             if (validation.dataType === "date") {
                 parsedFromDate = calc.runtime.parseDate(validation.from);
                 if (parsedFromDate) {
-                    validation.from = kendoFormat(DATE_FORMAT, validation.from);
+                    validation.from = intl().format(DATE_FORMAT, validation.from);
                     validation.fromIsDateValue = true;
                 }
             }
@@ -12772,7 +12812,7 @@
             if (validation.dataType === "date") {
                 parsedToDate = calc.runtime.parseDate(validation.to);
                 if (parsedToDate) {
-                    validation.to = kendoFormat(DATE_FORMAT, validation.to);
+                    validation.to = intl().format(DATE_FORMAT, validation.to);
                     validation.toIsDateValue = true;
                 }
             }
@@ -12786,7 +12826,7 @@
             comparer = validationExport.validationComparers[validation.comparerType];
         }
         if (!comparer) {
-            throw kendoFormat("'{0}' comparer is not implemented.", validation.comparerType);
+            throw intl().format("'{0}' comparer is not implemented.", validation.comparerType);
         }
         validationHandler = function(valueToCompare) { //add 'valueFormat' arg when add isDate comparer
             let toValue = this.to && (this.to_value || this.to_value === 0) ? this.to_value : undefined;
@@ -12852,7 +12892,7 @@
             let dataType = this.dataType;
             let type = this.type;
             let comparerType = this.comparerType;
-            return kendoFormat(format, from, to, fromFormula, toFormula, dataType, type, comparerType);
+            return intl().format(format, from, to, fromFormula, toFormula, dataType, type, comparerType);
         }
         _setMessages() {
             this.title = "";
@@ -13249,7 +13289,8 @@
                         }
                     }
                     if (type === "date") {
-                        value = kendoIntl.toString(serialToDate(value), culture().calendar.patterns.d, locale());
+                        const intlVal = intl();
+                        value = intlVal.toString(serialToDate(value), culture().calendar.patterns.d, intlVal.locale);
                     } else if (type === "percent") {
                         value = calc.runtime.limitPrecision(value * 100) + "%";
                     } else if (typeof value == "string" &&
@@ -14736,49 +14777,6 @@
         return oldRect && (oldRect.top !== newRect.top || oldRect.left !== newRect.left);
     }
 
-    /* eslint-disable key-spacing */
-    const messages = {};
-    messages.view = {
-        nameBox: "Name Box",
-        errors: {
-            openUnsupported: "Unsupported format. Please select an .xlsx file.",
-            shiftingNonblankCells: "Cannot insert cells due to data loss possibility. Select another insert location or delete the data from the end of your worksheet.",
-            insertColumnWhenRowIsSelected: "Cannot insert column when all columns are selected.",
-            insertRowWhenColumnIsSelected: "Cannot insert row when all rows are selected.",
-            filterRangeContainingMerges: "Cannot create a filter within a range containing merges",
-            sortRangeContainingMerges: "Cannot sort a range containing merges",
-            cantSortMultipleSelection: "Cannot sort multiple selection",
-            cantSortNullRef: "Cannot sort empty selection",
-            cantSortMixedCells: "Cannot sort range containing cells of mixed shapes",
-            validationError: "The value that you entered violates the validation rules set on the cell.",
-            cannotModifyDisabled: "Cannot modify disabled cells.",
-            insertRowBelowLastRow: "Cannot insert row below the last row.",
-            insertColAfterLastCol: "Cannot insert column to the right of the last column."
-        },
-        tabs: {
-            home: "Home",
-            insert: "Insert",
-            data: "Data"
-        }
-    };
-
-    messages.menus = {
-        "cut"          : "Cut",
-        "copy"         : "Copy",
-        "paste"        : "Paste",
-        "merge"        : "Merge",
-        "unmerge"      : "Unmerge",
-        "delete"       : "Delete",
-        "hide"         : "Hide",
-        "unhide"       : "Unhide",
-        "bringToFront" : "Bring to front",
-        "sendToBack"   : "Send to back"
-    };
-
-    messages.workbook = {
-        defaultSheetName: "Sheet"
-    };
-
     const ampRegExp = /&/g,
         ltRegExp = /</g,
         quoteRegExp = /"/g,
@@ -17377,15 +17375,17 @@
         };
     });
 
-    culture().calendar.months.format.wide.forEach(function(month, index) {
-        DynamicFilter.prototype[month.toLowerCase()] = function(value) {
-            if (value instanceof Date) {
-                return value.getMonth() === index;
-            }
+    const initDynamicFilter = () => {
+        culture().calendar.months.format.wide.forEach(function(month, index) {
+            DynamicFilter.prototype[month.toLowerCase()] = function(value) {
+                if (value instanceof Date) {
+                    return value.getMonth() === index;
+                }
 
-            return false;
-        };
-    });
+                return false;
+            };
+        });
+    };
 
     function quarter(value) {
         var month = value.getMonth() + 1;
@@ -20487,7 +20487,7 @@
         //                 if (options.useGridFormat) {
         //                     if (value != null) {
         //                         if (col.format) {
-        //                             value = kendoFormat(col.format, value);
+        //                             value = intl().format(col.format, value);
         //                         } else {
         //                             value += "";
         //                         }
@@ -21785,13 +21785,13 @@
             if (this._isFormula() && !this._navigated) {
                 value = ((this._tokenContext() || {}).token || {}).value;
 
-                this.filter(value);
+                const data = this.filter(value);
 
-                if (!value || !this.formulaSource.length) {
+                if (!value || !data.length) {
                     popup.close();
                 } else {
                     popup[popup.visible() ? "position" : "open"]();
-                    this.list.focusFirst();
+                    setTimeout(() => { this.list.focusFirst(); }, 0);
                 }
             }
 
@@ -21934,7 +21934,11 @@
                 return;
             }
 
-            this.list.data(this.formulaSource.filter((item) => String(item.value).startsWith(value)));
+            const data = this.formulaSource.filter((item) => String(item.value).startsWith(value.toLowerCase()));
+
+            this.list.data(data);
+
+            return data;
         }
 
         hide() {
@@ -22115,8 +22119,10 @@
             if (width > element.offsetWidth) {
                 element.style.width = width + 'px';
             }
-            if (height > element.offsetHeight) {
-                element.style.height = height + 'px';
+
+            const activeCellOutlineWidth = 1;
+            if (height - activeCellOutlineWidth > element.offsetHeight) {
+                element.style.height = (height - activeCellOutlineWidth) + 'px';
             }
 
             this._sync();
@@ -25904,7 +25910,7 @@
                             } else if (type === "b") {
                                 value = value === "1";
                             } else if (type === "d") {
-                                value = kendoIntl.parseDate(value);
+                                value = intl().parseDate(value);
                             }
 
                             if (value != null) {
@@ -26047,7 +26053,7 @@
         let relationships = await readRelationships(zip, relsFile);
 
         if (relationships.byType.image) {
-            await Object.keys(relationships.byId).forEach(async function(id) {
+            for (const id of Object.keys(relationships.byId)) {
                 let img = relative_file(file, relationships.byId[id]);
                 let type = getContentType(img);
 
@@ -26059,7 +26065,7 @@
                         : new window.Blob([ data ], { type: type });
                     relationships.byId[id] = sheet._workbook.addImage(blob);
                 }
-            });
+            }
         }
 
         let cdr, ref, width, height;
@@ -26754,7 +26760,7 @@
         return val / 9525;
     }
 
-    /* eslint-disable no-nested-ternary */
+    /* eslint-disable no-undef */
 
     const events$1 = [
         "cut",
@@ -27062,6 +27068,7 @@
             let insertIndex = typeof options.index === "number" ? options.index : that._sheets.length;
             let sheetName;
             let sheets = that._sheets;
+            const messages = this.options.messages;
 
             let getUniqueSheetName = function(sheetNameSuffix) {
                 sheetNameSuffix = sheetNameSuffix ? sheetNameSuffix : 1;
@@ -27259,33 +27266,33 @@
             this._imgID = 0;
         }
 
-        // _loadImages() {
-        //     let self = this;
-        //     let ids = Object.keys(self._images);
-        //     let count = ids.length;
-        //     if (count) {
-        //         ids.forEach(function(id){
-        //             let img = self._images[id];
-        //             if (!img.blob) {
-        //                 loadBinary(img.url, function(data, type) {
-        //                     // XXX: can we do something better in case of error?
-        //                     if (data != null) {
-        //                         img.blob = new Blob([ data ], { type: type });
-        //                         delete img.url;
-        //                     }
-        //                     next();
-        //                 });
-        //             }
-        //         });
-        //     } else {
-        //         next();
-        //     }
-        //     function next() {
-        //         if (--count <= 0) {
-        //             self.activeSheet().triggerChange({ layout: true });
-        //         }
-        //     }
-        // },
+        _loadImages() {
+            let self = this;
+            let ids = Object.keys(self._images);
+            let count = ids.length;
+            if (count) {
+                ids.forEach(function(id){
+                    let img = self._images[id];
+                    if (!img.blob) {
+                        loadBinary(img.url, function(data, type) {
+                            // XXX: can we do something better in case of error?
+                            if (data != null) {
+                                img.blob = new Blob([ data ], { type: type });
+                                delete img.url;
+                            }
+                            next();
+                        });
+                    }
+                });
+            } else {
+                next();
+            }
+            function next() {
+                if (--count <= 0) {
+                    self.activeSheet().triggerChange({ layout: true });
+                }
+            }
+        }
 
         fromJSON(json) {
             if (json.sheets) {
@@ -27303,7 +27310,7 @@
                         }
                         this._images[id] = { url: json.images[id] };
                     }, this);
-                    // this._loadImages();
+                    this._loadImages();
                 }
 
                 for (let idx = 0; idx < json.sheets.length; idx++) {
@@ -27370,47 +27377,42 @@
                     return sheet.toJSON();
                 }, this),
                 names: names,
+                images: {},
                 columnWidth: this.options.columnWidth,
                 rowHeight: this.options.rowHeight
             };
         }
 
         saveJSON() {
-            // PoC only
-            window.console.log('`saveJSON` function not implemented');
-            // let self = this;
-            // let deferred = new $.Deferred();
-            // let data = self.toJSON();
-            // let ids = Object.keys(self._images).filter(function(id) {
-            //     return self.usesImage(id) === 1;
-            // });
-            // let count = ids.length;
-            // data.images = {};
-            // if (count) {
-            //     ids.forEach(function(id) {
-            //         let img = self._images[id];
-            //         if (img.blob) {
-            //             let reader = new FileReader();
-            //             reader.onload = function() {
-            //                 data.images[id] = reader.result;
-            //                 next();
-            //             };
-            //             reader.readAsDataURL(img.blob);
-            //         } else {
-            //             data.images[id] = img.url;
-            //             next();
-            //         }
-            //     });
-            // } else {
-            //     next();
-            // }
-            // return deferred.promise();
+            let self = this;
+            let data = self.toJSON();
+            let ids = Object.keys(self._images).filter(function(id) {
+                return self.usesImage(id) === 1;
+            });
+            let count = ids.length;
 
-            // function next() {
-            //     if (--count <= 0) {
-            //         deferred.resolve(data);
-            //     }
-            // }
+            const promises = [];
+
+            if (count) {
+                ids.forEach(function(id) {
+                    let img = self._images[id];
+                    if (img.blob) {
+                        const promise = new Promise((resolve) => {
+                            let reader = new FileReader();
+                            reader.onload = function() {
+                                data.images[id] = reader.result;
+                                resolve();
+                            };
+                            reader.readAsDataURL(img.blob);
+                        });
+                        promises.push(promise);
+                    } else {
+                        data.images[id] = img.url;
+                    }
+                });
+            }
+
+            return Promise.all(promises).then(() => data);
         }
 
         fromFile(file) {
@@ -27745,11 +27747,12 @@
 
     class Spreadsheet extends Widget {
         constructor(element, options$1) {
-            super(element, Object.assign({}, options, options$1));
+            super(element, deepExtend({}, options, options$1));
             this.events = events;
             this.bind(this.events, this.options);
 
-            locale(this.options.locale);
+            intl({ locale: this.options.locale, ...this.options.intl });
+            initDynamicFilter();
 
             this._view = new View(this.element, {
                 messages: this.options.messages.view,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-spreadsheet-common",
   "description": "Kendo UI platform-independent Spreadsheet library",
-  "version": "1.0.0-develop.5",
+  "version": "1.0.0-develop.7",
   "keywords": [
     "Kendo UI"
   ],
@@ -24,13 +24,13 @@
     "@progress/kendo-common": "^0.2.2",
     "@progress/kendo-date-math": "^1.5.10",
     "@progress/kendo-drawing": "^1.17.5",
-    "@progress/jszip-esm": "^1.0.3",
-    "@progress/kendo-intl": "^3.1.1"
+    "@progress/jszip-esm": "^1.0.3"
   },
   "devDependencies": {
     "@commitlint/cli": "^17.3.0",
     "@commitlint/config-conventional": "^17.3.0",
     "@progress/kendo-e2e": "^1.3.0",
+    "@progress/kendo-intl": "^3.1.1",
     "@types/jest": "^29.0.0",
     "es-jest": "^2.1.0",
     "eslint": "^8.28.0",

package/src/index.d.ts

@@ -395,6 +395,12 @@ export class Spreadsheet {
      */
     toJSON(): DocumentDescriptor;
 
+    /**
+     * Serializes the workbook. This method does not return the JSON, but a Promise object which will yield the JSON data when it is available.
+     * The method is functionally similar to `toJSON`, but it is also able to save the embedded images (this is the reason why it must be asynchronous).
+     */
+    saveJSON(): Promise<DocumentDescriptor>;
+
     /**
      * Clears the Spreadsheet and populates it with data from the specified Excel (.xlsx) file.
      *