Hi there,
I am trying to upgrade my project from Angular 14 to Angular 15. I am getting the following errors:
./src/assets/styles/pim.scss - Error: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Index out of range
╷
1328 │ @return function-exists( $name );
│ ^^^^^^^^^^^^^^^^^^^^^^^^
╵
@progress\kendo-theme-default\dist\all.scss 1328:13 k-meta-function-exists()
@progress\kendo-theme-default\dist\all.scss 6526:19 generate-utils()
@progress\kendo-theme-default\dist\all.scss 6627:5 kendo-utils--layout--aspect-ratio()
@progress\kendo-theme-default\dist\all.scss 7440:5 kendo-utils--layout()
@progress\kendo-theme-default\dist\all.scss 13231:5 kendo-utils()
@progress\kendo-theme-default\dist\all.scss 13259:9 @content
@progress\kendo-theme-default\dist\all.scss 3695:9 module-render()
@progress\kendo-theme-default\dist\all.scss 13258:5 kendo-utils--styles()
@progress\kendo-theme-default\dist\all.scss 13264:5 @import
src\assets\styles\_kendo-custom.scss 16:9 @import
src\assets\styles\my.scss 5:9 root stylesheet
./src/assets/styles/my.scss?ngGlobalStyle - Error: Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
HookWebpackError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Index out of range
╷
1328 │ @return function-exists( $name );
│ ^^^^^^^^^^^^^^^^^^^^^^^^
╵
@progress\kendo-theme-default\dist\all.scss 1328:13 k-meta-function-exists()
@progress\kendo-theme-default\dist\all.scss 6526:19 generate-utils()
@progress\kendo-theme-default\dist\all.scss 6627:5 kendo-utils--layout--aspect-ratio()
@progress\kendo-theme-default\dist\all.scss 7440:5 kendo-utils--layout()
@progress\kendo-theme-default\dist\all.scss 13231:5 kendo-utils()
@progress\kendo-theme-default\dist\all.scss 13259:9 @content
@progress\kendo-theme-default\dist\all.scss 3695:9 module-render()
@progress\kendo-theme-default\dist\all.scss 13258:5 kendo-utils--styles()
@progress\kendo-theme-default\dist\all.scss 13264:5 @import
src\assets\styles\_kendo-custom.scss 16:9 @import
src\assets\styles\my.scss 5:9 root stylesheet
In my _kendo-custom.scss, it's simply importing the default theme stylesheet like this:
@import "@progress/kendo-theme-default/dist/all.scss";
I have tried to upgrade all the dependencies, but it's still throwing these errors. Here is the content my package.json
"@angular/animations": "^15.2.8",
"@angular/cdk": "^15.2.8",
"@angular/common": "^15.2.8",
"@angular/compiler": "^15.2.8",
"@angular/core": "^15.2.8",
"@angular/forms": "^15.2.8",
"@angular/localize": "^15.2.8",
"@angular/material": "^15.2.8",
"@angular/platform-browser": "^15.2.8",
"@angular/platform-browser-dynamic": "^15.2.8",
"@angular/router": "^15.2.8",
"@ng-select/ng-select": "^10.0.4",
"@progress/kendo-angular-buttons": "^11.6.0",
"@progress/kendo-angular-common": "^11.6.0",
"@progress/kendo-angular-dateinputs": "^11.6.0",
"@progress/kendo-angular-dialog": "^11.6.0",
"@progress/kendo-angular-dropdowns": "^11.6.0",
"@progress/kendo-angular-excel-export": "^11.6.0",
"@progress/kendo-angular-grid": "^11.6.0",
"@progress/kendo-angular-inputs": "^11.6.0",
"@progress/kendo-angular-intl": "^11.6.0",
"@progress/kendo-angular-l10n": "^11.6.0",
"@progress/kendo-angular-label": "^11.6.0",
"@progress/kendo-angular-notification": "^11.6.0",
"@progress/kendo-angular-pdf-export": "^11.6.0",
"@progress/kendo-angular-popup": "^11.6.0",
"@progress/kendo-angular-tooltip": "^11.6.0",
"@progress/kendo-angular-treelist": "^11.6.0",
"@progress/kendo-angular-treeview": "^11.6.0",
"@progress/kendo-common": "^0.2.2",
"@progress/kendo-data-query": "^1.6.0",
"@progress/kendo-date-math": "^1.5.10",
"@progress/kendo-drawing": "^1.17.5",
"@progress/kendo-file-saver": "^1.1.1",
"@progress/kendo-licensing": "^1.3.0",
"@progress/kendo-ooxml": "^1.7.0",
"@progress/kendo-popup-common": "^1.9.2",
"@progress/kendo-schematics": "^3.2.0",
"@progress/kendo-theme-default": "^6.3.0",
Running out of ideas now on how to resolve this. Any help would be appreciated!

Hi,
I am trying to export multiple treelists which has same columns and treelists are generated by *ngFor (from an external button request) into one Excel sheet. I cannot get it quite right, and cannot find any example that can help me.
Any examples or assistance would be greatly appreciated.
Thank you,
Mahidhar.
Hi,
I am implementing a solution using the Kendo UI for Angular Filter Component. The filter fields will potentially be a very large list of fields and I'd like to use the Kendo Automcomplete control to display the field picker instead of the standard dropdownlist. I can see that there is support for customizing the Value Editor for each filter, but is there any way to use a custom template for the Field selector?
using kendoFileSelectFileTemplate,
would like to have some Angular TypeScript code run when the user clicks in the whitespace in the <li> elements rendered by the kendo-upload control.

how can edit the dropdown defaultitem cell , I want to change the background colour and font size . thanks

I'm struggling with issue creating custom filter Multi-Checkbox but for row filters - it should be open when user click on input bellow column header, chosen values displays in this input field.
I was trying work with those both tutorials :
https://www.telerik.com/kendo-angular-ui/components/grid/filtering/filter-row/#toc-custom-filter-row-components
and
https://www.telerik.com/kendo-angular-ui/components/grid/filtering/filter-menu/#toc-multi-checkbox-menu-filtering
and trying combine them somehow.
The issue which I'm facing with is when i try update filters by methods
filterService.filter()or by
extends BaseFilterCellComponentand method
this.applyFilter()It makes that other already chosen filters from other columns disappears.
My grid setup looks like this
<kendo-grid
[data]="gridData"
[filter]="filter"
filterable="row"
(filterChange)="filterChange($event)"
(dataStateChange)="dataStateChange($event)"
[height]="400"
> where
gridData is a GridDataResult
filters is CompositeFilterDescriptor
my goal is to receive such object of filters
{"filter":{
"filters":[
{
"field":"ProductName",
"operator":"contains",
"value":"chai"
},
{
"filters":[
{
"field":"CategoryID",
"operator":"eq",
"value":2
},
{
"field":"CategoryID",
"operator":"eq",
"value":7
},
{
"field":"CategoryID",
"operator":"eq",
"value":6
}
],
"logic":"or"
}
],
"logic":"and"
},
"group":[],
"skip":0,
"sort":[]
}Hello,
So I downloaded figma assets, created design with reused components from underlying figma assets, variables are changed and everything, but how do you actually use those in Angular app ?
If I set variable names with the values before importing all.scss in styles, it has no effect, because variable names in figma does not match variable names in all.scss of the themes, so it does not override. I noticed that themebuilder somehow maps those figma variables to the variables used in themes.
what should I do without ThemeBuilder?
Hi,
I want to show orders in a grid but the comment fields I would like to put on a second row that spans over all the columns. The reason is that the comments are important and they don't need to scroll to the columns. Also there can be a lot of text in the field and I can't put it in the beginning of the grid, otherwise they don't see other columns.
What I've done to achieve this is put the comments in a detailtemplate (see attachment). This works.
But the issue now is that I also need sticky columns that the first column stays visible and this is not supported.
I also get this message when debugging: re.mjs:7739 ERROR Error: Having both detail template and sticky columns is not supported.
When I change the environment.production setting to true, I don't get the error any more and it seems to work.
But is there another way of achieving the behavior of having on a row a second line that spans over the columns and I still can use sticky columns?