@db-ux/ngx-core-components 4.9.1 → 4.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @db-ux/ngx-core-components
2
2
 
3
+ ## 4.10.0
4
+
5
+ ### Minor Changes
6
+
7
+ - feat(`DBAccordionItem`): add `open` prop to control the expanded state of an accordion item programmatically. - [see commit 8e7c85d](https://github.com/db-ux-design-system/core-web/commit/8e7c85dfba9e0b013fce9db2151545b8f336a29a)
8
+
9
+ - refactor(form components): replace hard 25ch label width limit with customizable CSS variable `--db-label-max-size` (defaults to `100%`). To restore the previous behavior, set `--db-label-max-size: 25ch;` in your project styles. - [see commit 08b1234](https://github.com/db-ux-design-system/core-web/commit/08b1234342e3c0d622116d528a979ff53d7e2356)
10
+
3
11
  ## 4.9.1
4
12
 
5
13
  ### Patch Changes
@@ -207,7 +215,7 @@ _version bump_
207
215
 
208
216
  - fix: set DBTabItem internal state `_selected` correctly - [see commit f7625cb](https://github.com/db-ux-design-system/core-web/commit/f7625cbd9d64513527e826c9d2c1ef42b2734a4b):
209
217
 
210
- - Now also sets aria-selected=true|false correctly which improves screen reader behaviour
218
+ - Now also sets aria-selected=true|false correctly which improves screen reader behaviour
211
219
 
212
220
  ## 4.2.1
213
221
 
package/README.md CHANGED
@@ -6,52 +6,55 @@
6
6
  [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](https://makeapullrequest.com)
7
7
 
8
8
  An Angular library containing all styles & components of [DB UX Design System (technical components)](https://github.com/db-ux-design-system/core-web).
9
-
10
- > **Note:** Find more information about specific components [here](https://design-system.deutschebahn.com/core-web/review/main)
9
+ We also provide more information about specific components. This information is in our [Design System documentation](https://design-system.deutschebahn.com/documentation/get-started/).
11
10
 
12
11
  ## Install
13
12
 
14
13
  ```shell
15
- npm i @db-ux/ngx-core-components
14
+ pnpm add @db-ux/ngx-core-components @db-ux/core-components @db-ux/core-foundations --save-dev
16
15
  ```
17
16
 
18
- > **Note:** This will install [`@db-ux/core-foundations`](https://www.npmjs.com/package/@db-ux/core-foundations) and [`@db-ux/core-components`](https://www.npmjs.com/package/@db-ux/core-components) as well which contains the `css`/`scss` files
19
-
20
17
  ## Styling Dependencies
21
18
 
22
- Import the styles in `scss` or `css`. Based on your technology the file names could be different.
19
+ Import the styles in your main CSS file:
20
+
21
+ ```css
22
+ /* styles.css */
23
+ @layer whitelabel-theme, db-ux;
24
+ /* You may want to include another theme here, this is a whitelabel theme! So instead of including the following line of code, please have a look at the DB Theme section */
25
+ @import "@db-ux/core-foundations/build/styles/theme/rollup.css"
26
+ layer(whitelabel-theme);
27
+
28
+ @import "@db-ux/core-components/build/styles/bundle.css" layer(db-ux);
29
+ ```
23
30
 
24
- - Default (relative): points to `../assets`
25
- - Rollup (rollup): points to `@db-ux/core-foundations/assets`
26
- - Webpack (webpack): points to `~@db-ux/core-foundations/assets`
31
+ ### PostCSS Plugin (recommended)
27
32
 
28
- <details>
29
- <summary><strong>SCSS</strong></summary>
33
+ We recommend using the [`@db-ux/core-postcss-plugin`](https://www.npmjs.com/package/@db-ux/core-postcss-plugin) to reduce your bundle size. It flattens CSS custom properties by resolving `var()`, `calc()`, `color-mix()`, and `light-dark()` at build time, removing unused declarations.
30
34
 
31
- ```scss styles.scss
32
- // styles.scss
33
- @forward "@db-ux/core-components/build/styles/rollup";
35
+ ```shell
36
+ pnpm add @db-ux/core-postcss-plugin --save-dev
34
37
  ```
35
38
 
36
- </details>
37
- <details>
38
- <summary><strong>CSS</strong></summary>
39
+ Create a `postcss.config.json` in your project root:
39
40
 
40
- ```css styles.css
41
- /* styles.css */
42
- @import "@db-ux/core-components/build/styles/rollup.css";
41
+ ```json
42
+ {
43
+ "plugins": {
44
+ "@db-ux/core-postcss-plugin": {}
45
+ }
46
+ }
43
47
  ```
44
48
 
45
- </details>
49
+ > Angular CLI (`@angular/build:application`) only supports JSON-based PostCSS configs and loads plugins by name via `require()`. Works in both `ng build` and `ng serve`.
46
50
 
47
- > **Note:** The `relative` file contains optional and all components styles. If you consider performance issues see [@db-ux/core-components](https://www.npmjs.com/package/@db-ux/core-components) for more information.
51
+ 📖 **[Learn more about `@db-ux/core-postcss-plugin` node package](https://www.npmjs.com/package/@db-ux/core-postcss-plugin)**
48
52
 
49
53
  ### Resolve assets
50
54
 
51
55
  The current default development config in `angular.json` doesn't use output hashing. This may cause an issue loading the fonts. Look at [this](https://github.com/angular/angular-cli/issues/26347) for more information.
52
56
 
53
- As a solution add `
54
- "outputHashing": "media"` to `configurations/development` in`angular.json`.
57
+ As a solution add `"outputHashing": "media"` to `configurations/development` in `angular.json`.
55
58
 
56
59
  ### DB Theme
57
60
 
@@ -59,8 +62,8 @@ In case that you're building a website or application for Deutsche Bahn, you'll
59
62
 
60
63
  ## Usage
61
64
 
62
- ```ts app.component.ts
63
- //app.component.ts
65
+ ```ts
66
+ // app.component.ts
64
67
  import { DBButton } from '@db-ux/ngx-core-components';
65
68
 
66
69
  @Component({
@@ -68,13 +71,13 @@ import { DBButton } from '@db-ux/ngx-core-components';
68
71
  imports: [
69
72
  // ...,
70
73
  DBButton
71
- ],
74
+ ],
72
75
  standalone: true
73
76
  // ...
74
77
  })
75
78
  ```
76
79
 
77
- ```html app.component.html
80
+ ```html
78
81
  <!-- app.component.html -->
79
82
  <db-button variant="brand">Button</db-button>
80
83
  ```
@@ -83,7 +86,7 @@ import { DBButton } from '@db-ux/ngx-core-components';
83
86
 
84
87
  There are 3 ways to use Events in Angular:
85
88
 
86
- **[ngModel](https://angular.io/api/forms/NgModel)**
89
+ **[ngModel](https://angular.dev/api/forms/NgModel)**
87
90
 
88
91
  ```html
89
92
  <db-input
@@ -93,7 +96,7 @@ There are 3 ways to use Events in Angular:
93
96
  ></db-input>
94
97
  ```
95
98
 
96
- **[FormControl](https://angular.io/api/forms/FormControl)**
99
+ **[FormControl](https://angular.dev/api/forms/FormControl)**
97
100
 
98
101
  ```html
99
102
  <db-input
@@ -103,7 +106,7 @@ There are 3 ways to use Events in Angular:
103
106
  ></db-input>
104
107
  ```
105
108
 
106
- **[change](https://developer.mozilla.org/de/docs/Web/API/HTMLElement/change_event)**
109
+ **[change](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)**
107
110
 
108
111
  ```html
109
112
  <db-input
@@ -127,7 +130,7 @@ npx @db-ux/agent-cli
127
130
 
128
131
  This will create or update `.github/copilot-instructions.md` with component documentation based on your installed `@db-ux` packages, helping AI agents provide better suggestions.
129
132
 
130
- 📖 **[Learn more about `@db-ux/agent-cli` node package](packages/agent-cli/README.md)**
133
+ 📖 **[Learn more about `@db-ux/agent-cli` node package](https://www.npmjs.com/package/@db-ux/agent-cli)**
131
134
 
132
135
  ## Code Quality
133
136
 
@@ -136,7 +139,7 @@ To enforce correct usage of DB UX Design System components in your Angular templ
136
139
  ### Installation
137
140
 
138
141
  ```shell
139
- npm install eslint @db-ux/core-eslint-plugin @angular-eslint/template-parser --save-dev
142
+ pnpm add eslint @db-ux/core-eslint-plugin @angular-eslint/template-parser --save-dev
140
143
  ```
141
144
 
142
145
  ### Setup
@@ -162,6 +165,35 @@ export default [
162
165
 
163
166
  📖 **[Learn more about `@db-ux/core-eslint-plugin` node package](https://www.npmjs.com/package/@db-ux/core-eslint-plugin)**
164
167
 
168
+ ## Stylelint
169
+
170
+ To validate correct usage of DB UX Design System tokens in your CSS/SCSS, use the [`@db-ux/core-stylelint`](https://www.npmjs.com/package/@db-ux/core-stylelint) plugin.
171
+
172
+ ### Installation
173
+
174
+ ```shell
175
+ pnpm add stylelint @db-ux/core-stylelint --save-dev
176
+ ```
177
+
178
+ ### Setup
179
+
180
+ Add to your `.stylelintrc.json`:
181
+
182
+ ```json
183
+ {
184
+ "plugins": ["@db-ux/core-stylelint"],
185
+ "rules": {
186
+ "db-ux/use-spacings": [true],
187
+ "db-ux/use-sizing": [true],
188
+ "db-ux/use-border-width": [true],
189
+ "db-ux/use-border-radius": [true],
190
+ "db-ux/use-border-color": [true]
191
+ }
192
+ }
193
+ ```
194
+
195
+ 📖 **[Learn more about `@db-ux/core-stylelint` node package](https://www.npmjs.com/package/@db-ux/core-stylelint)**
196
+
165
197
  ## Deutsche Bahn brand
166
198
 
167
199
  As we'd like to perfectly support our users and customers on their digital journey, the usage of Deutsche Bahn brand and trademarks are bound of clear guidelines and restrictions even if being used with the code that we're providing with this product; Deutsche Bahn fully reserves all rights regarding the Deutsche Bahn brand, even though that we're providing the code of DB UX Design System products free to use and release it under the Apache 2.0 license.
@@ -190,13 +190,16 @@ class DBAccordionItem {
190
190
  if (this.toggle) {
191
191
  this.toggle.emit(newStateOpen);
192
192
  }
193
- this._open.set(newStateOpen);
193
+ if (this.open() === undefined) {
194
+ this._open.set(newStateOpen);
195
+ }
194
196
  }
195
197
  constructor() {
196
198
  this.cls = cls;
197
199
  this.getBooleanAsString = getBooleanAsString;
198
200
  this.defaultOpen = input(...(ngDevMode ? [undefined, { debugName: "defaultOpen" }] : /* istanbul ignore next */ []));
199
201
  this.name = input(...(ngDevMode ? [undefined, { debugName: "name" }] : /* istanbul ignore next */ []));
202
+ this.open = input(...(ngDevMode ? [undefined, { debugName: "open" }] : /* istanbul ignore next */ []));
200
203
  this.id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : /* istanbul ignore next */ []));
201
204
  this.propOverrides = input(...(ngDevMode ? [undefined, { debugName: "propOverrides" }] : /* istanbul ignore next */ []));
202
205
  this.className = input(...(ngDevMode ? [undefined, { debugName: "className" }] : /* istanbul ignore next */ []));
@@ -229,6 +232,17 @@ class DBAccordionItem {
229
232
  }, {
230
233
  // Enable writing to signals inside effects
231
234
  });
235
+ effect(() => {
236
+ // --- Mitosis: Workaround to make sure the effect() is triggered ---
237
+ this.open();
238
+ // ---
239
+ const nextOpen = getBoolean(this.open(), "open");
240
+ if (nextOpen !== undefined) {
241
+ this._open.set(nextOpen);
242
+ }
243
+ }, {
244
+ // Enable writing to signals inside effects
245
+ });
232
246
  }
233
247
  }
234
248
  /**
@@ -278,7 +292,7 @@ class DBAccordionItem {
278
292
  }
279
293
  }
280
294
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: DBAccordionItem, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
281
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: DBAccordionItem, isStandalone: true, selector: "db-accordion-item", inputs: { defaultOpen: { classPropertyName: "defaultOpen", publicName: "defaultOpen", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, propOverrides: { classPropertyName: "propOverrides", publicName: "propOverrides", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, headlinePlain: { classPropertyName: "headlinePlain", publicName: "headlinePlain", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { toggle: "toggle" }, viewQueries: [{ propertyName: "_ref", first: true, predicate: ["_ref"], descendants: true, isSignal: true }], ngImport: i0, template: `<li
295
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: DBAccordionItem, isStandalone: true, selector: "db-accordion-item", inputs: { defaultOpen: { classPropertyName: "defaultOpen", publicName: "defaultOpen", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, propOverrides: { classPropertyName: "propOverrides", publicName: "propOverrides", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, headlinePlain: { classPropertyName: "headlinePlain", publicName: "headlinePlain", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { toggle: "toggle" }, viewQueries: [{ propertyName: "_ref", first: true, predicate: ["_ref"], descendants: true, isSignal: true }], ngImport: i0, template: `<li
282
296
  [attr.id]="id() ?? propOverrides()?.id"
283
297
  [class]="cls('db-accordion-item', className())"
284
298
  >
@@ -317,7 +331,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
317
331
  <div>@if(text()){{{text()}}} <ng-content></ng-content></div>
318
332
  </details>
319
333
  </li> `, styles: [":host{display:contents}\n"] }]
320
- }], ctorParameters: () => [], propDecorators: { defaultOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultOpen", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], propOverrides: [{ type: i0.Input, args: [{ isSignal: true, alias: "propOverrides", required: false }] }], className: [{ type: i0.Input, args: [{ isSignal: true, alias: "className", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], headlinePlain: [{ type: i0.Input, args: [{ isSignal: true, alias: "headlinePlain", required: false }] }], text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], toggle: [{ type: i0.Output, args: ["toggle"] }], _ref: [{ type: i0.ViewChild, args: ["_ref", { isSignal: true }] }] } });
334
+ }], ctorParameters: () => [], propDecorators: { defaultOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultOpen", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], propOverrides: [{ type: i0.Input, args: [{ isSignal: true, alias: "propOverrides", required: false }] }], className: [{ type: i0.Input, args: [{ isSignal: true, alias: "className", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], headlinePlain: [{ type: i0.Input, args: [{ isSignal: true, alias: "headlinePlain", required: false }] }], text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], toggle: [{ type: i0.Output, args: ["toggle"] }], _ref: [{ type: i0.ViewChild, args: ["_ref", { isSignal: true }] }] } });
321
335
 
322
336
  const defaultProps$z = {};
323
337
  class DBAccordion {
@@ -359,7 +373,7 @@ class DBAccordion {
359
373
  // ---
360
374
  // If we have a single behavior we first check for
361
375
  // props.name otherwise for state_id
362
- if (this.initialized()) {
376
+ if (this.initialized() && this._ref()?.nativeElement) {
363
377
  if (this.behavior() === "single") {
364
378
  if (this.name()) {
365
379
  if (this._name() !== this.name()) {
@@ -487,7 +501,7 @@ class DBAccordion {
487
501
  [text]="item.text"
488
502
  ></db-accordion-item>
489
503
  } }
490
- </ul> `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DBAccordionItem, selector: "db-accordion-item", inputs: ["defaultOpen", "name", "id", "propOverrides", "className", "disabled", "headlinePlain", "text"], outputs: ["toggle"] }] }); }
504
+ </ul> `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DBAccordionItem, selector: "db-accordion-item", inputs: ["defaultOpen", "name", "open", "id", "propOverrides", "className", "disabled", "headlinePlain", "text"], outputs: ["toggle"] }] }); }
491
505
  }
492
506
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: DBAccordion, decorators: [{
493
507
  type: Component,
@@ -4784,8 +4798,8 @@ class DBDrawer {
4784
4798
  }
4785
4799
  handleDialogOpen() {
4786
4800
  if (this._ref()?.nativeElement) {
4787
- const open = Boolean(this.open());
4788
- if (open && !this._ref()?.nativeElement.open) {
4801
+ const dialogOpen = getBoolean(this.open(), "open");
4802
+ if (dialogOpen && !this._ref()?.nativeElement.open) {
4789
4803
  if (this.dialogContainerRef()?.nativeElement) {
4790
4804
  (this.dialogContainerRef()?.nativeElement).removeAttribute("data-transition");
4791
4805
  }
@@ -4803,7 +4817,7 @@ class DBDrawer {
4803
4817
  }
4804
4818
  }, 1);
4805
4819
  }
4806
- if (!open && this._ref()?.nativeElement.open) {
4820
+ if (!dialogOpen && this._ref()?.nativeElement.open) {
4807
4821
  if (this.dialogContainerRef()?.nativeElement) {
4808
4822
  (this.dialogContainerRef()?.nativeElement).dataset["transition"] = "close";
4809
4823
  }
@@ -5179,17 +5193,17 @@ class DBHeader {
5179
5193
  }
5180
5194
  constructor() {
5181
5195
  this.cls = cls;
5182
- this.getBoolean = getBoolean;
5183
5196
  this.DEFAULT_BURGER_MENU = DEFAULT_BURGER_MENU;
5197
+ this.getBoolean = getBoolean;
5184
5198
  this.forceMobile = input(...(ngDevMode ? [undefined, { debugName: "forceMobile" }] : /* istanbul ignore next */ []));
5185
5199
  this.drawerOpen = input(...(ngDevMode ? [undefined, { debugName: "drawerOpen" }] : /* istanbul ignore next */ []));
5186
5200
  this.className = input(...(ngDevMode ? [undefined, { debugName: "className" }] : /* istanbul ignore next */ []));
5187
5201
  this.id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : /* istanbul ignore next */ []));
5188
5202
  this.propOverrides = input(...(ngDevMode ? [undefined, { debugName: "propOverrides" }] : /* istanbul ignore next */ []));
5189
5203
  this.width = input(...(ngDevMode ? [undefined, { debugName: "width" }] : /* istanbul ignore next */ []));
5204
+ this.burgerMenuLabel = input(...(ngDevMode ? [undefined, { debugName: "burgerMenuLabel" }] : /* istanbul ignore next */ []));
5190
5205
  this.closeButtonId = input(...(ngDevMode ? [undefined, { debugName: "closeButtonId" }] : /* istanbul ignore next */ []));
5191
5206
  this.closeButtonText = input(...(ngDevMode ? [undefined, { debugName: "closeButtonText" }] : /* istanbul ignore next */ []));
5192
- this.burgerMenuLabel = input(...(ngDevMode ? [undefined, { debugName: "burgerMenuLabel" }] : /* istanbul ignore next */ []));
5193
5207
  this.toggle = output();
5194
5208
  this._ref = viewChild("_ref", ...(ngDevMode ? [{ debugName: "_ref" }] : /* istanbul ignore next */ []));
5195
5209
  this.initialized = signal(false, ...(ngDevMode ? [{ debugName: "initialized" }] : /* istanbul ignore next */ []));
@@ -5260,35 +5274,13 @@ class DBHeader {
5260
5274
  }
5261
5275
  }
5262
5276
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: DBHeader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5263
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.14", type: DBHeader, isStandalone: true, selector: "db-header", inputs: { forceMobile: { classPropertyName: "forceMobile", publicName: "forceMobile", isSignal: true, isRequired: false, transformFunction: null }, drawerOpen: { classPropertyName: "drawerOpen", publicName: "drawerOpen", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, propOverrides: { classPropertyName: "propOverrides", publicName: "propOverrides", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, closeButtonId: { classPropertyName: "closeButtonId", publicName: "closeButtonId", isSignal: true, isRequired: false, transformFunction: null }, closeButtonText: { classPropertyName: "closeButtonText", publicName: "closeButtonText", isSignal: true, isRequired: false, transformFunction: null }, burgerMenuLabel: { classPropertyName: "burgerMenuLabel", publicName: "burgerMenuLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { toggle: "toggle" }, queries: [{ propertyName: "dbNavigation", first: true, predicate: NavigationDirective, descendants: true, read: TemplateRef }, { propertyName: "dbMetaNavigation", first: true, predicate: MetaNavigationDirective, descendants: true, read: TemplateRef }, { propertyName: "dbSecondaryAction", first: true, predicate: SecondaryActionDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "_ref", first: true, predicate: ["_ref"], descendants: true, isSignal: true }], ngImport: i0, template: `<header
5277
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.14", type: DBHeader, isStandalone: true, selector: "db-header", inputs: { forceMobile: { classPropertyName: "forceMobile", publicName: "forceMobile", isSignal: true, isRequired: false, transformFunction: null }, drawerOpen: { classPropertyName: "drawerOpen", publicName: "drawerOpen", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, propOverrides: { classPropertyName: "propOverrides", publicName: "propOverrides", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, burgerMenuLabel: { classPropertyName: "burgerMenuLabel", publicName: "burgerMenuLabel", isSignal: true, isRequired: false, transformFunction: null }, closeButtonId: { classPropertyName: "closeButtonId", publicName: "closeButtonId", isSignal: true, isRequired: false, transformFunction: null }, closeButtonText: { classPropertyName: "closeButtonText", publicName: "closeButtonText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { toggle: "toggle" }, queries: [{ propertyName: "dbNavigation", first: true, predicate: NavigationDirective, descendants: true, read: TemplateRef }, { propertyName: "dbMetaNavigation", first: true, predicate: MetaNavigationDirective, descendants: true, read: TemplateRef }, { propertyName: "dbSecondaryAction", first: true, predicate: SecondaryActionDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "_ref", first: true, predicate: ["_ref"], descendants: true, isSignal: true }], ngImport: i0, template: `<header
5264
5278
  #_ref
5265
5279
  [class]="cls('db-header', className())"
5266
5280
  [attr.id]="id() ?? propOverrides()?.id"
5267
5281
  [attr.data-width]="width()"
5268
5282
  [attr.data-on-forcing-mobile]="forceMobile() && !forcedToMobile()"
5269
5283
  >
5270
- <db-drawer
5271
- spacing="small"
5272
- className="db-header-drawer"
5273
- [rounded]="true"
5274
- [closeButtonId]="closeButtonId()"
5275
- [closeButtonText]="closeButtonText()"
5276
- [open]="getBoolean(drawerOpen())"
5277
- (close)="handleToggle()"
5278
- ><div class="db-header-drawer-navigation">
5279
- <div
5280
- class="db-header-navigation"
5281
- (click)="handleNavigationItemClick($event)"
5282
- >
5283
- <ng-content *ngTemplateOutlet="dbNavigation"></ng-content>
5284
- </div>
5285
- <div class="db-header-meta-navigation">
5286
- <ng-content *ngTemplateOutlet="dbMetaNavigation"> </ng-content>
5287
- </div>
5288
- </div>
5289
- <div class="db-header-secondary-action">
5290
- <ng-content *ngTemplateOutlet="dbSecondaryAction"> </ng-content></div
5291
- ></db-drawer>
5292
5284
  <div class="db-header-meta-navigation">
5293
5285
  <ng-content *ngTemplateOutlet="dbMetaNavigation"> </ng-content>
5294
5286
  </div>
@@ -5317,17 +5309,6 @@ class DBHeader {
5317
5309
  </div>
5318
5310
  </div>
5319
5311
  </div>
5320
- </header> `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DBDrawer, selector: "db-drawer", inputs: ["open", "position", "backdrop", "variant", "id", "propOverrides", "direction", "className", "spacing", "width", "rounded", "closeButtonId", "closeButtonText"], outputs: ["close"] }, { kind: "component", type: DBButton, selector: "db-button", inputs: ["type", "id", "propOverrides", "className", "disabled", "iconLeading", "icon", "showIconLeading", "showIcon", "iconTrailing", "showIconTrailing", "size", "width", "variant", "wrap", "noText", "name", "form", "value", "text"], outputs: ["click"] }] }); }
5321
- }
5322
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: DBHeader, decorators: [{
5323
- type: Component,
5324
- args: [{ selector: "db-header", standalone: true, imports: [CommonModule, DBDrawer, DBButton], template: `<header
5325
- #_ref
5326
- [class]="cls('db-header', className())"
5327
- [attr.id]="id() ?? propOverrides()?.id"
5328
- [attr.data-width]="width()"
5329
- [attr.data-on-forcing-mobile]="forceMobile() && !forcedToMobile()"
5330
- >
5331
5312
  <db-drawer
5332
5313
  spacing="small"
5333
5314
  className="db-header-drawer"
@@ -5350,6 +5331,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
5350
5331
  <div class="db-header-secondary-action">
5351
5332
  <ng-content *ngTemplateOutlet="dbSecondaryAction"> </ng-content></div
5352
5333
  ></db-drawer>
5334
+ </header> `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DBButton, selector: "db-button", inputs: ["type", "id", "propOverrides", "className", "disabled", "iconLeading", "icon", "showIconLeading", "showIcon", "iconTrailing", "showIconTrailing", "size", "width", "variant", "wrap", "noText", "name", "form", "value", "text"], outputs: ["click"] }, { kind: "component", type: DBDrawer, selector: "db-drawer", inputs: ["open", "position", "backdrop", "variant", "id", "propOverrides", "direction", "className", "spacing", "width", "rounded", "closeButtonId", "closeButtonText"], outputs: ["close"] }] }); }
5335
+ }
5336
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: DBHeader, decorators: [{
5337
+ type: Component,
5338
+ args: [{ selector: "db-header", standalone: true, imports: [CommonModule, DBButton, DBDrawer], template: `<header
5339
+ #_ref
5340
+ [class]="cls('db-header', className())"
5341
+ [attr.id]="id() ?? propOverrides()?.id"
5342
+ [attr.data-width]="width()"
5343
+ [attr.data-on-forcing-mobile]="forceMobile() && !forcedToMobile()"
5344
+ >
5353
5345
  <div class="db-header-meta-navigation">
5354
5346
  <ng-content *ngTemplateOutlet="dbMetaNavigation"> </ng-content>
5355
5347
  </div>
@@ -5378,6 +5370,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
5378
5370
  </div>
5379
5371
  </div>
5380
5372
  </div>
5373
+ <db-drawer
5374
+ spacing="small"
5375
+ className="db-header-drawer"
5376
+ [rounded]="true"
5377
+ [closeButtonId]="closeButtonId()"
5378
+ [closeButtonText]="closeButtonText()"
5379
+ [open]="getBoolean(drawerOpen())"
5380
+ (close)="handleToggle()"
5381
+ ><div class="db-header-drawer-navigation">
5382
+ <div
5383
+ class="db-header-navigation"
5384
+ (click)="handleNavigationItemClick($event)"
5385
+ >
5386
+ <ng-content *ngTemplateOutlet="dbNavigation"></ng-content>
5387
+ </div>
5388
+ <div class="db-header-meta-navigation">
5389
+ <ng-content *ngTemplateOutlet="dbMetaNavigation"> </ng-content>
5390
+ </div>
5391
+ </div>
5392
+ <div class="db-header-secondary-action">
5393
+ <ng-content *ngTemplateOutlet="dbSecondaryAction"> </ng-content></div
5394
+ ></db-drawer>
5381
5395
  </header> `, styles: [":host{display:contents}\n"] }]
5382
5396
  }], ctorParameters: () => [], propDecorators: { dbNavigation: [{
5383
5397
  type: ContentChild,
@@ -5388,7 +5402,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
5388
5402
  }], dbSecondaryAction: [{
5389
5403
  type: ContentChild,
5390
5404
  args: [SecondaryActionDirective, { read: TemplateRef }]
5391
- }], forceMobile: [{ type: i0.Input, args: [{ isSignal: true, alias: "forceMobile", required: false }] }], drawerOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "drawerOpen", required: false }] }], className: [{ type: i0.Input, args: [{ isSignal: true, alias: "className", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], propOverrides: [{ type: i0.Input, args: [{ isSignal: true, alias: "propOverrides", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], closeButtonId: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeButtonId", required: false }] }], closeButtonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeButtonText", required: false }] }], burgerMenuLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "burgerMenuLabel", required: false }] }], toggle: [{ type: i0.Output, args: ["toggle"] }], _ref: [{ type: i0.ViewChild, args: ["_ref", { isSignal: true }] }] } });
5405
+ }], forceMobile: [{ type: i0.Input, args: [{ isSignal: true, alias: "forceMobile", required: false }] }], drawerOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "drawerOpen", required: false }] }], className: [{ type: i0.Input, args: [{ isSignal: true, alias: "className", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], propOverrides: [{ type: i0.Input, args: [{ isSignal: true, alias: "propOverrides", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], burgerMenuLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "burgerMenuLabel", required: false }] }], closeButtonId: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeButtonId", required: false }] }], closeButtonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeButtonText", required: false }] }], toggle: [{ type: i0.Output, args: ["toggle"] }], _ref: [{ type: i0.ViewChild, args: ["_ref", { isSignal: true }] }] } });
5392
5406
 
5393
5407
  const defaultProps$g = {};
5394
5408
  class DBIcon {
@@ -5715,6 +5729,7 @@ class DBNavigationItem {
5715
5729
  this.active = input(...(ngDevMode ? [undefined, { debugName: "active" }] : /* istanbul ignore next */ []));
5716
5730
  this.wrap = input(...(ngDevMode ? [undefined, { debugName: "wrap" }] : /* istanbul ignore next */ []));
5717
5731
  this.disabled = input(...(ngDevMode ? [undefined, { debugName: "disabled" }] : /* istanbul ignore next */ []));
5732
+ this.hideSubNavigation = input(...(ngDevMode ? [undefined, { debugName: "hideSubNavigation" }] : /* istanbul ignore next */ []));
5718
5733
  this.text = input(...(ngDevMode ? [undefined, { debugName: "text" }] : /* istanbul ignore next */ []));
5719
5734
  this.backButtonId = input(...(ngDevMode ? [undefined, { debugName: "backButtonId" }] : /* istanbul ignore next */ []));
5720
5735
  this.backButtonText = input(...(ngDevMode ? [undefined, { debugName: "backButtonText" }] : /* istanbul ignore next */ []));
@@ -5810,7 +5825,7 @@ class DBNavigationItem {
5810
5825
  }
5811
5826
  }
5812
5827
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: DBNavigationItem, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5813
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: DBNavigationItem, isStandalone: true, selector: "db-navigation-item", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, subNavigationExpanded: { classPropertyName: "subNavigationExpanded", publicName: "subNavigationExpanded", isSignal: true, isRequired: false, transformFunction: null }, propOverrides: { classPropertyName: "propOverrides", publicName: "propOverrides", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, wrap: { classPropertyName: "wrap", publicName: "wrap", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, backButtonId: { classPropertyName: "backButtonId", publicName: "backButtonId", isSignal: true, isRequired: false, transformFunction: null }, backButtonText: { classPropertyName: "backButtonText", publicName: "backButtonText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { click: "click" }, queries: [{ propertyName: "dbNavigationContent", first: true, predicate: NavigationContentDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "_ref", first: true, predicate: ["_ref"], descendants: true, isSignal: true }], ngImport: i0, template: `<li
5828
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: DBNavigationItem, isStandalone: true, selector: "db-navigation-item", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, subNavigationExpanded: { classPropertyName: "subNavigationExpanded", publicName: "subNavigationExpanded", isSignal: true, isRequired: false, transformFunction: null }, propOverrides: { classPropertyName: "propOverrides", publicName: "propOverrides", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, wrap: { classPropertyName: "wrap", publicName: "wrap", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hideSubNavigation: { classPropertyName: "hideSubNavigation", publicName: "hideSubNavigation", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, backButtonId: { classPropertyName: "backButtonId", publicName: "backButtonId", isSignal: true, isRequired: false, transformFunction: null }, backButtonText: { classPropertyName: "backButtonText", publicName: "backButtonText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { click: "click" }, queries: [{ propertyName: "dbNavigationContent", first: true, predicate: NavigationContentDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "_ref", first: true, predicate: ["_ref"], descendants: true, isSignal: true }], ngImport: i0, template: `<li
5814
5829
  #_ref
5815
5830
  [attr.id]="id() ?? propOverrides()?.id"
5816
5831
  (mouseover)="navigationItemSafeTriangle()?.enableFollow()"
@@ -5824,9 +5839,8 @@ class DBNavigationItem {
5824
5839
  [attr.data-wrap]="getBooleanAsString(wrap())"
5825
5840
  [attr.aria-disabled]="getBooleanAsString(disabled())"
5826
5841
  >
5827
- @if(!hasSubNavigation()){ @if(text()){{{text()}}}@else{
5828
- <ng-content *ngTemplateOutlet="dbNavigationContent"></ng-content>
5829
- } } @if(hasSubNavigation()){
5842
+ @if(!getBoolean(hideSubNavigation(), 'hideSubNavigation') &&
5843
+ hasSubNavigation()){
5830
5844
  <button
5831
5845
  class="db-navigation-item-expand-button"
5832
5846
  [attr.id]="subNavigationToggleId()"
@@ -5859,7 +5873,9 @@ class DBNavigationItem {
5859
5873
  }
5860
5874
  <ng-content select="[sub-navigation]"> </ng-content
5861
5875
  ></menu>
5862
- }
5876
+ }@else{ @if(text()){{{text()}}}@else{
5877
+ <ng-content *ngTemplateOutlet="dbNavigationContent"></ng-content>
5878
+ } }
5863
5879
  </li> `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DBButton, selector: "db-button", inputs: ["type", "id", "propOverrides", "className", "disabled", "iconLeading", "icon", "showIconLeading", "showIcon", "iconTrailing", "showIconTrailing", "size", "width", "variant", "wrap", "noText", "name", "form", "value", "text"], outputs: ["click"] }] }); }
5864
5880
  }
5865
5881
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: DBNavigationItem, decorators: [{
@@ -5878,9 +5894,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
5878
5894
  [attr.data-wrap]="getBooleanAsString(wrap())"
5879
5895
  [attr.aria-disabled]="getBooleanAsString(disabled())"
5880
5896
  >
5881
- @if(!hasSubNavigation()){ @if(text()){{{text()}}}@else{
5882
- <ng-content *ngTemplateOutlet="dbNavigationContent"></ng-content>
5883
- } } @if(hasSubNavigation()){
5897
+ @if(!getBoolean(hideSubNavigation(), 'hideSubNavigation') &&
5898
+ hasSubNavigation()){
5884
5899
  <button
5885
5900
  class="db-navigation-item-expand-button"
5886
5901
  [attr.id]="subNavigationToggleId()"
@@ -5913,12 +5928,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
5913
5928
  }
5914
5929
  <ng-content select="[sub-navigation]"> </ng-content
5915
5930
  ></menu>
5916
- }
5931
+ }@else{ @if(text()){{{text()}}}@else{
5932
+ <ng-content *ngTemplateOutlet="dbNavigationContent"></ng-content>
5933
+ } }
5917
5934
  </li> `, styles: [":host{display:contents}\n"] }]
5918
5935
  }], ctorParameters: () => [], propDecorators: { dbNavigationContent: [{
5919
5936
  type: ContentChild,
5920
5937
  args: [NavigationContentDirective, { read: TemplateRef }]
5921
- }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], subNavigationExpanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "subNavigationExpanded", required: false }] }], propOverrides: [{ type: i0.Input, args: [{ isSignal: true, alias: "propOverrides", required: false }] }], className: [{ type: i0.Input, args: [{ isSignal: true, alias: "className", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], showIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIcon", required: false }] }], active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }], wrap: [{ type: i0.Input, args: [{ isSignal: true, alias: "wrap", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], backButtonId: [{ type: i0.Input, args: [{ isSignal: true, alias: "backButtonId", required: false }] }], backButtonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "backButtonText", required: false }] }], click: [{ type: i0.Output, args: ["click"] }], _ref: [{ type: i0.ViewChild, args: ["_ref", { isSignal: true }] }] } });
5938
+ }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], subNavigationExpanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "subNavigationExpanded", required: false }] }], propOverrides: [{ type: i0.Input, args: [{ isSignal: true, alias: "propOverrides", required: false }] }], className: [{ type: i0.Input, args: [{ isSignal: true, alias: "className", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], showIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIcon", required: false }] }], active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }], wrap: [{ type: i0.Input, args: [{ isSignal: true, alias: "wrap", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], hideSubNavigation: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideSubNavigation", required: false }] }], text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], backButtonId: [{ type: i0.Input, args: [{ isSignal: true, alias: "backButtonId", required: false }] }], backButtonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "backButtonText", required: false }] }], click: [{ type: i0.Output, args: ["click"] }], _ref: [{ type: i0.ViewChild, args: ["_ref", { isSignal: true }] }] } });
5922
5939
 
5923
5940
  const defaultProps$c = {};
5924
5941
  class DBNotification {