Skip to content

Commit 109c985

Browse files
RivaIvanovaRivaIvanova
committed
feat(tree-grid-toolbar): add features sample
1 parent 81f4152 commit 109c985

11 files changed

Lines changed: 550 additions & 14 deletions

File tree

‎samples/grids/tree-grid/data-exporting-indicator/package.json‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -15,13 +15,13 @@
1515
},
1616
"dependencies": {
1717
"igniteui-dockmanager": "1.14.3",
18-
"igniteui-react": "18.6.0",
19-
"igniteui-react-core": "18.6.0",
20-
"igniteui-react-datasources": "18.6.0",
21-
"igniteui-react-grids": "18.6.0",
22-
"igniteui-react-inputs": "18.6.0",
23-
"igniteui-react-layouts": "18.6.0",
24-
"igniteui-webcomponents": "4.7.0",
18+
"igniteui-react": "18.6.1-alpha.0",
19+
"igniteui-react-core": "18.6.1-alpha.0",
20+
"igniteui-react-datasources": "18.6.1-alpha.0",
21+
"igniteui-react-grids": "18.6.1-alpha.0",
22+
"igniteui-react-inputs": "18.6.1-alpha.0",
23+
"igniteui-react-layouts": "18.6.1-alpha.0",
24+
"igniteui-webcomponents": "4.9.0",
2525
"lit-html": "^2.2.0",
2626
"react": "^18.2.0",
2727
"react-dom": "^18.2.0",

‎samples/grids/tree-grid/toolbar-sample-2/.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/grids/tree-grid/toolbar-sample-2/package.json‎

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
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-dockmanager": "1.14.3",
18+
"igniteui-react": "18.6.1-alpha.0",
19+
"igniteui-react-core": "18.6.1-alpha.0",
20+
"igniteui-react-datasources": "18.6.1-alpha.0",
21+
"igniteui-react-grids": "18.6.1-alpha.0",
22+
"igniteui-react-inputs": "18.6.1-alpha.0",
23+
"igniteui-react-layouts": "18.6.1-alpha.0",
24+
"igniteui-webcomponents": "4.9.0",
25+
"lit-html": "^2.2.0",
26+
"react": "^18.2.0",
27+
"react-dom": "^18.2.0",
28+
"react-scripts": "^5.0.1",
29+
"tslib": "^2.4.0"
30+
},
31+
"devDependencies": {
32+
"@types/jest": "^29.2.0",
33+
"@types/node": "^18.11.7",
34+
"@types/react": "^18.0.24",
35+
"@types/react-dom": "^18.0.8",
36+
"eslint": "^8.33.0",
37+
"eslint-config-react": "^1.1.7",
38+
"eslint-plugin-react": "^7.20.0",
39+
"react-app-rewired": "^2.2.1",
40+
"typescript": "^4.8.4",
41+
"worker-loader": "^3.0.8"
42+
},
43+
"browserslist": [
44+
">0.2%",
45+
"not dead",
46+
"not ie <= 11",
47+
"not op_mini all"
48+
]
49+
}

‎samples/grids/tree-grid/toolbar-sample-2/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/grids/tree-grid/toolbar-sample-2/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/grids/tree-grid/toolbar-sample-2/src/EmployeesFlatAvatars.ts‎

Lines changed: 205 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,205 @@
1+
export class EmployeesFlatAvatarsItem {
2+
public constructor(init: Partial<EmployeesFlatAvatarsItem>) {
3+
Object.assign(this, init);
4+
}
5+
6+
public Age: number;
7+
public Avatar: string;
8+
public HireDate: string;
9+
public ID: number;
10+
public Name: string;
11+
public ParentID: number;
12+
public Title: string;
13+
14+
}
15+
export class EmployeesFlatAvatars extends Array<EmployeesFlatAvatarsItem> {
16+
public constructor(items: Array<EmployeesFlatAvatarsItem> | number = -1) {
17+
if (Array.isArray(items)) {
18+
super(...items);
19+
} else {
20+
const newItems = [
21+
new EmployeesFlatAvatarsItem(
22+
{
23+
Age: 55,
24+
Avatar: `https://static.infragistics.com/xplatform/images/people/men/5.jpg`,
25+
HireDate: `2008-03-20`,
26+
ID: 1,
27+
Name: `Johnathan Winchester`,
28+
ParentID: -1,
29+
Title: `Development Manager`
30+
}),
31+
new EmployeesFlatAvatarsItem(
32+
{
33+
Age: 42,
34+
Avatar: `https://static.infragistics.com/xplatform/images/people/women/4.jpg`,
35+
HireDate: `2014-01-22`,
36+
ID: 4,
37+
Name: `Ana Sanders`,
38+
ParentID: -1,
39+
Title: `CEO`
40+
}),
41+
new EmployeesFlatAvatarsItem(
42+
{
43+
Age: 49,
44+
Avatar: `https://static.infragistics.com/xplatform/images/people/women/2.jpg`,
45+
HireDate: `2014-01-22`,
46+
ID: 18,
47+
Name: `Victoria Lincoln`,
48+
ParentID: -1,
49+
Title: `Accounting Manager`
50+
}),
51+
new EmployeesFlatAvatarsItem(
52+
{
53+
Age: 61,
54+
Avatar: `https://static.infragistics.com/xplatform/images/people/men/4.jpg`,
55+
HireDate: `2010-01-01`,
56+
ID: 10,
57+
Name: `Yang Wang`,
58+
ParentID: -1,
59+
Title: `Localization Manager`
60+
}),
61+
new EmployeesFlatAvatarsItem(
62+
{
63+
Age: 43,
64+
Avatar: `https://static.infragistics.com/xplatform/images/people/men/1.jpg`,
65+
HireDate: `2011-06-03`,
66+
ID: 3,
67+
Name: `Michael Burke`,
68+
ParentID: 1,
69+
Title: `Senior Software Developer`
70+
}),
71+
new EmployeesFlatAvatarsItem(
72+
{
73+
Age: 29,
74+
Avatar: `https://static.infragistics.com/xplatform/images/people/men/2.jpg`,
75+
HireDate: `2009-06-19`,
76+
ID: 2,
77+
Name: `Thomas Anderson`,
78+
ParentID: 1,
79+
Title: `Senior Software Developer`
80+
}),
81+
new EmployeesFlatAvatarsItem(
82+
{
83+
Age: 31,
84+
Avatar: `https://static.infragistics.com/xplatform/images/people/women/3.jpg`,
85+
HireDate: `2014-08-18`,
86+
ID: 11,
87+
Name: `Monica Reyes`,
88+
ParentID: 1,
89+
Title: `Software Development Team Lead`
90+
}),
91+
new EmployeesFlatAvatarsItem(
92+
{
93+
Age: 35,
94+
Avatar: `https://static.infragistics.com/xplatform/images/people/men/3.jpg`,
95+
HireDate: `2015-09-17`,
96+
ID: 6,
97+
Name: `Roland Mendel`,
98+
ParentID: 11,
99+
Title: `Senior Software Developer`
100+
}),
101+
new EmployeesFlatAvatarsItem(
102+
{
103+
Age: 44,
104+
Avatar: `https://static.infragistics.com/xplatform/images/people/men/6.jpg`,
105+
HireDate: `2009-10-11`,
106+
ID: 12,
107+
Name: `Sven Cooper`,
108+
ParentID: 11,
109+
Title: `Senior Software Developer`
110+
}),
111+
new EmployeesFlatAvatarsItem(
112+
{
113+
Age: 44,
114+
Avatar: `https://static.infragistics.com/xplatform/images/people/men/7.jpg`,
115+
HireDate: `2014-04-04`,
116+
ID: 14,
117+
Name: `Laurence Johnson`,
118+
ParentID: 4,
119+
Title: `Director`
120+
}),
121+
new EmployeesFlatAvatarsItem(
122+
{
123+
Age: 25,
124+
Avatar: `https://static.infragistics.com/xplatform/images/people/women/1.jpg`,
125+
HireDate: `2017-11-09`,
126+
ID: 5,
127+
Name: `Elizabeth Richards`,
128+
ParentID: 4,
129+
Title: `Vice President`
130+
}),
131+
new EmployeesFlatAvatarsItem(
132+
{
133+
Age: 39,
134+
Avatar: `https://static.infragistics.com/xplatform/images/people/men/8.jpg`,
135+
HireDate: `2010-03-22`,
136+
ID: 13,
137+
Name: `Trevor Ashworth`,
138+
ParentID: 5,
139+
Title: `Director`
140+
}),
141+
new EmployeesFlatAvatarsItem(
142+
{
143+
Age: 44,
144+
Avatar: `https://static.infragistics.com/xplatform/images/people/men/9.jpg`,
145+
HireDate: `2014-04-04`,
146+
ID: 17,
147+
Name: `Antonio Moreno`,
148+
ParentID: 18,
149+
Title: `Senior Accountant`
150+
}),
151+
new EmployeesFlatAvatarsItem(
152+
{
153+
Age: 50,
154+
Avatar: `https://static.infragistics.com/xplatform/images/people/men/10.jpg`,
155+
HireDate: `2007-11-18`,
156+
ID: 7,
157+
Name: `Pedro Rodriguez`,
158+
ParentID: 10,
159+
Title: `Senior Localization Developer`
160+
}),
161+
new EmployeesFlatAvatarsItem(
162+
{
163+
Age: 27,
164+
Avatar: `https://static.infragistics.com/xplatform/images/people/women/5.jpg`,
165+
HireDate: `2016-02-19`,
166+
ID: 8,
167+
Name: `Casey Harper`,
168+
ParentID: 10,
169+
Title: `Senior Localization Developer`
170+
}),
171+
new EmployeesFlatAvatarsItem(
172+
{
173+
Age: 25,
174+
Avatar: `https://static.infragistics.com/xplatform/images/people/women/6.jpg`,
175+
HireDate: `2017-11-09`,
176+
ID: 15,
177+
Name: `Patricia Simpson`,
178+
ParentID: 7,
179+
Title: `Localization Intern`
180+
}),
181+
new EmployeesFlatAvatarsItem(
182+
{
183+
Age: 39,
184+
Avatar: `https://static.infragistics.com/xplatform/images/people/men/26.jpg`,
185+
HireDate: `2010-03-22`,
186+
ID: 9,
187+
Name: `Francisco Chang`,
188+
ParentID: 7,
189+
Title: `Localization Intern`
190+
}),
191+
new EmployeesFlatAvatarsItem(
192+
{
193+
Age: 25,
194+
Avatar: `https://static.infragistics.com/xplatform/images/people/men/27.jpg`,
195+
HireDate: `2018-03-18`,
196+
ID: 16,
197+
Name: `Peter Lewis`,
198+
ParentID: 7,
199+
Title: `Localization Intern`
200+
}),
201+
];
202+
super(...(newItems.slice(0, items)));
203+
}
204+
}
205+
}

‎samples/grids/tree-grid/toolbar-sample-2/src/index.css‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
/* shared styles are loaded from: */
2+
/* https://static.infragistics.com/xplatform/css/samples */
3+
4+
.cell__inner {
5+
display: flex;
6+
align-items: center;
7+
}
8+
9+
.name {
10+
margin-left: 30px;
11+
}
12+
13+
.control_panel {
14+
width: 700px;
15+
margin-bottom: 10px;
16+
}

0 commit comments

Comments
 (0)