Issue type

I'm submitting a ... (check one with "x")

• [x] bug report
• [ ] feature request

Issue description

Current behavior: Following an OAuth2 flow similar to the samples, the user context menu in the header component does not drop-down upon click and yields the following stack trace.

main.a72571efe1e9cccd811a.js:69949 ERROR TypeError: Cannot read property 'appendChild' of null at NbOverlayContainerAdapter.push../node_modules/@nebular/theme/components/cdk/adapter/overlay-container-adapter.js.NbOverlayContainerAdapter._createContainer (main.a72571efe1e9cccd811a.js:105528) at NbOverlayContainerAdapter.push../node_modules/@angular/cdk/esm5/overlay.es5.js.OverlayContainer.getContainerElement (main.a72571efe1e9cccd811a.js:11222) at NbOverlay.push../node_modules/@nebular/theme/components/cdk/overlay/mapping.js.NbOverlay.createHostElement (main.a72571efe1e9cccd811a.js:106080) at NbOverlay.push../node_modules/@nebular/theme/components/cdk/overlay/mapping.js.NbOverlay.create (main.a72571efe1e9cccd811a.js:106055) at NbOverlayService.push../node_modules/@nebular/theme/components/cdk/overlay/overlay.js.NbOverlayService.create (main.a72571efe1e9cccd811a.js:106832) at NbContextMenuDirective.push../node_modules/@nebular/theme/components/context-menu/context-menu.directive.js.NbContextMenuDirective.createOverlay (main.a72571efe1e9cccd811a.js:108818) at NbContextMenuDirective.push../node_modules/@nebular/theme/components/context-menu/context-menu.directive.js.NbContextMenuDirective.show (main.a72571efe1e9cccd811a.js:108798) at SafeSubscriber._next (main.a72571efe1e9cccd811a.js:108855) at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub (main.a72571efe1e9cccd811a.js:137557) at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next (main.a72571efe1e9cccd811a.js:137495)

Expected behavior: The user context menu will show upon click after router navigation.

Steps to reproduce: The callback code that's triggering the issue is in the akveo/nebular repo. https://github.com/akveo/nebular/blob/7e68c20a92dbe8f86ff728f0df6d4e771a0b7408/src/playground/with-layout/oauth2/oauth2-callback.component.ts

I even tried a variation of the existing logic by running it within OnInit and OnDestroy with the appropriate subscription disposable. It yields the same results. The only thing that makes the user context menu to start rendering again is a hard-refresh of the browser.

Related code:

Other information:

npm, node, OS, Browser

Node, npm: `node --version` (v11.4.0) and `npm --version` (6.4.1)
OS: macOS Mojave
Browser: Chrome

Angular, Nebular

    "@nebular/auth": "3.1.0",
    "@nebular/bootstrap": "3.1.0",
    "@nebular/security": "3.1.0",
    "@nebular/theme": "3.1.0",

Nb-Select not emitting event when used with [ngModel]

I'm submitting a bug report

Issue description

Current behavior: Nb-Select does not emit (selectChange) or (ngModelChange) event when using observables with ngModel.

<nb-select (selectedChange)="onChange($event)" (ngModelChange)="onChange($event)"
    [ngModel]="selectedLocationUnitGroupId$ | async">
    <nb-option *ngFor="let option of locationUnitGroups$ | async" [value]="option.id">
        {{ option.type }}
    </nb-option>
 </nb-select>

Expected behavior: I want nb-select to emit (selectChange) or (ngModelChange) event every time user selects an option

Any ideas how to fix it?

Issue type

I'm submitting a ... (check one with "x")

• [ x ] bug report
• [ ] feature request

Issue description

Current behavior: Error about nested mixins when building/running (yarn run start)

ERROR in ./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/sass-loader/lib/loader.js??ref--8-3!./src/app/@theme/styles/styles.scss
Module build failed: 
  @mixin hover-border($color) {
        ^
      Mixins may not be defined within control directives or other mixins.
      in /home/richard/workspace/ngx-admin/node_modules/@nebular/theme/components/checkbox/_checkbox.component.theme.scss (line 8, column 10)

Expected behavior: It should build and run.

Steps to reproduce: Clone from git and yarn run start

Other information:

npm, node, OS, Browser Yarn version 1.3.2 (also tried npm 5.6.0) Node 9.8.0 Arch Linux x86

Angular, Nebular

    "@angular/animations": "~5.2.6",
    "@angular/common": "~5.2.6",
    "@angular/compiler": "~5.2.6",
    "@angular/core": "~5.2.6",
    "@angular/forms": "~5.2.6",
    "@angular/http": "~5.2.6",
    "@angular/platform-browser": "~5.2.6",
    "@angular/platform-browser-dynamic": "~5.2.6",
    "@angular/router": "~5.2.6",
...
    "@nebular/auth": "2.0.0-rc.6",
    "@nebular/theme": "2.0.0-rc.6",
    "@nebular/security": "2.0.0-rc.6",

Issue type

I'm submitting a ... (check one with "x")

• [ ] bug report
• [x] feature request

Issue description

Current behavior: It would be nice to add a Time Picker component to the Nebular Framework. I would suggest to create similar to angular-material-time-picker or ngx-material-timepicker because they have a very good user experience.

It sould be nice to have it also integrated to the Datepicker

I have copied /framework/auth directory to my project src/app directory.

and i imported auth module into my app module

`/**

• @license
• Copyright Akveo. All Rights Reserved.
• Licensed under the MIT License. See License.txt in the project root for license information. */ import { APP_BASE_HREF } from '@angular/common'; import { BrowserModule } from '@angular/platform-browser'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { NgModule } from '@angular/core'; import { HttpModule } from '@angular/http'; import { CoreModule } from './@core/core.module';

import { AppComponent } from './app.component'; import { AppRoutingModule } from './app-routing.module'; import { ThemeModule } from './@theme/theme.module'; import { NgbModule } from '@ng-bootstrap/ng-bootstrap';

import { NbAuthModule } from "./auth/auth.module";

@NgModule({ declarations: [AppComponent], imports: [ BrowserModule, BrowserAnimationsModule, HttpModule, AppRoutingModule,

NgbModule.forRoot(),
ThemeModule.forRoot(),
CoreModule.forRoot(),

NbAuthModule,

], bootstrap: [AppComponent], providers: [ { provide: APP_BASE_HREF, useValue: '/' }, ], }) export class AppModule { } and change my app-routing.module.ts to get auth components from copied directory import { NbAuthComponent, NbLoginComponent, NbLogoutComponent, NbRegisterComponent, NbRequestPasswordComponent, NbResetPasswordComponent, } from './auth/components/index';`

but when i try to access http://localhost:4200/#/auth/login i got error : ERROR Error: Uncaught (in promise): Error: No provider for NbAuthService! Error: No provider for NbAuthService!

can anyone help me? Thanks

Issue type

Style not works I'm submitting a ... (check one with "x")

• [x] bug report
• [ ] feature request

Issue description

Current behavior:

Expected behavior:

Steps to reproduce:

Related code:

insert short code snippets here

Other information:

npm, node, OS, Browser

<!--
Node, npm: `node --version` and `npm --version`
OS: Windows (7/8/10). Linux (incl. distribution). macOS (El Capitan? Sierra?)
Browser: Chrome/Safari/Firefox/etc?
-->

Angular, Nebular

<!--
Check your `package-lock.json` or locate a `package.json` in the `node_modules` folder.
-->

Good day Nebular users! I have a couple of wonderful news for you 🎉

As some of you might already noticed, we are heavily working on something new. 😃 And it's time to reveal our plans and also aks a bit for your help.

Starting from Nebular 4.0 we will be updating Nebular components design and also upgrading Theme System to support various designs in the future!💅

We are looking to simplify the theming process and make it more convenient, obvious and unified across all of the components bringing application based on Nebular to the next level of quality and awesomeness:🚀

• with New Beautiful Design
• more convenient and flexible theming process
• unified components interface
• support of CSS-variables
• and other great features

On the other side, great new things come at a price, and it's Breaking Changes in our case. At the moment we envision the following:

• changes in components HTML structure
• changes in components styles and internal selectors
• changes in Theme Map, unification of variables, removal of unnecessary ones and integration of new
• changes in the color pallet
• unification of component @Inputs and possibly @Ouputs

❗️ That's why we are looking for your feedback. We would really appreciate hearing your experience on the following points:

• [ ] Do you use custom Nebular Themes? Theme example or at least a count of changes (variables changed) is appreciated.
• [ ] Do you use multiple run-time Themes?
• [ ] Do you customize Nebular styles with custom css? How big are those customizations?

Thanks in advance for your help, let's bring Nebular to the new level together!

P.S. Work in progress is available in the next dev branch. And some more info is in the CHANGELOG file.

Issue type

I'm submitting a bug report

Issue description

Current behavior: When a lazy loaded module is opened, a NbOverlayContainerAdapter gets constructed along with it which wont have its setContainer() called. This causes the nbDialog to fail in _createContainer()

Expected behavior: setContainer() should be called, or createContainer() should append to document body if container undefined

Steps to reproduce:

• Create a lazyloaded module and route to its component.
• Try to open a nbDialog with NbDialogService injected
• Check console

Related code: Please try to open the dialog from the lazy loaded module, sm and check stackblitz console.

https://stackblitz.com/edit/nebular-overlay-container-adapter-bug

Other information:

Console logs: ERROR TypeError: Cannot read property 'appendChild' of undefined at NbOverlayContainerAdapter._createContainer (theme.umd.js:1907) at NbOverlayContainerAdapter.OverlayContainer.getContainerElement (overlay-container.ts:40) at NbOverlay.createHostElement (theme.umd.js:1289) at NbOverlay.create (theme.umd.js:1246) at NbOverlayService.create (theme.umd.js:1859) at NbDialogService.createOverlay (theme.umd.js:12724) at NbDialogService.open (theme.umd.js:12714) at LcmpComponent.openDialog (VM4956 lcmp.component.ts:21) at Object.eval [as handleEvent] (LcmpComponent.html:1) at handleEvent (view.ts:138)

npm, node, OS, Browser

Node: v8.10  npm: v6.4.1
OS: Windows 10
Browser: All

Angular, Nebular

    "@angular/cdk": "^6.4.7",
    "@angular/common": "6.1.9",
    "@angular/compiler": "6.1.9",
    "@angular/core": "6.1.9",
    "@angular/forms": "6.1.9",
    "@angular/http": "6.1.9",
    "@angular/platform-browser": "6.1.9",
    "@angular/platform-browser-dynamic": "6.1.9",
    "@angular/router": "6.1.9",
    "@nebular/auth": "^2.0.0",
    "@nebular/theme": "^2.0.0",
    "@nebular/security": "^2.0.0",

What I have observed is that, only when NbLayout is constructed you call the setContainer() Also I dont get consistent behavior when i wrap lazy-component with NbLayout

Please look into this issue :)

Issue type

I'm submitting a ... (check one with "x")

• [ x] bug report
• [ ] feature request

Issue description

Current behavior: Cannot modify login page or auth modules even after manual input.

Expected behavior: When I edit the login page html, I should see the changes im doing?

Steps to reproduce: import the auth sources, change the html, changes don't apply on the login page.

Related code:

insert short code snippets here

Other information:

npm, node, OS, Browser

<!--
Node, npm: `node --version` and `npm --version`
OS: Windows (7/8/10). Linux (incl. distribution). macOS (El Capitan? Sierra?)
Browser: Chrome/Safari/Firefox/etc?
-->

Angular, Nebular

{
  "name": "ngx-admin",
  "version": "2.1.0",
  "license": "MIT",
  "repository": {
    "type": "git",
    "url": "git+https://github.com/akveo/ngx-admin.git"
  },
  "bugs": {
    "url": "https://github.com/akveo/ngx-admin/issues"
  },
  "scripts": {
    "ng": "ng",
    "conventional-changelog": "conventional-changelog",
    "start": "ng serve",
    "build": "ng build",
    "build:prod": "npm run build -- --prod --aot",
    "test": "ng test -sr",
    "test:coverage": "rimraf coverage && npm run test -- -cc",
    "lint": "ng lint --type-check",
    "lint:fix": "ng lint --fix",
    "lint:styles": "stylelint ./src/**/*.scss",
    "lint:ci": "npm run lint && npm run lint:styles",
    "pree2e": "webdriver-manager update --standalone false --gecko false",
    "e2e": "ng e2e",
    "docs": "compodoc -p src/tsconfig.app.json -d docs",
    "docs:serve": "compodoc -p src/tsconfig.app.json -d docs -s",
    "prepush": "npm run lint:ci",
    "release:changelog": "npm run conventional-changelog -- -p angular -i CHANGELOG.md -s"
  },
  "dependencies": {
    "@agm/core": "1.0.0-beta.2",
    "@angular/animations": "~5.2.6",
    "@angular/common": "~5.2.6",
    "@angular/compiler": "~5.2.6",
    "@angular/core": "~5.2.6",
    "@angular/forms": "~5.2.6",
    "@angular/http": "~5.2.6",
    "@angular/platform-browser": "~5.2.6",
    "@angular/platform-browser-dynamic": "~5.2.6",
    "@angular/router": "~5.2.6",
    "@asymmetrik/ngx-leaflet": "3.0.1",
    "@nebular/auth": "2.0.0-rc.6",
    "@nebular/theme": "2.0.0-rc.6",
    "@nebular/security": "2.0.0-rc.6",
    "@ng-bootstrap/ng-bootstrap": "1.0.0",
    "@swimlane/ngx-charts": "7.0.1",
    "angular2-chartjs": "0.4.1",
    "angular2-toaster": "4.0.1",
    "bootstrap": "4.0.0",
    "chart.js": "2.7.1",
    "ckeditor": "4.7.3",
    "classlist.js": "1.1.20150312",
    "core-js": "2.5.1",
    "echarts": "^4.0.2",
    "font-awesome": "4.7.0",
    "intl": "1.2.5",
    "ionicons": "2.0.1",
    "leaflet": "1.2.0",
    "nebular-icons": "1.0.6",
    "ng2-ckeditor": "1.1.13",
    "ng2-smart-table": "1.2.2",
    "ng2-tree": "2.0.0-rc.4",
    "ngx-echarts": "2.0.1",
    "normalize.css": "6.0.0",
    "pace-js": "1.0.2",
    "roboto-fontface": "0.8.0",
    "rxjs": "5.5.5",
    "socicon": "3.0.5",
    "tinymce": "4.5.7",
    "typeface-exo": "0.0.22",
    "web-animations-js": "2.2.5",
    "zone.js": "0.8.18"
  },
  "devDependencies": {
    "@angular/cli": "1.7.1",
    "@angular/compiler-cli": "~5.2.6",
    "@angular/language-service": "~5.2.6",
    "@compodoc/compodoc": "1.0.1",
    "@types/googlemaps": "3.30.4",
    "@types/d3-color": "1.0.5",
    "@types/jasmine": "2.5.54",
    "@types/jasminewd2": "2.0.3",
    "@types/leaflet": "1.2.3",
    "@types/node": "6.0.90",
    "codelyzer": "4.0.2",
    "conventional-changelog-cli": "1.3.4",
    "husky": "0.13.3",
    "jasmine-core": "2.6.4",
    "jasmine-spec-reporter": "4.1.1",
    "karma": "1.7.1",
    "karma-chrome-launcher": "2.1.1",
    "karma-cli": "1.0.1",
    "karma-coverage-istanbul-reporter": "1.3.0",
    "karma-jasmine": "1.1.0",
    "karma-jasmine-html-reporter": "0.2.2",
    "npm-run-all": "4.0.2",
    "protractor": "5.1.2",
    "rimraf": "2.6.1",
    "stylelint": "7.13.0",
    "ts-node": "3.2.2",
    "tslint": "5.7.0",
    "tslint-language-service": "0.9.6",
    "typescript": "2.5.3"
  }
}

Issue type

I'm submitting a ... (check one with "x")

• [x] bug report
• [ ] feature request

Issue description

Current behavior:

I'm getting error when trying to create modal window from lazily loaded module: ERROR TypeError: Cannot read property 'appendChild' of undefined

Expected behavior:

Modal window appears, no errors.

Steps to reproduce:

1. Create lazily loaded module
2. Try to show simple modal window

Related code:

app.module.ts:
@NgModule({
    imports: [
        CommonModule,
        FormsModule,
        RouterModule.forRoot(AppRoutes),
        NbThemeModule.forRoot(<NbThemeOptions> { name: 'default' }),
        NbToastrModule.forRoot(),
        NbDialogModule.forRoot()
    ]
})

lazy.module.ts:
@NgModule({
    declarations: [
        ArticleComponent,
    ],
    imports: [
        CommonModule,
        FormsModule,
        RouterModule.forChild(NewsRoutes),
        NbDialogModule.forChild()
    ],
})

Other information:

npm, node, OS, Browser

<!--
Node, npm: `node --version` and `npm --version`
OS: Windows (7/8/10). Linux (incl. distribution). macOS (El Capitan? Sierra?)
Browser: Chrome/Safari/Firefox/etc?
-->
$ npm --version
3.5.2
$ node --version
v8.10.0
OS: Ubuntu 18.04
Browser: any

Angular, Nebular

<!--
Check your `package-lock.json` or locate a `package.json` in the `node_modules` folder.
-->
{
  "name": "ivp",
  "version": "1.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^6.1.0",
    "@angular/cdk": "^6.4.7",
    "@angular/common": "^6.1.0",
    "@angular/compiler": "^6.1.0",
    "@angular/core": "^6.1.0",
    "@angular/forms": "^6.1.0",
    "@angular/http": "^6.1.0",
    "@angular/platform-browser": "^6.1.0",
    "@angular/platform-browser-dynamic": "^6.1.0",
    "@angular/router": "^6.1.0",
    "@nebular/bootstrap": "^2.0.0",
    "@nebular/theme": "^2.0.0",
    "bootstrap": "^4.1.3",
    "core-js": "^2.5.4",
    "jquery": "^3.3.1",
    "jquery-ui-dist": "^1.12.1",
    "moment": "^2.22.2",
    "nebular-icons": "^1.1.0",
    "ngx-moment": "^3.1.0",
    "ngx-typeahead": "^6.2.0",
    "pace-js": "1.0.2",
    "popper.js": "^1.14.3",
    "rxjs": "~6.2.0",
    "zone.js": "~0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.8.0",
    "@angular/cli": "~6.2.2",
    "@angular/compiler-cli": "^6.1.0",
    "@angular/language-service": "^6.1.0",
    "@types/jasmine": "~2.8.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/jquery": "^3.3.10",
    "@types/node": "~8.9.4",
    "codelyzer": "~4.3.0",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~3.0.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~1.1.2",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.4.0",
    "ts-node": "~7.0.0",
    "tslint": "^5.11.0",
    "typescript": "~2.9.2"
  }
}

Issue type

• [x] bug report
• [ ] feature request

Issue description

Current behavior: When using format="dd.MM.yyyy" on NbDatePicker only dates from the 1st till 12th of a month are valid in the formGroup. Using @nebuler/moment and @nebular/date-fns does not make any difference. The issue here seems to be that the form validation does not use the date format I provided. This is the validation error: nbDatepickerParse: {value: "19.12.2018"} As days from 1 to 12 are valid my guess is that days are taken for months?

Expected behavior: 19.12.2018 is a valid date when using format="dd.MM.yyyy".

Steps to reproduce: See above.

Other information:

npm, node, OS, Browser

<!--
Node, npm: 10.13.0, 6.4.1
OS: macOS
Browser: any
-->

Angular, Nebular

"@angular/core": "7.1.1",
"@nebular/date-fns": "3.0.0",
"@nebular/moment": "3.0.0",
"@nebular/theme": "3.0.0",

Issue type

I'm submitting a ... (check one with "x")

• [x] bug report
• [ ] feature request

Issue description

Current behavior: Using NbPasswordAuthStrategy and the accompanying NbAuthSimpleInterceptor, the received token is inserted as HTTP header like so:
Authorization: 3b023126-a007-422e-9838-839871aae08b

Expected behavior: I would need it to be:
Authorization: Bearer 3b023126-a007-422e-9838-839871aae08b

Steps to reproduce: I generally followed the tutorial for NbPasswordAuthStrategy in the Nebular vnext Docs

Related code: As a workaround I managed to configure a custom getter, like so:

NbAuthModule.forRoot({
  strategies: [
    NbPasswordAuthStrategy.setup({
      token: {
        key: 'token',
        getter: (_module: string, response: HttpResponse<{ token: string }>) =>
          `Bearer ${response.body?.token ?? ''}`,
      },
      // ...
    }),
  ],
});

Other information:

There is a (quite dated) Stackoverflow issue describing a similar issue with NbAuthJWTInterceptor, where the Bearer prefix is added in a hardcoded way instead. I guess it would be useful to generally make this prefix configurable (with sensible default that won't break existing apps).

npm, node, OS, Browser

Node v16.19.0
yarn: 1.22.19  
OS: EndeavourOS/ArchLinux x64 (rolling)
Browser: Firefox 108.0.1

Angular, Nebular

@angular/core: 15.0.0
@nebular/auth: 10.0.0

Issue type

**I'm submitting a bug report

Issue description

Current behavior: When I run npm start on my angular app this message is shown:

Expected behavior: No message shown

Steps to reproduce:

1. Install eva icons latest version npm install @nebular/[email protected] @nebular/eva-icons10.0.0 @nebular/[email protected]
2. Run npm start
3. The message is shown

Other information:

npm, node, OS, Browser

OS: Windows 10
Node: v18.12.1

Angular, Nebular

Angular: v14.2.8
Nebular: 10

I have two components, one is parent and the other is child component . I'm using Nebular ui to create a window (using nbWindowService.open(ChildComponent). There's a form in the child component and I need to get that data back into the parent component for processing.

When I close the window opened by the parent component on the child component, using this.windowref.close() does not work!!

angular.cli :12.1 nebular:8.0.0 ngx-admin:8.0.0

my code:

parent component: constructor( public windowRef: NbWindowRef, private windowService: NbWindowService }

 this.windowRef = this.windowService.open(content, { buttons: buttonsconfig });

child component:

@Input() windowref: NbWindowRef; @Output() afterupdate = new EventEmitter(); constructor( public windowRef: NbWindowRef, private windowService: NbWindowService) { } close() { this.windowRef.close();}

async update() { this.afterupdate.emit(); this.close(); }

Issue type

I'm submitting a ... (check one with "x")

• [ ] bug report
• [x] feature request

Issue description

Nebular has basic compatibility with Angular 15. Currently we must override the dependencies as follows:

{
  "overrides": {
    "@nebular/[email protected]": {
      "@angular/animations": "15.0.1",
      "@angular/cdk": "15.0.0",
      "@angular/common": "15.0.1",
      "@angular/core": "15.0.1",
      "@angular/forms": "15.0.1",
      "@angular/router": "15.0.1"
    },
    "@nebular/[email protected]": {
      "@angular/animations": "15.0.1",
      "@angular/cdk": "15.0.0",
      "@angular/common": "15.0.1",
      "@angular/core": "15.0.1",
      "@angular/router": "15.0.1"
    },
    "@nebular/[email protected]": {
      "@angular/common": "15.0.1",
      "@angular/core": "15.0.1",
      "@angular/router": "15.0.1"
    }
  }
}

Issue type

I'm submitting a

• [ ] bug report
• [X] feature request

Issue description

Current behavior: There is no way to provide default overlay configuration. Overlays are opened with predefined config, which cannot be accessed in any "programmer friendly" way.

Expected behavior: I'd like to be able to provide overlay config parameters used to create an overlay. A useful example could be opening the overlay with backdrop, or having influence what css classes are applied to the overlay.

I think the solution could be a simple injection token for the DEFAULT_OVERLAY_CONFIG which would be then injected into NbOverlayService and used as an extendable config base in the create method.

Other information:

Currently I think I have no other option than overriding NbOverlayService with my custom create method where I can specify my default params. This solution can cause issues once NbOverlayService changes, but it's the best I can think of.

@Injectable()
class OverlayService extends NbOverlayService {
  constructor(protected overlay: NbOverlay, protected layoutDirection: NbLayoutDirectionService) {
    super(overlay, layoutDirection);
  }

  public create(config?: NbOverlayConfig): NbOverlayRef {
    const extendedConfig = { hasBackdrop: true, backdropClass: 'cdk-overlay-transparent-backdrop', ...(config || {}) };
    return super.create(extendedConfig);
  }
}

Angular, Nebular

• Angular v14
• Nebular v9.0.2

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch @nebular/[email protected] for the project I'm working on.

Warning: Deprecation This operation is parsed as:

"Nebular Theme: `nb-theme()` cannot find value for key `" + $key + "` for theme `" + theming-variables.$nb-theme-name + ""

but you may have intended it to mean:

"Nebular Theme: `nb-theme()` cannot find value for key `" + $key + "` for theme `" + theming-variables.$nb-theme-name (+"")

Add a space after + to clarify that it's meant to be a binary operation, or wrap it in parentheses to make it a unary operation. This will be an error in future versions of Sass.

Here is the diff that solved my problem:

diff --git a/node_modules/@nebular/theme/styles/core/theming/_get-value.scss b/node_modules/@nebular/theme/styles/core/theming/_get-value.scss
index 8dae59d..581c8e9 100644
--- a/node_modules/@nebular/theme/styles/core/theming/_get-value.scss
+++ b/node_modules/@nebular/theme/styles/core/theming/_get-value.scss
@@ -59,7 +59,7 @@
   }
 
   @if ($value == null) {
-    @warn 'Nebular Theme: `nb-theme()` cannot find value for key `' + $key + '` for theme `'+ theming-variables.$nb-theme-name +'`';
+    @warn 'Nebular Theme: `nb-theme()` cannot find value for key `' + $key + '` for theme `'+ theming-variables.$nb-theme-name (+'`');
   }
 
   @return $value;

This issue body was partially generated by patch-package.