or
1 answer
20 views
I was following this: https://www.telerik.com/kendo-angular-ui/components/installation/migration/v18-to-v19
Gave the command:
npx @progress/kendo-cli migrate --from=18 --to=19
And I got:
Why is it skipping v19? My Angular version is 19.2.x. I want to update to v19, test everything and only then migrate both Angular, Material, and Kendo to v20
Thanks in advance
Zornitsa
Telerik team
answered
on
29 Sep 2025
2 answers
15 views
Hello.
I have a single-spa micro frontend web application that's written in Angular 16 and wrapped in React 19 that's having issues recognizing the Kendo UI for Angular license at runtime in the browser.
The following warning is displayed in the browser's DevTools after the application has loaded:
I've reviewed the cause of the error message listed at kendo-angular-ui/components/licensing/license-errors-and-warnings and have verified that I have an active license for Kendo UI for Angular, as shown below:
I've also followed the steps listed at kendo-angular-ui/components/licensing to ensure the license is properly downloaded and activated, with the following result:
Lastly, I've tried removing the node_modules folder and running yarn install after ensuring that the project's .angular folder has been deleted.
However, the warning messaged mentioned at the start is still being displayed.
Here's what packages are currently installed for the project in package.json:
{
"packageManager": "yarn@1.22.22",
"dependencies": {
"@angular-architects/module-federation-runtime": "^16.0.3",
"@angular-devkit/core": "~16.2.10",
"@angular-devkit/schematics": "~16.2.10",
"@angular/animations": "~16.2.12",
"@angular/common": "~16.2.12",
"@angular/compiler": "~16.2.12",
"@angular/core": "~16.2.12",
"@angular/forms": "~16.2.12",
"@angular/localize": "~16.2.12",
"@angular/platform-browser": "~16.2.12",
"@angular/platform-browser-dynamic": "~16.2.12",
"@angular/router": "~16.2.12",
"@apollo/client": "^3.4.5",
"@babel/core": "^7.0.0-0",
"@babel/plugin-proposal-dynamic-import": "^7.18.6",
"@fortawesome/angular-fontawesome": "~0.13.0",
"@fortawesome/fontawesome-pro": "^6.4.2",
"@fortawesome/fontawesome-svg-core": "^6.4.2",
"@fortawesome/pro-light-svg-icons": "^6.4.2",
"@fortawesome/pro-regular-svg-icons": "^6.4.2",
"@fortawesome/pro-solid-svg-icons": "^6.4.2",
"@fortawesome/pro-thin-svg-icons": "^6.4.2",
"@fortawesome/react-fontawesome": "^0.2.0",
"@ng-select/ng-select": "~12.0.4",
"@ngx-translate/core": "~15.0.0",
"@popperjs/core": "2.11.8",
"@progress/kendo-angular-buttons": "^14.0.1",
"@progress/kendo-angular-charts": "^14.0.1",
"@progress/kendo-angular-common": "^14.0.1",
"@progress/kendo-angular-dateinputs": "^14.0.1",
"@progress/kendo-angular-dialog": "^14.0.1",
"@progress/kendo-angular-dropdowns": "^14.0.1",
"@progress/kendo-angular-excel-export": "^14.0.1",
"@progress/kendo-angular-grid": "^14.0.1",
"@progress/kendo-angular-icons": "^14.0.1",
"@progress/kendo-angular-inputs": "^14.0.1",
"@progress/kendo-angular-intl": "^14.0.1",
"@progress/kendo-angular-l10n": "^14.0.1",
"@progress/kendo-angular-label": "^14.0.1",
"@progress/kendo-angular-layout": "^14.0.1",
"@progress/kendo-angular-menu": "^14.0.1",
"@progress/kendo-angular-navigation": "^14.0.1",
"@progress/kendo-angular-notification": "^14.0.1",
"@progress/kendo-angular-pager": "^14.0.1",
"@progress/kendo-angular-pdf-export": "^14.0.1",
"@progress/kendo-angular-popup": "^14.0.1",
"@progress/kendo-angular-progressbar": "^14.0.1",
"@progress/kendo-angular-schematics": "^14.0.1",
"@progress/kendo-angular-tooltip": "^14.0.1",
"@progress/kendo-angular-treeview": "^14.0.1",
"@progress/kendo-angular-upload": "^14.0.1",
"@progress/kendo-angular-utils": "^14.0.1",
"@progress/kendo-data-query": "1.7.0",
"@progress/kendo-drawing": "1.18.0",
"@progress/kendo-file-saver": "1.1.1",
"@progress/kendo-licensing": "^1.3.0",
"@progress/kendo-svg-icons": "2.0.0",
"@progress/kendo-theme-bootstrap": "7.0.1",
"@progress/kendo-theme-default": "7.0.1",
"@progress/kendo-webspeech-common": "^1.0.1",
"@schematics/angular": "16.2.8",
"@sweetalert2/ngx-sweetalert2": "~12.2.0",
"advanced-search-query": "^5.1.1",
"angular-favicon": "^1.0.9",
"autoprefixer": "^10.0.2",
"axios": "~0.17.0",
"babel-plugin-macros": "^3.1.0",
"classnames": "^2.3.2",
"core-js": "~3.34.0",
"cross-fetch": "4.0.0",
"date-fns": "~2.30.0",
"deep-freeze": "^0.0.1",
"graphql": "^15.5.1",
"guid-typescript": "^1.0.9",
"hammerjs": "^2.0.8",
"i18next": "^23.7.8",
"js-cookie": "^3.0.5",
"jsoncrush": "~1.1.8",
"jwt-decode": "^4.0.0",
"jwt-js-decode": "^1.9.0",
"lodash": "~4.17.21",
"lodash-es": "~4.17.21",
"mini-css-extract-plugin": "^2.9.1",
"module-federation-import-remote": "^1.1.0",
"ngx-loading": "~15.0.0",
"ngx-toastr": "~17.0.2",
"oidc-client-ts": "^3.0.1",
"papaparse": "5.4.1",
"postcss": "^8.0.9",
"qrcode": "^1.5.3",
"qrious": "~4.0.2",
"query-string": "^7.1.1",
"rc-tooltip": "^5.2.2",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-i18next": "^13.2.2",
"react-router-dom": "^6.22.1",
"react-swipeable": "^7.0.2",
"resize-observer-polyfill": "^1.5.1",
"rxios": "github:ImagineLearning/rxios",
"rxjs": "^6.5.3",
"rxjs-compat": "^6.5.3",
"single-spa": "^6.0.3",
"single-spa-angular": "^9.2.0",
"sweetalert2": "~11.9.0",
"tailwindcss": "^2.0.3",
"uuid": "^8.3.2",
"yup": "~1.3.2",
"zone.js": "~0.13.0"
},
"devDependencies": {
"@angular-architects/module-federation": "^16.0.4",
"@angular-builders/custom-webpack": "~16.0.1",
"@angular-builders/dev-server": "~7.3.3",
"@angular/cli": "~16.2.10",
"@angular/compiler-cli": "~16.2.12",
"@angular/language-service": "~16.2.12",
"@types/jasmine": "~5.1.4",
"@types/jasminewd2": "~2.0.13",
"@types/lodash": "4.14.202",
"@types/node": "~18.11.9",
"@types/react": "19.1.0",
"@types/react-dom": "19.1.0",
"axios-mock-adapter": "^1.22.0",
"cross-env": "^7.0.3",
"css-loader": "^6.8.1",
"eslint-plugin-prettier": "5.0.0",
"husky": "^8.0.0",
"jasmine-core": "~5.1.1",
"jasmine-spec-reporter": "~7.0.0",
"js-beautify": "^1.14.11",
"karma": "~6.4.2",
"karma-chrome-launcher": "~3.2.0",
"karma-coverage-istanbul-reporter": "~3.0.3",
"karma-jasmine": "~5.1.0",
"karma-jasmine-html-reporter": "~2.1.0",
"karma-sonarqube-reporter": "~1.4.0",
"karma-spec-reporter": "0.0.36",
"lint-staged": "^15.2.0",
"prettier": "^3.1.0",
"pretty-quick": "^4.0.0",
"protractor": "~7.0.0",
"react-test-attributes": "~1.0.0",
"regenerator-transform": "^0.15.2",
"rimraf": "^5.0.5",
"sass": "~1.69.5",
"sass-loader": "^16.0.5",
"single-spa-css": "^2.0.0",
"style-loader": "^3.3.3",
"ts-node": "~10.9.1",
"tslib": "^2.6.2",
"tslint": "^6.1.3",
"typescript": "~5.1.6",
"use-deep-compare-effect": "~1.8.1",
"webpack": "^5.89.0",
"webpack-cli": "^6.0.1",
"webpack-dev-server": "^5.2.2",
"yup": "~1.3.2"
},
"resolutions": {
"webpack": "^5.89.0"
}
}Any help would be greatly appreciated.
Thank you.
Martin Bechev
Telerik team
answered
on
25 Sep 2025
1 answer
32 views
Hi,
We're using the Conversational UI Chat for our AI enabled initiative. The issue we're encountering right now is regarding the auto-scroll. When we send a prompt to our AI agent and it responds back, if the response is long, the user needs to scroll up to view the response from the start. It doesn't really help the user experience. It will be great if it just scrolls down where the first part of the response is visible (not all the way to bottom) and let the user scroll down to view the rest. Or at the very least have an option for us to turn off the auto-scroll to the bottom. Is there a solution that we can use to address this?
Thanks
Martin Bechev
Telerik team
answered
on
23 Sep 2025
0 answers
15 views
Hi,
I am Kamal Hinduja Based Geneva, Switzerland(Swiss) . Can anyone explain What are the themes supported by Kendo UI for Angular?
Thanks, Regards
Kamal Hinduja Geneva, Switzerland
kamal
Top achievements
Rank 1
Rank 1
asked
on
23 Sep 2025
1 answer
16 views
How can i change the colour of the lines drawn between the different tasks if i specify dependencies between them?
Also is there any way to dynamically change the slotWidth of the kendo-gantt-timeline-year-view components. I want to hook up a slider to drive the slotWidth value to be able to zoom in and out of the chart. Is this possible?
Yanmario
Telerik team
answered
on
19 Sep 2025
1 answer
31 views
Hello,
I'm using Kendo UI for Angular's Upload component and implementing a custom upload mechanism via the upload event handler. The goal is to post the file before form submit (reactive form dynamically generated) and on submit only filename will be passed to form).
The problem is that although I've implemented custom upload handler, component is trying to post the file (at least I see POST to localhost in network tab)? Solved this with `e.preventDefault()` which uploads file correctly, but file is removed from kendo-upload and there is no info if it's uploaded.
<kendo-upload
[multiple]="false"
(upload)="uploadEventHandler($event)">
</kendo-upload>
uploadEventHandler(e: UploadEvent) {
this.file = e.files[0].rawFile;
this.uploadStatus = 'uploading';
this.fileUploadService.mediaUpload(this.file, this.question).subscribe({
next: () => {
this.uploadStatus = 'success';
this.control.setValue(this.file?.name);
},
error: (error: any) => {
this.uploadStatus = 'error';
this.errorMessage = this.getUserFriendlyErrorMessage(error);
},
});
e.preventDefault();
}
Zornitsa
Telerik team
answered
on
17 Sep 2025
1 answer
34 views
Hi, we have made an update of Angular version (to 19) alongside Kendo. It was working fine two weeks ago, but now we started having the following problem:
We use:
I didn't find anything related to this issue on the FAQ pages. Can I get some help and support about this issue?
npm error [INFO][Telerik and Kendo UI Licensing] Telerik and Kendo UI License Key found at: /vercel/path0/telerik-license.txt
npm error License issued at 9/26/2023, 8:20:20 AM to XXXXX
npm error TypeError: glob[_0xb5a829(...)] is not a function
npm error at setRuntimeLicense (/vercel/path0/node_modules/@progress/kendo-licensing/bin/kendo-ui-license.js:2:47328)
npm error at main (/vercel/path0/node_modules/@progress/kendo-licensing/bin/kendo-ui-license.js:2:65092)
npm error at async /vercel/path0/node_modules/@progress/kendo-licensing/bin/kendo-ui-license.js:2:77506
npm error [ERROR][Telerik and Kendo UI Licensing] Error while importing license."@progress/kendo-angular-buttons": "^19.2.0", "@progress/kendo-angular-charts": "^19.2.0", "@progress/kendo-angular-common": "^19.2.0", "@progress/kendo-angular-dateinputs": "^19.2.0", "@progress/kendo-angular-dialog": "^19.2.0", "@progress/kendo-angular-dropdowns": "^19.2.0", "@progress/kendo-angular-excel-export": "^19.2.0", "@progress/kendo-angular-gauges": "^19.2.0", "@progress/kendo-angular-grid": "^19.2.0", "@progress/kendo-angular-icons": "^19.2.0", "@progress/kendo-angular-indicators": "^19.2.0", "@progress/kendo-angular-inputs": "^19.2.0", "@progress/kendo-angular-intl": "^19.2.0", "@progress/kendo-angular-l10n": "^19.2.0", "@progress/kendo-angular-label": "^19.2.0", "@progress/kendo-angular-layout": "^19.2.0", "@progress/kendo-angular-listview": "^19.2.0", "@progress/kendo-angular-menu": "^19.2.0", "@progress/kendo-angular-navigation": "^19.2.0", "@progress/kendo-angular-pager": "^19.2.0", "@progress/kendo-angular-pdf-export": "^19.2.0", "@progress/kendo-angular-pdfviewer": "^19.2.0", "@progress/kendo-angular-popup": "^19.2.0", "@progress/kendo-angular-progressbar": "^19.2.0", "@progress/kendo-angular-spreadsheet": "^19.2.0", "@progress/kendo-angular-toolbar": "^19.2.0", "@progress/kendo-angular-tooltip": "^19.2.0", "@progress/kendo-angular-treelist": "^19.2.0", "@progress/kendo-angular-treeview": "^19.2.0", "@progress/kendo-angular-upload": "^19.2.0", "@progress/kendo-angular-utils": "^19.2.0", "@progress/kendo-data-query": "^1.7.0", "@progress/kendo-drawing": "^1.20.1", "@progress/kendo-font-icons": "^4.5.0", "@progress/kendo-licensing": "^1.7.1",
Martin Bechev
Telerik team
answered
on
16 Sep 2025
1 answer
10 views
Hi,
I use the kend dropdownlist with a attached kendo-label. However the "for" reference of the label is marked as invalid (at least by "AInspector" and "WAVE" Accessibility testing tools).
Please see attached screen shots, where I tested against the first example from the kendo docs
( https://demos.telerik.com/kendo-angular-ui/demos/dropdowns/dropdownlist/basic_usage?theme=default-ocean-blue-a11y )
DOM inspection of the example shows, that the label properly references the dropdownlist, also the aria-labelledby reference is correct:
<kendo-label text="Find restaurants in your area" dir="ltr"><!---->
<label for="k-9997b5c1-2233-4273-ba25-6e344c093c3d" id="k-2a8d206c-3623-44ce-a03d-c8c097acc5a6">
Find restaurants in your area<!----></label>
<kendo-dropdownlist ...
aria-describedby="k-80ee2bb7-41d8-4c8b-9afc-08898b371395"
id="k-9997b5c1-2233-4273-ba25-6e344c093c3d" ... aria-labelledby="k-2a8d206c-3623-44ce-a03d-c8c097acc5a6">
<button ...>...</button>
...
The problem could be, that the label references the <kendo-dropdownlist> tag itself, not the included button or other included elements.
According to HTML documentation , only "labelable elements" can be referenced by the "for" reference of a label (e.g. button, input, see labelable elements ).
My question is, how to deal with it, and how to explain the warnings to our customers...
Thank you in advance!
Zornitsa
Telerik team
answered
on
09 Sep 2025
1 answer
36 views
Getting below error while building angular application
10:04:17 am[vite] (client)warning:
/.../.angular/cache/20.2.1/.../vite/deps/@progress_kendo-angular-pdfviewer.js
16367 | const worker = yield import(
16368 | /*webpackIgnore: true*/
16369 | this.workerSrc
| ^^^^^^^^^^^^^^
16370 | );
16371 | return worker.WorkerMessageHandler;
The above dynamic import cannot be analyzed by Vite.
See https://github.com/rollup/plugins/tree/master/packages/dynamic-import-vars#limitations for supported dynamic import formats. If this is intended to be left as-is, you can use the /* @vite-ignore */ comment inside the import() call to suppress this warning.
Plugin: vite:import-analysis
File: /.../.angular/cache/20.2.1/.../vite/deps/@progress_kendo-angular-pdfviewer.js?v=46fe0012
@progress/kendo-angular-pdfviewer: 20.0.2
Angular: 20.2.1
Node: 22.18.0
NPM: 10.9.3
Zornitsa
Telerik team
answered
on
03 Sep 2025
1 answer
12 views
<div class="pdf-signing-viewer">
<div class="pdf-signing-document-container">
<kendo-pdf-export #pdf paperSize="A4" margin="0.5cm" style="height: 100%; display: block">
<div class="pdf-signing-document">
<div *ngIf="htmlHeader != null" class="pdf-signing-header">
<img src="{{ htmlHeader }}" width="90%" height="90%" />
</div>
<div id="HtmlTemplateContent" style="padding: 20px"></div>
<!-- Signature preview for PDF export -->
<div *ngIf="signatureValid" style="margin-left: 20px; display: flex; align-items: center;">
<p style="font-size: 14px; margin: 0;">Signature:</p>
<img [src]="signature" alt="Signature" style="max-width: 200px; max-height: 100px;" />
</div>
<div *ngIf="htmlFooter != null" class="pdf-signing-footer">
<img src="{{ htmlFooter }}" width="100%" height="80%" />
</div>
</div>
</kendo-pdf-export>
<div class="pdf-signing-fade"></div>
</div>
<div class="pdf-signing-actions">
<div class="pdf-signing-actions-content">
<div class="pdf-signing-signature-area">
<kendo-signature
[popupScale]="2"
[(ngModel)]="signature"
(ngModelChange)="onSignatureChange($event)">
</kendo-signature>
</div>
<div class="pdf-signing-buttons">
<button kendoButton themeColor="primary">Upload PDF</button>
<button kendoButton themeColor="primary" (click)="SaveThePdf(pdf)" [disabled]="htmlHeader == null && htmlFooter == null">Download PDF</button>
</div>
</div>
</div>
</div>
Yanmario
Telerik team
answered
on
03 Sep 2025
