@ng-atomic/components 18.2.0 → 18.4.0

package/fesm2022/ng-atomic-components-frames-progress-bar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ng-atomic-components-frames-progress-bar.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/progress-bar/progress-bar.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/progress-bar/ng-atomic-components-frames-progress-bar.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Directive, inject, input } from '@angular/core';\nimport { MatProgressBarModule, ProgressBarMode } from '@angular/material/progress-bar';\nimport { NgAtomicComponent } from '@ng-atomic/core';\n\n@Directive({\n  standalone: true,\n  selector: 'frames-progress-bar',\n})\nexport class ProgressBarFrameStore {\n  readonly mode = input<ProgressBarMode>('determinate');\n  readonly isProgress = input<boolean>(false);\n}\n\n@Component({\n  selector: 'frames-progress-bar',\n  standalone: true,\n  imports: [\n    MatProgressBarModule,\n  ],\n  template: `\n    @if (store.isProgress()) {\n      <mat-progress-bar [mode]=\"store.mode()\" [color]=\"'accent'\"/>\n    }\n    <ng-content />\n  `,\n  styleUrl: './progress-bar.frame.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  hostDirectives: [\n    {\n      directive: ProgressBarFrameStore,\n      inputs: [\n        'mode',\n        'isProgress',\n      ],\n    }\n  ]\n})\nexport class ProgressBarFrame extends NgAtomicComponent {\n  protected readonly store = inject(ProgressBarFrameStore);\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;MAQa,qBAAqB,CAAA;AAJlC,IAAA,WAAA,GAAA;AAKW,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAkB,aAAa,CAAC,CAAC;AAC7C,QAAA,IAAA,CAAA,UAAU,GAAG,KAAK,CAAU,KAAK,CAAC,CAAC;AAC7C,KAAA;8GAHY,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;kGAArB,qBAAqB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA,EAAA;;2FAArB,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBAJjC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,QAAQ,EAAE,qBAAqB;AAChC,iBAAA,CAAA;;AA8BK,MAAO,gBAAiB,SAAQ,iBAAiB,CAAA;AAxBvD,IAAA,WAAA,GAAA;;AAyBqB,QAAA,IAAA,CAAA,KAAK,GAAG,MAAM,CAAC,qBAAqB,CAAC,CAAC;AAC1D,KAAA;8GAFY,gBAAgB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;kGAAhB,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,eAAA,EAAA,IAAA,EAAA,cAAA,EAAA,CAAA,EAAA,SAAA,EA7BhB,qBAAqB,EAWtB,MAAA,EAAA,CAAA,MAAA,EAAA,MAAA,EAAA,YAAA,EAAA,YAAA,CAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA;;;;;AAKT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,mIAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAPC,oBAAoB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,cAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,OAAA,EAAA,aAAA,EAAA,MAAA,CAAA,EAAA,OAAA,EAAA,CAAA,cAAA,CAAA,EAAA,QAAA,EAAA,CAAA,gBAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;2FAoBX,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAxB5B,SAAS;+BACE,qBAAqB,EAAA,UAAA,EACnB,IAAI,EACP,OAAA,EAAA;wBACP,oBAAoB;qBACrB,EACS,QAAA,EAAA,CAAA;;;;;GAKT,EAEgB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAC/B,cAAA,EAAA;AACd,wBAAA;AACE,4BAAA,SAAS,EAAE,qBAAqB;AAChC,4BAAA,MAAM,EAAE;gCACN,MAAM;gCACN,YAAY;AACb,6BAAA;AACF,yBAAA;AACF,qBAAA,EAAA,MAAA,EAAA,CAAA,mIAAA,CAAA,EAAA,CAAA;;;ACnCH;;AAEG;;;;"}

package/fesm2022/ng-atomic-components-frames-router-outlet.mjs

@@ -1,17 +1,14 @@
 import * as i0 from '@angular/core';
-import { input, Directive, inject, viewChild, Component, ChangeDetectionStrategy } from '@angular/core';
+import { input, Directive, inject, EventEmitter, viewChild, Component, ChangeDetectionStrategy, Output, InjectionToken, signal, runInInjectionContext } from '@angular/core';
 import { NgTemplateOutlet } from '@angular/common';
 import { OverlayFrame } from '@ng-atomic/components/frames/overlay';
 import { LineUpFrame } from '@ng-atomic/components/frames/line-up';
 import { PRIMARY_OUTLET, RouterOutlet } from '@angular/router';
 import { makeConfig } from '@ng-atomic/common/services/ui';
 import { InjectableComponent, _computed, NgAtomicComponent } from '@ng-atomic/core';
-import { of, combineLatest, startWith, map } from 'rxjs';
-import { computedAsync } from 'ngxtension/computed-async';
+import { switchMap, combineLatest, startWith, map, distinctUntilChanged, of, delay } from 'rxjs';
+import { toObservable, toSignal } from '@angular/core/rxjs-interop';
 
-function isBlankRoute(outlet) {
-    return !!(outlet?.activatedRouteData) && !(outlet.activatedRouteData?.['isBlank']);
-}
 class RouterOutletFrameStore extends InjectableComponent {
     constructor() {
         super(...arguments);
@@ -19,6 +16,7 @@ class RouterOutletFrameStore extends InjectableComponent {
         this.frame = input(_computed(() => this.config().frame));
         this.name = input(_computed(() => this.config().name, { equal: (a, b) => a === b }));
         this.isActivated = input(_computed(() => this.config().isActivated));
+        this.skip = input(false);
     }
     static { this.Config = makeConfig(() => {
         const getFrame = (breakpoint) => {
@@ -31,24 +29,24 @@ class RouterOutletFrameStore extends InjectableComponent {
             return ({
                 frame: getFrame(context.breakpoint),
                 name: PRIMARY_OUTLET,
-                isActivated: (outlet) => isBlankRoute(outlet),
+                isActivated: (outlet) => !!outlet.isActivated,
             });
         };
     }, ['components', 'frames', 'router-outlet']); }
-    static provideExperimental() {
-        return RouterOutletFrameStore.Config.provide(() => {
-            return (config) => ({ ...config, isActivated: (outlet) => !!outlet.isActivated });
-        });
-    }
-    static { this.provideSideAppConfig = () => {
+    static { this.provideSideAppConfig = (name = PRIMARY_OUTLET) => {
         return RouterOutletFrameStore.Config.provide(() => (config) => ({
             ...config,
-            name: 'side-app',
+            name,
             frame: 'overlay',
         }));
     }; }
+    static provideDefault() {
+        return [
+            RouterOutletFrameStore.Config.provide(),
+        ];
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: RouterOutletFrameStore, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.1.2", type: RouterOutletFrameStore, isStandalone: true, selector: "frames-router-outlet", inputs: { frame: { classPropertyName: "frame", publicName: "frame", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, isActivated: { classPropertyName: "isActivated", publicName: "isActivated", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.1.2", type: RouterOutletFrameStore, isStandalone: true, selector: "frames-router-outlet", inputs: { frame: { classPropertyName: "frame", publicName: "frame", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, isActivated: { classPropertyName: "isActivated", publicName: "isActivated", isSignal: true, isRequired: false, transformFunction: null }, skip: { classPropertyName: "skip", publicName: "skip", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: RouterOutletFrameStore, decorators: [{
             type: Directive,
@@ -56,38 +54,47 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImpor
         }] });
 class RouterOutletFrame extends NgAtomicComponent {
     constructor() {
-        super(...arguments);
+        super();
         this.store = inject(RouterOutletFrameStore);
+        this.events = new EventEmitter();
         this.outlet = viewChild(RouterOutlet);
-        this.isActivated = computedAsync(() => {
-            const outlet = this.outlet();
-            if (!outlet)
-                return of(false);
-            return combineLatest([
-                outlet.activateEvents.pipe(startWith(null)),
-                outlet.deactivateEvents.pipe(startWith(null)),
-            ]).pipe(map(() => this.store.isActivated()(outlet)));
+        this.outlet$ = toObservable(this.outlet);
+        this.activatedEvents$ = this.outlet$.pipe(switchMap((outlet) => outlet.activateEvents));
+        this.hasNext$ = this.outlet$.pipe(switchMap((outlet) => combineLatest([
+            this.activatedEvents$.pipe(startWith(null)),
+            outlet.deactivateEvents.pipe(startWith(null)),
+        ]).pipe(map(() => this.store.isActivated()(outlet)), distinctUntilChanged())));
+        this.hasNext = toSignal(this.hasNext$);
+        this.parent = inject(RouterOutletFrame, { optional: true, skipSelf: true });
+        this.events.subscribe((event) => {
+            if (this.store.skip()) {
+                this.parent.events.emit(event);
+            }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: RouterOutletFrame, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.2", type: RouterOutletFrame, isStandalone: true, selector: "frames-router-outlet", viewQueries: [{ propertyName: "outlet", first: true, predicate: RouterOutlet, descendants: true, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: RouterOutletFrameStore, inputs: ["frame", "frame", "name", "name"] }], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: RouterOutletFrame, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.2", type: RouterOutletFrame, isStandalone: true, selector: "frames-router-outlet", outputs: { events: "events" }, viewQueries: [{ propertyName: "outlet", first: true, predicate: RouterOutlet, descendants: true, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: RouterOutletFrameStore, inputs: ["frame", "frame", "name", "name", "skip", "skip"] }], ngImport: i0, template: `
     @switch (store.frame()) {
       @case ('lineup') {
-        <frames-line-up [hasNext]="isActivated()" [scope]="store.name()">
-          <ng-container *ngTemplateOutlet="main" main/>
+        <frames-line-up [hasNext]="hasNext()" [scope]="store.name()">
+          @if (!store.skip()) {
+            <ng-container *ngTemplateOutlet="main" main/>
+          }
           <ng-container *ngTemplateOutlet="next" next/>
         </frames-line-up>
       }
       @default {
-        <frames-overlay [hasNext]="isActivated()">
-          <ng-container *ngTemplateOutlet="main" main/>
+        <frames-overlay [hasNext]="hasNext()">
+          @if (!store.skip()) {
+            <ng-container *ngTemplateOutlet="main" main/>
+          }
           <ng-container *ngTemplateOutlet="next" next/>
         </frames-overlay>
       }
     }
-    <ng-template #main><ng-content main /></ng-template>
+    <ng-template #main><ng-content main/></ng-template>
     <ng-template #next><router-outlet [name]="store.name()"/></ng-template>
-  `, isInline: true, styles: [":host{display:contents;--primary-color: #ccc;--primary-color-SCOPED-IN-router-outlet-UpHz: var(--primary-color);--on-primary-color: #ccc;--on-primary-color-SCOPED-IN-router-outlet-UpHz: var(--on-primary-color);--surface-color: #ccc;--surface-color-SCOPED-IN-router-outlet-UpHz: var(--surface-color);--background-color: #ccc;--background-color-SCOPED-IN-router-outlet-UpHz: var(--background-color)}:host *{--primary-color: var(--primary-color-SCOPED-IN-router-outlet-UpHz);--on-primary-color: var(--on-primary-color-SCOPED-IN-router-outlet-UpHz);--surface-color: var(--surface-color-SCOPED-IN-router-outlet-UpHz);--background-color: var(--background-color-SCOPED-IN-router-outlet-UpHz)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: OverlayFrame, selector: "frames-overlay" }, { kind: "component", type: LineUpFrame, selector: "frames-line-up" }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, styles: [":host{display:contents;--primary-color: #ccc;--primary-color-SCOPED-IN-router-outlet-4kuO: var(--primary-color);--on-primary-color: #ccc;--on-primary-color-SCOPED-IN-router-outlet-4kuO: var(--on-primary-color);--surface-color: #ccc;--surface-color-SCOPED-IN-router-outlet-4kuO: var(--surface-color);--background-color: #ccc;--background-color-SCOPED-IN-router-outlet-4kuO: var(--background-color)}:host *{--primary-color: var(--primary-color-SCOPED-IN-router-outlet-4kuO);--on-primary-color: var(--on-primary-color-SCOPED-IN-router-outlet-4kuO);--surface-color: var(--surface-color-SCOPED-IN-router-outlet-4kuO);--background-color: var(--background-color-SCOPED-IN-router-outlet-4kuO)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: OverlayFrame, selector: "frames-overlay" }, { kind: "component", type: LineUpFrame, selector: "frames-line-up" }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: RouterOutletFrame, decorators: [{
             type: Component,
@@ -99,31 +106,79 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImpor
                     ], template: `
     @switch (store.frame()) {
       @case ('lineup') {
-        <frames-line-up [hasNext]="isActivated()" [scope]="store.name()">
-          <ng-container *ngTemplateOutlet="main" main/>
+        <frames-line-up [hasNext]="hasNext()" [scope]="store.name()">
+          @if (!store.skip()) {
+            <ng-container *ngTemplateOutlet="main" main/>
+          }
           <ng-container *ngTemplateOutlet="next" next/>
         </frames-line-up>
       }
       @default {
-        <frames-overlay [hasNext]="isActivated()">
-          <ng-container *ngTemplateOutlet="main" main/>
+        <frames-overlay [hasNext]="hasNext()">
+          @if (!store.skip()) {
+            <ng-container *ngTemplateOutlet="main" main/>
+          }
           <ng-container *ngTemplateOutlet="next" next/>
         </frames-overlay>
       }
     }
-    <ng-template #main><ng-content main /></ng-template>
+    <ng-template #main><ng-content main/></ng-template>
     <ng-template #next><router-outlet [name]="store.name()"/></ng-template>
   `, changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [
                         {
                             directive: RouterOutletFrameStore,
-                            inputs: ['frame', 'name'],
+                            inputs: ['frame', 'name', 'skip'],
                         },
-                    ], styles: [":host{display:contents;--primary-color: #ccc;--primary-color-SCOPED-IN-router-outlet-UpHz: var(--primary-color);--on-primary-color: #ccc;--on-primary-color-SCOPED-IN-router-outlet-UpHz: var(--on-primary-color);--surface-color: #ccc;--surface-color-SCOPED-IN-router-outlet-UpHz: var(--surface-color);--background-color: #ccc;--background-color-SCOPED-IN-router-outlet-UpHz: var(--background-color)}:host *{--primary-color: var(--primary-color-SCOPED-IN-router-outlet-UpHz);--on-primary-color: var(--on-primary-color-SCOPED-IN-router-outlet-UpHz);--surface-color: var(--surface-color-SCOPED-IN-router-outlet-UpHz);--background-color: var(--background-color-SCOPED-IN-router-outlet-UpHz)}\n"] }]
-        }] });
+                    ], styles: [":host{display:contents;--primary-color: #ccc;--primary-color-SCOPED-IN-router-outlet-4kuO: var(--primary-color);--on-primary-color: #ccc;--on-primary-color-SCOPED-IN-router-outlet-4kuO: var(--on-primary-color);--surface-color: #ccc;--surface-color-SCOPED-IN-router-outlet-4kuO: var(--surface-color);--background-color: #ccc;--background-color-SCOPED-IN-router-outlet-4kuO: var(--background-color)}:host *{--primary-color: var(--primary-color-SCOPED-IN-router-outlet-4kuO);--on-primary-color: var(--on-primary-color-SCOPED-IN-router-outlet-4kuO);--surface-color: var(--surface-color-SCOPED-IN-router-outlet-4kuO);--background-color: var(--background-color-SCOPED-IN-router-outlet-4kuO)}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { events: [{
+                type: Output
+            }] } });
+function InjectableSignal(name, defaultValue = null) {
+    return new InjectionToken(name, {
+        providedIn: 'root',
+        factory: () => signal(defaultValue),
+    });
+}
+const CURRENT_ROUTER_OUTLET = InjectableSignal('CURRENT_ROUTER_OUTLET', null);
+const canDeactivateFn = (component) => {
+    const current = inject(CURRENT_ROUTER_OUTLET);
+    const frame = component?.__injector ? runInInjectionContext(component?.__injector, () => {
+        return inject(RouterOutletFrame, { optional: true });
+    }) : null;
+    if (frame) {
+        current.set(frame);
+        frame.events.emit('deactivated');
+    }
+    // MEMO(NozomuMiyamoto): RouterOutletFrameの幅を変更するアニメーションの最適化のために遅延させている。
+    return of(true).pipe(delay(0));
+};
+const canActivateFn = () => {
+    const current = inject(CURRENT_ROUTER_OUTLET);
+    if (current()) {
+        current().events.emit('activated');
+    }
+    // MEMO(NozomuMiyamoto): RouterOutletFrameの幅を変更するアニメーションの最適化のために遅延させている。
+    return of(true).pipe(delay(0));
+};
+function ngAtomicRoutes(routes) {
+    return routes.map(route => {
+        return {
+            ...route,
+            canActivate: [canActivateFn, ...(route.canActivate || [])],
+            canDeactivate: [canDeactivateFn, ...(route.canDeactivate || [])],
+            data: { preload: true, ...route.data },
+            // loadChildren: route?.loadChildren ? async () => {
+            //   const module = await route?.loadChildren();
+            //   const routes: Routes = module['default'] || module['routes'] || [];
+            //   return ngAtomicRoutes(routes);
+            // } : undefined,
+        };
+    });
+}
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { RouterOutletFrame, RouterOutletFrameStore };
+export { RouterOutletFrame, RouterOutletFrameStore, canActivateFn, canDeactivateFn, ngAtomicRoutes };
 //# sourceMappingURL=ng-atomic-components-frames-router-outlet.mjs.map

package/fesm2022/ng-atomic-components-frames-router-outlet.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ng-atomic-components-frames-router-outlet.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/router-outlet/router-outlet.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/router-outlet/ng-atomic-components-frames-router-outlet.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Directive, inject, input, viewChild } from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { OverlayFrame } from '@ng-atomic/components/frames/overlay';\nimport { LineUpFrame } from '@ng-atomic/components/frames/line-up';\nimport { PRIMARY_OUTLET, RouterOutlet } from '@angular/router';\nimport { Breakpoint } from '@ng-atomic/common/services/breakpoint';\nimport { makeConfig } from '@ng-atomic/common/services/ui';\nimport { InjectableComponent, NgAtomicComponent, _computed } from '@ng-atomic/core';\nimport { combineLatest, map, of, startWith } from 'rxjs';\nimport { computedAsync } from 'ngxtension/computed-async';\n\nfunction isBlankRoute(outlet: RouterOutlet): boolean {\n  return !!(outlet?.activatedRouteData) && !(outlet.activatedRouteData?.['isBlank']);\n}\n\n@Directive({standalone: true, selector: 'frames-router-outlet'})\nexport class RouterOutletFrameStore extends InjectableComponent {\n  static readonly Config = makeConfig(() => {\n    const getFrame = (breakpoint: Breakpoint) => {\n      switch(breakpoint) {\n        case 'xSmall': return 'overlay' as 'lineup' | 'overlay';\n        default: return 'lineup' as 'lineup' | 'overlay';\n      }\n    }\n    return (context) => {\n      return ({\n        frame: getFrame(context.breakpoint),\n        name: PRIMARY_OUTLET as string,\n        isActivated: (outlet: RouterOutlet) => isBlankRoute(outlet),\n      });\n    }\n  }, ['components', 'frames', 'router-outlet']);\n\n  static provideExperimental() {\n    return RouterOutletFrameStore.Config.provide(() => {\n      return (config) => ({ ...config, isActivated: (outlet) => !!outlet.isActivated });\n    });\n  }\n\n  static provideSideAppConfig = () => {\n    return RouterOutletFrameStore.Config.provide(() => (config) => ({\n      ...config,\n      name: 'side-app',\n      frame: 'overlay',\n    }));\n  }\n\n  readonly config = RouterOutletFrameStore.Config.inject();\n  readonly frame = input(_computed(() => this.config().frame));\n  readonly name = input(_computed(() => this.config().name, { equal: (a, b) => a === b }));\n  readonly isActivated = input(_computed(() => this.config().isActivated));\n} \n\n@Component({\n  selector: 'frames-router-outlet',\n  standalone: true,\n  imports: [\n    NgTemplateOutlet,\n    OverlayFrame,\n    LineUpFrame,\n    RouterOutlet,\n  ],\n  template: `\n    @switch (store.frame()) {\n      @case ('lineup') {\n        <frames-line-up [hasNext]=\"isActivated()\" [scope]=\"store.name()\">\n          <ng-container *ngTemplateOutlet=\"main\" main/>\n          <ng-container *ngTemplateOutlet=\"next\" next/>\n        </frames-line-up>\n      }\n      @default {\n        <frames-overlay [hasNext]=\"isActivated()\">\n          <ng-container *ngTemplateOutlet=\"main\" main/>\n          <ng-container *ngTemplateOutlet=\"next\" next/>\n        </frames-overlay>\n      }\n    }\n    <ng-template #main><ng-content main /></ng-template>\n    <ng-template #next><router-outlet [name]=\"store.name()\"/></ng-template>\n  `,\n  styleUrls: ['./router-outlet.frame.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  hostDirectives: [\n    {\n      directive: RouterOutletFrameStore,\n      inputs: ['frame', 'name'],\n    },\n  ],\n})\nexport class RouterOutletFrame extends NgAtomicComponent {\n  protected store = inject(RouterOutletFrameStore);\n  readonly outlet = viewChild(RouterOutlet);\n  readonly isActivated = computedAsync(() => {\n    const outlet = this.outlet();\n    if (!outlet) return of(false);\n    return combineLatest([\n      outlet.activateEvents.pipe(startWith(null)), \n      outlet.deactivateEvents.pipe(startWith(null)),\n    ]).pipe(\n      map(() => this.store.isActivated()(outlet)),\n    )\n  })\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ng-atomic-components-frames-router-outlet.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/router-outlet/router-outlet.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/router-outlet/ng-atomic-components-frames-router-outlet.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Directive, EventEmitter, inject, Injectable, InjectionToken, input, Output, runInInjectionContext, Signal, signal, viewChild, WritableSignal } from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { OverlayFrame } from '@ng-atomic/components/frames/overlay';\nimport { LineUpFrame } from '@ng-atomic/components/frames/line-up';\nimport { CanActivateFn, CanDeactivateFn, PRIMARY_OUTLET, RouterOutlet, Routes } from '@angular/router';\nimport { Breakpoint } from '@ng-atomic/common/services/breakpoint';\nimport { makeConfig } from '@ng-atomic/common/services/ui';\nimport { InjectableComponent, NgAtomicComponent, _computed } from '@ng-atomic/core';\nimport { combineLatest, delay, distinctUntilChanged, map, of, startWith, switchMap, tap } from 'rxjs';\nimport { toObservable, toSignal } from '@angular/core/rxjs-interop';\n\n@Directive({standalone: true, selector: 'frames-router-outlet'})\nexport class RouterOutletFrameStore extends InjectableComponent {\n  static readonly Config = makeConfig(() => {\n    const getFrame = (breakpoint: Breakpoint) => {\n      switch(breakpoint) {\n        case 'xSmall': return 'overlay' as 'lineup' | 'overlay';\n        default: return 'lineup' as 'lineup' | 'overlay';\n      }\n    }\n    return (context) => {\n      return ({\n        frame: getFrame(context.breakpoint),\n        name: PRIMARY_OUTLET as string,\n        isActivated: (outlet: RouterOutlet) => !!outlet.isActivated,\n      });\n    }\n  }, ['components', 'frames', 'router-outlet']);\n\n  static provideSideAppConfig = (name: string = PRIMARY_OUTLET) => {\n    return RouterOutletFrameStore.Config.provide(() => (config) => ({\n      ...config,\n      name,\n      frame: 'overlay',\n    }));\n  }\n\n  static provideDefault() {\n    return [\n      RouterOutletFrameStore.Config.provide(),\n    ]\n  }\n\n  readonly config = RouterOutletFrameStore.Config.inject();\n  readonly frame = input(_computed(() => this.config().frame));\n  readonly name = input(_computed(() => this.config().name, { equal: (a, b) => a === b }));\n  readonly isActivated = input(_computed(() => this.config().isActivated));\n  readonly skip = input(false);\n} \n\n@Component({\n  selector: 'frames-router-outlet',\n  standalone: true,\n  imports: [\n    NgTemplateOutlet,\n    OverlayFrame,\n    LineUpFrame,\n    RouterOutlet,\n  ],\n  template: `\n    @switch (store.frame()) {\n      @case ('lineup') {\n        <frames-line-up [hasNext]=\"hasNext()\" [scope]=\"store.name()\">\n          @if (!store.skip()) {\n            <ng-container *ngTemplateOutlet=\"main\" main/>\n          }\n          <ng-container *ngTemplateOutlet=\"next\" next/>\n        </frames-line-up>\n      }\n      @default {\n        <frames-overlay [hasNext]=\"hasNext()\">\n          @if (!store.skip()) {\n            <ng-container *ngTemplateOutlet=\"main\" main/>\n          }\n          <ng-container *ngTemplateOutlet=\"next\" next/>\n        </frames-overlay>\n      }\n    }\n    <ng-template #main><ng-content main/></ng-template>\n    <ng-template #next><router-outlet [name]=\"store.name()\"/></ng-template>\n  `,\n  styleUrls: ['./router-outlet.frame.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  hostDirectives: [\n    {\n      directive: RouterOutletFrameStore,\n      inputs: ['frame', 'name', 'skip'],\n    },\n  ],\n})\nexport class RouterOutletFrame extends NgAtomicComponent {\n  protected store = inject(RouterOutletFrameStore);\n  @Output() readonly events = new EventEmitter<string>();\n  readonly outlet = viewChild(RouterOutlet);\n  readonly outlet$ = toObservable(this.outlet);\n  readonly activatedEvents$ = this.outlet$.pipe(\n    switchMap((outlet) => outlet.activateEvents),\n  );\n  readonly hasNext$ = this.outlet$.pipe(\n    switchMap((outlet) => combineLatest([\n      this.activatedEvents$.pipe(startWith(null)), \n      outlet.deactivateEvents.pipe(startWith(null)),\n    ]).pipe(\n      map(() => this.store.isActivated()(outlet)),\n      distinctUntilChanged(),\n    )),\n  );\n  readonly hasNext = toSignal(this.hasNext$);\n  readonly parent = inject(RouterOutletFrame, { optional: true, skipSelf: true });\n\n  constructor() {\n    super();\n    this.events.subscribe((event) => {\n      if (this.store.skip()) {\n        this.parent.events.emit(event);\n      }\n    });\n  }\n}\n\nfunction InjectableSignal<T>(name: string, defaultValue: T = null): InjectionToken<WritableSignal<T>> {\n  return new InjectionToken<Signal<T>>(name, {\n    providedIn: 'root',\n    factory: () => signal(defaultValue),\n  });\n}\n\nconst CURRENT_ROUTER_OUTLET = InjectableSignal<RouterOutletFrame>('CURRENT_ROUTER_OUTLET', null);\n\nexport const canDeactivateFn: CanDeactivateFn<NgAtomicComponent | undefined> = (component) => {\n\tconst current = inject(CURRENT_ROUTER_OUTLET);\n\tconst frame = component?.__injector ? runInInjectionContext(component?.__injector, () => {\n    return inject(RouterOutletFrame, { optional: true });\n  }) : null;\n\tif (frame) {\n\t\tcurrent.set(frame);\n\t\tframe.events.emit('deactivated');\n\t}\n  // MEMO(NozomuMiyamoto): RouterOutletFrameの幅を変更するアニメーションの最適化のために遅延させている。\n  return of(true).pipe(delay(0));\n}\n\nexport const canActivateFn: CanActivateFn = () => {\n\tconst current = inject(CURRENT_ROUTER_OUTLET);\n\tif (current()) {\n\t\tcurrent().events.emit('activated');\n\t}\n  // MEMO(NozomuMiyamoto): RouterOutletFrameの幅を変更するアニメーションの最適化のために遅延させている。\n\treturn of(true).pipe(delay(0))\n}\n\nexport function ngAtomicRoutes(routes: Routes): Routes {\n  return routes.map(route => {\n    return {\n      ...route,\n      canActivate: [canActivateFn, ...(route.canActivate || [])],\n      canDeactivate: [canDeactivateFn, ...(route.canDeactivate || [])],\n      data: { preload: true, ...route.data },\n      // loadChildren: route?.loadChildren ? async () => {\n      //   const module = await route?.loadChildren();\n      //   const routes: Routes = module['default'] || module['routes'] || [];\n      //   return ngAtomicRoutes(routes);\n      // } : undefined,\n    }\n  })\n}","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/ng-atomic-components-frames-scroll-v2.mjs

@@ -1,53 +1,6 @@
-import { CommonModule } from '@angular/common';
-import * as i0 from '@angular/core';
-import { Component, ChangeDetectionStrategy, ViewChild } from '@angular/core';
-
-class ScrollFrame {
-    isScrollBottom() {
-        const contents = this.contents.nativeElement;
-        return contents.scrollHeight - contents.scrollTop === contents.clientHeight;
-    }
-    scrollToBottom() {
-        this.contents.nativeElement.scrollTop = this.contents.nativeElement.scrollHeight;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: ScrollFrame, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.2", type: ScrollFrame, isStandalone: true, selector: "frames-scroll", viewQueries: [{ propertyName: "contents", first: true, predicate: ["contents"], descendants: true, static: true }], ngImport: i0, template: `
-  <div class="top">
-    <ng-content select=[top]></ng-content>
-  </div>
-  <div class="contents" #contents>
-    <ng-content></ng-content>
-    <!-- <ng-content select=[contents]></ng-content> -->
-  </div>
-  <div class="bottom">
-    <ng-content select=[bottom]></ng-content>
-  </div>
-  `, isInline: true, styles: [":host{--height: 100%;--height-SCOPED-IN-scroll-8NwH: var(--height);--top-height: 56px;--top-height-SCOPED-IN-scroll-8NwH: var(--top-height);--bottom-height: 56px;--bottom-height-SCOPED-IN-scroll-8NwH: var(--bottom-height);--contents-gap: 16px;--contents-gap-SCOPED-IN-scroll-8NwH: var(--contents-gap)}:host{display:flex;width:100%;flex-direction:column;justify-content:space-between;height:var(--height-SCOPED-IN-scroll-8NwH);overflow:hidden}:host .top{height:fit-content;transition:.5s height;touch-action:none}:host .contents{display:flex;flex:auto;flex-direction:column;gap:var(--contents-gap-SCOPED-IN-scroll-8NwH);transition:.5s height;overflow:scroll;box-sizing:border-box;-webkit-overflow-scrolling:touch}:host .contents::-webkit-scrollbar{display:none}:host .bottom{height:fit-content}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: ScrollFrame, decorators: [{
-            type: Component,
-            args: [{ selector: 'frames-scroll', standalone: true, imports: [
-                        CommonModule,
-                    ], template: `
-  <div class="top">
-    <ng-content select=[top]></ng-content>
-  </div>
-  <div class="contents" #contents>
-    <ng-content></ng-content>
-    <!-- <ng-content select=[contents]></ng-content> -->
-  </div>
-  <div class="bottom">
-    <ng-content select=[bottom]></ng-content>
-  </div>
-  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{--height: 100%;--height-SCOPED-IN-scroll-8NwH: var(--height);--top-height: 56px;--top-height-SCOPED-IN-scroll-8NwH: var(--top-height);--bottom-height: 56px;--bottom-height-SCOPED-IN-scroll-8NwH: var(--bottom-height);--contents-gap: 16px;--contents-gap-SCOPED-IN-scroll-8NwH: var(--contents-gap)}:host{display:flex;width:100%;flex-direction:column;justify-content:space-between;height:var(--height-SCOPED-IN-scroll-8NwH);overflow:hidden}:host .top{height:fit-content;transition:.5s height;touch-action:none}:host .contents{display:flex;flex:auto;flex-direction:column;gap:var(--contents-gap-SCOPED-IN-scroll-8NwH);transition:.5s height;overflow:scroll;box-sizing:border-box;-webkit-overflow-scrolling:touch}:host .contents::-webkit-scrollbar{display:none}:host .bottom{height:fit-content}\n"] }]
-        }], propDecorators: { contents: [{
-                type: ViewChild,
-                args: ['contents', { static: true }]
-            }] } });
+export * from '@ng-atomic/components/frames/scroll';
 
 /**
  * Generated bundle index. Do not edit.
  */
-
-export { ScrollFrame };
 //# sourceMappingURL=ng-atomic-components-frames-scroll-v2.mjs.map

package/fesm2022/ng-atomic-components-frames-scroll-v2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ng-atomic-components-frames-scroll-v2.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/scroll-v2/scroll.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/scroll-v2/ng-atomic-components-frames-scroll-v2.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, ElementRef, ViewChild } from '@angular/core';\n\n@Component({\n  selector: 'frames-scroll',\n  standalone: true,\n  imports: [\n    CommonModule,\n  ],\n  template: `\n  <div class=\"top\">\n    <ng-content select=[top]></ng-content>\n  </div>\n  <div class=\"contents\" #contents>\n    <ng-content></ng-content>\n    <!-- <ng-content select=[contents]></ng-content> -->\n  </div>\n  <div class=\"bottom\">\n    <ng-content select=[bottom]></ng-content>\n  </div>\n  `,\n  styleUrls: ['./scroll.frame.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScrollFrame {\n\n  @ViewChild('contents', {static: true})\n  protected contents: ElementRef<HTMLDivElement>;\n\n  isScrollBottom() {\n    const contents = this.contents.nativeElement;\n    return contents.scrollHeight - contents.scrollTop === contents.clientHeight;\n  }\n\n  scrollToBottom() {\n    this.contents.nativeElement.scrollTop = this.contents.nativeElement.scrollHeight;\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;MAwBa,WAAW,CAAA;IAKtB,cAAc,GAAA;AACZ,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC;QAC7C,OAAO,QAAQ,CAAC,YAAY,GAAG,QAAQ,CAAC,SAAS,KAAK,QAAQ,CAAC,YAAY,CAAC;KAC7E;IAED,cAAc,GAAA;AACZ,QAAA,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,YAAY,CAAC;KAClF;8GAZU,WAAW,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAX,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,WAAW,EAfZ,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,eAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,UAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA;;;;;;;;;;;AAWT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,6xBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAbC,YAAY,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;2FAiBH,WAAW,EAAA,UAAA,EAAA,CAAA;kBArBvB,SAAS;+BACE,eAAe,EAAA,UAAA,EACb,IAAI,EACP,OAAA,EAAA;wBACP,YAAY;qBACb,EACS,QAAA,EAAA,CAAA;;;;;;;;;;;GAWT,EAEgB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,6xBAAA,CAAA,EAAA,CAAA;8BAKrC,QAAQ,EAAA,CAAA;sBADjB,SAAS;AAAC,gBAAA,IAAA,EAAA,CAAA,UAAU,EAAE,EAAC,MAAM,EAAE,IAAI,EAAC,CAAA;;;AC1BvC;;AAEG;;;;"}
+{"version":3,"file":"ng-atomic-components-frames-scroll-v2.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/scroll-v2/ng-atomic-components-frames-scroll-v2.ts"],"sourcesContent":["/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;AAAA;;AAEG"}

package/fesm2022/ng-atomic-components-frames-scroll.mjs

@@ -1,31 +1,49 @@
 import { CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { Component, ChangeDetectionStrategy } from '@angular/core';
+import { Component, ChangeDetectionStrategy, ViewChild } from '@angular/core';
 
 class ScrollFrame {
+    isScrollBottom() {
+        const contents = this.contents.nativeElement;
+        return contents.scrollHeight - contents.scrollTop === contents.clientHeight;
+    }
+    scrollToBottom() {
+        this.contents.nativeElement.scrollTop = this.contents.nativeElement.scrollHeight;
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: ScrollFrame, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.2", type: ScrollFrame, isStandalone: true, selector: "frames-scroll", ngImport: i0, template: `
-  <div class="navigator">
-    <ng-content select=[navigator]></ng-content>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.2", type: ScrollFrame, isStandalone: true, selector: "frames-scroll", viewQueries: [{ propertyName: "contents", first: true, predicate: ["contents"], descendants: true, static: true }], ngImport: i0, template: `
+  <div class="top">
+    <ng-content select=[top]></ng-content>
   </div>
-  <div class="contents">
-    <ng-content select=[contents]></ng-content>
+  <div class="contents" #contents>
+    <ng-content></ng-content>
+    <!-- <ng-content select=[contents]></ng-content> -->
   </div>
-  `, isInline: true, styles: [":host{--height: 100%;--height-SCOPED-IN-scroll-B8aq: var(--height);--navigator-height: 56px;--navigator-height-SCOPED-IN-scroll-B8aq: var(--navigator-height)}:host{height:var(--height-SCOPED-IN-scroll-B8aq);overflow:hidden}:host .navigator{height:var(--navigator-height-SCOPED-IN-scroll-B8aq);transition:.5s height;overflow:hidden;touch-action:none}:host .contents{height:calc(var(--height-SCOPED-IN-scroll-B8aq) - var(--navigator-height-SCOPED-IN-scroll-B8aq));transition:.5s height;overflow:auto;-webkit-overflow-scrolling:touch}:host .contents::-webkit-scrollbar{display:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  <div class="bottom">
+    <ng-content select=[bottom]></ng-content>
+  </div>
+  `, isInline: true, styles: [":host{--height: 100%;--height-SCOPED-IN-scroll-9d2A: var(--height);--top-height: 56px;--top-height-SCOPED-IN-scroll-9d2A: var(--top-height);--bottom-height: 56px;--bottom-height-SCOPED-IN-scroll-9d2A: var(--bottom-height);--contents-gap: 16px;--contents-gap-SCOPED-IN-scroll-9d2A: var(--contents-gap)}:host{display:flex;width:100%;flex-direction:column;justify-content:space-between;height:var(--height-SCOPED-IN-scroll-9d2A);overflow:hidden}:host .top{height:fit-content;transition:.5s height;touch-action:none}:host .contents{display:flex;flex:auto;flex-direction:column;gap:var(--contents-gap-SCOPED-IN-scroll-9d2A);transition:.5s height;overflow:scroll;box-sizing:border-box;-webkit-overflow-scrolling:touch}:host .contents::-webkit-scrollbar{display:none}:host .bottom{height:fit-content}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: ScrollFrame, decorators: [{
             type: Component,
             args: [{ selector: 'frames-scroll', standalone: true, imports: [
                         CommonModule,
                     ], template: `
-  <div class="navigator">
-    <ng-content select=[navigator]></ng-content>
+  <div class="top">
+    <ng-content select=[top]></ng-content>
+  </div>
+  <div class="contents" #contents>
+    <ng-content></ng-content>
+    <!-- <ng-content select=[contents]></ng-content> -->
   </div>
-  <div class="contents">
-    <ng-content select=[contents]></ng-content>
+  <div class="bottom">
+    <ng-content select=[bottom]></ng-content>
   </div>
-  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{--height: 100%;--height-SCOPED-IN-scroll-B8aq: var(--height);--navigator-height: 56px;--navigator-height-SCOPED-IN-scroll-B8aq: var(--navigator-height)}:host{height:var(--height-SCOPED-IN-scroll-B8aq);overflow:hidden}:host .navigator{height:var(--navigator-height-SCOPED-IN-scroll-B8aq);transition:.5s height;overflow:hidden;touch-action:none}:host .contents{height:calc(var(--height-SCOPED-IN-scroll-B8aq) - var(--navigator-height-SCOPED-IN-scroll-B8aq));transition:.5s height;overflow:auto;-webkit-overflow-scrolling:touch}:host .contents::-webkit-scrollbar{display:none}\n"] }]
-        }] });
+  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{--height: 100%;--height-SCOPED-IN-scroll-9d2A: var(--height);--top-height: 56px;--top-height-SCOPED-IN-scroll-9d2A: var(--top-height);--bottom-height: 56px;--bottom-height-SCOPED-IN-scroll-9d2A: var(--bottom-height);--contents-gap: 16px;--contents-gap-SCOPED-IN-scroll-9d2A: var(--contents-gap)}:host{display:flex;width:100%;flex-direction:column;justify-content:space-between;height:var(--height-SCOPED-IN-scroll-9d2A);overflow:hidden}:host .top{height:fit-content;transition:.5s height;touch-action:none}:host .contents{display:flex;flex:auto;flex-direction:column;gap:var(--contents-gap-SCOPED-IN-scroll-9d2A);transition:.5s height;overflow:scroll;box-sizing:border-box;-webkit-overflow-scrolling:touch}:host .contents::-webkit-scrollbar{display:none}:host .bottom{height:fit-content}\n"] }]
+        }], propDecorators: { contents: [{
+                type: ViewChild,
+                args: ['contents', { static: true }]
+            }] } });
 
 /**
  * Generated bundle index. Do not edit.

package/fesm2022/ng-atomic-components-frames-scroll.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ng-atomic-components-frames-scroll.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/scroll/scroll.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/scroll/ng-atomic-components-frames-scroll.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n  selector: 'frames-scroll',\n  standalone: true,\n  imports: [\n    CommonModule,\n  ],\n  template: `\n  <div class=\"navigator\">\n    <ng-content select=[navigator]></ng-content>\n  </div>\n  <div class=\"contents\">\n    <ng-content select=[contents]></ng-content>\n  </div>\n  `,\n  styleUrls: ['./scroll.frame.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScrollFrame { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;MAoBa,WAAW,CAAA;8GAAX,WAAW,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAX,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,WAAW,EAXZ,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,eAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA;;;;;;;AAOT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,ukBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EATC,YAAY,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;2FAaH,WAAW,EAAA,UAAA,EAAA,CAAA;kBAjBvB,SAAS;+BACE,eAAe,EAAA,UAAA,EACb,IAAI,EACP,OAAA,EAAA;wBACP,YAAY;qBACb,EACS,QAAA,EAAA,CAAA;;;;;;;GAOT,EAEgB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,ukBAAA,CAAA,EAAA,CAAA;;;AClBjD;;AAEG;;;;"}
+{"version":3,"file":"ng-atomic-components-frames-scroll.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/scroll/scroll.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/scroll/ng-atomic-components-frames-scroll.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, ElementRef, ViewChild } from '@angular/core';\n\n@Component({\n  selector: 'frames-scroll',\n  standalone: true,\n  imports: [\n    CommonModule,\n  ],\n  template: `\n  <div class=\"top\">\n    <ng-content select=[top]></ng-content>\n  </div>\n  <div class=\"contents\" #contents>\n    <ng-content></ng-content>\n    <!-- <ng-content select=[contents]></ng-content> -->\n  </div>\n  <div class=\"bottom\">\n    <ng-content select=[bottom]></ng-content>\n  </div>\n  `,\n  styleUrls: ['./scroll.frame.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScrollFrame {\n\n  @ViewChild('contents', {static: true})\n  protected contents: ElementRef<HTMLDivElement>;\n\n  isScrollBottom() {\n    const contents = this.contents.nativeElement;\n    return contents.scrollHeight - contents.scrollTop === contents.clientHeight;\n  }\n\n  scrollToBottom() {\n    this.contents.nativeElement.scrollTop = this.contents.nativeElement.scrollHeight;\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;MAwBa,WAAW,CAAA;IAKtB,cAAc,GAAA;AACZ,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC;QAC7C,OAAO,QAAQ,CAAC,YAAY,GAAG,QAAQ,CAAC,SAAS,KAAK,QAAQ,CAAC,YAAY,CAAC;KAC7E;IAED,cAAc,GAAA;AACZ,QAAA,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,YAAY,CAAC;KAClF;8GAZU,WAAW,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAX,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,WAAW,EAfZ,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,eAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,UAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA;;;;;;;;;;;AAWT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,6xBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAbC,YAAY,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;2FAiBH,WAAW,EAAA,UAAA,EAAA,CAAA;kBArBvB,SAAS;+BACE,eAAe,EAAA,UAAA,EACb,IAAI,EACP,OAAA,EAAA;wBACP,YAAY;qBACb,EACS,QAAA,EAAA,CAAA;;;;;;;;;;;GAWT,EAEgB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,6xBAAA,CAAA,EAAA,CAAA;8BAKrC,QAAQ,EAAA,CAAA;sBADjB,SAAS;AAAC,gBAAA,IAAA,EAAA,CAAA,UAAU,EAAE,EAAC,MAAM,EAAE,IAAI,EAAC,CAAA;;;AC1BvC;;AAEG;;;;"}

package/fesm2022/ng-atomic-components-frames-side-app.mjs

@@ -0,0 +1,81 @@
+import * as i0 from '@angular/core';
+import { input, inject, Directive, Component } from '@angular/core';
+import { PRIMARY_OUTLET, RouterOutlet } from '@angular/router';
+import { InjectableComponent, provideEffect, NgAtomicComponent } from '@ng-atomic/core';
+import { RouterOutletFrameStore } from '@ng-atomic/components/frames/router-outlet';
+import { ColumnsPageStore } from '@ng-atomic/components/pages/columns';
+import { FormPageStore } from '@ng-atomic/components/pages/form';
+import { IndexPageStore } from '@ng-atomic/components/pages/_index';
+import { AppService } from '@ng-atomic/common/services/app';
+import { merge } from 'lodash-es';
+
+class SideAppFrameStore extends InjectableComponent {
+    constructor() {
+        super(...arguments);
+        this.name = input();
+    }
+    static route(route) {
+        return merge({
+            outlet: 'side',
+            component: SideAppFrame,
+            path: '',
+            providers: [
+                SideAppFrameStore.provideDefault(),
+            ]
+        }, route);
+    }
+    static provideDefault() {
+        return [
+            RouterOutletFrameStore.provideSideAppConfig(PRIMARY_OUTLET),
+            provideEffect([
+                ColumnsPageStore.ActionId.CLOSE,
+                FormPageStore.ActionId.CLOSE,
+                IndexPageStore.ActionId.CLOSE,
+            ], () => {
+                const app = inject(AppService);
+                return () => {
+                    app.sideApp.collapse();
+                };
+            }),
+        ];
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SideAppFrameStore, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.1.2", type: SideAppFrameStore, isStandalone: true, selector: "frames-side-app", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SideAppFrameStore, decorators: [{
+            type: Directive,
+            args: [{ standalone: true, selector: 'frames-side-app' }]
+        }] });
+class SideAppFrame extends NgAtomicComponent {
+    constructor() {
+        super(...arguments);
+        this.store = inject(SideAppFrameStore);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SideAppFrame, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.2", type: SideAppFrame, isStandalone: true, selector: "frames-side-app", providers: [], usesInheritance: true, hostDirectives: [{ directive: SideAppFrameStore, inputs: ["name", "name"] }], ngImport: i0, template: `<router-outlet />`, isInline: true, dependencies: [{ kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SideAppFrame, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    imports: [
+                        RouterOutlet,
+                    ],
+                    selector: 'frames-side-app',
+                    template: `<router-outlet />`,
+                    providers: [],
+                    hostDirectives: [
+                        {
+                            directive: SideAppFrameStore,
+                            inputs: ['name'],
+                        }
+                    ]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SideAppFrame, SideAppFrameStore };
+//# sourceMappingURL=ng-atomic-components-frames-side-app.mjs.map

package/fesm2022/ng-atomic-components-frames-side-app.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ng-atomic-components-frames-side-app.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/side-app/side-app.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/side-app/ng-atomic-components-frames-side-app.ts"],"sourcesContent":["import { Component, Directive, inject, input } from \"@angular/core\";\nimport { PRIMARY_OUTLET, Route, RouterOutlet } from \"@angular/router\";\nimport { InjectableComponent, NgAtomicComponent, provideEffect } from \"@ng-atomic/core\";\nimport { RouterOutletFrameStore } from \"@ng-atomic/components/frames/router-outlet\";\nimport { ColumnsPageStore } from \"@ng-atomic/components/pages/columns\";\nimport { FormPageStore } from \"@ng-atomic/components/pages/form\";\nimport { IndexPageStore } from \"@ng-atomic/components/pages/_index\";\nimport { AppService } from \"@ng-atomic/common/services/app\";\nimport { merge } from \"lodash-es\";\n\n@Directive({standalone: true, selector: 'frames-side-app'})\nexport class SideAppFrameStore extends InjectableComponent {\n  static route(route: Route) {\n    return merge({\n      outlet: 'side',\n      component: SideAppFrame,\n      path: '',\n      providers: [\n        SideAppFrameStore.provideDefault(),\n      ]\n    }, route);\n  }\n\n  static provideDefault() {\n    return [\n      RouterOutletFrameStore.provideSideAppConfig(PRIMARY_OUTLET),\n      provideEffect([\n        ColumnsPageStore.ActionId.CLOSE,\n        FormPageStore.ActionId.CLOSE,\n        IndexPageStore.ActionId.CLOSE,\n      ], () => {\n        const app = inject(AppService);\n        return () => {\n          app.sideApp.collapse();\n        };\n      }),\n    ]\n  }\n\n  readonly name = input<string>();\n}\n\n@Component({\n  standalone: true,\n  imports: [\n    RouterOutlet,\n  ],\n  selector: 'frames-side-app',\n  template: `<router-outlet />`,\n  providers: [\n  ],\n  hostDirectives: [\n    {\n      directive: SideAppFrameStore,\n      inputs: ['name'],\n    }\n  ]\n})\nexport class SideAppFrame extends NgAtomicComponent {\n  protected store = inject(SideAppFrameStore);\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}