feat: enhance dev toolbar with development mode check

- Added a conditional rendering for the developer tools in the DevToolbarComponent to display only in development mode.
- Introduced the `isDevMode` function from Angular core to determine the current mode.
- Updated the component template to include the new conditional logic for improved usability during development.

libs/ngx-dev-toolbar/src/dev-toolbar.component.ts

@@ -5,7 +5,13 @@ import {
   transition,
   trigger,
 } from '@angular/animations';
-import { Component, DestroyRef, OnInit, inject } from '@angular/core';
+import {
+  Component,
+  DestroyRef,
+  OnInit,
+  inject,
+  isDevMode,
+} from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { fromEvent } from 'rxjs';
 import { filter, throttleTime } from 'rxjs/operators';
@@ -28,6 +34,7 @@ import { SettingsService } from './tools/settings-tool/settings.service';
   ],
 
   template: `
+    @if (isDevMode) {
     <div
       aria-label="Developer tools"
       role="toolbar"
@@ -43,6 +50,7 @@ import { SettingsService } from './tools/settings-tool/settings.service';
       <ndt-feature-flags-tool />
       <ndt-settings-tool />
     </div>
+    }
   `,
   animations: [
     trigger('toolbarState', [
@@ -69,6 +77,8 @@ export class DevToolbarComponent implements OnInit {
   destroyRef = inject(DestroyRef);
   settingsService = inject(SettingsService);
 
+  isDevMode = isDevMode();
+
   private keyboardShortcut = fromEvent<KeyboardEvent>(window, 'keydown')
     .pipe(
       filter((event) => event.ctrlKey && event.shiftKey && event.key === 'D'),