feat(package): add new Export (csv, txt) package

packages/common/package.json

@@ -71,6 +71,7 @@
     "@types/dompurify": "^2.0.1",
     "@types/jest": "^25.2.1",
     "@types/jquery": "^3.3.35",
+    "@types/lodash.isequal": "^4.5.5",
     "@types/moment": "^2.13.0",
     "@types/node": "^13.13.1",
     "autoprefixer": "^9.7.6",

packages/common/src/global-grid-options.ts

@@ -1,4 +1,4 @@
-import { EventNamingStyle, OperatorType, GridAutosizeColsMode } from './enums/index';
+import { DelimiterType, EventNamingStyle, FileType, GridAutosizeColsMode, OperatorType } from './enums/index';
 import { GridOption } from './interfaces/gridOption.interface';
 import { Filters } from './filters';
 
@@ -92,7 +92,7 @@ export const GlobalGridOptions: GridOption = {
   enableColumnReorder: true,
   enableContextMenu: true,
   //   enableExcelExport: true, // Excel Export is the new default,
-  //   enableExport: false, // CSV/Text with Tab Delimited
+  enableExport: true, // CSV/Text with Tab Delimited
   enableGridMenu: true,
   enableHeaderMenu: true,
   enableMouseHoverHighlightRow: true,
@@ -110,16 +110,16 @@ export const GlobalGridOptions: GridOption = {
   // //     groupingAggregatorRowText: '',
   // //     sanitizeDataExport: false,
   // //   },
-  // //   exportOptions: {
-  // //     delimiter: DelimiterType.comma,
-  // //     exportWithFormatter: false,
-  // //     filename: 'export',
-  // //     format: FileType.csv,
-  // //     groupingColumnHeaderTitle: 'Group By',
-  // //     groupingAggregatorRowText: '',
-  // //     sanitizeDataExport: false,
-  // //     useUtf8WithBom: true
-  // //   },
+  exportOptions: {
+    delimiter: DelimiterType.comma,
+    exportWithFormatter: false,
+    filename: 'export',
+    format: FileType.csv,
+    groupingColumnHeaderTitle: 'Group By',
+    groupingAggregatorRowText: '',
+    sanitizeDataExport: false,
+    useUtf8WithBom: true
+  },
   gridAutosizeColsMode: GridAutosizeColsMode.none,
   eventNamingStyle: EventNamingStyle.lowerCase,
   forceFitColumns: false,

packages/common/src/interfaces/index.ts

@@ -72,7 +72,7 @@ export * from './headerMenu.interface';
 export * from './htmlElementPosition.interface';
 export * from './jQueryUiSliderOption.interface';
 export * from './jQueryUiSliderResponse.interface';
-export * from './locale.interface';
+export * from './keyTitlePair.interface';
 export * from './menuCallbackArgs.interface';
 export * from './menuCommandItem.interface';
 export * from './menuCommandItemCallbackArgs.interface';
@@ -82,13 +82,14 @@ export * from './menuOptionItemCallbackArgs.interface';
 export * from './metrics.interface';
 export * from './multiColumnSort.interface';
 export * from './multipleSelectOption.interface';
-export * from './onEventArgs.interface';
+export * from './locale.interface';
 export * from './pagination.interface';
 export * from './paginationChangedArgs.interface';
 export * from './rowMoveManager.interface';
 export * from './selectedRange.interface';
-export * from './selectOption.interface';
+export * from './onEventArgs.interface';
 export * from './servicePagination.interface';
+export * from './selectOption.interface';
 export * from './slickEvent.interface';
 export * from './slickEventData.interface';
 export * from './slickEventHandler.interface';

packages/common/src/interfaces/keyTitlePair.interface.ts

@@ -0,0 +1,4 @@
+export interface KeyTitlePair {
+  key: string;
+  title: string;
+}

packages/common/src/services/__tests__/utilities.spec.ts

@@ -13,7 +13,6 @@ import {
   getHtmlElementOffset,
   htmlEncode,
   htmlEntityDecode,
-  htmlEntityEncode,
   mapMomentDateFormatWithFieldType,
   mapFlatpickrDateFormatWithFieldType,
   mapOperatorByFieldType,
@@ -94,18 +93,6 @@ describe('Service/Utilies', () => {
     });
   });
 
-  describe('htmlEntityEncode method', () => {
-    it('should be able to encode HTML entity of an HTML string', () => {
-      const result = htmlEntityEncode(`<div>a</div>`);
-      expect(result).toBe(`&#60;&#100;&#105;&#118;&#62;&#97;&#60;&#47;&#100;&#105;&#118;&#62;`);
-    });
-
-    it('should be able to encode unicode characters and also latin accents', () => {
-      const result = htmlEntityEncode(`Sam's 🚀🦄 español`);
-      expect(result).toBe(`&#83;&#97;&#109;&#39;&#115;&#32;&#55357;&#56960;&#55358;&#56708;&#32;&#101;&#115;&#112;&#97;&#241;&#111;&#108;`);
-    });
-  });
-
   describe('arraysEqual method', () => {
     it('should return false when at least 1 input is not an array', () => {
       const array1 = null;

packages/common/src/services/filter.service.ts

@@ -1,5 +1,4 @@
-import * as isequal_ from 'lodash.isequal';
-const isequal = isequal_; // patch to fix rollup to work
+import isequal from 'lodash.isequal';
 
 import { FilterConditions } from './../filter-conditions/index';
 import { FilterFactory } from './../filters/filterFactory';

packages/common/src/services/gridState.service.ts

@@ -1,5 +1,4 @@
-import * as isequal_ from 'lodash.isequal';
-const isequal = isequal_; // patch to fix rollup to work
+import isequal from 'lodash.isequal';
 
 import {
   ExtensionName,

packages/common/src/services/pagination.service.ts

@@ -1,5 +1,4 @@
-import * as isequal_ from 'lodash.isequal';
-const isequal = isequal_; // patch to fix rollup to work
+import isequal from 'lodash.isequal';
 
 import { BackendServiceApi, CurrentPagination, Pagination, ServicePagination, Subscription } from '../interfaces/index';
 import { executeBackendProcessesCallback, onBackendError } from './backend-utilities';

packages/common/src/services/utilities.ts

@@ -127,6 +127,59 @@ export function convertHierarchicalViewToParentChildArrayByReference(hierarchica
   }
 }
 
+/*!
+ * Create an immutable clone of an array or object
+ * (c) 2019 Chris Ferdinandi, MIT License, https://gomakethings.com
+ * @param  {Array|Object} obj The array or object to copy
+ * @return {Array|Object}     The clone of the array or object
+ */
+export function deepCopy(obj: any) {
+	/**
+	 * Create an immutable copy of an object
+	 * @return {Object}
+	 */
+  const cloneObj = () => {
+    // Create new object
+    const clone = {};
+
+    // Loop through each item in the original
+    // Recursively copy it's value and add to the clone
+    for (let key in obj) {
+      if (obj.hasOwnProperty(key)) {
+        clone[key] = deepCopy(obj[key]);
+      }
+    }
+    return clone;
+  };
+
+	/**
+	 * Create an immutable copy of an array
+	 * @return {Array}
+	 */
+  const cloneArr = () => {
+    return obj.map((item: any) => {
+      return deepCopy(item);
+    });
+  };
+
+  /* Inits */
+
+  // Get object type
+  const type = Object.prototype.toString.call(obj).slice(8, -1).toLowerCase();
+
+  // If an object
+  if (type === 'object') {
+    return cloneObj();
+  }
+  // If an array
+  if (type === 'array') {
+    return cloneArr();
+  }
+
+  // Otherwise, return it as-is
+  return obj;
+}
+
 /**
  * Find an item from a hierarchical view structure (a parent that can have children array which themseleves can children and so on)
  * @param hierarchicalArray
@@ -180,19 +233,6 @@ export function htmlEntityDecode(input: string): string {
   });
 }
 
-/**
- * Decode text into html entity
- * @param string text: input text
- * @param string text: output text
- */
-export function htmlEntityEncode(input: any): string {
-  const buf = [];
-  for (let i = input.length - 1; i >= 0; i--) {
-    buf.unshift(['&#', input[i].charCodeAt(), ';'].join(''));
-  }
-  return buf.join('');
-}
-
 /**
  * Take a number (or a string) and display it as a formatted decimal string with defined minimum and maximum decimals
  * @param input
@@ -864,7 +904,7 @@ export function uniqueObjectArray(arr: any[], propertyName = 'id'): any[] {
     const map = new Map();
 
     for (const item of arr) {
-      if (!map.has(item[propertyName])) {
+      if (item && !map.has(item[propertyName])) {
         map.set(item[propertyName], true);    // set any value to Map
         result.push({
           id: item[propertyName],

packages/common/tsconfig.build.json

@@ -18,6 +18,8 @@
       "../typings",
       "../../node_modules/@types"
     ],
+    "allowSyntheticDefaultImports": true,
+    "importHelpers": true,
     "outDir": "dist/amd",
     "noImplicitAny": true,
     "suppressImplicitAnyIndexErrors": true,

packages/common/tsconfig.json

@@ -8,7 +8,8 @@
     "target": "es2015",
     "module": "esnext",
     "sourceMap": true,
-    "allowSyntheticDefaultImports": false,
+    "allowSyntheticDefaultImports": true,
+    "importHelpers": true,
     "noImplicitReturns": true,
     "lib": [
       "es2020",

packages/export/README.md

@@ -0,0 +1,7 @@
+## Vanilla Bundle 
+#### @slickgrid-universal/export
+
+Simple Export to File Service that allows to export as CSV or Text, user can also choose which separator to use (comma, colon, semicolon, ...).
+
+### Installation
+Follow the instruction provided in the main [README](https://github.com/ghiscoding/slickgrid-universal#installation), you can see a demo by looking at the [GitHub Demo](https://ghiscoding.github.io/slickgrid-universal) page and click on "Export to CSV" from the Grid Menu (aka hamburger menu).

packages/export/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "@slickgrid-universal/export",
+  "version": "0.0.2",
+  "description": "Export to File (CSV/Txt) Service.",
+  "browser": "src/index.ts",
+  "main": "dist/es2020/index.js",
+  "typings": "dist/es2020/index.d.ts",
+  "files": [
+    "src",
+    "dist"
+  ],
+  "scripts": {
+    "build": "cross-env tsc --build",
+    "build:watch": "cross-env tsc --incremental --watch",
+    "dev": "run-s build sass:build sass:copy",
+    "dev:watch": "run-p build:watch",
+    "bundle:commonjs": "tsc --project tsconfig.build.json --outDir dist/commonjs --module commonjs",
+    "bundle:es2020": "cross-env tsc --project tsconfig.build.json --outDir dist/es2020 --module es2015 --target es2020",
+    "bundle": "npm-run-all bundle:commonjs bundle:es2020",
+    "prebundle": "npm-run-all delete:dist",
+    "delete:dist": "cross-env rimraf dist"
+  },
+  "author": "Ghislain B.",
+  "license": "MIT",
+  "engines": {
+    "node": ">=12.13.1",
+    "npm": ">=6.12.1"
+  },
+  "browserslist": [
+    "last 2 version",
+    "> 1%",
+    "maintained node versions",
+    "not dead",
+    "IE 11"
+  ],
+  "dependencies": {
+    "@slickgrid-universal/common": "^0.0.2",
+    "text-encoding-utf-8": "^1.0.2"
+  },
+  "devDependencies": {
+    "@types/text-encoding-utf-8": "^1.0.1",
+    "cross-env": "^7.0.2",
+    "npm-run-all": "^4.1.5",
+    "rimraf": "^3.0.2",
+    "typescript": "^3.8.3"
+  }
+}