@open-rlb/ng-bootstrap 3.1.23 → 3.1.25

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.
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { signal, Component, input, booleanAttribute, effect, Host, Self, Optional, Directive, Injectable, output, contentChild, computed, contentChildren, viewChild, numberAttribute, model, ViewChild, isSignal, Pipe, ChangeDetectionStrategy, inject, DOCUMENT, Inject, HostListener, InjectionToken, viewChildren, ViewContainerRef, untracked, EventEmitter, Output, NgModule } from '@angular/core';
2
+ import { signal, Component, input, booleanAttribute, effect, Host, Self, Optional, Directive, Injectable, output, contentChild, computed, contentChildren, viewChild, numberAttribute, model, ViewChild, isSignal, Pipe, ChangeDetectionStrategy, inject, ViewContainerRef, Renderer2, DestroyRef, DOCUMENT, Inject, HostListener, InjectionToken, viewChildren, untracked, EventEmitter, Output, NgModule } from '@angular/core';
3
3
  import { Collapse, Carousel, Dropdown, Modal, Toast, Offcanvas, ScrollSpy, Popover, Tooltip } from 'bootstrap';
4
4
  import * as i2 from '@angular/router';
5
5
  import { RouterModule } from '@angular/router';
@@ -4211,8 +4211,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImpor
4211
4211
  }], propDecorators: { active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }], disabledInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], action: [{ type: i0.Input, args: [{ isSignal: true, alias: "action", required: false }] }] } });
4212
4212
 
4213
4213
  class NavbarDropdownItemComponent {
4214
- constructor(viewContainerRef) {
4215
- this.viewContainerRef = viewContainerRef;
4214
+ constructor() {
4215
+ this.viewContainerRef = inject(ViewContainerRef);
4216
+ this.renderer = inject(Renderer2);
4217
+ this.destroyRef = inject(DestroyRef);
4218
+ this.template = viewChild.required('template');
4216
4219
  this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), alias: 'disabled', transform: booleanAttribute });
4217
4220
  this.dropdown = input(false, { ...(ngDevMode ? { debugName: "dropdown" } : {}), alias: 'dropdown', transform: booleanAttribute });
4218
4221
  this.href = input(undefined, ...(ngDevMode ? [{ debugName: "href" }] : []));
@@ -4220,10 +4223,9 @@ class NavbarDropdownItemComponent {
4220
4223
  this.toggle = input(undefined, ...(ngDevMode ? [{ debugName: "toggle" }] : []));
4221
4224
  this.autoClose = input('default', { ...(ngDevMode ? { debugName: "autoClose" } : {}), alias: 'auto-close' });
4222
4225
  this.click = output();
4226
+ this.statusChanged = output({ alias: 'status-changed' });
4223
4227
  this._autoClose = computed(() => {
4224
4228
  switch (this.autoClose()) {
4225
- case 'default':
4226
- return 'true';
4227
4229
  case 'inside':
4228
4230
  return 'inside';
4229
4231
  case 'outside':
@@ -4234,58 +4236,93 @@ class NavbarDropdownItemComponent {
4234
4236
  return 'true';
4235
4237
  }
4236
4238
  }, ...(ngDevMode ? [{ debugName: "_autoClose" }] : []));
4239
+ effect(() => {
4240
+ const template = this.template();
4241
+ const dropdownEnabled = this.dropdown();
4242
+ const templateView = this.viewContainerRef.createEmbeddedView(template);
4243
+ this.element = templateView.rootNodes[0];
4244
+ this.viewContainerRef.element.nativeElement.remove();
4245
+ const anchor = this.element.querySelector('a');
4246
+ if (!anchor || !dropdownEnabled)
4247
+ return;
4248
+ this.dropdownInstance = Dropdown.getOrCreateInstance(anchor);
4249
+ const unsubShow = this.renderer.listen(anchor, 'show.bs.dropdown', () => this.statusChanged.emit('show'));
4250
+ const unsubShown = this.renderer.listen(anchor, 'shown.bs.dropdown', () => this.statusChanged.emit('shown'));
4251
+ const unsubHide = this.renderer.listen(anchor, 'hide.bs.dropdown', () => this.statusChanged.emit('hide'));
4252
+ const unsubHidden = this.renderer.listen(anchor, 'hidden.bs.dropdown', () => this.statusChanged.emit('hidden'));
4253
+ this.destroyRef.onDestroy(() => {
4254
+ unsubShow();
4255
+ unsubShown();
4256
+ unsubHide();
4257
+ unsubHidden();
4258
+ this.dropdownInstance?.dispose();
4259
+ });
4260
+ });
4237
4261
  }
4238
- ngOnInit() {
4239
- const templateView = this.viewContainerRef.createEmbeddedView(this.template);
4240
- this.element = templateView.rootNodes[0];
4241
- this.viewContainerRef.element.nativeElement.remove();
4262
+ open() {
4263
+ this.dropdownInstance?.show();
4242
4264
  }
4243
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: NavbarDropdownItemComponent, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
4244
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.1", type: NavbarDropdownItemComponent, isStandalone: false, selector: "rlb-navbar-dropdown-item", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, dropdown: { classPropertyName: "dropdown", publicName: "dropdown", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, cssClass: { classPropertyName: "cssClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, toggle: { classPropertyName: "toggle", publicName: "toggle", isSignal: true, isRequired: false, transformFunction: null }, autoClose: { classPropertyName: "autoClose", publicName: "auto-close", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { click: "click" }, viewQueries: [{ propertyName: "template", first: true, predicate: ["template"], descendants: true, static: true }], ngImport: i0, template: ` <ng-template #template>
4245
- <li class="nav-item" [class.dropdown]="dropdown()">
4246
- <a
4247
- class="nav-link {{ cssClass() }}"
4248
- [class.dropdown-toggle]="dropdown()"
4249
- [attr.role]="(dropdown() || toggle()) ? 'button' : undefined"
4250
- [attr.data-bs-toggle]="dropdown() ? 'dropdown' : undefined"
4251
- [attr.aria-expanded]="(dropdown() || toggle()) ? 'false' : undefined"
4252
- [attr.data-bs-auto-close]="_autoClose()"
4253
- [href]="(dropdown() || toggle()) ? '#' : href()"
4254
- (click)="click.emit($event)"
4265
+ close() {
4266
+ this.dropdownInstance?.hide();
4267
+ }
4268
+ toggleDropdown() {
4269
+ this.dropdownInstance?.toggle();
4270
+ }
4271
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: NavbarDropdownItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
4272
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.1", type: NavbarDropdownItemComponent, isStandalone: false, selector: "rlb-navbar-dropdown-item", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, dropdown: { classPropertyName: "dropdown", publicName: "dropdown", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, cssClass: { classPropertyName: "cssClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, toggle: { classPropertyName: "toggle", publicName: "toggle", isSignal: true, isRequired: false, transformFunction: null }, autoClose: { classPropertyName: "autoClose", publicName: "auto-close", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { click: "click", statusChanged: "status-changed" }, viewQueries: [{ propertyName: "template", first: true, predicate: ["template"], descendants: true, isSignal: true }], ngImport: i0, template: `
4273
+ <ng-template #template>
4274
+ <li
4275
+ class="nav-item"
4276
+ [class.dropdown]="dropdown()"
4255
4277
  >
4256
- <ng-content select=":not(rlb-dropdown-container)"></ng-content>
4257
- </a>
4258
- <ng-content select="rlb-dropdown-container"></ng-content>
4259
- </li>
4260
- </ng-template>`, isInline: true }); }
4278
+ <a
4279
+ class="nav-link {{ cssClass() }}"
4280
+ [class.dropdown-toggle]="dropdown()"
4281
+ [attr.role]="dropdown() || toggle() ? 'button' : undefined"
4282
+ [attr.data-bs-toggle]="dropdown() ? 'dropdown' : undefined"
4283
+ [attr.aria-expanded]="dropdown() || toggle() ? 'false' : undefined"
4284
+ [attr.data-bs-auto-close]="_autoClose()"
4285
+ [href]="dropdown() || toggle() ? '#' : href()"
4286
+ (click)="click.emit($event)"
4287
+ >
4288
+ <ng-content select=":not(rlb-dropdown-container)"></ng-content>
4289
+ </a>
4290
+
4291
+ <ng-content select="rlb-dropdown-container"></ng-content>
4292
+ </li>
4293
+ </ng-template>
4294
+ `, isInline: true }); }
4261
4295
  }
4262
4296
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: NavbarDropdownItemComponent, decorators: [{
4263
4297
  type: Component,
4264
4298
  args: [{
4265
4299
  selector: 'rlb-navbar-dropdown-item',
4266
- template: ` <ng-template #template>
4267
- <li class="nav-item" [class.dropdown]="dropdown()">
4268
- <a
4269
- class="nav-link {{ cssClass() }}"
4270
- [class.dropdown-toggle]="dropdown()"
4271
- [attr.role]="(dropdown() || toggle()) ? 'button' : undefined"
4272
- [attr.data-bs-toggle]="dropdown() ? 'dropdown' : undefined"
4273
- [attr.aria-expanded]="(dropdown() || toggle()) ? 'false' : undefined"
4274
- [attr.data-bs-auto-close]="_autoClose()"
4275
- [href]="(dropdown() || toggle()) ? '#' : href()"
4276
- (click)="click.emit($event)"
4300
+ template: `
4301
+ <ng-template #template>
4302
+ <li
4303
+ class="nav-item"
4304
+ [class.dropdown]="dropdown()"
4277
4305
  >
4278
- <ng-content select=":not(rlb-dropdown-container)"></ng-content>
4279
- </a>
4280
- <ng-content select="rlb-dropdown-container"></ng-content>
4281
- </li>
4282
- </ng-template>`,
4283
- standalone: false
4306
+ <a
4307
+ class="nav-link {{ cssClass() }}"
4308
+ [class.dropdown-toggle]="dropdown()"
4309
+ [attr.role]="dropdown() || toggle() ? 'button' : undefined"
4310
+ [attr.data-bs-toggle]="dropdown() ? 'dropdown' : undefined"
4311
+ [attr.aria-expanded]="dropdown() || toggle() ? 'false' : undefined"
4312
+ [attr.data-bs-auto-close]="_autoClose()"
4313
+ [href]="dropdown() || toggle() ? '#' : href()"
4314
+ (click)="click.emit($event)"
4315
+ >
4316
+ <ng-content select=":not(rlb-dropdown-container)"></ng-content>
4317
+ </a>
4318
+
4319
+ <ng-content select="rlb-dropdown-container"></ng-content>
4320
+ </li>
4321
+ </ng-template>
4322
+ `,
4323
+ standalone: false,
4284
4324
  }]
4285
- }], ctorParameters: () => [{ type: i0.ViewContainerRef }], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], dropdown: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdown", required: false }] }], href: [{ type: i0.Input, args: [{ isSignal: true, alias: "href", required: false }] }], cssClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], toggle: [{ type: i0.Input, args: [{ isSignal: true, alias: "toggle", required: false }] }], autoClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "auto-close", required: false }] }], click: [{ type: i0.Output, args: ["click"] }], template: [{
4286
- type: ViewChild,
4287
- args: ['template', { static: true }]
4288
- }] } });
4325
+ }], ctorParameters: () => [], propDecorators: { template: [{ type: i0.ViewChild, args: ['template', { isSignal: true }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], dropdown: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdown", required: false }] }], href: [{ type: i0.Input, args: [{ isSignal: true, alias: "href", required: false }] }], cssClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], toggle: [{ type: i0.Input, args: [{ isSignal: true, alias: "toggle", required: false }] }], autoClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "auto-close", required: false }] }], click: [{ type: i0.Output, args: ["click"] }], statusChanged: [{ type: i0.Output, args: ["status-changed"] }] } });
4289
4326
 
4290
4327
  class NavbarItemComponent {
4291
4328
  constructor(viewContainerRef) {