@ngb-bootstrap/core 0.0.0 → 0.1.0-next.0

package/fesm2022/ngb-bootstrap-core-sidebar.mjs

@@ -0,0 +1,425 @@
+import { NgTemplateOutlet } from "@angular/common";
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, effect, inject, input, signal, untracked, viewChild } from "@angular/core";
+import { takeUntilDestroyed } from "@angular/core/rxjs-interop";
+import { NavigationEnd, Router, RouterLink, RouterLinkActive, isActive } from "@angular/router";
+import { NgbIcon } from "@ngb-bootstrap/core/icon";
+import { NgbLayout } from "@ngb-bootstrap/core/layout";
+import { ngbIconRight } from "@ngb-bootstrap/icons";
+import { filter } from "rxjs";
+const SUBTREE = {
+	paths: "subset",
+	queryParams: "ignored",
+	fragment: "ignored",
+	matrixParams: "ignored"
+};
+var NgbSidebar = class NgbSidebar {
+	layout = inject(NgbLayout, { optional: true });
+	router = inject(Router);
+	drawer = viewChild.required("drawer", ...ngDevMode ? [{ debugName: "drawer" }] : /* istanbul ignore next */ []);
+	expanded = signal(/* @__PURE__ */ new Set(), ...ngDevMode ? [{ debugName: "expanded" }] : /* istanbul ignore next */ []);
+	chevron = ngbIconRight;
+	items = input([], ...ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []);
+	label = input("Main", ...ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []);
+	closeLabel = input("Close", ...ngDevMode ? [{ debugName: "closeLabel" }] : /* istanbul ignore next */ []);
+	constructor() {
+		effect(() => {
+			const items = this.items();
+			untracked(() => this.expandActive(items));
+		});
+		this.router.events.pipe(filter((event) => event instanceof NavigationEnd), takeUntilDestroyed()).subscribe(() => this.expandActive(this.items()));
+		effect(() => {
+			const open = this.layout?.sidebarOpen() ?? false;
+			const dialog = this.drawer().nativeElement;
+			if (open && !dialog.open && typeof dialog.showModal === "function") dialog.showModal();
+			else if (!open && dialog.open) dialog.close();
+		});
+	}
+	isExpanded(item) {
+		return this.expanded().has(item);
+	}
+	toggle(item) {
+		if (this.layout?.sidebarRail()) {
+			this.layout.sidebarCollapsed.set(false);
+			this.expanded.update((current) => /* @__PURE__ */ new Set([...current, item]));
+			return;
+		}
+		this.expanded.update((current) => {
+			const next = new Set(current);
+			if (!next.delete(item)) next.add(item);
+			return next;
+		});
+	}
+	closeOnBackdrop(event) {
+		const dialog = this.drawer().nativeElement;
+		if (event.target !== dialog || !dialog.matches(":modal")) return;
+		const box = dialog.getBoundingClientRect();
+		if (!(event.clientX >= box.left && event.clientX <= box.right && event.clientY >= box.top && event.clientY <= box.bottom)) this.layout?.closeSidebar();
+	}
+	expandActive(items) {
+		const active = [];
+		const visit = (item) => {
+			if (item.children?.length) {
+				const hasActive = item.children.map(visit).some(Boolean);
+				if (hasActive) active.push(item);
+				return hasActive;
+			}
+			return !!item.link && isActive(item.link, this.router, SUBTREE)();
+		};
+		items.forEach(visit);
+		if (active.some((item) => !this.expanded().has(item))) this.expanded.update((current) => /* @__PURE__ */ new Set([...current, ...active]));
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: NgbSidebar,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.3",
+		type: NgbSidebar,
+		isStandalone: true,
+		selector: "ngb-sidebar",
+		inputs: {
+			items: {
+				classPropertyName: "items",
+				publicName: "items",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			label: {
+				classPropertyName: "label",
+				publicName: "label",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			closeLabel: {
+				classPropertyName: "closeLabel",
+				publicName: "closeLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: { classAttribute: "ngb-sidebar lg:col-auto" },
+		viewQueries: [{
+			propertyName: "drawer",
+			first: true,
+			predicate: ["drawer"],
+			descendants: true,
+			isSignal: true
+		}],
+		ngImport: i0,
+		template: `
+    <!-- The click handler only catches backdrop clicks; keyboard users close the dialog with Escape. -->
+    <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->
+    <dialog
+      #drawer
+      class="lg:drawer drawer-start ngb-sidebar-drawer"
+      [id]="layout?.sidebarId"
+      [attr.aria-label]="label()"
+      (close)="layout?.closeSidebar()"
+      (click)="closeOnBackdrop($event)"
+    >
+      <!-- Shown from lg up in a full-sidebar layout; elsewhere the navbar shows the brand. -->
+      @if (layout?.brand(); as brand) {
+        <div class="ngb-sidebar-brand"><ng-container *ngTemplateOutlet="brand.template" /></div>
+      }
+      <div class="drawer-body">
+        <!-- Taiga's drawer has no visible header; the close button shows on keyboard focus. -->
+        <button
+          type="button"
+          class="btn-close ngb-sidebar-close"
+          [attr.aria-label]="closeLabel()"
+          (click)="layout?.closeSidebar()"
+        ></button>
+        <nav class="ngb-sidebar-nav" [attr.aria-label]="label()">
+          <ng-content />
+          <ng-container *ngTemplateOutlet="list; context: { $implicit: items(), level: 0 }" />
+        </nav>
+      </div>
+    </dialog>
+
+    <ng-template #list let-items let-level="level">
+      <ul class="ngb-sidebar-list">
+        @for (item of items; track item.label) {
+          <li>
+            @if (item.children?.length) {
+              <button
+                type="button"
+                class="ngb-sidebar-link ngb-sidebar-group"
+                [attr.data-level]="level"
+                [attr.title]="level === 0 && layout?.sidebarRail() ? item.label : null"
+                [attr.aria-expanded]="isExpanded(item)"
+                (click)="toggle(item)"
+              >
+                <ng-container *ngTemplateOutlet="itemLabel; context: { $implicit: item, level }" />
+                <ngb-icon class="ngb-sidebar-chevron" [icon]="chevron" size="1rem" />
+              </button>
+              <!-- Always rendered so expanding can animate; inert while collapsed. -->
+              <div
+                class="ngb-sidebar-collapse"
+                [class.ngb-sidebar-collapse-open]="isExpanded(item)"
+                [inert]="!isExpanded(item)"
+              >
+                <div class="ngb-sidebar-collapse-inner">
+                  <ng-container
+                    *ngTemplateOutlet="
+                      list;
+                      context: { $implicit: item.children, level: level + 1 }
+                    "
+                  />
+                </div>
+              </div>
+            } @else if (item.href) {
+              <a
+                class="ngb-sidebar-link"
+                [attr.data-level]="level"
+                [attr.title]="level === 0 && layout?.sidebarRail() ? item.label : null"
+                [href]="item.href"
+                target="_blank"
+                rel="noopener"
+              >
+                <ng-container *ngTemplateOutlet="itemLabel; context: { $implicit: item, level }" />
+              </a>
+            } @else {
+              <a
+                class="ngb-sidebar-link"
+                [attr.data-level]="level"
+                [attr.title]="level === 0 && layout?.sidebarRail() ? item.label : null"
+                [routerLink]="item.link"
+                routerLinkActive="active"
+                ariaCurrentWhenActive="page"
+                (click)="layout?.closeSidebar()"
+              >
+                <ng-container *ngTemplateOutlet="itemLabel; context: { $implicit: item, level }" />
+              </a>
+            }
+          </li>
+        }
+      </ul>
+    </ng-template>
+
+    <ng-template #itemLabel let-item let-level="level">
+      @if (level === 0 && item.icon) {
+        <ngb-icon class="ngb-sidebar-icon" [icon]="item.icon" size="1rem" />
+      }
+      <span class="ngb-sidebar-label">{{ item.label }}</span>
+    </ng-template>
+  `,
+		isInline: true,
+		dependencies: [
+			{
+				kind: "component",
+				type: NgbIcon,
+				selector: "ngb-icon",
+				inputs: [
+					"name",
+					"icon",
+					"theme",
+					"size",
+					"strokeWidth",
+					"label"
+				]
+			},
+			{
+				kind: "directive",
+				type: NgTemplateOutlet,
+				selector: "[ngTemplateOutlet]",
+				inputs: [
+					"ngTemplateOutletContext",
+					"ngTemplateOutlet",
+					"ngTemplateOutletInjector"
+				]
+			},
+			{
+				kind: "directive",
+				type: RouterLink,
+				selector: "[routerLink]",
+				inputs: [
+					"target",
+					"queryParams",
+					"fragment",
+					"queryParamsHandling",
+					"state",
+					"info",
+					"relativeTo",
+					"preserveFragment",
+					"skipLocationChange",
+					"replaceUrl",
+					"browserUrl",
+					"routerLink"
+				]
+			},
+			{
+				kind: "directive",
+				type: RouterLinkActive,
+				selector: "[routerLinkActive]",
+				inputs: [
+					"routerLinkActiveOptions",
+					"ariaCurrentWhenActive",
+					"routerLinkActive"
+				],
+				outputs: ["isActiveChange"],
+				exportAs: ["routerLinkActive"]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: NgbSidebar,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ngb-sidebar",
+			imports: [
+				NgbIcon,
+				NgTemplateOutlet,
+				RouterLink,
+				RouterLinkActive
+			],
+			template: `
+    <!-- The click handler only catches backdrop clicks; keyboard users close the dialog with Escape. -->
+    <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->
+    <dialog
+      #drawer
+      class="lg:drawer drawer-start ngb-sidebar-drawer"
+      [id]="layout?.sidebarId"
+      [attr.aria-label]="label()"
+      (close)="layout?.closeSidebar()"
+      (click)="closeOnBackdrop($event)"
+    >
+      <!-- Shown from lg up in a full-sidebar layout; elsewhere the navbar shows the brand. -->
+      @if (layout?.brand(); as brand) {
+        <div class="ngb-sidebar-brand"><ng-container *ngTemplateOutlet="brand.template" /></div>
+      }
+      <div class="drawer-body">
+        <!-- Taiga's drawer has no visible header; the close button shows on keyboard focus. -->
+        <button
+          type="button"
+          class="btn-close ngb-sidebar-close"
+          [attr.aria-label]="closeLabel()"
+          (click)="layout?.closeSidebar()"
+        ></button>
+        <nav class="ngb-sidebar-nav" [attr.aria-label]="label()">
+          <ng-content />
+          <ng-container *ngTemplateOutlet="list; context: { $implicit: items(), level: 0 }" />
+        </nav>
+      </div>
+    </dialog>
+
+    <ng-template #list let-items let-level="level">
+      <ul class="ngb-sidebar-list">
+        @for (item of items; track item.label) {
+          <li>
+            @if (item.children?.length) {
+              <button
+                type="button"
+                class="ngb-sidebar-link ngb-sidebar-group"
+                [attr.data-level]="level"
+                [attr.title]="level === 0 && layout?.sidebarRail() ? item.label : null"
+                [attr.aria-expanded]="isExpanded(item)"
+                (click)="toggle(item)"
+              >
+                <ng-container *ngTemplateOutlet="itemLabel; context: { $implicit: item, level }" />
+                <ngb-icon class="ngb-sidebar-chevron" [icon]="chevron" size="1rem" />
+              </button>
+              <!-- Always rendered so expanding can animate; inert while collapsed. -->
+              <div
+                class="ngb-sidebar-collapse"
+                [class.ngb-sidebar-collapse-open]="isExpanded(item)"
+                [inert]="!isExpanded(item)"
+              >
+                <div class="ngb-sidebar-collapse-inner">
+                  <ng-container
+                    *ngTemplateOutlet="
+                      list;
+                      context: { $implicit: item.children, level: level + 1 }
+                    "
+                  />
+                </div>
+              </div>
+            } @else if (item.href) {
+              <a
+                class="ngb-sidebar-link"
+                [attr.data-level]="level"
+                [attr.title]="level === 0 && layout?.sidebarRail() ? item.label : null"
+                [href]="item.href"
+                target="_blank"
+                rel="noopener"
+              >
+                <ng-container *ngTemplateOutlet="itemLabel; context: { $implicit: item, level }" />
+              </a>
+            } @else {
+              <a
+                class="ngb-sidebar-link"
+                [attr.data-level]="level"
+                [attr.title]="level === 0 && layout?.sidebarRail() ? item.label : null"
+                [routerLink]="item.link"
+                routerLinkActive="active"
+                ariaCurrentWhenActive="page"
+                (click)="layout?.closeSidebar()"
+              >
+                <ng-container *ngTemplateOutlet="itemLabel; context: { $implicit: item, level }" />
+              </a>
+            }
+          </li>
+        }
+      </ul>
+    </ng-template>
+
+    <ng-template #itemLabel let-item let-level="level">
+      @if (level === 0 && item.icon) {
+        <ngb-icon class="ngb-sidebar-icon" [icon]="item.icon" size="1rem" />
+      }
+      <span class="ngb-sidebar-label">{{ item.label }}</span>
+    </ng-template>
+  `,
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: { class: "ngb-sidebar lg:col-auto" }
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		drawer: [{
+			type: i0.ViewChild,
+			args: ["drawer", { isSignal: true }]
+		}],
+		items: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "items",
+				required: false
+			}]
+		}],
+		label: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "label",
+				required: false
+			}]
+		}],
+		closeLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "closeLabel",
+				required: false
+			}]
+		}]
+	}
+});
+export { NgbSidebar };
+
+//# sourceMappingURL=ngb-bootstrap-core-sidebar.mjs.map

package/fesm2022/ngb-bootstrap-core-sidebar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngb-bootstrap-core-sidebar.mjs","names":[],"sources":["../../../../projects/core/sidebar/sidebar.ts"],"sourcesContent":["import { NgTemplateOutlet } from '@angular/common';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  ElementRef,\n  effect,\n  inject,\n  input,\n  signal,\n  untracked,\n  viewChild,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport {\n  IsActiveMatchOptions,\n  NavigationEnd,\n  Router,\n  RouterLink,\n  RouterLinkActive,\n  isActive,\n} from '@angular/router';\nimport { NgbIcon } from '@ngb-bootstrap/core/icon';\nimport { NgbLayout } from '@ngb-bootstrap/core/layout';\nimport { NgbIconDefinition, ngbIconRight } from '@ngb-bootstrap/icons';\nimport { filter } from 'rxjs';\n\n/** One entry in `<ngb-sidebar>`: a router link, an external link, or a group of children. */\nexport interface NgbSidebarItem {\n  readonly label: string;\n  /** Router link, e.g. `/components/badge`. */\n  readonly link?: string;\n  /** External URL, opened in a new tab. */\n  readonly href?: string;\n  /** Icon shown before top-level items. */\n  readonly icon?: NgbIconDefinition;\n  readonly children?: readonly NgbSidebarItem[];\n}\n\nconst SUBTREE: IsActiveMatchOptions = {\n  paths: 'subset',\n  queryParams: 'ignored',\n  fragment: 'ignored',\n  matrixParams: 'ignored',\n};\n\n/**\n * Side navigation in the Taiga UI docs style. From `lg` up it is a fixed column of\n * `<ngb-layout>`; below `lg` it is a Bootstrap drawer (`.lg:drawer`) opened by the navbar's menu\n * button and closed by the backdrop, Escape or following a link. In a `collapsible` layout it\n * contracts from `lg` up to a rail of top-level icons. Groups expand to reveal the current route. Content placed inside it (e.g. a notice) appears above the items.\n *\n * ```html\n * <ngb-sidebar label=\"Documentation\" [items]=\"items\" />\n * ```\n */\n@Component({\n  selector: 'ngb-sidebar',\n  imports: [NgbIcon, NgTemplateOutlet, RouterLink, RouterLinkActive],\n  template: `\n    <!-- The click handler only catches backdrop clicks; keyboard users close the dialog with Escape. -->\n    <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\n    <dialog\n      #drawer\n      class=\"lg:drawer drawer-start ngb-sidebar-drawer\"\n      [id]=\"layout?.sidebarId\"\n      [attr.aria-label]=\"label()\"\n      (close)=\"layout?.closeSidebar()\"\n      (click)=\"closeOnBackdrop($event)\"\n    >\n      <!-- Shown from lg up in a full-sidebar layout; elsewhere the navbar shows the brand. -->\n      @if (layout?.brand(); as brand) {\n        <div class=\"ngb-sidebar-brand\"><ng-container *ngTemplateOutlet=\"brand.template\" /></div>\n      }\n      <div class=\"drawer-body\">\n        <!-- Taiga's drawer has no visible header; the close button shows on keyboard focus. -->\n        <button\n          type=\"button\"\n          class=\"btn-close ngb-sidebar-close\"\n          [attr.aria-label]=\"closeLabel()\"\n          (click)=\"layout?.closeSidebar()\"\n        ></button>\n        <nav class=\"ngb-sidebar-nav\" [attr.aria-label]=\"label()\">\n          <ng-content />\n          <ng-container *ngTemplateOutlet=\"list; context: { $implicit: items(), level: 0 }\" />\n        </nav>\n      </div>\n    </dialog>\n\n    <ng-template #list let-items let-level=\"level\">\n      <ul class=\"ngb-sidebar-list\">\n        @for (item of items; track item.label) {\n          <li>\n            @if (item.children?.length) {\n              <button\n                type=\"button\"\n                class=\"ngb-sidebar-link ngb-sidebar-group\"\n                [attr.data-level]=\"level\"\n                [attr.title]=\"level === 0 && layout?.sidebarRail() ? item.label : null\"\n                [attr.aria-expanded]=\"isExpanded(item)\"\n                (click)=\"toggle(item)\"\n              >\n                <ng-container *ngTemplateOutlet=\"itemLabel; context: { $implicit: item, level }\" />\n                <ngb-icon class=\"ngb-sidebar-chevron\" [icon]=\"chevron\" size=\"1rem\" />\n              </button>\n              <!-- Always rendered so expanding can animate; inert while collapsed. -->\n              <div\n                class=\"ngb-sidebar-collapse\"\n                [class.ngb-sidebar-collapse-open]=\"isExpanded(item)\"\n                [inert]=\"!isExpanded(item)\"\n              >\n                <div class=\"ngb-sidebar-collapse-inner\">\n                  <ng-container\n                    *ngTemplateOutlet=\"\n                      list;\n                      context: { $implicit: item.children, level: level + 1 }\n                    \"\n                  />\n                </div>\n              </div>\n            } @else if (item.href) {\n              <a\n                class=\"ngb-sidebar-link\"\n                [attr.data-level]=\"level\"\n                [attr.title]=\"level === 0 && layout?.sidebarRail() ? item.label : null\"\n                [href]=\"item.href\"\n                target=\"_blank\"\n                rel=\"noopener\"\n              >\n                <ng-container *ngTemplateOutlet=\"itemLabel; context: { $implicit: item, level }\" />\n              </a>\n            } @else {\n              <a\n                class=\"ngb-sidebar-link\"\n                [attr.data-level]=\"level\"\n                [attr.title]=\"level === 0 && layout?.sidebarRail() ? item.label : null\"\n                [routerLink]=\"item.link\"\n                routerLinkActive=\"active\"\n                ariaCurrentWhenActive=\"page\"\n                (click)=\"layout?.closeSidebar()\"\n              >\n                <ng-container *ngTemplateOutlet=\"itemLabel; context: { $implicit: item, level }\" />\n              </a>\n            }\n          </li>\n        }\n      </ul>\n    </ng-template>\n\n    <ng-template #itemLabel let-item let-level=\"level\">\n      @if (level === 0 && item.icon) {\n        <ngb-icon class=\"ngb-sidebar-icon\" [icon]=\"item.icon\" size=\"1rem\" />\n      }\n      <span class=\"ngb-sidebar-label\">{{ item.label }}</span>\n    </ng-template>\n  `,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: { class: 'ngb-sidebar lg:col-auto' },\n})\nexport class NgbSidebar {\n  protected readonly layout = inject(NgbLayout, { optional: true });\n  private readonly router = inject(Router);\n  private readonly drawer = viewChild.required<ElementRef<HTMLDialogElement>>('drawer');\n  private readonly expanded = signal<ReadonlySet<NgbSidebarItem>>(new Set());\n  protected readonly chevron = ngbIconRight;\n\n  /** The navigation tree. */\n  readonly items = input<readonly NgbSidebarItem[]>([]);\n  /** Accessible name of the navigation. */\n  readonly label = input('Main');\n  /** Accessible name of the drawer's close button. */\n  readonly closeLabel = input('Close');\n\n  constructor() {\n    effect(() => {\n      const items = this.items();\n      untracked(() => this.expandActive(items));\n    });\n    this.router.events\n      .pipe(\n        filter((event) => event instanceof NavigationEnd),\n        takeUntilDestroyed(),\n      )\n      .subscribe(() => this.expandActive(this.items()));\n\n    // Open and close the drawer as a modal dialog below lg.\n    effect(() => {\n      const open = this.layout?.sidebarOpen() ?? false;\n      const dialog = this.drawer().nativeElement;\n      if (open && !dialog.open && typeof dialog.showModal === 'function') {\n        dialog.showModal();\n      } else if (!open && dialog.open) {\n        dialog.close();\n      }\n    });\n  }\n\n  protected isExpanded(item: NgbSidebarItem): boolean {\n    return this.expanded().has(item);\n  }\n\n  protected toggle(item: NgbSidebarItem): void {\n    // The rail hides children: expand the sidebar and open the group instead.\n    if (this.layout?.sidebarRail()) {\n      this.layout.sidebarCollapsed.set(false);\n      this.expanded.update((current) => new Set([...current, item]));\n      return;\n    }\n    this.expanded.update((current) => {\n      const next = new Set(current);\n      if (!next.delete(item)) next.add(item);\n      return next;\n    });\n  }\n\n  /** A click on the dialog itself, outside its box, is a click on the backdrop. */\n  protected closeOnBackdrop(event: MouseEvent): void {\n    const dialog = this.drawer().nativeElement;\n    if (event.target !== dialog || !dialog.matches(':modal')) return;\n    const box = dialog.getBoundingClientRect();\n    const inside =\n      event.clientX >= box.left &&\n      event.clientX <= box.right &&\n      event.clientY >= box.top &&\n      event.clientY <= box.bottom;\n    if (!inside) this.layout?.closeSidebar();\n  }\n\n  /** Expands every group that contains the current route, keeping groups the user opened. */\n  private expandActive(items: readonly NgbSidebarItem[]): void {\n    const active: NgbSidebarItem[] = [];\n    const visit = (item: NgbSidebarItem): boolean => {\n      if (item.children?.length) {\n        const hasActive = item.children.map(visit).some(Boolean);\n        if (hasActive) active.push(item);\n        return hasActive;\n      }\n      return !!item.link && isActive(item.link, this.router, SUBTREE)();\n    };\n    items.forEach(visit);\n    if (active.some((item) => !this.expanded().has(item))) {\n      this.expanded.update((current) => new Set([...current, ...active]));\n    }\n  }\n}\n"],"mappings":";;;;;;;;;AAsCA,MAAM,UAAgC;CACpC,OAAO;CACP,aAAa;CACb,UAAU;CACV,cAAc;AACf;AAmHD,IAAa,aAAb,MAAa,WAAU;CACF,SAAS,OAAO,WAAW,EAAE,UAAU,KAAI,CAAE;CAC/C,SAAS,OAAO,MAAM;CACtB,SAAS,UAAU,SAAwC,UAAS,GAAA,YAAA,CAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;CACpE,WAAW,uBAAoC,IAAI,IAAG,GAAG,GAAA,YAAA,CAAA,EAAA,WAAA,WAAA,CAAA,+BAAA,CAAA,CAAA;CACvD,UAAU;CAGpB,QAAQ,MAAiC,CAAA,GAAG,GAAA,YAAA,CAAA,EAAA,WAAA,QAAA,CAAA,+BAAA,CAAA,CAAA;CAE5C,QAAQ,MAAM,QAAO,GAAA,YAAA,CAAA,EAAA,WAAA,QAAA,CAAA,+BAAA,CAAA,CAAA;CAErB,aAAa,MAAM,SAAQ,GAAA,YAAA,CAAA,EAAA,WAAA,aAAA,CAAA,+BAAA,CAAA,CAAA;CAEpC,cAAA;EACE,aAAY;GACV,MAAM,QAAQ,KAAK,MAAK;GACxB,gBAAgB,KAAK,aAAa,KAAK,CAAC;EAC1C,CAAC;EACD,KAAK,OAAO,OACT,KACC,QAAQ,UAAU,iBAAiB,aAAa,GAChD,mBAAkB,CAAE,CACrB,CACA,gBAAgB,KAAK,aAAa,KAAK,MAAK,CAAE,CAAC;EAGlD,aAAY;GACV,MAAM,OAAO,KAAK,QAAQ,YAAW,KAAM;GAC3C,MAAM,SAAS,KAAK,OAAM,CAAE,CAAC;GAC7B,IAAI,QAAQ,CAAC,OAAO,QAAQ,OAAO,OAAO,cAAc,YACtD,OAAO,UAAS;QACX,IAAI,CAAC,QAAQ,OAAO,MACzB,OAAO,MAAK;EAEhB,CAAC;CACH;CAEU,WAAW,MAAoB;EACvC,OAAO,KAAK,SAAQ,CAAE,CAAC,IAAI,IAAI;CACjC;CAEU,OAAO,MAAoB;EAEnC,IAAI,KAAK,QAAQ,YAAW,GAAI;GAC9B,KAAK,OAAO,iBAAiB,IAAI,KAAK;GACtC,KAAK,SAAS,QAAQ,4BAAY,IAAI,IAAI,CAAC,GAAG,SAAS,IAAI,CAAC,CAAC;GAC7D;EACF;EACA,KAAK,SAAS,QAAQ,YAAW;GAC/B,MAAM,OAAO,IAAI,IAAI,OAAO;GAC5B,IAAI,CAAC,KAAK,OAAO,IAAI,GAAG,KAAK,IAAI,IAAI;GACrC,OAAO;EACT,CAAC;CACH;CAGU,gBAAgB,OAAiB;EACzC,MAAM,SAAS,KAAK,OAAM,CAAE,CAAC;EAC7B,IAAI,MAAM,WAAW,UAAU,CAAC,OAAO,QAAQ,QAAQ,GAAG;EAC1D,MAAM,MAAM,OAAO,sBAAqB;EAMxC,IAAI,EAJF,MAAM,WAAW,IAAI,QACrB,MAAM,WAAW,IAAI,SACrB,MAAM,WAAW,IAAI,OACrB,MAAM,WAAW,IAAI,SACV,KAAK,QAAQ,aAAY;CACxC;CAGQ,aAAa,OAAgC;EACnD,MAAM,SAA2B,CAAA;EACjC,MAAM,SAAS,SAAiC;GAC9C,IAAI,KAAK,UAAU,QAAQ;IACzB,MAAM,YAAY,KAAK,SAAS,IAAI,KAAK,CAAC,CAAC,KAAK,OAAO;IACvD,IAAI,WAAW,OAAO,KAAK,IAAI;IAC/B,OAAO;GACT;GACA,OAAO,CAAC,CAAC,KAAK,QAAQ,SAAS,KAAK,MAAM,KAAK,QAAQ,OAAO,CAAC,CAAA;EACjE;EACA,MAAM,QAAQ,KAAK;EACnB,IAAI,OAAO,MAAM,SAAS,CAAC,KAAK,SAAQ,CAAE,CAAC,IAAI,IAAI,CAAC,GAClD,KAAK,SAAS,QAAQ,4BAAY,IAAI,IAAI,CAAC,GAAG,SAAS,GAAG,MAAM,CAAC,CAAC;CAEtE;CApFW,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAU,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAAV,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAU,cAAA;EAAA,UAAA;EAAA,QAAA;GAAA,OAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,OAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,YAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;EAAA;EAAA,MAAA,EAAA,gBAAA,0BAAA;EAAA,aAAA,CAAA;GAAA,cAAA;GAAA,OAAA;GAAA,WAAA,CAAA,QAAA;GAAA,aAAA;GAAA,UAAA;EAAA,CAAA;EAAA,UAAA;EAAA,UApGX;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgGT,UAAA;EAAA,cAAA;GAAA;IAAA,MAAA;IAAA,MAjGS;IAAO,UAAA;IAAA,QAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;IAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MAAE;IAAgB,UAAA;IAAA,QAAA;KAAA;KAAA;KAAA;IAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MAAE;IAAU,UAAA;IAAA,QAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;IAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MAAE;IAAgB,UAAA;IAAA,QAAA;KAAA;KAAA;KAAA;IAAA;IAAA,SAAA,CAAA,gBAAA;IAAA,UAAA,CAAA,kBAAA;GAAA;EAAA;EAAA,iBAAA,GAAA,wBAAA;CAAA,CAAA;;AAqGtD,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAU,YAAA,CAAA;EAvGtB,MAAA;EAAU,MAAA,CAAA;GACT,UAAU;GACV,SAAS;IAAC;IAAS;IAAkB;IAAY;GAAgB;GACjE,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiGV,iBAAiB,wBAAwB;GACzC,MAAM,EAAE,OAAO,0BAAyB;EACzC,CAAA;CAI6E,CAAA;CAAA,sBAAA,CAAA;CAAA,gBAAA;EAAA,QAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA,UAAQ,EAAA,UAAA,KAAA,CAAA;EAAA,CAAA;EAAA,OAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA;IAAA,UAAA;IAAA,OAAA;IAAA,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,OAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA;IAAA,UAAA;IAAA,OAAA;IAAA,UAAA;GAAA,CAAA;EAAA,CAAA;EAAA,YAAA,CAAA;GAAA,MAAA,GAAA;GAAA,MAAA,CAAA;IAAA,UAAA;IAAA,OAAA;IAAA,UAAA;GAAA,CAAA;EAAA,CAAA;CAAA;AAAA,CAAA"}

package/fesm2022/ngb-bootstrap-core-spinner.mjs

@@ -0,0 +1,126 @@
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, computed, inject, input } from "@angular/core";
+import { NGB_I18N } from "@ngb-bootstrap/core";
+var NgbSpinner = class NgbSpinner {
+	i18n = inject(NGB_I18N);
+	type = input("border", ...ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []);
+	size = input("md", ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
+	color = input(...ngDevMode ? [void 0, { debugName: "color" }] : /* istanbul ignore next */ []);
+	label = input(...ngDevMode ? [void 0, { debugName: "label" }] : /* istanbul ignore next */ []);
+	text = computed(() => this.label() ?? this.i18n.loading, ...ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []);
+	classes = computed(() => {
+		const classes = [`spinner-${this.type()}`];
+		if (this.size() === "sm") classes.push("spinner-sm");
+		const color = this.color();
+		if (color) classes.push(`fg-${color}`);
+		return classes.join(" ");
+	}, ...ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: NgbSpinner,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.3",
+		type: NgbSpinner,
+		isStandalone: true,
+		selector: "ngb-spinner",
+		inputs: {
+			type: {
+				classPropertyName: "type",
+				publicName: "type",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			size: {
+				classPropertyName: "size",
+				publicName: "size",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			color: {
+				classPropertyName: "color",
+				publicName: "color",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			label: {
+				classPropertyName: "label",
+				publicName: "label",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: {
+			attributes: { "role": "status" },
+			properties: { "class": "classes()" }
+		},
+		ngImport: i0,
+		template: "<span class=\"visually-hidden\">{{ text() }}</span>",
+		isInline: true,
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: NgbSpinner,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ngb-spinner",
+			template: "<span class=\"visually-hidden\">{{ text() }}</span>",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: {
+				"[class]": "classes()",
+				role: "status"
+			}
+		}]
+	}],
+	propDecorators: {
+		type: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "type",
+				required: false
+			}]
+		}],
+		size: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "size",
+				required: false
+			}]
+		}],
+		color: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "color",
+				required: false
+			}]
+		}],
+		label: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "label",
+				required: false
+			}]
+		}]
+	}
+});
+export { NgbSpinner };
+
+//# sourceMappingURL=ngb-bootstrap-core-spinner.mjs.map

package/fesm2022/ngb-bootstrap-core-spinner.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngb-bootstrap-core-spinner.mjs","names":[],"sources":["../../../../projects/core/spinner/spinner.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, inject, input } from '@angular/core';\nimport { NGB_I18N, NgbThemeColor } from '@ngb-bootstrap/core';\n\nexport type NgbSpinnerType = 'border' | 'grow';\nexport type NgbSpinnerSize = 'sm' | 'md';\n\n/**\n * Loading indicator built on Bootstrap 6 `.spinner-border` and `.spinner-grow`. It is a\n * `role=\"status\"` region with visually hidden text, named \"Loading…\" by default.\n *\n * ```html\n * <ngb-spinner color=\"primary\" size=\"sm\" />\n * <ngb-spinner type=\"grow\" label=\"Saving your draft\" />\n * ```\n */\n@Component({\n  selector: 'ngb-spinner',\n  template: '<span class=\"visually-hidden\">{{ text() }}</span>',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    '[class]': 'classes()',\n    role: 'status',\n  },\n})\nexport class NgbSpinner {\n  private readonly i18n = inject(NGB_I18N);\n\n  /** `border` (default) or `grow`. */\n  readonly type = input<NgbSpinnerType>('border');\n  /** `md` (default) or `sm`. For any other size, set `--spinner-width` and `--spinner-height`. */\n  readonly size = input<NgbSpinnerSize>('md');\n  /** Theme colour. Without it the spinner takes the current text colour. */\n  readonly color = input<NgbThemeColor>();\n  /** Accessible text. Defaults to the `loading` string of `NGB_I18N`. */\n  readonly label = input<string>();\n\n  protected readonly text = computed(() => this.label() ?? this.i18n.loading);\n\n  protected readonly classes = computed(() => {\n    const classes = [`spinner-${this.type()}`];\n    if (this.size() === 'sm') classes.push('spinner-sm');\n    const color = this.color();\n    if (color) classes.push(`fg-${color}`);\n    return classes.join(' ');\n  });\n}\n"],"mappings":";;;AAwBA,IAAa,aAAb,MAAa,WAAU;CACJ,OAAO,OAAO,QAAQ;CAG9B,OAAO,MAAsB,UAAS,GAAA,YAAA,CAAA,EAAA,WAAA,OAAA,CAAA,+BAAA,CAAA,CAAA;CAEtC,OAAO,MAAsB,MAAK,GAAA,YAAA,CAAA,EAAA,WAAA,OAAA,CAAA,+BAAA,CAAA,CAAA;CAElC,QAAQ,MAAsB,GAAA,YAAA,CAAA,QAAA,EAAA,WAAA,QAAA,CAAA,+BAAA,CAAA,CAAA;CAE9B,QAAQ,MAAe,GAAA,YAAA,CAAA,QAAA,EAAA,WAAA,QAAA,CAAA,+BAAA,CAAA,CAAA;CAEb,OAAO,eAAe,KAAK,MAAK,KAAM,KAAK,KAAK,SAAQ,GAAA,YAAA,CAAA,EAAA,WAAA,OAAA,CAAA,+BAAA,CAAA,CAAA;CAExD,UAAU,eAAc;EACzC,MAAM,UAAU,CAAC,WAAW,KAAK,KAAI,GAAI;EACzC,IAAI,KAAK,KAAI,MAAO,MAAM,QAAQ,KAAK,YAAY;EACnD,MAAM,QAAQ,KAAK,MAAK;EACxB,IAAI,OAAO,QAAQ,KAAK,MAAM,OAAO;EACrC,OAAO,QAAQ,KAAK,GAAG;CACzB,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;CApBS,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAU,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAAV,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAU,cAAA;EAAA,UAAA;EAAA,QAAA;GAAA,MAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,MAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,OAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,OAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;EAAA;EAAA,MAAA;GAAA,YAAA,EAAA,QAAA,SAAA;GAAA,YAAA,EAAA,SAAA,YAAA;EAAA;EAAA,UAAA;EAAA,UAPX;EAAmD,UAAA;EAAA,iBAAA,GAAA,wBAAA;CAAA,CAAA;;AAOlD,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAU,YAAA,CAAA;EATtB,MAAA;EAAU,MAAA,CAAA;GACT,UAAU;GACV,UAAU;GACV,iBAAiB,wBAAwB;GACzC,MAAM;IACJ,WAAW;IACX,MAAM;GACP;EACF,CAAA"}