Skip to content

Commit 37e3fd3

Browse files
HUSSAR-mtrelaHUSSAR-mtrela
authored
merging vnext into master (#695)
* export samples and fixes * export new samples
1 parent bbabb94 commit 37e3fd3

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

48 files changed

+3936
-33
lines changed

‎samples/charts/category-chart/highlighting-behavior/.prettierrc‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
{
2+
"printWidth": 250,
3+
"tabWidth": 4,
4+
"useTabs": false,
5+
"semi": true,
6+
"singleQuote": false,
7+
"trailingComma": "none",
8+
"bracketSpacing": true,
9+
"jsxBracketSameLine": false,
10+
"fluid": false
11+
}

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

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Sample | Ignite UI | Web Components | infragistics</title>
5+
<meta charset="UTF-8" />
6+
7+
<link rel="shortcut icon" href="https://static.infragistics.com/xplatform/images/browsers/wc.png" >
8+
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
9+
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Kanit&display=swap" />
10+
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Titillium Web" />
11+
<link rel="stylesheet" href="https://static.infragistics.com/xplatform/css/samples/shared.v8.css" />
12+
<link rel="stylesheet" href="/src/index.css" type="text/css" />
13+
14+
</head>
15+
16+
<body>
17+
<div id="root">
18+
19+
<div class="container sample">
20+
<div class="options vertical">
21+
<igc-property-editor-panel
22+
name="PropertyEditor"
23+
id="PropertyEditor"
24+
description-type="CategoryChart"
25+
is-horizontal="true"
26+
is-wrapping-enabled="true">
27+
<igc-property-editor-property-description
28+
property-path="HighlightingBehavior"
29+
name="HighlightingBehaviorEditor"
30+
id="HighlightingBehaviorEditor"
31+
label="Highlighting Behavior: "
32+
primitive-value="DirectlyOver">
33+
</igc-property-editor-property-description>
34+
</igc-property-editor-panel>
35+
</div>
36+
37+
<div class="container fill">
38+
<igc-category-chart
39+
name="chart"
40+
id="chart"
41+
chart-type="Column"
42+
computed-plot-area-margin-mode="Series"
43+
is-horizontal-zoom-enabled="false"
44+
is-vertical-zoom-enabled="false"
45+
highlighting-mode="Brighten"
46+
highlighting-behavior="DirectlyOver"
47+
crosshairs-annotation-enabled="false"
48+
tool-tip-type="None"
49+
crosshairs-display-mode="None">
50+
</igc-category-chart>
51+
</div>
52+
</div>
53+
54+
</div>
55+
56+
<!-- This script is needed only for parcel and it will be excluded for webpack -->
57+
<% if (false) { %><script src="src/index.ts"></script><% } %>
58+
</body>
59+
</html>

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

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
{
2+
"name": "example-ignite-ui-web-components",
3+
"description": "This project provides example of using Ignite UI for Web Components",
4+
"author": "Infragistics",
5+
"version": "1.0.0",
6+
"license": "",
7+
"private": true,
8+
"homepage": ".",
9+
"main": "src/index.ts",
10+
"scripts": {
11+
"build": "npm run build:prod",
12+
"build:dev": "webpack --mode development --config ./webpack.config.js --progress --color --display-error-details",
13+
"build:prod": "webpack --env.NODE_ENV=production --mode production --config ./webpack.config.js --progress --color --display-error-details --bail",
14+
"serve:dev": "node --max-old-space-size=8192 node_modules/webpack-dev-server/bin/webpack-dev-server.js --mode development --config ./webpack.config.js --hot --progress --open",
15+
"serve:prod": "webpack-dev-server --env.NODE_ENV=production --mode production --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --progress --open --content-base dist/",
16+
"start": "npm run serve:dev",
17+
"build:legacy": "npm run build:prod:legacy",
18+
"build:dev:legacy": "webpack --env.legacy=true --mode development --config ./webpack.config.js --progress --color --display-error-details",
19+
"build:prod:legacy": "webpack --env.NODE_ENV=production --env.legacy=true --mode production --config ./webpack.config.js --progress --color --display-error-details --bail",
20+
"serve:dev:legacy": "node --max-old-space-size=8192 node_modules/webpack-dev-server/bin/webpack-dev-server.js --env.legacy=true --mode development --config ./webpack.config.js --hot --progress --open",
21+
"serve:prod:legacy": "webpack-dev-server --env.NODE_ENV=production --env.legacy=true --mode production --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --progress --open --content-base dist/",
22+
"start:legacy": "npm run serve:dev:legacy"
23+
},
24+
"dependencies": {
25+
"@webcomponents/custom-elements": "^1.4.1",
26+
"@webcomponents/template": "^1.4.2",
27+
"babel-runtime": "^6.26.0",
28+
"core-js": "^3.6.5",
29+
"igniteui-webcomponents": "4.8.0",
30+
"igniteui-webcomponents-charts": "4.8.0",
31+
"igniteui-webcomponents-core": "4.8.0",
32+
"igniteui-webcomponents-inputs": "4.8.0",
33+
"igniteui-webcomponents-layouts": "4.8.0",
34+
"lit-html": "^2.2.0",
35+
"tslib": "^2.0.0"
36+
},
37+
"devDependencies": {
38+
"@babel/cli": "^7.8.3",
39+
"@babel/core": "^7.8.3",
40+
"@babel/plugin-proposal-class-properties": "^7.8.3",
41+
"@babel/plugin-transform-runtime": "^7.10.0",
42+
"@babel/preset-env": "^7.8.3",
43+
"@babel/preset-typescript": "^7.8.3",
44+
"@types/source-map": "^0.5.7",
45+
"babel-loader": "^8.1.0",
46+
"babel-plugin-transform-custom-element-classes": "^0.1.0",
47+
"css-loader": "^1.0.0",
48+
"csv-loader": "^3.0.2",
49+
"file-loader": "^4.2.0",
50+
"fork-ts-checker-webpack-plugin": "^4.1.5",
51+
"html-webpack-plugin": "^4.3.0",
52+
"parcel-bundler": "^1.6.1",
53+
"source-map": "^0.7.3",
54+
"style-loader": "^0.22.1",
55+
"tsconfig-paths-webpack-plugin": "^4.0.0",
56+
"typescript": "^4.4.4",
57+
"webpack": "^5.74.0",
58+
"webpack-cli": "^4.10.0",
59+
"webpack-dev-server": "^4.11.1",
60+
"worker-loader": "^3.0.8",
61+
"xml-loader": "^1.2.1"
62+
}
63+
}

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

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

‎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: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
/* shared styles are loaded from: */
2+
/* https://static.infragistics.com/xplatform/css/samples */
3+

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

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
import { IgcPropertyEditorPanelModule } from 'igniteui-webcomponents-layouts';
2+
import { IgcCategoryChartModule } from 'igniteui-webcomponents-charts';
3+
import { ComponentRenderer, PropertyEditorPanelDescriptionModule, CategoryChartDescriptionModule } from 'igniteui-webcomponents-core';
4+
import { IgcPropertyEditorPanelComponent, IgcPropertyEditorPropertyDescriptionComponent } from 'igniteui-webcomponents-layouts';
5+
import { IgcCategoryChartComponent } from 'igniteui-webcomponents-charts';
6+
import { TemperatureAnnotatedDataItem, TemperatureAnnotatedData } from './TemperatureAnnotatedData';
7+
8+
import 'igniteui-webcomponents/themes/light/bootstrap.css';
9+
import { defineAllComponents } from 'igniteui-webcomponents';
10+
import { ModuleManager } from 'igniteui-webcomponents-core';
11+
defineAllComponents();
12+
13+
import "./index.css";
14+
15+
ModuleManager.register(
16+
IgcPropertyEditorPanelModule,
17+
IgcCategoryChartModule
18+
);
19+
20+
export class Sample {
21+
22+
private propertyEditor: IgcPropertyEditorPanelComponent
23+
private highlightingBehaviorEditor: IgcPropertyEditorPropertyDescriptionComponent
24+
private chart: IgcCategoryChartComponent
25+
private _bind: () => void;
26+
27+
constructor() {
28+
var propertyEditor = this.propertyEditor = document.getElementById('PropertyEditor') as IgcPropertyEditorPanelComponent;
29+
var highlightingBehaviorEditor = this.highlightingBehaviorEditor = document.getElementById('HighlightingBehaviorEditor') as IgcPropertyEditorPropertyDescriptionComponent;
30+
var chart = this.chart = document.getElementById('chart') as IgcCategoryChartComponent;
31+
32+
this._bind = () => {
33+
propertyEditor.componentRenderer = this.renderer;
34+
propertyEditor.target = this.chart;
35+
chart.dataSource = this.temperatureAnnotatedData;
36+
}
37+
this._bind();
38+
39+
}
40+
41+
private _temperatureAnnotatedData: TemperatureAnnotatedData = null;
42+
public get temperatureAnnotatedData(): TemperatureAnnotatedData {
43+
if (this._temperatureAnnotatedData == null)
44+
{
45+
this._temperatureAnnotatedData = new TemperatureAnnotatedData();
46+
}
47+
return this._temperatureAnnotatedData;
48+
}
49+
50+
private _componentRenderer: ComponentRenderer = null;
51+
public get renderer(): ComponentRenderer {
52+
if (this._componentRenderer == null) {
53+
this._componentRenderer = new ComponentRenderer();
54+
var context = this._componentRenderer.context;
55+
PropertyEditorPanelDescriptionModule.register(context);
56+
CategoryChartDescriptionModule.register(context);
57+
}
58+
return this._componentRenderer;
59+
}
60+
61+
}
62+
63+
new Sample();

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

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
{
2+
"compilerOptions": {
3+
"noImplicitReturns": true,
4+
"esModuleInterop": true,
5+
"resolveJsonModule": true,
6+
"noImplicitAny": true,
7+
"declarationDir": "dist/types",
8+
"moduleResolution": "node",
9+
"declaration": true,
10+
"target": "es2015",
11+
"module": "es2015",
12+
"strict": true,
13+
"strictNullChecks": false,
14+
"baseUrl": ".",
15+
"paths": {
16+
"igniteui-webcomponents-core": [ "node_modules/igniteui-webcomponents-core", "node_modules/@infragistics/igniteui-webcomponents-core" ],
17+
"igniteui-webcomponents-charts": [ "node_modules/igniteui-webcomponents-charts", "node_modules/@infragistics/igniteui-webcomponents-charts" ],
18+
"igniteui-webcomponents-gauges": [ "node_modules/igniteui-webcomponents-gauges", "node_modules/@infragistics/igniteui-webcomponents-gauges" ],
19+
"igniteui-webcomponents-datasources": [ "node_modules/igniteui-webcomponents-datasources", "node_modules/@infragistics/igniteui-webcomponents-datasources" ],
20+
"igniteui-webcomponents-excel": [ "node_modules/igniteui-webcomponents-excel", "node_modules/@infragistics/igniteui-webcomponents-excel" ],
21+
"igniteui-webcomponents-inputs": [ "node_modules/igniteui-webcomponents-inputs", "node_modules/@infragistics/igniteui-webcomponents-inputs" ],
22+
"igniteui-webcomponents-grids": [ "node_modules/igniteui-webcomponents-grids", "node_modules/@infragistics/igniteui-webcomponents-grids" ],
23+
"igniteui-webcomponents-maps": [ "node_modules/igniteui-webcomponents-maps", "node_modules/@infragistics/igniteui-webcomponents-maps" ],
24+
"igniteui-webcomponents-spreadsheet": [ "node_modules/igniteui-webcomponents-spreadsheet", "node_modules/@infragistics/igniteui-webcomponents-spreadsheet" ],
25+
"igniteui-webcomponents-spreadsheet-chart-adapter": [ "node_modules/igniteui-webcomponents-spreadsheet-chart-adapter", "node_modules/@infragistics/igniteui-webcomponents-spreadsheet-chart-adapter" ],
26+
"igniteui-webcomponents-grids/*": [ "node_modules/igniteui-webcomponents-grids/*", "node_modules/@infragistics/igniteui-webcomponents-grids/*" ],
27+
"igniteui-webcomponents-grids/grids": [ "node_modules/igniteui-webcomponents-grids/grids", "node_modules/@infragistics/igniteui-webcomponents-grids/grids" ],
28+
"igniteui-webcomponents-grids/grids/*": [ "node_modules/igniteui-webcomponents-grids/grids/*", "node_modules/@infragistics/igniteui-webcomponents-grids/grids/*" ],
29+
"igniteui-webcomponents-grids/grids/combined": [ "node_modules/igniteui-webcomponents-grids/grids/combined", "node_modules/@infragistics/igniteui-webcomponents-grids/grids/combined" ],
30+
"igniteui-webcomponents-layouts": [ "node_modules/igniteui-webcomponents-layouts", "node_modules/@infragistics/igniteui-webcomponents-layouts" ]
31+
}
32+
},
33+
"include": [
34+
"src/**/*"
35+
],
36+
"exclude": [
37+
"node_modules",
38+
"dist"
39+
]
40+
}

0 commit comments

Comments
 (0)