;
10 | }
11 | }
12 |
--------------------------------------------------------------------------------
/examples/projects/integration-jquery/tsconfig.app.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../../out-tsc/app",
5 | "types": []
6 | },
7 | "files": [
8 | "src/main.ts",
9 | "src/polyfills.ts"
10 | ],
11 | "include": [
12 | "projects/integration-jquery/src/**/*.d.ts"
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/examples/projects/pdf-embedded-fonts/tsconfig.app.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../../out-tsc/app",
5 | "types": []
6 | },
7 | "files": [
8 | "src/main.ts",
9 | "src/polyfills.ts"
10 | ],
11 | "include": [
12 | "projects/pdf-embedded-fonts/src/**/*.d.ts"
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/aspnet_core_sample_application/ClientApp/e2e/tsconfig.e2e.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../out-tsc/app",
5 | "module": "commonjs",
6 | "target": "es5",
7 | "types": [
8 | "jasmine",
9 | "jasminewd2",
10 | "node"
11 | ]
12 | }
13 | }
--------------------------------------------------------------------------------
/examples-standalone/dialogflow-integration/client/.editorconfig:
--------------------------------------------------------------------------------
1 | # Editor configuration, see https://editorconfig.org
2 | root = true
3 |
4 | [*]
5 | charset = utf-8
6 | indent_style = space
7 | indent_size = 2
8 | insert_final_newline = true
9 | trim_trailing_whitespace = true
10 |
11 | [*.md]
12 | max_line_length = off
13 | trim_trailing_whitespace = false
14 |
--------------------------------------------------------------------------------
/examples-standalone/grid-csp-enabled/src/main.ts:
--------------------------------------------------------------------------------
1 | ///
2 |
3 | import { bootstrapApplication } from '@angular/platform-browser';
4 | import { appConfig } from './app/app.config';
5 | import { AppComponent } from './app/app.component';
6 |
7 | bootstrapApplication(AppComponent, appConfig)
8 | .catch((err) => console.error(err));
9 |
--------------------------------------------------------------------------------
/examples-standalone/integration-i18n/src/main.ts:
--------------------------------------------------------------------------------
1 | ///
2 |
3 | import { bootstrapApplication } from '@angular/platform-browser';
4 | import { appConfig } from './app/app.config';
5 | import { AppComponent } from './app/app.component';
6 |
7 | bootstrapApplication(AppComponent, appConfig)
8 | .catch((err) => console.error(err));
9 |
--------------------------------------------------------------------------------
/examples-standalone/personal-finance-app/src/app/components/home/home.component.css:
--------------------------------------------------------------------------------
1 | .k-text-blue {
2 | color: var(--kendo-color-series-b);
3 | }
4 |
5 | .k-vertical-separator {
6 | width: 50px;
7 | border: 1px solid #ffffff;
8 | opacity: 20%;
9 | transform: rotate(-90deg);
10 | border-radius: 3px;
11 | align-content: center;
12 | }
13 |
--------------------------------------------------------------------------------
/examples/projects/grid-firebase/tslint.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tslint.json",
3 | "rules": {
4 | "directive-selector": [
5 | true,
6 | "attribute",
7 | "app",
8 | "camelCase"
9 | ],
10 | "component-selector": [
11 | true,
12 | "element",
13 | "app",
14 | "kebab-case"
15 | ]
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/examples/projects/grid-graphql/tslint.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tslint.json",
3 | "rules": {
4 | "directive-selector": [
5 | true,
6 | "attribute",
7 | "app",
8 | "camelCase"
9 | ],
10 | "component-selector": [
11 | true,
12 | "element",
13 | "app",
14 | "kebab-case"
15 | ]
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/examples/projects/grid-signalr/tslint.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tslint.json",
3 | "rules": {
4 | "directive-selector": [
5 | true,
6 | "attribute",
7 | "app",
8 | "camelCase"
9 | ],
10 | "component-selector": [
11 | true,
12 | "element",
13 | "app",
14 | "kebab-case"
15 | ]
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/examples/projects/integration-pwa/tslint.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tslint.json",
3 | "rules": {
4 | "directive-selector": [
5 | true,
6 | "attribute",
7 | "app",
8 | "camelCase"
9 | ],
10 | "component-selector": [
11 | true,
12 | "element",
13 | "app",
14 | "kebab-case"
15 | ]
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/examples/projects/chart-websockets/tslint.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tslint.json",
3 | "rules": {
4 | "directive-selector": [
5 | true,
6 | "attribute",
7 | "app",
8 | "camelCase"
9 | ],
10 | "component-selector": [
11 | true,
12 | "element",
13 | "app",
14 | "kebab-case"
15 | ]
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/examples/projects/integration-jquery/tslint.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tslint.json",
3 | "rules": {
4 | "directive-selector": [
5 | true,
6 | "attribute",
7 | "app",
8 | "camelCase"
9 | ],
10 | "component-selector": [
11 | true,
12 | "element",
13 | "app",
14 | "kebab-case"
15 | ]
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/examples/projects/integration-pwa-material/tsconfig.app.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../../out-tsc/app",
5 | "types": []
6 | },
7 | "files": [
8 | "src/main.ts",
9 | "src/polyfills.ts"
10 | ],
11 | "include": [
12 | "projects/integration-pwa-material/src/**/*.d.ts"
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/examples/projects/pdf-embedded-fonts/tslint.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tslint.json",
3 | "rules": {
4 | "directive-selector": [
5 | true,
6 | "attribute",
7 | "app",
8 | "camelCase"
9 | ],
10 | "component-selector": [
11 | true,
12 | "element",
13 | "app",
14 | "kebab-case"
15 | ]
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/node_sample_application/.editorconfig:
--------------------------------------------------------------------------------
1 | # Editor configuration, see https://editorconfig.org
2 | root = true
3 |
4 | [*]
5 | charset = utf-8
6 | indent_style = space
7 | indent_size = 2
8 | insert_final_newline = true
9 | trim_trailing_whitespace = true
10 |
11 | [*.md]
12 | max_line_length = off
13 | trim_trailing_whitespace = false
14 |
--------------------------------------------------------------------------------
/examples/projects/integration-pwa-material/tslint.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tslint.json",
3 | "rules": {
4 | "directive-selector": [
5 | true,
6 | "attribute",
7 | "app",
8 | "camelCase"
9 | ],
10 | "component-selector": [
11 | true,
12 | "element",
13 | "app",
14 | "kebab-case"
15 | ]
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-landing-page/src/app/app.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 | import { RouterOutlet } from '@angular/router';
3 |
4 | @Component({
5 | selector: 'app-root',
6 | imports: [RouterOutlet],
7 | templateUrl: './app.component.html',
8 | styleUrl: './app.component.css',
9 | })
10 | export class AppComponent {}
11 |
--------------------------------------------------------------------------------
/examples/projects/integration-jquery-partial/tslint.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tslint.json",
3 | "rules": {
4 | "directive-selector": [
5 | true,
6 | "attribute",
7 | "app",
8 | "camelCase"
9 | ],
10 | "component-selector": [
11 | true,
12 | "element",
13 | "app",
14 | "kebab-case"
15 | ]
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/examples/static/404.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Kendo UI for Angular - Sample Applications
6 |
7 |
8 |
9 | Error
10 |
11 |
12 | Resource not found.
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/aspnet_core_sample_application/ClientApp/.editorconfig:
--------------------------------------------------------------------------------
1 | # Editor configuration, see http://editorconfig.org
2 | root = true
3 |
4 | [*]
5 | charset = utf-8
6 | indent_style = space
7 | indent_size = 2
8 | insert_final_newline = true
9 | trim_trailing_whitespace = true
10 |
11 | [*.md]
12 | max_line_length = off
13 | trim_trailing_whitespace = false
14 |
--------------------------------------------------------------------------------
/examples-standalone/grid-charts-integration/src/styles/_responsive.scss:
--------------------------------------------------------------------------------
1 | @media screen and (max-width: 480px) {
2 | .profile-wrapper {
3 | display: none;
4 | }
5 |
6 | .header-title {
7 | font-size: 1.8rem;
8 | }
9 | }
10 |
11 | @media screen and (max-width: 769px) {
12 | .profile-wrapper div:last-child {
13 | display: none;
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/examples-standalone/electron-dashboard/.editorconfig:
--------------------------------------------------------------------------------
1 | # Editor configuration, see http://editorconfig.org
2 | root = true
3 |
4 | [*]
5 | charset = utf-8
6 | indent_style = space
7 | indent_size = 2
8 | insert_final_newline = true
9 | trim_trailing_whitespace = true
10 |
11 | [*.ts]
12 | quote_type = single
13 |
14 | [*.md]
15 | max_line_length = off
16 | trim_trailing_whitespace = false
17 |
--------------------------------------------------------------------------------
/examples-standalone/finance-portfolio/.editorconfig:
--------------------------------------------------------------------------------
1 | # Editor configuration, see https://editorconfig.org
2 | root = true
3 |
4 | [*]
5 | charset = utf-8
6 | indent_style = space
7 | indent_size = 2
8 | insert_final_newline = true
9 | trim_trailing_whitespace = true
10 |
11 | [*.ts]
12 | quote_type = single
13 |
14 | [*.md]
15 | max_line_length = off
16 | trim_trailing_whitespace = false
17 |
--------------------------------------------------------------------------------
/examples-standalone/finance-portfolio/src/app/pipes/number-format.pipe.ts:
--------------------------------------------------------------------------------
1 | import { Pipe, PipeTransform } from '@angular/core';
2 |
3 | import { formatCurrency } from './helpers';
4 |
5 | @Pipe({
6 | name: 'numberFormat'
7 | })
8 | export class NumberFormatPipe implements PipeTransform {
9 | transform(value: number): any {
10 | return formatCurrency(value);
11 | }
12 | }
13 |
--------------------------------------------------------------------------------
/examples-standalone/grid-csp-enabled/.editorconfig:
--------------------------------------------------------------------------------
1 | # Editor configuration, see https://editorconfig.org
2 | root = true
3 |
4 | [*]
5 | charset = utf-8
6 | indent_style = space
7 | indent_size = 2
8 | insert_final_newline = true
9 | trim_trailing_whitespace = true
10 |
11 | [*.ts]
12 | quote_type = single
13 |
14 | [*.md]
15 | max_line_length = off
16 | trim_trailing_whitespace = false
17 |
--------------------------------------------------------------------------------
/examples-standalone/grid-performance/.editorconfig:
--------------------------------------------------------------------------------
1 | # Editor configuration, see https://editorconfig.org
2 | root = true
3 |
4 | [*]
5 | charset = utf-8
6 | indent_style = space
7 | indent_size = 2
8 | insert_final_newline = true
9 | trim_trailing_whitespace = true
10 |
11 | [*.ts]
12 | quote_type = single
13 |
14 | [*.md]
15 | max_line_length = off
16 | trim_trailing_whitespace = false
17 |
--------------------------------------------------------------------------------
/examples/projects/grid-jsdo/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | GridJsdo
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/examples/projects/grid-jsdo/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../../out-tsc/spec",
5 | "types": [
6 | "jasmine",
7 | "node"
8 | ]
9 | },
10 | "files": [
11 | "src/test.ts",
12 | "src/polyfills.ts"
13 | ],
14 | "include": [
15 | "**/*.spec.ts",
16 | "**/*.d.ts"
17 | ]
18 | }
19 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/aspnet_core_sample_application/ClientApp/src/tsconfig.server.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../tsconfig.json",
3 | "compilerOptions": {
4 | "module": "commonjs"
5 | },
6 | "angularCompilerOptions": {
7 | "entryModule": "app/app.server.module#AppServerModule"
8 | },
9 | "exclude": [
10 | "src/test.ts",
11 | "**/*.spec.ts"
12 | ]
13 | }
14 |
--------------------------------------------------------------------------------
/examples-standalone/grid-charts-integration/.editorconfig:
--------------------------------------------------------------------------------
1 | # Editor configuration, see https://editorconfig.org
2 | root = true
3 |
4 | [*]
5 | charset = utf-8
6 | indent_style = space
7 | indent_size = 2
8 | insert_final_newline = true
9 | trim_trailing_whitespace = true
10 |
11 | [*.ts]
12 | quote_type = single
13 |
14 | [*.md]
15 | max_line_length = off
16 | trim_trailing_whitespace = false
17 |
--------------------------------------------------------------------------------
/examples-standalone/grid-csp-enabled/src/app/app.config.ts:
--------------------------------------------------------------------------------
1 | import { ApplicationConfig, provideZoneChangeDetection } from '@angular/core';
2 | import { provideAnimations } from '@angular/platform-browser/animations';
3 |
4 | export const appConfig: ApplicationConfig = {
5 | providers: [
6 | provideZoneChangeDetection({ eventCoalescing: true }),
7 | provideAnimations()
8 | ]
9 | };
10 |
--------------------------------------------------------------------------------
/examples-standalone/grid-live-data/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | GridLiveData
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-aspnetcore-integration/ClientApp/src/main.ts:
--------------------------------------------------------------------------------
1 | ///
2 |
3 | import { bootstrapApplication } from '@angular/platform-browser';
4 | import { AppComponent } from './app/app.component';
5 | import { appConfig } from './app/app.config';
6 |
7 | bootstrapApplication(AppComponent, appConfig)
8 | .catch((err) => console.error(err));
9 |
--------------------------------------------------------------------------------
/examples-standalone/personal-finance-app/src/app/components/settings/settings.component.css:
--------------------------------------------------------------------------------
1 | .customClass {
2 | font-size: 72px;
3 | width: 72px;
4 | height: 72px;
5 | }
6 |
7 | .k-text-blue {
8 | color: #8ca5da;
9 | }
10 |
11 | .k-horizontal-separator {
12 | border: 1px solid #ffffff;
13 | opacity: 20%;
14 | border-radius: 3px;
15 | align-content: center;
16 | }
17 |
--------------------------------------------------------------------------------
/examples/projects/grid-firebase/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../../out-tsc/spec",
5 | "types": [
6 | "jasmine",
7 | "node"
8 | ]
9 | },
10 | "files": [
11 | "src/test.ts",
12 | "src/polyfills.ts"
13 | ],
14 | "include": [
15 | "**/*.spec.ts",
16 | "**/*.d.ts"
17 | ]
18 | }
19 |
--------------------------------------------------------------------------------
/examples/projects/grid-graphql/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../../out-tsc/spec",
5 | "types": [
6 | "jasmine",
7 | "node"
8 | ]
9 | },
10 | "files": [
11 | "src/test.ts",
12 | "src/polyfills.ts"
13 | ],
14 | "include": [
15 | "**/*.spec.ts",
16 | "**/*.d.ts"
17 | ]
18 | }
19 |
--------------------------------------------------------------------------------
/examples/projects/grid-signalr/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../../out-tsc/spec",
5 | "types": [
6 | "jasmine",
7 | "node"
8 | ]
9 | },
10 | "files": [
11 | "src/test.ts",
12 | "src/polyfills.ts"
13 | ],
14 | "include": [
15 | "**/*.spec.ts",
16 | "**/*.d.ts"
17 | ]
18 | }
19 |
--------------------------------------------------------------------------------
/examples/projects/integration-pwa/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../../out-tsc/spec",
5 | "types": [
6 | "jasmine",
7 | "node"
8 | ]
9 | },
10 | "files": [
11 | "src/test.ts",
12 | "src/polyfills.ts"
13 | ],
14 | "include": [
15 | "**/*.spec.ts",
16 | "**/*.d.ts"
17 | ]
18 | }
19 |
--------------------------------------------------------------------------------
/.github/ISSUE_TEMPLATE/other.md:
--------------------------------------------------------------------------------
1 | ---
2 | name: Other
3 | about: Ask a question or share additional feedback.
4 | title: ''
5 | labels: 'Question'
6 | assignees: ''
7 |
8 | ---
9 |
10 | Use this template for questions that are relevant to the community as a whole.
11 |
12 | **If the issue is specific to your project, please open a [support ticket](https://www.telerik.com/account/support-tickets).**
13 |
--------------------------------------------------------------------------------
/examples-standalone/electron-dashboard/src/app/core/core.module.ts:
--------------------------------------------------------------------------------
1 | import { NgModule } from '@angular/core';
2 | import { CommonModule } from '@angular/common';
3 | import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
4 | @NgModule({
5 | declarations: [],
6 | imports: [
7 | CommonModule,
8 | BrowserAnimationsModule
9 | ]
10 | })
11 | export class CoreModule { }
12 |
--------------------------------------------------------------------------------
/examples-standalone/grid-charts-integration/src/styles/_typography.scss:
--------------------------------------------------------------------------------
1 | h1 {
2 | font-size: 2.5rem;
3 | }
4 |
5 | h2 {
6 | font-size: 2rem;
7 | }
8 |
9 | h3 {
10 | font-size: 1.75rem;
11 | }
12 |
13 | h4 {
14 | font-size: 1.75rem;
15 | }
16 |
17 | h5 {
18 | font-size: 1.25rem;
19 | }
20 |
21 | p {
22 | font-size: 1rem;
23 | }
24 |
25 | a {
26 | font-size: 1rem;
27 | }
28 |
--------------------------------------------------------------------------------
/examples-standalone/integration-i18n/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | IntegrationI18n
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/examples/projects/chart-websockets/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../../out-tsc/spec",
5 | "types": [
6 | "jasmine",
7 | "node"
8 | ]
9 | },
10 | "files": [
11 | "src/test.ts",
12 | "src/polyfills.ts"
13 | ],
14 | "include": [
15 | "**/*.spec.ts",
16 | "**/*.d.ts"
17 | ]
18 | }
19 |
--------------------------------------------------------------------------------
/examples/projects/grid-firebase/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | GridFirebase
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/examples/projects/grid-graphql/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | GridGraphql
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/examples/projects/grid-signalr/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | GridSignalr
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/examples/projects/integration-jquery/src/app/other.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'app-other',
5 | template: `
6 | Other
7 | The Kendo UI for jQuery widgets are destroyed when navigating to this component.
8 | `
9 | })
10 | export class OtherComponent {
11 | constructor() { }
12 | }
13 |
--------------------------------------------------------------------------------
/examples/projects/integration-jquery/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../../out-tsc/spec",
5 | "types": [
6 | "jasmine",
7 | "node"
8 | ]
9 | },
10 | "files": [
11 | "src/test.ts",
12 | "src/polyfills.ts"
13 | ],
14 | "include": [
15 | "**/*.spec.ts",
16 | "**/*.d.ts"
17 | ]
18 | }
19 |
--------------------------------------------------------------------------------
/examples/projects/pdf-embedded-fonts/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../../out-tsc/spec",
5 | "types": [
6 | "jasmine",
7 | "node"
8 | ]
9 | },
10 | "files": [
11 | "src/test.ts",
12 | "src/polyfills.ts"
13 | ],
14 | "include": [
15 | "**/*.spec.ts",
16 | "**/*.d.ts"
17 | ]
18 | }
19 |
--------------------------------------------------------------------------------
/examples-standalone/coffee-warehouse/src/app/models/order.model.ts:
--------------------------------------------------------------------------------
1 | export class Order {
2 | public orderID?: number;
3 | public orderDate?: Date;
4 | public orderTotal?: number;
5 | public customerCompanyName?: string;
6 | public customerContactName?: string;
7 | public requiredDateStart?: Date;
8 | public requiredDateEnd?: Date;
9 | public teamID?: number;
10 | }
11 |
--------------------------------------------------------------------------------
/examples-standalone/dialogflow-integration/client/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Client
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/examples-standalone/finance-portfolio/src/app/components/stocks/stocks.component.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
--------------------------------------------------------------------------------
/examples/projects/chart-websockets/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | ChartWebsockets
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/examples/projects/grid-signalr/server/server.csproj:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | netcoreapp2.1
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/examples/projects/integration-pwa-material/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../../out-tsc/spec",
5 | "types": [
6 | "jasmine",
7 | "node"
8 | ]
9 | },
10 | "files": [
11 | "src/test.ts",
12 | "src/polyfills.ts"
13 | ],
14 | "include": [
15 | "**/*.spec.ts",
16 | "**/*.d.ts"
17 | ]
18 | }
19 |
--------------------------------------------------------------------------------
/examples-standalone/coffee-warehouse/src/app/models/form.model.ts:
--------------------------------------------------------------------------------
1 | export class FormModel {
2 | public avatar?: any[];
3 | public firstName?: string;
4 | public lastName?: string;
5 | public email?: string;
6 | public phoneNumber?: string;
7 | public directory?: boolean;
8 | public country?: string;
9 | public biography?: string;
10 | public team?: string;
11 | }
12 |
--------------------------------------------------------------------------------
/examples-standalone/dialogflow-integration/client/e2e/src/app.po.ts:
--------------------------------------------------------------------------------
1 | import { browser, by, element } from 'protractor';
2 |
3 | export class AppPage {
4 | navigateTo(): Promise {
5 | return browser.get(browser.baseUrl) as Promise;
6 | }
7 |
8 | getTitleText(): Promise {
9 | return element(by.css('app-root .content span')).getText() as Promise;
10 | }
11 | }
12 |
--------------------------------------------------------------------------------
/examples-standalone/grid-charts-integration/src/app/components/footer/footer.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'app-footer',
5 | imports: [],
6 | templateUrl: './footer.component.html',
7 | styleUrl: './footer.component.scss'
8 | })
9 | export class FooterComponent {
10 | public currentYear: number = new Date().getFullYear();
11 | }
12 |
--------------------------------------------------------------------------------
/examples-standalone/grid-performance/src/app/app.component.css:
--------------------------------------------------------------------------------
1 | .example-config {
2 | margin: 0 0 20px;
3 | padding: 20px;
4 | background-color: rgba(0, 0, 0, 0.03);
5 | border: 1px solid rgba(0, 0, 0, 0.08);
6 | }
7 |
8 | .k-grid tbody td {
9 | white-space: nowrap;
10 | line-height: 20px;
11 | padding: 8px 12px;
12 | }
13 |
14 | input[type='radio'] {
15 | margin-right: 5px;
16 | }
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-java-integration/ClientApp/.editorconfig:
--------------------------------------------------------------------------------
1 | # Editor configuration, see https://editorconfig.org
2 | root = true
3 |
4 | [*]
5 | charset = utf-8
6 | indent_style = space
7 | indent_size = 4
8 | insert_final_newline = true
9 | trim_trailing_whitespace = true
10 |
11 | [*.ts]
12 | quote_type = single
13 |
14 | [*.md]
15 | max_line_length = off
16 | trim_trailing_whitespace = false
17 |
--------------------------------------------------------------------------------
/examples-standalone/spreadsheet-app/src/app/app.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from "@angular/core";
2 | import { RouterOutlet } from "@angular/router";
3 |
4 | @Component({
5 | selector: "app-root",
6 | imports: [RouterOutlet],
7 | templateUrl: "./app.component.html",
8 | styleUrl: "./app.component.css",
9 | })
10 | export class AppComponent {
11 | title = "spreadsheet-app";
12 | }
13 |
--------------------------------------------------------------------------------
/examples-standalone/spreadsheet-app/tsconfig.app.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "./out-tsc/app",
6 | "types": [
7 | "@angular/localize"
8 | ]
9 | },
10 | "files": [
11 | "src/main.ts"
12 | ],
13 | "include": [
14 | "src/**/*.d.ts"
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/node_sample_application/src/main.server.ts:
--------------------------------------------------------------------------------
1 | import { enableProdMode } from '@angular/core';
2 |
3 | import { environment } from './environments/environment';
4 |
5 | if (environment.production) {
6 | enableProdMode();
7 | }
8 |
9 | export { AppServerModule } from './app/app.server.module';
10 | export { renderModule, renderModuleFactory } from '@angular/platform-server';
11 |
--------------------------------------------------------------------------------
/examples-standalone/coffee-warehouse/tsconfig.app.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "./out-tsc/app",
6 | "types": [
7 | "@angular/localize"
8 | ]
9 | },
10 | "files": [
11 | "src/main.ts"
12 | ],
13 | "include": [
14 | "src/**/*.d.ts"
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/examples-standalone/finance-portfolio/tsconfig.app.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "./out-tsc/app",
6 | "types": [
7 | "@angular/localize"
8 | ]
9 | },
10 | "files": [
11 | "src/main.ts"
12 | ],
13 | "include": [
14 | "src/**/*.d.ts"
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/examples-standalone/finance-portfolio/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "./out-tsc/spec",
6 | "types": [
7 | "jasmine",
8 | "@angular/localize"
9 | ]
10 | },
11 | "include": [
12 | "src/**/*.spec.ts",
13 | "src/**/*.d.ts"
14 | ]
15 | }
16 |
--------------------------------------------------------------------------------
/examples-standalone/grid-csp-enabled/tsconfig.app.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "./out-tsc/app",
6 | "types": [
7 | "@angular/localize"
8 | ]
9 | },
10 | "files": [
11 | "src/main.ts"
12 | ],
13 | "include": [
14 | "src/**/*.d.ts"
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/examples-standalone/grid-csp-enabled/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "./out-tsc/spec",
6 | "types": [
7 | "jasmine",
8 | "@angular/localize"
9 | ]
10 | },
11 | "include": [
12 | "src/**/*.spec.ts",
13 | "src/**/*.d.ts"
14 | ]
15 | }
16 |
--------------------------------------------------------------------------------
/examples-standalone/grid-performance/tsconfig.app.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "./out-tsc/app",
6 | "types": [
7 | "@angular/localize"
8 | ]
9 | },
10 | "files": [
11 | "src/main.ts"
12 | ],
13 | "include": [
14 | "src/**/*.d.ts"
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/examples-standalone/grid-performance/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "./out-tsc/spec",
6 | "types": [
7 | "jasmine",
8 | "@angular/localize"
9 | ]
10 | },
11 | "include": [
12 | "src/**/*.spec.ts",
13 | "src/**/*.d.ts"
14 | ]
15 | }
16 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-java-integration/ClientApp/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Client
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/examples-standalone/spreadsheet-app/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "./out-tsc/spec",
6 | "types": [
7 | "jasmine",
8 | "@angular/localize"
9 | ]
10 | },
11 | "include": [
12 | "src/**/*.spec.ts",
13 | "src/**/*.d.ts"
14 | ]
15 | }
16 |
--------------------------------------------------------------------------------
/examples/projects/integration-jquery-partial/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../../out-tsc/spec",
5 | "types": [
6 | "jasmine",
7 | "node"
8 | ]
9 | },
10 | "files": [
11 | "src/test.ts",
12 | "src/polyfills.ts"
13 | ],
14 | "include": [
15 | "src/**/*.spec.ts",
16 | "src/**/*.d.ts"
17 | ]
18 | }
19 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/node_sample_application/e2e/src/app.po.ts:
--------------------------------------------------------------------------------
1 | import { browser, by, element } from 'protractor';
2 |
3 | export class AppPage {
4 | navigateTo(): Promise {
5 | return browser.get(browser.baseUrl) as Promise;
6 | }
7 |
8 | getTitleText(): Promise {
9 | return element(by.css('app-root .content span')).getText() as Promise;
10 | }
11 | }
12 |
--------------------------------------------------------------------------------
/examples-standalone/dialogflow-integration/client/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "./tsconfig.base.json",
3 | "compilerOptions": {
4 | "outDir": "./out-tsc/spec",
5 | "types": [
6 | "jasmine",
7 | "node"
8 | ]
9 | },
10 | "files": [
11 | "src/test.ts",
12 | "src/polyfills.ts"
13 | ],
14 | "include": [
15 | "src/**/*.spec.ts",
16 | "src/**/*.d.ts"
17 | ]
18 | }
19 |
--------------------------------------------------------------------------------
/examples-standalone/electron-dashboard/jest.config.js:
--------------------------------------------------------------------------------
1 | const esModules = [].join('|');
2 |
3 | module.exports = {
4 | rootDir : './src',
5 | transformIgnorePatterns: [`/node_modules/(?!${esModules})`],
6 | transform: {
7 | '^.+\\.tsx?$': [
8 | 'ts-jest',
9 | {
10 | allowSyntheticDefaultImports: true,
11 | },
12 | ],
13 | '^.+\\.js$': 'babel-jest',
14 | },
15 | };
16 |
--------------------------------------------------------------------------------
/examples-standalone/grid-charts-integration/src/app/pipes/number-format.pipe.ts:
--------------------------------------------------------------------------------
1 | import { Pipe, PipeTransform } from '@angular/core';
2 | import { formatCurrency } from './helpers';
3 |
4 | @Pipe({
5 | name: 'numberFormat',
6 | standalone: true
7 | })
8 | export class NumberFormatPipe implements PipeTransform {
9 | transform(value: number): any {
10 | return formatCurrency(value);
11 | }
12 | }
13 |
--------------------------------------------------------------------------------
/examples-standalone/grid-charts-integration/tsconfig.app.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "./out-tsc/app",
6 | "types": [
7 | "@angular/localize"
8 | ]
9 | },
10 | "files": [
11 | "src/main.ts"
12 | ],
13 | "include": [
14 | "src/**/*.d.ts"
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/examples-standalone/grid-charts-integration/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "./out-tsc/spec",
6 | "types": [
7 | "jasmine",
8 | "@angular/localize"
9 | ]
10 | },
11 | "include": [
12 | "src/**/*.spec.ts",
13 | "src/**/*.d.ts"
14 | ]
15 | }
16 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-java-integration/backend/src/test/java/telerik/demo/KendoangularJavaSpringIntegrationApplicationTests.java:
--------------------------------------------------------------------------------
1 | package telerik.demo;
2 |
3 | import org.junit.jupiter.api.Test;
4 | import org.springframework.boot.test.context.SpringBootTest;
5 |
6 | @SpringBootTest
7 | class KendoangularJavaSpringIntegrationApplicationTests {
8 |
9 | @Test
10 | void contextLoads() {
11 | }
12 |
13 | }
14 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-landing-page/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | KendoangularLandingPage
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/examples/projects/chart-websockets/server/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "ws-server",
3 | "version": "1.0.0",
4 | "description": "Kendo UI for Angular - WebSocket API Sample Server",
5 | "main": "index.js",
6 | "scripts": {
7 | "start": "node index.js"
8 | },
9 | "author": "Progress",
10 | "license": "MIT",
11 | "dependencies": {
12 | "express": "^4.16.4",
13 | "ws": "^6.2.1"
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/examples/projects/pdf-embedded-fonts/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | PDF Export - Embedded Fonts
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/aspnet_core_sample_application/ClientApp/src/app/counter/counter.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'app-counter-component',
5 | templateUrl: './counter.component.html'
6 | })
7 | export class CounterComponent {
8 | public currentCount = 0;
9 |
10 | public incrementCounter() {
11 | this.currentCount++;
12 | }
13 | }
14 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/node_sample_application/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | NgUniversalDemo
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/examples-standalone/finance-portfolio/src/styles/_typography.scss:
--------------------------------------------------------------------------------
1 | h1 {
2 | font-size: 2.5rem;
3 | }
4 |
5 | h2 {
6 | font-size: 2rem;
7 | }
8 |
9 | h3 {
10 | font-size: 1.75rem;
11 | }
12 |
13 | h4 {
14 | font-size: 1.75rem;
15 | }
16 |
17 | h5 {
18 | font-size: 1.25rem;
19 | }
20 |
21 | p {
22 | font-size: 1rem;
23 | }
24 |
25 | a {
26 | font-size: 1rem;
27 | }
28 |
--------------------------------------------------------------------------------
/examples/projects/integration-jquery-partial/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | IntegrationJqueryPartial
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/examples/projects/integration-jquery/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Kendo UI for jQuery Integration
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/examples/projects/integration-pwa/src/app/shared/shared.module.ts:
--------------------------------------------------------------------------------
1 | import { NgModule } from '@angular/core';
2 |
3 | import { CommonModule } from '@angular/common';
4 |
5 | import { FormsModule } from '@angular/forms';
6 |
7 | @NgModule({
8 | imports: [ CommonModule ],
9 | declarations: [],
10 | exports: [
11 | CommonModule,
12 | FormsModule
13 | ]
14 | })
15 | export class SharedModule { }
16 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/node_sample_application/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "./tsconfig.base.json",
3 | "compilerOptions": {
4 | "outDir": "./out-tsc/spec",
5 | "types": [
6 | "jasmine",
7 | "node"
8 | ]
9 | },
10 | "files": [
11 | "src/test.ts",
12 | "src/polyfills.ts"
13 | ],
14 | "include": [
15 | "src/**/*.spec.ts",
16 | "src/**/*.d.ts"
17 | ]
18 | }
19 |
--------------------------------------------------------------------------------
/examples-standalone/dialogflow-integration/backend/server/src/process-response.ts:
--------------------------------------------------------------------------------
1 | import { structProtoToJson } from './structjson';
2 |
3 | export function processResponse(value) {
4 | const result = value[0].queryResult;
5 | const payload = result.webhookPayload?.fields?.null?.structValue;
6 | return {
7 | messages: result.fulfillmentMessages,
8 | data: structProtoToJson(payload)
9 | };
10 | }
11 |
--------------------------------------------------------------------------------
/examples-standalone/grid-live-data/.editorconfig:
--------------------------------------------------------------------------------
1 | # Editor configuration, see https://editorconfig.org
2 | root = true
3 |
4 | [*]
5 | charset = utf-8
6 | indent_style = space
7 | indent_size = 2
8 | insert_final_newline = true
9 | trim_trailing_whitespace = true
10 |
11 | [*.ts]
12 | quote_type = single
13 | ij_typescript_use_double_quotes = false
14 |
15 | [*.md]
16 | max_line_length = off
17 | trim_trailing_whitespace = false
18 |
--------------------------------------------------------------------------------
/examples/bin/serve-project.js:
--------------------------------------------------------------------------------
1 | #!/usr/bin/env node
2 |
3 | const path = require('path');
4 | const { execSync } = require('child_process');
5 |
6 | const cwd = process.env.INIT_CWD;
7 | let projectName = path.relative('projects', cwd);
8 |
9 | if (projectName === '..') {
10 | projectName = '';
11 | }
12 |
13 | const args = `serve ${projectName}`;
14 | execSync(`npm run ng ${args}`, { stdio: 'inherit', windowsHide: true });
15 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/aspnet_core_sample_application/ClientApp/e2e/src/app.e2e-spec.ts:
--------------------------------------------------------------------------------
1 | import { AppPage } from './app.po';
2 |
3 | describe('App', () => {
4 | let page: AppPage;
5 |
6 | beforeEach(() => {
7 | page = new AppPage();
8 | });
9 |
10 | it('should display welcome message', () => {
11 | page.navigateTo();
12 | expect(page.getMainHeading()).toEqual('Hello, world!');
13 | });
14 | });
15 |
--------------------------------------------------------------------------------
/examples/projects/integration-pwa-material/src/app/shared/shared.module.ts:
--------------------------------------------------------------------------------
1 | import { NgModule } from '@angular/core';
2 |
3 | import { CommonModule } from '@angular/common';
4 |
5 | import { FormsModule } from '@angular/forms';
6 |
7 | @NgModule({
8 | imports: [ CommonModule ],
9 | declarations: [],
10 | exports: [
11 | CommonModule,
12 | FormsModule
13 | ]
14 | })
15 | export class SharedModule { }
16 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/aspnet_core_sample_application/ClientApp/src/app/nav-menu/nav-menu.component.css:
--------------------------------------------------------------------------------
1 | a.navbar-brand {
2 | white-space: normal;
3 | text-align: center;
4 | word-break: break-all;
5 | }
6 |
7 | html {
8 | font-size: 14px;
9 | }
10 | @media (min-width: 768px) {
11 | html {
12 | font-size: 16px;
13 | }
14 | }
15 |
16 | .box-shadow {
17 | box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
18 | }
19 |
--------------------------------------------------------------------------------
/examples-standalone/electron-dashboard/src/tsconfig.app.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../out-tsc/app",
5 | "baseUrl": "",
6 | "types": [
7 | "node"
8 | ]
9 | },
10 | "files": [
11 | "main.ts",
12 | "polyfills.ts"
13 | ],
14 | "include": [
15 | "**/*.d.ts"
16 | ],
17 | "exclude": [
18 | "**/*.spec.ts"
19 | ]
20 | }
21 |
--------------------------------------------------------------------------------
/examples-standalone/finance-portfolio/src/app/models/stock.ts:
--------------------------------------------------------------------------------
1 | /* tslint:disable */
2 |
3 | export class Stock {
4 | symbol: string = '';
5 | name: string = '';
6 | price: number = 0;
7 | day_change: number = 0;
8 | change_pct: number = 0;
9 | volume: number = 0;
10 | volume_avg: number = 0;
11 | market_cap: number = 0;
12 | pe: number | null = 0;
13 | intraday: number[] = [0];
14 | }
15 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-aspnetcore-integration/Models/Products.cs:
--------------------------------------------------------------------------------
1 | namespace Kendo_ASP.NET_Core_Angular;
2 |
3 | public class Product
4 | {
5 | public int ProductID { get; set; }
6 | public string ProductName { get; set; }
7 | public decimal UnitPrice { get; set; }
8 | }
9 |
10 | // public class Category
11 | // {
12 | // public int CategoryID { get; set; }
13 | // public string CategoryName { get; set; }
14 | // }
--------------------------------------------------------------------------------
/examples-standalone/personal-finance-app/src/app/app.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 | import { NavigationComponent } from './components/navigation/navigation.component';
3 |
4 | @Component({
5 | selector: 'app-root',
6 | standalone: true,
7 | imports: [NavigationComponent],
8 | templateUrl: './app.component.html',
9 | styleUrl: './app.component.css',
10 | })
11 | export class AppComponent {}
12 |
--------------------------------------------------------------------------------
/examples-standalone/coffee-warehouse/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.json",
4 | "esModuleInterop": true,
5 | "compilerOptions": {
6 | "outDir": "./out-tsc/spec",
7 | "types": [
8 | "jasmine",
9 | "@angular/localize"
10 | ]
11 | },
12 | "include": [
13 | "src/**/*.spec.ts",
14 | "src/**/*.d.ts"
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/examples-standalone/personal-finance-app/src/app/components/header/header.component.css:
--------------------------------------------------------------------------------
1 | .language-dropdown > .k-button {
2 | flex-direction: row-reverse;
3 | }
4 |
5 | .custom-dimensions {
6 | width: 119px;
7 | max-width: 119px;
8 | }
9 |
10 | .k-font-size-custom {
11 | font-size: 14px;
12 | }
13 |
14 | @media (max-width: 992px) {
15 | .k-justify-content-sm-start {
16 | justify-content: start;
17 | }
18 | }
19 |
--------------------------------------------------------------------------------
/examples-standalone/personal-finance-app/src/app/models/currency-mover.ts:
--------------------------------------------------------------------------------
1 | export interface CurrencyMover {
2 | imgPath: string;
3 | abbreviation: string;
4 | name: string;
5 | firstParameter: number;
6 | firstParameterChange: number;
7 | firstParameterPercentage: number;
8 | secondParameter: number;
9 | secondParameterChange: number;
10 | secondParameterPercentage: number;
11 | totalValue: number;
12 | }
13 |
--------------------------------------------------------------------------------
/examples/projects/integration-jquery-partial/src/app/app.module.ts:
--------------------------------------------------------------------------------
1 | import { BrowserModule } from '@angular/platform-browser';
2 | import { NgModule } from '@angular/core';
3 |
4 | import { AppComponent } from './app.component';
5 |
6 | @NgModule({
7 | declarations: [
8 | AppComponent
9 | ],
10 | imports: [
11 | BrowserModule
12 | ],
13 | providers: [],
14 | bootstrap: [AppComponent]
15 | })
16 | export class AppModule { }
17 |
--------------------------------------------------------------------------------
/examples/projects/pdf-embedded-fonts/src/app/invoice-data.ts:
--------------------------------------------------------------------------------
1 | import { InvoiceRow } from './invoice-row';
2 |
3 | export const invoiceData = [
4 | new InvoiceRow('QUESO CABRALES', 21, 5),
5 | new InvoiceRow('ALICE MUTTON', 39, 7),
6 | new InvoiceRow('GENEN SHOUYU', 15.50, 3),
7 | new InvoiceRow('CHARTREUSE VERTE', 18, 1),
8 | new InvoiceRow('MASCARPONE FABIOLI', 32, 2),
9 | new InvoiceRow('VALKOINEN SUKLAA', 16.25, 3)
10 | ];
11 |
12 |
--------------------------------------------------------------------------------
/examples-standalone/grid-charts-integration/src/app/components/footer/footer.component.html:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-java-integration/ClientApp/src/app/app.config.ts:
--------------------------------------------------------------------------------
1 | import { ApplicationConfig, provideZoneChangeDetection } from '@angular/core';
2 | import { provideRouter } from '@angular/router';
3 |
4 | import { routes } from './app.routes';
5 |
6 | export const appConfig: ApplicationConfig = {
7 | providers: [
8 | provideZoneChangeDetection({ eventCoalescing: true }),
9 | provideRouter(routes),
10 | ],
11 | };
12 |
--------------------------------------------------------------------------------
/examples/projects/grid-jsdo/src/main.ts:
--------------------------------------------------------------------------------
1 | import { enableProdMode } from '@angular/core';
2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3 |
4 | import { AppModule } from './app/app.module';
5 | import { environment } from './environments/environment';
6 |
7 | if (environment.production) {
8 | enableProdMode();
9 | }
10 |
11 | platformBrowserDynamic().bootstrapModule(AppModule)
12 | .catch(err => console.error(err));
13 |
--------------------------------------------------------------------------------
/examples/projects/integration-pwa/src/app/app.style.css:
--------------------------------------------------------------------------------
1 | html, body {
2 | height: 100%;
3 | font-family: Arial, Helvetica, sans-serif;
4 | }
5 |
6 | span.active {
7 | background-color: gray;
8 | }
9 |
10 | .col-xs {
11 | flex-basis: 0;
12 | flex-grow: 1;
13 | max-width: 100%
14 | }
15 |
16 | .col-xs-12 {
17 | flex: 0 0 100%;
18 | }
19 |
20 | .nav-toggle .k-i-hamburger {
21 | font-size: 32px;
22 | }
23 |
--------------------------------------------------------------------------------
/readme.txt:
--------------------------------------------------------------------------------
1 | Kendo UI for Angular is distributed through NPM packages, just like the Angular framework.
2 |
3 | To set up your first Angular CLI project with Kendo UI, follow the steps in Getting Started at https://www.telerik.com/kendo-angular-ui/getting-started/.
4 |
5 | For a list of the available packages and for more information on installing each of them, refer to Components page at https://www.telerik.com/kendo-angular-ui/components/.
6 |
7 | Happy Coding!
8 |
--------------------------------------------------------------------------------
/examples-standalone/finance-portfolio/src/app/components/badge/badge.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, Input, HostBinding } from '@angular/core';
2 | import { CommonModule } from '@angular/common';
3 |
4 | @Component({
5 | selector: 'app-badge',
6 | templateUrl: './badge.component.html',
7 | styleUrls: ['./badge.component.scss'],
8 | imports: [CommonModule]
9 | })
10 | export class BadgeComponent {
11 | @Input() public item: any;
12 | }
13 |
--------------------------------------------------------------------------------
/examples-standalone/spreadsheet-app/src/app/spreadsheet-view/spreadsheet-view.component.css:
--------------------------------------------------------------------------------
1 | .page-title {
2 | background-image: url("../../assets/budget-bg.svg");
3 | }
4 |
5 | .page-container {
6 | margin: -125px auto 0;
7 | max-width: 1136px;
8 |
9 | @media (max-width: 1179.98px) {
10 | max-width: 100%;
11 | margin-inline: var(--kendo-spacing-5);
12 | }
13 | }
14 |
15 | .kendo-spreadsheet {
16 | margin-bottom: var(--kendo-spacing-15);
17 | }
--------------------------------------------------------------------------------
/examples/projects/grid-firebase/src/main.ts:
--------------------------------------------------------------------------------
1 | import { enableProdMode } from '@angular/core';
2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3 |
4 | import { AppModule } from './app/app.module';
5 | import { environment } from './environments/environment';
6 |
7 | if (environment.production) {
8 | enableProdMode();
9 | }
10 |
11 | platformBrowserDynamic().bootstrapModule(AppModule)
12 | .catch(err => console.error(err));
13 |
--------------------------------------------------------------------------------
/examples/projects/grid-graphql/src/main.ts:
--------------------------------------------------------------------------------
1 | import { enableProdMode } from '@angular/core';
2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3 |
4 | import { AppModule } from './app/app.module';
5 | import { environment } from './environments/environment';
6 |
7 | if (environment.production) {
8 | enableProdMode();
9 | }
10 |
11 | platformBrowserDynamic().bootstrapModule(AppModule)
12 | .catch(err => console.error(err));
13 |
--------------------------------------------------------------------------------
/examples/projects/grid-signalr/src/main.ts:
--------------------------------------------------------------------------------
1 | import { enableProdMode } from '@angular/core';
2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3 |
4 | import { AppModule } from './app/app.module';
5 | import { environment } from './environments/environment';
6 |
7 | if (environment.production) {
8 | enableProdMode();
9 | }
10 |
11 | platformBrowserDynamic().bootstrapModule(AppModule)
12 | .catch(err => console.error(err));
13 |
--------------------------------------------------------------------------------
/examples/projects/integration-pwa/src/app/app-routing.module.ts:
--------------------------------------------------------------------------------
1 | // angular
2 | import { NgModule } from '@angular/core';
3 | import { RouterModule } from '@angular/router';
4 | // app
5 | import { AppRoutes } from './app.routes';
6 |
7 | @NgModule({
8 | imports: [
9 | RouterModule.forRoot(AppRoutes, { useHash: true, relativeLinkResolution: 'legacy' })
10 | ],
11 | exports: [RouterModule]
12 | })
13 | export class AppRoutingModule { }
14 |
15 |
--------------------------------------------------------------------------------
/examples/projects/integration-pwa/src/main.ts:
--------------------------------------------------------------------------------
1 | import { enableProdMode } from '@angular/core';
2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3 |
4 | import { AppModule } from './app/app.module';
5 | import { environment } from './environments/environment';
6 |
7 | if (environment.production) {
8 | enableProdMode();
9 | }
10 |
11 | platformBrowserDynamic().bootstrapModule(AppModule)
12 | .catch(err => console.error(err));
13 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/aspnet_core_sample_application/ClientApp/src/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../tsconfig.json",
3 | "compilerOptions": {
4 | "outDir": "../out-tsc/spec",
5 | "module": "commonjs",
6 | "types": [
7 | "jasmine",
8 | "node"
9 | ]
10 | },
11 | "files": [
12 | "test.ts",
13 | "polyfills.ts"
14 | ],
15 | "include": [
16 | "**/*.spec.ts",
17 | "**/*.d.ts"
18 | ]
19 | }
20 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/node_sample_application/src/app/app.server.module.ts:
--------------------------------------------------------------------------------
1 | import { NgModule } from '@angular/core';
2 | import { ServerModule } from '@angular/platform-server';
3 |
4 | import { AppModule } from './app.module';
5 | import { AppComponent } from './app.component';
6 |
7 | @NgModule({
8 | imports: [
9 | AppModule,
10 | ServerModule,
11 | ],
12 | bootstrap: [AppComponent],
13 | })
14 | export class AppServerModule {}
15 |
--------------------------------------------------------------------------------
/examples-standalone/grid-charts-integration/src/app/pipes/helpers.ts:
--------------------------------------------------------------------------------
1 | export const formatCurrency = (value: number): any => {
2 | if (value >= 1000000000) {
3 | return (value / 1000000000).toFixed(3) + 'B';
4 | }
5 |
6 | if (value >= 1000000) {
7 | return (value / 1000000).toFixed(3) + 'M';
8 | }
9 |
10 | if (value >= 1000) {
11 | return (value / 1000).toFixed(3) + 'K';
12 | }
13 |
14 | return value;
15 | };
16 |
--------------------------------------------------------------------------------
/examples-standalone/grid-performance/src/app/app.config.ts:
--------------------------------------------------------------------------------
1 | import { ApplicationConfig, importProvidersFrom } from '@angular/core';
2 | import { provideRouter } from '@angular/router';
3 | import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
4 |
5 | import { routes } from './app.routes';
6 |
7 | export const appConfig: ApplicationConfig = {
8 | providers: [provideRouter(routes), importProvidersFrom([BrowserAnimationsModule])]
9 | };
10 |
--------------------------------------------------------------------------------
/examples/projects/chart-websockets/src/main.ts:
--------------------------------------------------------------------------------
1 | import { enableProdMode } from '@angular/core';
2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3 |
4 | import { AppModule } from './app/app.module';
5 | import { environment } from './environments/environment';
6 |
7 | if (environment.production) {
8 | enableProdMode();
9 | }
10 |
11 | platformBrowserDynamic().bootstrapModule(AppModule)
12 | .catch(err => console.error(err));
13 |
--------------------------------------------------------------------------------
/examples/projects/integration-jquery/src/app/app.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | declare var kendo: any;
4 |
5 | @Component({
6 | selector: 'app-root',
7 | templateUrl: './app.component.html',
8 | styleUrls: ['./app.component.css']
9 | })
10 | export class AppComponent {
11 | constructor() {
12 | if (window !== undefined) {
13 | (window as any).$ = kendo.jQuery;
14 | }
15 | }
16 | }
17 |
--------------------------------------------------------------------------------
/examples/projects/integration-jquery/src/main.ts:
--------------------------------------------------------------------------------
1 | import { enableProdMode } from '@angular/core';
2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3 |
4 | import { AppModule } from './app/app.module';
5 | import { environment } from './environments/environment';
6 |
7 | if (environment.production) {
8 | enableProdMode();
9 | }
10 |
11 | platformBrowserDynamic().bootstrapModule(AppModule)
12 | .catch(err => console.error(err));
13 |
--------------------------------------------------------------------------------
/examples/projects/pdf-embedded-fonts/src/main.ts:
--------------------------------------------------------------------------------
1 | import { enableProdMode } from '@angular/core';
2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3 |
4 | import { AppModule } from './app/app.module';
5 | import { environment } from './environments/environment';
6 |
7 | if (environment.production) {
8 | enableProdMode();
9 | }
10 |
11 | platformBrowserDynamic().bootstrapModule(AppModule)
12 | .catch(err => console.error(err));
13 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-aspnetcore-integration/ClientApp/src/app/nav-menu/nav-menu.component.css:
--------------------------------------------------------------------------------
1 | a.navbar-brand {
2 | white-space: normal;
3 | text-align: center;
4 | word-break: break-all;
5 | }
6 |
7 | html {
8 | font-size: 14px;
9 | }
10 | @media (min-width: 768px) {
11 | html {
12 | font-size: 16px;
13 | }
14 | }
15 |
16 | .box-shadow {
17 | box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.05);
18 | }
19 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-landing-page/src/app/components/layout/child-components/splitter/splitter.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 | import { KENDO_SPLITTER } from '@progress/kendo-angular-layout';
3 |
4 | @Component({
5 | selector: 'splitter-component',
6 | imports: [KENDO_SPLITTER],
7 | templateUrl: './splitter.component.html',
8 | styleUrl: './splitter.component.css',
9 | })
10 | export class SplitterComponent {}
11 |
--------------------------------------------------------------------------------
/examples/projects/integration-pwa-material/src/app/app-routing.module.ts:
--------------------------------------------------------------------------------
1 | // angular
2 | import { NgModule } from '@angular/core';
3 | import { RouterModule } from '@angular/router';
4 | // app
5 | import { AppRoutes } from './app.routes';
6 |
7 | @NgModule({
8 | imports: [
9 | RouterModule.forRoot(AppRoutes, { useHash: true, relativeLinkResolution: 'legacy' })
10 | ],
11 | exports: [RouterModule]
12 | })
13 | export class AppRoutingModule { }
14 |
15 |
--------------------------------------------------------------------------------
/examples/projects/integration-pwa-material/src/main.ts:
--------------------------------------------------------------------------------
1 | import { enableProdMode } from '@angular/core';
2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3 |
4 | import { AppModule } from './app/app.module';
5 | import { environment } from './environments/environment';
6 |
7 | if (environment.production) {
8 | enableProdMode();
9 | }
10 |
11 | platformBrowserDynamic().bootstrapModule(AppModule)
12 | .catch(err => console.error(err));
13 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/aspnet_core_sample_application/ClientApp/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | .NET Core - Angular Universal
6 |
7 |
8 |
9 |
10 |
11 |
12 | Loading...
13 |
14 |
15 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/node_sample_application/tsconfig.server.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "./tsconfig.app.json",
3 | "compilerOptions": {
4 | "outDir": "./out-tsc/app-server",
5 | "types": [
6 | "node"
7 | ]
8 | , "target": "es2016"
9 | },
10 | "files": [
11 | "src/main.server.ts",
12 | "server.ts"
13 | ],
14 | "angularCompilerOptions": {
15 | "entryModule": "./src/app/app.server.module#AppServerModule"
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/examples-standalone/finance-portfolio/src/app/components/navigation/navigation.component.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
--------------------------------------------------------------------------------
/examples-standalone/grid-charts-integration/src/app/app.config.ts:
--------------------------------------------------------------------------------
1 | import { ApplicationConfig, importProvidersFrom } from '@angular/core';
2 | import { provideRouter } from '@angular/router';
3 | import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
4 |
5 | import { routes } from './app.routes';
6 |
7 | export const appConfig: ApplicationConfig = {
8 | providers: [provideRouter(routes), importProvidersFrom([BrowserAnimationsModule])]
9 | };
10 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-landing-page/src/app/components/grid/multi-checkbox-filter/multi-checkbox-filter.component.css:
--------------------------------------------------------------------------------
1 | .wrapper {
2 | padding: 1px;
3 | display: flex;
4 | flex-direction: column;
5 | gap: 7px;
6 | }
7 |
8 | .items-wrapper {
9 | display: flex;
10 | flex-direction: column;
11 | gap: 5px;
12 | }
13 |
14 | .item {
15 | display: flex;
16 | gap: 4px;
17 | flex-direction: row;
18 | align-items: center;
19 | }
20 |
--------------------------------------------------------------------------------
/examples/projects/integration-jquery-partial/src/main.ts:
--------------------------------------------------------------------------------
1 | import { enableProdMode } from '@angular/core';
2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3 |
4 | import { AppModule } from './app/app.module';
5 | import { environment } from './environments/environment';
6 |
7 | if (environment.production) {
8 | enableProdMode();
9 | }
10 |
11 | platformBrowserDynamic().bootstrapModule(AppModule)
12 | .catch(err => console.error(err));
13 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/aspnet_core_sample_application/ClientApp/src/tslint.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../tslint.json",
3 | "rules": {
4 | "directive-selector": [
5 | true,
6 | "attribute",
7 | "app",
8 | "camelCase"
9 | ],
10 | "component-selector": [
11 | true,
12 | "element",
13 | "app",
14 | "kebab-case"
15 | ]
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/node_sample_application/src/app/app.component.html:
--------------------------------------------------------------------------------
1 |
12 |
--------------------------------------------------------------------------------
/examples-standalone/dialogflow-integration/client/src/main.ts:
--------------------------------------------------------------------------------
1 | import { enableProdMode } from '@angular/core';
2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3 |
4 | import { AppModule } from './app/app.module';
5 | import { environment } from './environments/environment';
6 |
7 | if (environment.production) {
8 | enableProdMode();
9 | }
10 |
11 | platformBrowserDynamic().bootstrapModule(AppModule)
12 | .catch(err => console.error(err));
13 |
--------------------------------------------------------------------------------
/examples-standalone/personal-finance-app/src/app/components/home/saving-item/saving-item.component.html:
--------------------------------------------------------------------------------
1 |
2 | {{ customMsgService.translate(getCurrentTitle()) }}
3 | {{ intl.formatNumber(saving!.value, customCurrencyOptions) }}
4 |
5 |
6 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/aspnet_core_sample_application/ClientApp/src/browserslist:
--------------------------------------------------------------------------------
1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers
2 | # For additional information regarding the format and rule options, please see:
3 | # https://github.com/browserslist/browserslist#queries
4 | # For IE 9-11 support, please uncomment the last line of the file and adjust as needed
5 | > 0.5%
6 | last 2 versions
7 | Firefox ESR
8 | not dead
9 | # IE 9-11
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-aspnetcore-integration/ClientApp/src/app/app.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from "@angular/core";
2 | import { RouterOutlet } from "@angular/router";
3 | import { NavMenuComponent } from "./nav-menu/nav-menu.component";
4 |
5 | @Component({
6 | selector: "app-root",
7 | templateUrl: "./app.component.html",
8 | imports: [RouterOutlet, NavMenuComponent]
9 | })
10 | export class AppComponent {
11 | title = "app";
12 | }
13 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-aspnetcore-integration/ClientApp/src/app/home/home.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 | import { FetchDataComponent } from '../fetch-data/fetch-data.component';
3 | import { UploadComponent } from '../upload/upload.component';
4 |
5 | @Component({
6 | selector: 'app-home',
7 | templateUrl: './home.component.html',
8 | imports: [FetchDataComponent, UploadComponent]
9 | })
10 | export class HomeComponent {
11 | }
12 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-landing-page/src/app/components/conversational-ui/conversational-ui.component.css:
--------------------------------------------------------------------------------
1 | .container {
2 | display: flex;
3 | justify-content: center;
4 | height: 440px;
5 | gap: 100px;
6 | width: 100%;
7 | }
8 |
9 | .wrapper {
10 | display: flex;
11 | flex-direction: column;
12 | }
13 |
14 | .chat {
15 | width: 400px;
16 | }
17 |
18 | .prompt {
19 | flex-grow: 1;
20 | max-width: 400px;
21 | width: 400px;
22 | }
23 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-landing-page/src/app/components/layout/child-components/expansionpanel/expansionpanel.component.css:
--------------------------------------------------------------------------------
1 | .content {
2 | display: flex;
3 | }
4 |
5 | .image-container {
6 | height: 250px;
7 | margin-right: 20px;
8 | }
9 |
10 | img {
11 | height: 100%;
12 | }
13 |
14 | .content-text {
15 | display: block;
16 | text-align: justify;
17 | }
18 |
19 | .expansionpanel-wrapper {
20 | max-width: 550px;
21 | margin: 0 auto;
22 | }
23 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-landing-page/src/app/components/layout/child-components/gridlayout/gridlayout.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 | import { KENDO_GRIDLAYOUT } from '@progress/kendo-angular-layout';
3 |
4 | @Component({
5 | selector: 'gridlayout-component',
6 | imports: [KENDO_GRIDLAYOUT],
7 | templateUrl: './gridlayout.component.html',
8 | styleUrl: './gridlayout.component.css',
9 | })
10 | export class GridlayoutComponent {}
11 |
--------------------------------------------------------------------------------
/examples-standalone/finance-portfolio/src/app/components/navigation/navigation.component.scss:
--------------------------------------------------------------------------------
1 | @use '../../../styles/variables' as *;
2 |
3 | .k-button {
4 | width: $nav-button-width;
5 |
6 | &.k-state-active {
7 | color: $white;
8 | }
9 |
10 | &:focus {
11 | box-shadow: none;
12 | }
13 |
14 | &.k-state-active {
15 | background: $nav-button-active-bg;
16 | border-color: $nav-button-active-bg;
17 | }
18 | }
19 |
--------------------------------------------------------------------------------
/examples-standalone/grid-live-data/src/main.ts:
--------------------------------------------------------------------------------
1 | ///
2 | import { provideZoneChangeDetection } from "@angular/core";
3 | import { bootstrapApplication } from '@angular/platform-browser';
4 | import { appConfig } from './app/app.config';
5 | import { AppComponent } from './app/app.component';
6 |
7 | bootstrapApplication(AppComponent, {...appConfig, providers: [provideZoneChangeDetection(), ...appConfig.providers]})
8 | .catch((err) => console.error(err));
9 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-aspnetcore-integration/ClientApp/tsconfig.app.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "./out-tsc/app",
6 | "types": [
7 | "@angular/localize"
8 | ]
9 | },
10 | "files": [
11 | "src/main.ts",
12 | "src/polyfills.ts"
13 | ],
14 | "include": [
15 | "src/**/*.d.ts"
16 | ]
17 | }
18 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-landing-page/src/app/components/layout/child-components/stacklayout/stacklayout.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 | import { KENDO_STACKLAYOUT } from '@progress/kendo-angular-layout';
3 |
4 | @Component({
5 | selector: 'stacklayout-component',
6 | imports: [KENDO_STACKLAYOUT],
7 | templateUrl: './stacklayout.component.html',
8 | styleUrl: './stacklayout.component.css',
9 | })
10 | export class StacklayoutComponent {}
11 |
--------------------------------------------------------------------------------
/examples-standalone/personal-finance-app/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Personal Finance
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/examples/projects/integration-pwa-material/src/styles.scss:
--------------------------------------------------------------------------------
1 | /* You can add global styles to this file, and also import other style files */
2 |
3 | @import './app/scss/variables';
4 | @import './app/scss/bootstrap-custom';
5 | @import './app/scss/globals';
6 | @import './app/scss/nav';
7 | @import './app/scss/header';
8 | @import './app/scss/dashboard';
9 | @import './app/scss/issues';
10 | @import './app/scss/profile';
11 | @import './app/scss/login';
12 | @import './app/scss/typography';
13 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-aspnetcore-integration/ClientApp/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | kendoangular_aspnetcore
6 |
7 |
8 |
9 |
10 |
11 |
12 | Loading...
13 |
14 |
15 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-landing-page/src/app/components/date-inputs/date-inputs.component.css:
--------------------------------------------------------------------------------
1 | .grid {
2 | display: flex;
3 | grid: auto auto / 1fr 1fr;
4 | grid-gap: 40px;
5 | justify-content: center;
6 | align-items: center;
7 | }
8 |
9 | .wrapper {
10 | display: flex;
11 | flex-direction: column;
12 | gap: 20px;
13 | }
14 |
15 | .component {
16 | width: 460px;
17 | }
18 |
19 | .k-daterangepicker {
20 | justify-content: space-between;
21 | }
22 |
--------------------------------------------------------------------------------
/examples-standalone/electron-dashboard/src/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../tsconfig.json",
3 | "compilerOptions": {
4 | "esModuleInterop": true,
5 | "outDir": "../out-tsc/spec",
6 | "types": [
7 | "jest",
8 | "node"
9 | ]
10 | },
11 | "files": [
12 | "polyfills-test.ts"
13 | ],
14 | "include": [
15 | "**/*.spec.ts",
16 | "**/*.d.ts"
17 | ],
18 | "exclude": [
19 | "dist",
20 | "release",
21 | "node_modules"
22 | ]
23 | }
24 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-landing-page/src/app/components/layout/child-components/stacklayout/stacklayout.component.css:
--------------------------------------------------------------------------------
1 | .box {
2 | padding: 4px;
3 | text-align: center;
4 | vertical-align: center;
5 | }
6 | .header {
7 | background-color: #fae47a;
8 | }
9 | .nav {
10 | background-color: #fbd17f;
11 | }
12 | .content {
13 | background-color: #f5bf8b;
14 | }
15 | .toc {
16 | background-color: #ebaa79;
17 | }
18 | .footer {
19 | background-color: #e39a6a;
20 | }
21 |
--------------------------------------------------------------------------------
/examples-standalone/personal-finance-app/src/app/data/savings.ts:
--------------------------------------------------------------------------------
1 | import { Saving } from '../models/saving';
2 |
3 | export const savings: Saving[] = [
4 | {
5 | title: 'Education',
6 | value: 3000,
7 | },
8 | {
9 | title: 'Dream Home',
10 | value: 25000,
11 | },
12 | {
13 | title: 'Car',
14 | value: 6500,
15 | },
16 | {
17 | title: 'Holidays',
18 | value: 20000,
19 | },
20 | {
21 | title: 'Healthcare',
22 | value: 50000,
23 | },
24 | ];
25 |
--------------------------------------------------------------------------------
/examples-standalone/grid-performance/src/main.ts:
--------------------------------------------------------------------------------
1 | import { provideZoneChangeDetection } from "@angular/core";
2 | ///
3 |
4 | import { bootstrapApplication } from '@angular/platform-browser';
5 | import { appConfig } from './app/app.config';
6 | import { AppComponent } from './app/app.component';
7 |
8 | bootstrapApplication(AppComponent, {...appConfig, providers: [provideZoneChangeDetection(), ...appConfig.providers]})
9 | .catch((err) => console.error(err));
10 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-landing-page/src/app/components/dropdowns/dropdowns.component.css:
--------------------------------------------------------------------------------
1 | .wrapper {
2 | display: flex;
3 | box-sizing: border-box;
4 | padding-bottom: 30px;
5 | min-height: 420px;
6 | justify-content: center;
7 | align-items: center;
8 | }
9 |
10 | .components-wrapper {
11 | display: grid;
12 | grid-template-columns: repeat(3, 1fr);
13 | gap: 20px;
14 | width: 1170px;
15 | justify-content: center;
16 | align-items: center;
17 | }
18 |
--------------------------------------------------------------------------------
/examples/bin/build-gh-pages:
--------------------------------------------------------------------------------
1 | #!/usr/bin/env bash
2 |
3 | # Builds example projects and deploys them to GH Pages
4 | WORKSPACE_PROJECTS=(integration-pwa integration-pwa-material)
5 | set -e
6 |
7 | # Workspace Projects
8 | npm ci
9 | rm -rf dist
10 |
11 | for PROJECT in "${WORKSPACE_PROJECTS[@]}"
12 | do
13 | echo Building ${PROJECT}
14 | node --max_old_space_size=6144 ./node_modules/.bin/ng build ${PROJECT} --prod --base-href
15 | done
16 |
17 | # Copy static assets
18 | cp static/* dist
19 |
20 |
--------------------------------------------------------------------------------
/examples-standalone/electron-dashboard/src/app/core/services/electron/electron.service.spec.ts:
--------------------------------------------------------------------------------
1 | import {TestBed, waitForAsync} from '@angular/core/testing';
2 |
3 | import { ElectronService } from './electron.service';
4 |
5 | describe('ElectronService', () => {
6 | beforeEach(waitForAsync(() => TestBed.configureTestingModule({})));
7 |
8 | it('should be created', () => {
9 | const service: ElectronService = TestBed.get(ElectronService);
10 | expect(service).toBeTruthy();
11 | });
12 | });
13 |
--------------------------------------------------------------------------------
/examples-standalone/electron-dashboard/src/app/shared/components/page-not-found/page-not-found.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, OnInit } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'app-page-not-found',
5 | templateUrl: './page-not-found.component.html',
6 | styleUrls: ['./page-not-found.component.scss']
7 | })
8 | export class PageNotFoundComponent implements OnInit {
9 | constructor() {}
10 |
11 | ngOnInit(): void {
12 | console.log('PageNotFoundComponent INIT');
13 | }
14 | }
15 |
--------------------------------------------------------------------------------
/examples-standalone/grid-charts-integration/src/main.ts:
--------------------------------------------------------------------------------
1 | import { provideZoneChangeDetection } from "@angular/core";
2 | ///
3 |
4 | import { bootstrapApplication } from '@angular/platform-browser';
5 | import { appConfig } from './app/app.config';
6 | import { AppComponent } from './app/app.component';
7 |
8 | bootstrapApplication(AppComponent, {...appConfig, providers: [provideZoneChangeDetection(), ...appConfig.providers]})
9 | .catch((err) => console.error(err));
10 |
--------------------------------------------------------------------------------
/examples-standalone/grid-csp-enabled/src/app/app.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 | import { KENDO_GRID } from '@progress/kendo-angular-grid';
3 | import { customers } from './customers';
4 |
5 | @Component({
6 | selector: 'app-root',
7 | imports: [KENDO_GRID],
8 | templateUrl: './app.component.html',
9 | styleUrl: './app.component.css'
10 | })
11 | export class AppComponent {
12 | title = 'grid-csp-enabled';
13 | public gridData: any[] = customers;
14 | }
15 |
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-landing-page/src/app/components/layout/child-components/expansionpanel/expansionpanel.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from "@angular/core";
2 | import { KENDO_EXPANSIONPANEL } from "@progress/kendo-angular-layout";
3 |
4 | @Component({
5 | selector: "expansionpanel-component",
6 | imports: [KENDO_EXPANSIONPANEL],
7 | templateUrl: "./expansionpanel.component.html",
8 | styleUrl: "./expansionpanel.component.css",
9 | })
10 | export class ExpansionpanelComponent {}
11 |
--------------------------------------------------------------------------------
/examples-standalone/electron-dashboard/src/main.ts:
--------------------------------------------------------------------------------
1 | import { enableProdMode } from '@angular/core';
2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3 |
4 | import { AppModule } from './app/app.module';
5 | import { APP_CONFIG } from './environments/environment';
6 |
7 | if (APP_CONFIG.production) {
8 | enableProdMode();
9 | }
10 |
11 | platformBrowserDynamic()
12 | .bootstrapModule(AppModule, {
13 | preserveWhitespaces: false
14 | })
15 | .catch(err => console.error(err));
16 |
--------------------------------------------------------------------------------
/examples-standalone/finance-portfolio/src/app/components/footer/footer.component.html:
--------------------------------------------------------------------------------
1 | @if (router.url !== '/profile') {
2 |
10 | }
11 |
--------------------------------------------------------------------------------
/examples-standalone/umd-bundles/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "es5",
4 | "module": "commonjs",
5 | "moduleResolution": "node",
6 | "sourceMap": true,
7 | "emitDecoratorMetadata": true,
8 | "experimentalDecorators": true,
9 | "noImplicitAny": true,
10 | "suppressImplicitAnyIndexErrors": true,
11 | "lib": ["es6", "dom"],
12 | "typeRoots": ["node_modules/@types"]
13 | },
14 | "exclude": [
15 | "node_modules",
16 | "src/main.aot.ts"
17 | ]
18 | }
--------------------------------------------------------------------------------
/examples-standalone/grid-charts-integration/src/app/components/charts/day/day.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, Input } from '@angular/core';
2 | import { KENDO_CHARTS } from '@progress/kendo-angular-charts';
3 |
4 | @Component({
5 | selector: 'day-chart',
6 | imports: [KENDO_CHARTS],
7 | templateUrl: './day.component.html',
8 | styleUrl: './day.component.scss'
9 | })
10 | export class DayChartComponent {
11 | @Input() public data: number[] = [];
12 | @Input() public changePct: number = 0;
13 | }
14 |
--------------------------------------------------------------------------------
/examples-standalone/personal-finance-app/src/app/data/overview-cards.ts:
--------------------------------------------------------------------------------
1 | import { OverviewCard } from '../models/overview-card';
2 |
3 | export const overviewCards: OverviewCard[] = [
4 | {
5 | title: 'Earnings',
6 | value: 15000,
7 | description: 200,
8 | },
9 | {
10 | title: 'Spendings',
11 | value: 50000,
12 | description: 100,
13 | },
14 | {
15 | title: 'Investments',
16 | value: 35000,
17 | description: -80,
18 | },
19 | ];
20 |
--------------------------------------------------------------------------------
/examples/projects/grid-graphql/server/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "kendo-graphql-sample-server",
3 | "version": "1.0.0",
4 | "description": "Kendo UI for Angular - GraphQL Sample Server",
5 | "main": "index.js",
6 | "author": "Progress",
7 | "scripts": {
8 | "start": "node index.js"
9 | },
10 | "license": "MIT",
11 | "dependencies": {
12 | "cors": "^2.8.5",
13 | "express": "^4.16.3",
14 | "express-graphql": "^0.6.12",
15 | "graphql": "^0.13.2",
16 | "uuid": "^3.2.1"
17 | }
18 | }
19 |
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/aspnet_core_sample_application/ClientApp/src/app/nav-menu/nav-menu.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'app-nav-menu',
5 | templateUrl: './nav-menu.component.html',
6 | styleUrls: ['./nav-menu.component.css']
7 | })
8 | export class NavMenuComponent {
9 | isExpanded = false;
10 |
11 | collapse() {
12 | this.isExpanded = false;
13 | }
14 |
15 | toggle() {
16 | this.isExpanded = !this.isExpanded;
17 | }
18 | }
19 |
--------------------------------------------------------------------------------
/examples-standalone/grid-performance/README.md:
--------------------------------------------------------------------------------
1 | # GridPerformance
2 |
3 | This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 17.0.0.
4 |
5 | ## Getting Started
6 |
7 | 1. Clone or download the source code from GitHub `git clone https://github.com/telerik/kendo-angular.git`.
8 | 1. Enter the project directory by running `cd examples-standalone/grid-performance`.
9 | 1. Install the node modules with `npm install`.
10 | 1. Run the project with `ng serve`.
11 | 1. Open http://localhost:4200.
--------------------------------------------------------------------------------
/examples-standalone/dialogflow-integration/client/.browserslistrc:
--------------------------------------------------------------------------------
1 | # This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
2 | # For additional information regarding the format and rule options, please see:
3 | # https://github.com/browserslist/browserslist#queries
4 |
5 | # You can see what browsers were selected by your queries by running:
6 | # npx browserslist
7 |
8 | > 0.5%
9 | last 2 versions
10 | Firefox ESR
11 | not dead
12 | not IE 9-11 # For IE 9-11 support, remove 'not'.
--------------------------------------------------------------------------------
/examples-standalone/kendoangular-aspnetcore-integration/ClientApp/src/app/upload/upload.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from "@angular/core";
2 | import { ChunkSettings, KENDO_UPLOAD } from "@progress/kendo-angular-upload";
3 |
4 | @Component({
5 | selector: "app-upload",
6 | templateUrl: "./upload.component.html",
7 | styleUrl: "./upload.component.css",
8 | imports: [KENDO_UPLOAD]
9 | })
10 | export class UploadComponent {
11 | public chunkSettings: ChunkSettings = {
12 | size: 102400,
13 | };
14 | }
15 |
--------------------------------------------------------------------------------
/examples/projects/grid-graphql/server/index.js:
--------------------------------------------------------------------------------
1 | const express = require('express');
2 | const graphqlHTTP = require('express-graphql');
3 | const schema = require('./schema/schema');
4 | const cors = require('cors')
5 |
6 | const app = express();
7 |
8 |
9 | // allow cross-origin requests
10 | app.use(cors());
11 |
12 | // bind express with graphql
13 | app.use('/graphql', graphqlHTTP({
14 | schema
15 | }));
16 |
17 | app.listen(4000, () => {
18 | console.log('now listening for requests on port 4000');
19 | });
--------------------------------------------------------------------------------
/examples-standalone/angular-universal/node_sample_application/.browserslistrc:
--------------------------------------------------------------------------------
1 | # This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
2 | # For additional information regarding the format and rule options, please see:
3 | # https://github.com/browserslist/browserslist#queries
4 |
5 | # You can see what browsers were selected by your queries by running:
6 | # npx browserslist
7 |
8 | > 0.5%
9 | last 2 versions
10 | Firefox ESR
11 | not dead
12 | not IE 9-11 # For IE 9-11 support, remove 'not'.
--------------------------------------------------------------------------------
/examples-standalone/finance-portfolio/src/app/components/footer/footer.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, ViewEncapsulation } from '@angular/core';
2 | import { Router } from '@angular/router';
3 |
4 | @Component({
5 | selector: 'app-footer',
6 | templateUrl: './footer.component.html',
7 | styleUrls: ['./footer.component.scss'],
8 | encapsulation: ViewEncapsulation.None
9 | })
10 | export class FooterComponent {
11 | public currentYear: number = new Date().getFullYear();
12 | constructor(public router: Router) {}
13 | }
14 |
--------------------------------------------------------------------------------