Themes are no longer working

[ricardosaracino]

Description

Here is a link to reproduce https://github.com/ricardosaracino/igniteui-angular-theme

Themes are no longer working

• igniteui-angular version:
• browser:

"@angular/animations": "^17.2.1",
   "@angular/common": "^17.2.1",
   "@angular/compiler": "^17.2.1",
   "@angular/core": "^17.2.1",
   "@angular/forms": "^17.2.1",
   "@angular/platform-browser": "^17.2.1",
   "@angular/platform-browser-dynamic": "^17.2.1",
   "@angular/router": "^17.2.1",
   "@fontsource/roboto": "^5.0.8",
   "@fortawesome/fontawesome-free": "^6.5.1",
   "@infragistics/igniteui-angular": "^17.0.13",
   "@ngrx/effects": "^17.1.0",
   "@ngrx/store": "^17.1.0",
   "@ngx-translate/core": "^15.0.0",
   "@ngx-translate/http-loader": "^8.0.0",
   "accounting": "^0.4.1",
   "bootstrap": "^5.3.2",
   "hammerjs": "^2.0.8",
   "igniteui-angular-core": "^17.2.1",
   "igniteui-theming": "^4.4.0",
   "jwt-decode": "^4.0.0",
   "minireset.css": "^0.0.7",
   "rxjs": "~7.8.1",
   "tslib": "^2.6.2",
   "zone.js": "~0.14.4"

Steps to reproduce

@use '@infragistics/igniteui-angular/theming' as *;

$font-family: 'Roboto, Arial, sans-serif';

$gray: #121212;
$surface: #fff;

$info: #1377d5;
$success: #4eb862;
$warn: #fbb13c;
$error: #ff134a;

$roundness: 0;

$primary: #045493;
$secondary: #045493;

@include core();

@include typography($font-family: $font-family);

$palette: palette($primary, $secondary, $surface, $gray, $info, $success, $warn, $error);

:root {
  @include palette($palette);
}

@include bootstrap-light-theme($palette, $roundness: $roundness);

Result

HookWebpackError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
$map: null is not a map.
   ╷
63 │     $s: map.get($theme, 'selector');
   │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^
   ╵
  node_modules\igniteui-theming\sass\themes\_mixins.scss 63:9                                             css-vars()
  node_modules\@infragistics\igniteui-angular\lib\core\styles\components\button\_button-theme.scss 231:5  button()
  node_modules\@infragistics\igniteui-angular\lib\core\styles\themes\generators\_base.scss 163:9          theme-internal()
  node_modules\@infragistics\igniteui-angular\lib\core\styles\themes\generators\_base.scss 42:5           theme()
  node_modules\@infragistics\igniteui-angular\lib\core\styles\themes\generators\_bootstrap.scss 29:5      bootstrap-light-theme()
  src\client\dev1manager.advancedais.com\theme.scss 19:1                                                  root stylesheet

Expected result

What is the expected result after following the steps to reproduce?

Attachments

Attach a sample if available, and screenshots, if applicable.

i can get it working if i comment this line out

\node_modules@infragistics\igniteui-angular\lib\core\styles\themes\generators_base.scss

[lalo-mx]

Ignite UI for Angular 17.0.x is only compatible with igniteui-theming 3.x.x; igniteui-theming