Skip to content

Commit 652773e

Browse files
azure-pipelines[bot]tfsbuild
azure-pipelines[bot]
and
tfsbuild
authored
Adding changes from build igniteui-xplat-examples-output+PRs_2024.3.28.1 (#498)
Co-authored-by: tfsbuild <tfsbuild@infragistics.com>
1 parent 5511a3b commit 652773e

29 files changed

Lines changed: 1131 additions & 2 deletions

‎samples/charts/category-chart/highlighting-behavior/.eslintrc.js‎

Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
// https://www.robertcooper.me/using-eslint-and-prettier-in-a-typescript-project
2+
module.exports = {
3+
parser: "@typescript-eslint/parser", // Specifies the ESLint parser
4+
parserOptions: {
5+
ecmaVersion: 2020, // Allows for the parsing of modern ECMAScript features
6+
sourceType: "module", // Allows for the use of imports
7+
ecmaFeatures: {
8+
jsx: true // Allows for the parsing of JSX
9+
}
10+
},
11+
settings: {
12+
react: {
13+
version: "999.999.999" // Tells eslint-plugin-react to automatically detect the version of React to use
14+
}
15+
},
16+
extends: [
17+
"eslint:recommended",
18+
"plugin:react/recommended", // Uses the recommended rules from @eslint-plugin-react
19+
"plugin:@typescript-eslint/recommended" // Uses the recommended rules from @typescript-eslint/eslint-plugin
20+
],
21+
rules: {
22+
// Place to specify ESLint rules. Can be used to overwrite rules specified from the extended configs
23+
"default-case": "off",
24+
"jsx-a11y/alt-text": "off",
25+
"jsx-a11y/iframe-has-title": "off",
26+
"no-undef": "off",
27+
"no-unused-vars": "off",
28+
"no-extend-native": "off",
29+
"no-throw-literal": "off",
30+
"no-useless-concat": "off",
31+
"no-mixed-operators": "off",
32+
"no-prototype-builtins": "off",
33+
"prefer-const": "off",
34+
"prefer-rest-params": "off",
35+
"@typescript-eslint/no-unused-vars": "off",
36+
"@typescript-eslint/no-explicit-any": "off",
37+
"@typescript-eslint/no-inferrable-types": "off",
38+
"@typescript-eslint/no-useless-constructor": "off",
39+
"@typescript-eslint/no-use-before-define": "off",
40+
"@typescript-eslint/no-non-null-assertion": "off",
41+
"@typescript-eslint/interface-name-prefix": "off",
42+
"@typescript-eslint/prefer-namespace-keyword": "off",
43+
"@typescript-eslint/explicit-function-return-type": "off",
44+
"@typescript-eslint/explicit-module-boundary-types": "off"
45+
},
46+
"overrides": [
47+
{
48+
"files": ["*.ts", "*.tsx"],
49+
"rules": {
50+
"default-case": "off",
51+
"jsx-a11y/alt-text": "off",
52+
"jsx-a11y/iframe-has-title": "off",
53+
"no-var": "off",
54+
"no-undef": "off",
55+
"no-unused-vars": "off",
56+
"no-extend-native": "off",
57+
"no-throw-literal": "off",
58+
"no-useless-concat": "off",
59+
"no-mixed-operators": "off",
60+
"no-prototype-builtins": "off",
61+
"prefer-const": "off",
62+
"prefer-rest-params": "off",
63+
"@typescript-eslint/no-unused-vars": "off",
64+
"@typescript-eslint/no-explicit-any": "off",
65+
"@typescript-eslint/no-inferrable-types": "off",
66+
"@typescript-eslint/no-useless-constructor": "off",
67+
"@typescript-eslint/no-use-before-define": "off",
68+
"@typescript-eslint/no-non-null-assertion": "off",
69+
"@typescript-eslint/interface-name-prefix": "off",
70+
"@typescript-eslint/prefer-namespace-keyword": "off",
71+
"@typescript-eslint/explicit-function-return-type": "off",
72+
"@typescript-eslint/explicit-module-boundary-types": "off"
73+
}
74+
}
75+
]
76+
};

‎samples/charts/category-chart/highlighting-behavior/package.json‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
{
2+
"name": "example-ignite-ui-react",
3+
"description": "This project provides example of using Ignite UI for React components",
4+
"author": "Infragistics",
5+
"version": "1.4.0",
6+
"license": "",
7+
"homepage": ".",
8+
"private": true,
9+
"scripts": {
10+
"start": "set PORT=4200 && react-scripts --max_old_space_size=10240 start",
11+
"build": "react-scripts --max_old_space_size=10240 build ",
12+
"test": "react-scripts test --env=jsdom",
13+
"eject": "react-scripts eject",
14+
"lint": "eslint ./src/**/*.{ts,tsx}"
15+
},
16+
"dependencies": {
17+
"igniteui-react": "18.5.2-beta.2",
18+
"igniteui-react-charts": "18.5.2-beta.2",
19+
"igniteui-react-core": "18.5.2-beta.2",
20+
"igniteui-react-inputs": "18.5.2-beta.2",
21+
"igniteui-react-layouts": "18.5.2-beta.2",
22+
"igniteui-webcomponents": "4.7.0",
23+
"lit-html": "^2.2.0",
24+
"react": "^18.2.0",
25+
"react-dom": "^18.2.0",
26+
"react-scripts": "^5.0.1",
27+
"tslib": "^2.4.0"
28+
},
29+
"devDependencies": {
30+
"@types/jest": "^29.2.0",
31+
"@types/node": "^18.11.7",
32+
"@types/react": "^18.0.24",
33+
"@types/react-dom": "^18.0.8",
34+
"eslint": "^8.33.0",
35+
"eslint-config-react": "^1.1.7",
36+
"eslint-plugin-react": "^7.20.0",
37+
"react-app-rewired": "^2.2.1",
38+
"typescript": "^4.8.4",
39+
"worker-loader": "^3.0.8"
40+
},
41+
"browserslist": [
42+
">0.2%",
43+
"not dead",
44+
"not ie <= 11",
45+
"not op_mini all"
46+
]
47+
}

‎samples/charts/category-chart/highlighting-behavior/public/index.html‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<title>Sample | Ignite UI | React | infragistics</title>
5+
<link rel="shortcut icon" href="https://static.infragistics.com/xplatform/images/browsers/react.png" >
6+
<link rel="stylesheet" href="https://static.infragistics.com/xplatform/css/samples/shared.v8.css" />
7+
</head>
8+
<body>
9+
<div id="root"></div>
10+
</body>
11+
</html>

‎samples/charts/category-chart/highlighting-behavior/sandbox.config.json‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"infiniteLoopProtection": false,
3+
"hardReloadOnChange": false,
4+
"view": "browser"
5+
}

‎samples/charts/category-chart/highlighting-behavior/src/TemperatureAnnotatedData.ts‎

Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
export class TemperatureAnnotatedDataItem {
2+
public constructor(init: Partial<TemperatureAnnotatedDataItem>) {
3+
Object.assign(this, init);
4+
}
5+
6+
public index: number;
7+
public tempInfo: string;
8+
public temperature: number;
9+
public month: string;
10+
11+
}
12+
export class TemperatureAnnotatedData extends Array<TemperatureAnnotatedDataItem> {
13+
public constructor(items: Array<TemperatureAnnotatedDataItem> | number = -1) {
14+
if (Array.isArray(items)) {
15+
super(...items);
16+
} else {
17+
const newItems = [
18+
new TemperatureAnnotatedDataItem(
19+
{
20+
index: 0,
21+
tempInfo: `27°C`,
22+
temperature: 27,
23+
month: `Jan`
24+
}),
25+
new TemperatureAnnotatedDataItem(
26+
{
27+
index: 1,
28+
tempInfo: `25°C`,
29+
temperature: 25,
30+
month: `Feb`
31+
}),
32+
new TemperatureAnnotatedDataItem(
33+
{
34+
index: 2,
35+
tempInfo: `21°C`,
36+
temperature: 21,
37+
month: `Mar`
38+
}),
39+
new TemperatureAnnotatedDataItem(
40+
{
41+
index: 3,
42+
tempInfo: `19°C`,
43+
temperature: 19,
44+
month: `Apr`
45+
}),
46+
new TemperatureAnnotatedDataItem(
47+
{
48+
index: 4,
49+
tempInfo: `16°C`,
50+
temperature: 16,
51+
month: `May`
52+
}),
53+
new TemperatureAnnotatedDataItem(
54+
{
55+
index: 5,
56+
tempInfo: `13°C`,
57+
temperature: 13,
58+
month: `Jun`
59+
}),
60+
new TemperatureAnnotatedDataItem(
61+
{
62+
index: 6,
63+
tempInfo: `14°C`,
64+
temperature: 14,
65+
month: `Jul`
66+
}),
67+
new TemperatureAnnotatedDataItem(
68+
{
69+
index: 7,
70+
tempInfo: `15°C`,
71+
temperature: 15,
72+
month: `Aug`
73+
}),
74+
new TemperatureAnnotatedDataItem(
75+
{
76+
index: 8,
77+
tempInfo: `19°C`,
78+
temperature: 19,
79+
month: `Sep`
80+
}),
81+
new TemperatureAnnotatedDataItem(
82+
{
83+
index: 9,
84+
tempInfo: `22°C`,
85+
temperature: 22,
86+
month: `Oct`
87+
}),
88+
new TemperatureAnnotatedDataItem(
89+
{
90+
index: 10,
91+
tempInfo: `26°C`,
92+
temperature: 26,
93+
month: `Nov`
94+
}),
95+
new TemperatureAnnotatedDataItem(
96+
{
97+
index: 11,
98+
tempInfo: `30°C`,
99+
temperature: 30,
100+
month: `Dec`
101+
}),
102+
];
103+
super(...(newItems.slice(0, items)));
104+
}
105+
}
106+
}

‎samples/charts/category-chart/highlighting-behavior/src/index.css‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
/* shared styles are loaded from: */
2+
/* https://static.infragistics.com/xplatform/css/samples */

‎samples/charts/category-chart/highlighting-behavior/src/index.tsx‎

Lines changed: 103 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,103 @@
1+
import React from 'react';
2+
import ReactDOM from 'react-dom/client';
3+
import './index.css';
4+
5+
import { IgrPropertyEditorPanelModule } from 'igniteui-react-layouts';
6+
import { IgrCategoryChartModule } from 'igniteui-react-charts';
7+
import { IgrPropertyEditorPanel, IgrPropertyEditorPropertyDescription } from 'igniteui-react-layouts';
8+
import { IgrCategoryChart } from 'igniteui-react-charts';
9+
import { ComponentRenderer, PropertyEditorPanelDescriptionModule, CategoryChartDescriptionModule } from 'igniteui-react-core';
10+
import { TemperatureAnnotatedDataItem, TemperatureAnnotatedData } from './TemperatureAnnotatedData';
11+
12+
import 'igniteui-webcomponents/themes/light/bootstrap.css';
13+
14+
const mods: any[] = [
15+
IgrPropertyEditorPanelModule,
16+
IgrCategoryChartModule
17+
];
18+
mods.forEach((m) => m.register());
19+
20+
export default class Sample extends React.Component<any, any> {
21+
private propertyEditor: IgrPropertyEditorPanel
22+
private propertyEditorRef(r: IgrPropertyEditorPanel) {
23+
this.propertyEditor = r;
24+
this.setState({});
25+
}
26+
private highlightingBehaviorEditor: IgrPropertyEditorPropertyDescription
27+
private chart: IgrCategoryChart
28+
private chartRef(r: IgrCategoryChart) {
29+
this.chart = r;
30+
this.setState({});
31+
}
32+
33+
constructor(props: any) {
34+
super(props);
35+
36+
this.propertyEditorRef = this.propertyEditorRef.bind(this);
37+
this.chartRef = this.chartRef.bind(this);
38+
}
39+
40+
public render(): JSX.Element {
41+
return (
42+
<div className="container sample">
43+
<div className="options vertical">
44+
<IgrPropertyEditorPanel
45+
ref={this.propertyEditorRef}
46+
componentRenderer={this.renderer}
47+
target={this.chart}
48+
descriptionType="CategoryChart"
49+
isHorizontal="true"
50+
isWrappingEnabled="true">
51+
<IgrPropertyEditorPropertyDescription
52+
propertyPath="HighlightingBehavior"
53+
name="HighlightingBehaviorEditor"
54+
label="Highlighting Behavior: "
55+
primitiveValue="DirectlyOver">
56+
</IgrPropertyEditorPropertyDescription>
57+
</IgrPropertyEditorPanel>
58+
</div>
59+
60+
<div className="container fill">
61+
<IgrCategoryChart
62+
ref={this.chartRef}
63+
chartType="Column"
64+
computedPlotAreaMarginMode="Series"
65+
isHorizontalZoomEnabled="false"
66+
isVerticalZoomEnabled="false"
67+
dataSource={this.temperatureAnnotatedData}
68+
highlightingMode="Brighten"
69+
highlightingBehavior="DirectlyOver"
70+
crosshairsAnnotationEnabled="false"
71+
toolTipType="None"
72+
crosshairsDisplayMode="None">
73+
</IgrCategoryChart>
74+
</div>
75+
</div>
76+
);
77+
}
78+
79+
private _temperatureAnnotatedData: TemperatureAnnotatedData = null;
80+
public get temperatureAnnotatedData(): TemperatureAnnotatedData {
81+
if (this._temperatureAnnotatedData == null)
82+
{
83+
this._temperatureAnnotatedData = new TemperatureAnnotatedData();
84+
}
85+
return this._temperatureAnnotatedData;
86+
}
87+
88+
private _componentRenderer: ComponentRenderer = null;
89+
public get renderer(): ComponentRenderer {
90+
if (this._componentRenderer == null) {
91+
this._componentRenderer = new ComponentRenderer();
92+
var context = this._componentRenderer.context;
93+
PropertyEditorPanelDescriptionModule.register(context);
94+
CategoryChartDescriptionModule.register(context);
95+
}
96+
return this._componentRenderer;
97+
}
98+
99+
}
100+
101+
// rendering above component in the React DOM
102+
const root = ReactDOM.createRoot(document.getElementById('root'));
103+
root.render(<Sample/>);

‎samples/charts/category-chart/highlighting-behavior/src/react-app-env.d.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
/// <reference types="react-scripts" />

0 commit comments

Comments
 (0)