Merge remote-tracking branch 'origin/vnext' into add-ci

azure-pipelines/build-pipeline.yml

@@ -11,6 +11,10 @@ parameters:
   displayName: 'Get verbose output from steps - where configurable'
   type: boolean
   default: false
+- name: shouldCleanPostExectuion
+  displayName: 'Clean all pipeline dirs after the pipeline finishes?'
+  type: boolean
+  default: true
 
 name: $(BuildDefinitionName)_$(Year:yyyy).$(Month).$(DayOfMonth)$(Rev:.r)
 
@@ -133,3 +137,6 @@ stages:
         inputs:
           targetPath: '$(Build.ArtifactStagingDirectory)/ReactSamples.zip'
           artifact: 'ReactSamplesBrowser'
+
+      - ${{ if eq(parameters.shouldCleanPostExectuion, true) }}:
+        - task: PostBuildCleanup@4

samples/charts/data-chart/data-legend-grouping-and-highlighting/.eslintrc.js

@@ -0,0 +1,76 @@
+// https://www.robertcooper.me/using-eslint-and-prettier-in-a-typescript-project
+module.exports = {
+    parser: "@typescript-eslint/parser", // Specifies the ESLint parser
+    parserOptions: {
+        ecmaVersion: 2020, // Allows for the parsing of modern ECMAScript features
+        sourceType: "module", // Allows for the use of imports
+        ecmaFeatures: {
+            jsx: true // Allows for the parsing of JSX
+        }
+    },
+    settings: {
+        react: {
+            version: "999.999.999" // Tells eslint-plugin-react to automatically detect the version of React to use
+        }
+    },
+    extends: [
+        "eslint:recommended",
+        "plugin:react/recommended", // Uses the recommended rules from @eslint-plugin-react
+        "plugin:@typescript-eslint/recommended" // Uses the recommended rules from @typescript-eslint/eslint-plugin
+    ],
+    rules: {
+      // Place to specify ESLint rules. Can be used to overwrite rules specified from the extended configs
+      "default-case": "off",
+      "jsx-a11y/alt-text": "off",
+      "jsx-a11y/iframe-has-title": "off",
+      "no-undef": "off",
+      "no-unused-vars": "off",
+      "no-extend-native": "off",
+      "no-throw-literal": "off",
+      "no-useless-concat": "off",
+      "no-mixed-operators": "off",
+      "no-prototype-builtins": "off",
+      "prefer-const": "off",
+      "prefer-rest-params": "off",
+      "@typescript-eslint/no-unused-vars": "off",
+      "@typescript-eslint/no-explicit-any": "off",
+      "@typescript-eslint/no-inferrable-types": "off",
+      "@typescript-eslint/no-useless-constructor": "off",
+      "@typescript-eslint/no-use-before-define": "off",
+      "@typescript-eslint/no-non-null-assertion": "off",
+      "@typescript-eslint/interface-name-prefix": "off",
+      "@typescript-eslint/prefer-namespace-keyword": "off",
+      "@typescript-eslint/explicit-function-return-type": "off",
+      "@typescript-eslint/explicit-module-boundary-types": "off"
+    },
+    "overrides": [
+      {
+        "files": ["*.ts", "*.tsx"],
+        "rules": {
+            "default-case": "off",
+            "jsx-a11y/alt-text": "off",
+            "jsx-a11y/iframe-has-title": "off",
+            "no-var": "off",
+            "no-undef": "off",
+            "no-unused-vars": "off",
+            "no-extend-native": "off",
+            "no-throw-literal": "off",
+            "no-useless-concat": "off",
+            "no-mixed-operators": "off",
+            "no-prototype-builtins": "off",
+            "prefer-const": "off",
+            "prefer-rest-params": "off",
+            "@typescript-eslint/no-unused-vars": "off",
+            "@typescript-eslint/no-explicit-any": "off",
+            "@typescript-eslint/no-inferrable-types": "off",
+            "@typescript-eslint/no-useless-constructor": "off",
+            "@typescript-eslint/no-use-before-define": "off",
+            "@typescript-eslint/no-non-null-assertion": "off",
+            "@typescript-eslint/interface-name-prefix": "off",
+            "@typescript-eslint/prefer-namespace-keyword": "off",
+            "@typescript-eslint/explicit-function-return-type": "off",
+            "@typescript-eslint/explicit-module-boundary-types": "off"
+        }
+      }
+    ]
+  };

samples/charts/data-chart/data-legend-grouping-and-highlighting/package.json

@@ -0,0 +1,45 @@
+{
+  "name": "example-ignite-ui-react",
+  "description": "This project provides example of using Ignite UI for React components",
+  "author": "Infragistics",
+  "version": "1.4.0",
+  "license": "",
+  "homepage": ".",
+  "private": true,
+  "scripts": {
+    "start": "set PORT=4200 && react-scripts --max_old_space_size=10240 start",
+    "build": "react-scripts --max_old_space_size=10240 build ",
+    "test": "react-scripts test --env=jsdom",
+    "eject": "react-scripts eject",
+    "lint": "eslint ./src/**/*.{ts,tsx}"
+  },
+  "dependencies": {
+    "igniteui-react": "18.6.1-alpha.0",
+    "igniteui-react-charts": "18.6.1-alpha.0",
+    "igniteui-react-core": "18.6.1-alpha.0",
+    "igniteui-webcomponents": "4.9.0",
+    "lit-html": "^2.2.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-scripts": "^5.0.1",
+    "tslib": "^2.4.0"
+  },
+  "devDependencies": {
+    "@types/jest": "^29.2.0",
+    "@types/node": "^18.11.7",
+    "@types/react": "^18.0.24",
+    "@types/react-dom": "^18.0.8",
+    "eslint": "^8.33.0",
+    "eslint-config-react": "^1.1.7",
+    "eslint-plugin-react": "^7.20.0",
+    "react-app-rewired": "^2.2.1",
+    "typescript": "^4.8.4",
+    "worker-loader": "^3.0.8"
+  },
+  "browserslist": [
+    ">0.2%",
+    "not dead",
+    "not ie <= 11",
+    "not op_mini all"
+  ]
+}

samples/charts/data-chart/data-legend-grouping-and-highlighting/public/index.html

@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>Sample | Ignite UI | React | infragistics</title>
+    <link rel="shortcut icon" href="https://static.infragistics.com/xplatform/images/browsers/react.png" >
+    <link rel="stylesheet"    href="https://static.infragistics.com/xplatform/css/samples/shared.v8.css" />
+  </head>
+  <body>
+    <div id="root"></div>
+  </body>
+</html>

samples/charts/data-chart/data-legend-grouping-and-highlighting/sandbox.config.json

@@ -0,0 +1,5 @@
+{
+    "infiniteLoopProtection": false,
+    "hardReloadOnChange": false,
+    "view": "browser"
+}

samples/charts/data-chart/data-legend-grouping-and-highlighting/src/OlympicMedalsTopCountriesWithTotals.ts

@@ -0,0 +1,92 @@
+export class OlympicMedalsTopCountriesWithTotalsItem {
+    public constructor(init: Partial<OlympicMedalsTopCountriesWithTotalsItem>) {
+        Object.assign(this, init);
+    }
+
+    public year: string;
+    public america: number;
+    public americaGold: number;
+    public china: number;
+    public chinaGold: number;
+    public russia: number;
+    public russiaGold: number;
+    public total: number;
+
+}
+export class OlympicMedalsTopCountriesWithTotals extends Array<OlympicMedalsTopCountriesWithTotalsItem> {
+    public constructor(items: Array<OlympicMedalsTopCountriesWithTotalsItem> | number = -1) {
+        if (Array.isArray(items)) {
+            super(...items);
+        } else {
+            const newItems = [
+                new OlympicMedalsTopCountriesWithTotalsItem(
+                {
+                    year: `1996`,
+                    america: 148,
+                    americaGold: 50,
+                    china: 110,
+                    chinaGold: 40,
+                    russia: 95,
+                    russiaGold: 20,
+                    total: 353
+                }),
+                new OlympicMedalsTopCountriesWithTotalsItem(
+                {
+                    year: `2000`,
+                    america: 142,
+                    americaGold: 40,
+                    china: 115,
+                    chinaGold: 45,
+                    russia: 91,
+                    russiaGold: 40,
+                    total: 348
+                }),
+                new OlympicMedalsTopCountriesWithTotalsItem(
+                {
+                    year: `2004`,
+                    america: 134,
+                    americaGold: 35,
+                    china: 121,
+                    chinaGold: 55,
+                    russia: 86,
+                    russiaGold: 25,
+                    total: 341
+                }),
+                new OlympicMedalsTopCountriesWithTotalsItem(
+                {
+                    year: `2008`,
+                    america: 131,
+                    americaGold: 20,
+                    china: 129,
+                    chinaGold: 35,
+                    russia: 65,
+                    russiaGold: 35,
+                    total: 325
+                }),
+                new OlympicMedalsTopCountriesWithTotalsItem(
+                {
+                    year: `2012`,
+                    america: 135,
+                    americaGold: 25,
+                    china: 115,
+                    chinaGold: 50,
+                    russia: 77,
+                    russiaGold: 15,
+                    total: 327
+                }),
+                new OlympicMedalsTopCountriesWithTotalsItem(
+                {
+                    year: `2016`,
+                    america: 146,
+                    americaGold: 45,
+                    china: 112,
+                    chinaGold: 45,
+                    russia: 88,
+                    russiaGold: 30,
+                    total: 346
+                }),
+            ];
+            super(...(newItems.slice(0, items)));
+        }
+    }
+}

samples/charts/data-chart/data-legend-grouping-and-highlighting/src/index.css

@@ -0,0 +1,2 @@
+/* shared styles are loaded from: */
+/* https://static.infragistics.com/xplatform/css/samples */