documentation(EJ2-1023830): Create new repos for Getting Started Sample for all the Spreadsheet Platforms

.github/workflows/gitleaks.yaml

@@ -0,0 +1,44 @@
+name: Secret Value found!!
+on:
+  push:
+  public:
+jobs:
+  scan:
+    name: gitleaks
+    runs-on: ubuntu-latest
+    steps:
+     - name: Checkout
+       uses: actions/checkout@v4.2.2 
+     - name: Install the gitleaks
+       run: wget https://github.com/zricethezav/gitleaks/releases/download/v8.15.2/gitleaks_8.15.2_linux_x64.tar.gz
+       shell: pwsh
+     - name: Extract the tar file
+       run: tar xzvf gitleaks_8.15.2_linux_x64.tar.gz
+     - name: Generate the report
+       id: gitleaks
+       run: $GITHUB_WORKSPACE/gitleaks detect -s $GITHUB_WORKSPACE -f json -r $GITHUB_WORKSPACE/leaksreport.json
+       shell: bash
+       continue-on-error: true
+     - name: Setup NuGet.exe
+       if: steps.gitleaks.outcome != 'success'
+       uses: nuget/setup-nuget@v2
+       with:
+          nuget-version: latest
+     - name: Install Mono
+       if: steps.gitleaks.outcome != 'success'
+       run: |
+        sudo apt update
+        sudo apt install -y mono-complete
+     - name: Install the dotnet SDK to a custom directory
+       if: steps.gitleaks.outcome != 'success'
+       run: |
+        mkdir -p $GITHUB_WORKSPACE/dotnet
+        curl -sSL https://dot.net/v1/dotnet-install.sh | bash /dev/stdin --install-dir $GITHUB_WORKSPACE/dotnet --channel 6.0
+     - name: Install the report tool packages
+       if: steps.gitleaks.outcome != 'success'
+       run: |
+           export PATH=$GITHUB_WORKSPACE/dotnet:$PATH
+           nuget install "Syncfusion.Email" -source ${{ secrets.NexusFeedLink }} -ExcludeVersion
+           dir $GITHUB_WORKSPACE/Syncfusion.Email/lib/net6.0
+           dotnet $GITHUB_WORKSPACE/Syncfusion.Email/lib/net6.0/GitleaksReportMail.dll ${{ secrets.CITEAMCREDENTIALS }} "$GITHUB_REF_NAME" ${{ secrets.NETWORKCREDENTIALS }} ${{ secrets.NETWORKKEY }} "$GITHUB_WORKSPACE" ${{ secrets.ORGANIZATIONNAME }}
+           exit 1

.gitignore

@@ -0,0 +1,2 @@
+dist/
+node_modules/

README.md

@@ -1,2 +1,28 @@
-# getting-started-with-the-javascript-spreadsheet-control
-This repository provides a getting started sample for the Syncfusion JavaScript Spreadsheet Component, demonstrating basic setup and usage.
+# Getting Started with the JavaScript Spreadsheet Component
+
+A quick-start project that helps you create and configure the Syncfusion JavaScript (TypeScript) Spreadsheet component using Essential JS 2.
+
+## Documentation
+
+- Getting Started Guide: https://help.syncfusion.com/document-processing/excel/spreadsheet/javascript-es6/getting-started
+- Online Demo: https://document.syncfusion.com/demos/spreadsheet-editor/javascript/#/tailwind3/spreadsheet/default.html
+
+## Project Prerequisites
+
+- Node.js (v14.15.0 or higher)
+- npm
+- Webpack CLI
+
+## How to run this application?
+
+1. Clone the repository.
+2. Open the project folder in Visual Studio Code.
+3. Install the required packages using:
+   ```
+   npm install
+   ```
+4. Run the application using:
+   ```
+   npm start
+   ```
+5. Open the application URL shown in the terminal.

e2e/protractor.conf.js

@@ -0,0 +1,21 @@
+exports.config = {
+
+    allScriptsTimeout: 11000,
+
+    capabilities: {
+        'browserName': 'chrome'
+    },
+
+    framework: 'jasmine',
+
+    jasmineNodeOpts: {
+        defaultTimeoutInterval: 10000
+    },
+    directConnect: true,
+
+    onPrepare: function() {
+        browser.waitForAngularEnabled(false);
+    },
+
+    specs: ['./*.spec.js']
+};

gulpfile.js

@@ -0,0 +1,62 @@
+'use strict';
+
+var gulp = require('gulp');
+
+/** 
+ * Compile TypeScript to JS
+ */
+gulp.task('compile', function (done) {
+    var webpack = require('webpack');
+    var webpackStream = require('webpack-stream');
+    gulp.src(['./src/app/app.ts']).pipe(webpackStream({
+        config: require('./webpack.config.js')
+    }, webpack))
+        .pipe(gulp.dest('./dist'))
+        .on('end', function () {
+            done();
+        });
+});
+
+/**
+ * Testing spec files
+ */
+var protractor = require('gulp-protractor').protractor;
+var webdriver_standalone = require('gulp-protractor').webdriver_standalone;
+var webdriver_update = require('gulp-protractor').webdriver_update_specific;
+
+gulp.task('e2e-serve', webdriver_standalone);
+
+gulp.task('e2e-webdriver-update', webdriver_update({
+    webdriverManagerArgs: ['--ie', '--edge']
+}));
+
+gulp.task('e2e-test', gulp.series('compile', function (done) {
+    var browserSync = require('browser-sync');
+    var bs = browserSync.create('Essential JS 2');
+    var options = {
+        server: {
+            baseDir: [
+                './dist/',
+            ],
+            directory: true
+        },
+        ui: false,
+        open: false,
+        notify: false
+    };
+    bs.init(options, function () {
+        gulp.src(['./spec/**/*.spec.js'])
+            .pipe(protractor({
+                configFile: 'e2e/protractor.conf.js'
+            }))
+            .on('error', function (e) {
+                console.error('Error: ' + e.message);
+                done();
+                process.exit(1);
+            })
+            .on('end', function () {
+                done();
+                process.exit(0);
+            });
+    });
+}));

license

@@ -0,0 +1,10 @@
+Essential JS 2 library is available under the Syncfusion Essential Studio program,  and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license.
+
+To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions. 
+
+Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options.
+
+Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions. 
+
+The Syncfusion license that contains the terms and conditions can be found at 
+https://www.syncfusion.com/content/downloads/syncfusion_license.pdf

package.json

@@ -0,0 +1,38 @@
+{
+  "name": "ej2-quickstart",
+  "version": "0.0.1",
+  "description": "Essential JS 2 typescript quick start application",
+  "author": "Syncfusion Inc.",
+  "license": "SEE LICENSE IN license",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/syncfusion/ej2-quickstart.git"
+  },
+  "scripts": {
+    "start": "webpack serve --mode development",
+    "build": "webpack --mode production",
+    "serve": "gulp e2e-serve",
+    "test": "gulp e2e-test",
+    "update-webdriver": "gulp e2e-webdriver-update"
+  },
+  "devDependencies": {
+    "ajv": "^8.11.2",
+    "browser-sync": "^2.18.12",
+    "css-loader": "^6.7.2",
+    "gulp": "*",
+    "gulp-protractor": "*",
+    "gulp-typescript": "*",
+    "html-webpack-plugin": "^5.5.0",
+    "jasmine": "^2.6.0",
+    "mini-css-extract-plugin": "^2.7.0",
+    "ts-loader": "^9.4.1",
+    "typescript": "*",
+    "webpack": "^5.75.0",
+    "webpack-cli": "^5.0.0",
+    "webpack-dev-server": "^5.2.1",
+    "webpack-stream": "^7.0.0"
+  },
+  "dependencies": {
+    "@syncfusion/ej2": "*"
+  }
+}

src/app/app.ts

@@ -0,0 +1,10 @@
+import { Spreadsheet } from '@syncfusion/ej2-spreadsheet';
+
+// Initialize the Spreadsheet component
+const spreadsheet: Spreadsheet = new Spreadsheet({
+    openUrl: 'https://document.syncfusion.com/web-services/spreadsheet-editor/api/spreadsheet/open',
+    saveUrl: 'https://document.syncfusion.com/web-services/spreadsheet-editor/api/spreadsheet/save'
+});
+
+// Render initialized Spreadsheet
+spreadsheet.appendTo('#element');

src/index.html

@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <title>Syncfusion TypeScript Spreadsheet</title>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
+    <meta name="description" content="Syncfusion TypeScript Spreadsheet" />
+    <meta name="author" content="Syncfusion" />
+    <link rel="shortcut icon" href="resources/favicon.ico" />
+    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
+</head>
+<body>
+    <!-- Element which will render as Spreadsheet -->
+    <div id="element"></div>
+</body>
+</html>

src/styles/styles.css

@@ -0,0 +1,10 @@
+@import '../../node_modules/@syncfusion/ej2-base/styles/tailwind3.css';
+@import '../../node_modules/@syncfusion/ej2-inputs/styles/tailwind3.css';
+@import '../../node_modules/@syncfusion/ej2-buttons/styles/tailwind3.css';
+@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/tailwind3.css';
+@import '../../node_modules/@syncfusion/ej2-lists/styles/tailwind3.css';
+@import '../../node_modules/@syncfusion/ej2-navigations/styles/tailwind3.css';
+@import '../../node_modules/@syncfusion/ej2-popups/styles/tailwind3.css';
+@import '../../node_modules/@syncfusion/ej2-dropdowns/styles/tailwind3.css';
+@import '../../node_modules/@syncfusion/ej2-grids/styles/tailwind3.css';
+@import '../../node_modules/@syncfusion/ej2-spreadsheet/styles/tailwind3.css';

tsconfig.json

@@ -0,0 +1,11 @@
+{
+  "compilerOptions": {
+    "target": "ES2017",
+    "module": "node16",
+    "moduleResolution": "node16",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true
+  }
+}

webpack.config.js

@@ -0,0 +1,45 @@
+const HtmlWebpackPlugin = require("html-webpack-plugin");
+const MiniCssExtractPlugin = require("mini-css-extract-plugin");
+const path = require('path');
+
+module.exports = {
+    entry: ['./src/app/app.ts', './src/styles/styles.css'],
+    module: {
+        rules: [
+            {
+                test: /\.ts?$/,
+                use: 'ts-loader',
+                exclude: /node_modules/,
+            },
+            {
+                test: /\.css$/,
+                use: [ MiniCssExtractPlugin.loader, "css-loader" ]
+            },
+        ],
+    },
+    resolve: {
+        extensions: ['.ts', '.js'],
+    },
+    output: {
+        filename: 'bundle.js',
+        path: path.resolve(__dirname, 'dist'),
+    },
+    plugins: [
+        new HtmlWebpackPlugin({
+            template: 'src/index.html'
+        }),
+        new MiniCssExtractPlugin({
+            filename: "bundle.css"
+        })
+    ],
+    devServer: {
+        static: {
+            directory: path.join(__dirname, "dist"),
+        },
+        compress: true,
+        port: 4000,
+        open: true,
+        hot: true,
+        historyApiFallback: true
+    },
+};