@ojiepermana/angular 21.3.4 → 22.0.27

package/fesm2022/ojiepermana-angular-layout-vertical.mjs

@@ -1,113 +0,0 @@
-import * as i0 from '@angular/core';
-import { inject, input, computed, ChangeDetectionStrategy, Component } from '@angular/core';
-import { RouterOutlet } from '@angular/router';
-import { LayoutService } from '@ojiepermana/angular/layout/services';
-import { SidebarComponent } from '@ojiepermana/angular/navigation/sidebar';
-import { ThemeService } from '@ojiepermana/angular/theme';
-
-/**
- * Vertical layout — sidebar + main (scrollable).
- *
- * Data navigasi diambil dari `NavigationService` (register via
- * `NavigationService.registerItems()` di bootstrap). Main memegang
- * `<router-outlet>` dan scroll jika konten panjang.
- *
- * Markup:
- * ```html
- * <vertical>
- *   <a ui-layout-brand>Brand</a>
- *   <button ui-layout-profile type="button">Profile</button>
- * </vertical>
- * ```
- */
-class VerticalLayoutComponent {
-    layout = inject(LayoutService);
-    theme = inject(ThemeService);
-    sidebarAppearance = input('default', ...(ngDevMode ? [{ debugName: "sidebarAppearance" }] : /* istanbul ignore next */ []));
-    sidebarPosition = input('left', ...(ngDevMode ? [{ debugName: "sidebarPosition" }] : /* istanbul ignore next */ []));
-    sidebarMode = input('side', ...(ngDevMode ? [{ debugName: "sidebarMode" }] : /* istanbul ignore next */ []));
-    ariaLabel = input('Primary', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
-    layoutWidth = this.layout.width;
-    themeStyle = this.theme.style;
-    isConstrainedWidth = computed(() => this.layoutWidth() !== 'full', ...(ngDevMode ? [{ debugName: "isConstrainedWidth" }] : /* istanbul ignore next */ []));
-    isWideWidth = computed(() => this.layoutWidth() === 'wide', ...(ngDevMode ? [{ debugName: "isWideWidth" }] : /* istanbul ignore next */ []));
-    shellBorderWidth = computed(() => (this.isConstrainedWidth() ? 'var(--border-width)' : null), ...(ngDevMode ? [{ debugName: "shellBorderWidth" }] : /* istanbul ignore next */ []));
-    hostClasses = computed(() => {
-        const classes = ['block', 'h-dvh', 'w-full', 'overflow-hidden', 'text-foreground'];
-        if (this.isConstrainedWidth()) {
-            classes.push('bg-primary/10', 'box-border', 'lg:p-8');
-        }
-        else {
-            classes.push('bg-background');
-        }
-        return classes.join(' ');
-    }, ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
-    frameClasses = computed(() => {
-        const classes = ['flex', 'h-full', 'w-full', 'overflow-hidden', 'bg-background'];
-        if (this.isConstrainedWidth()) {
-            classes.push('lg:mx-auto', this.isWideWidth() ? 'lg:max-w-[calc(17.5rem+96rem)]' : 'lg:max-w-[calc(17.5rem+80rem)]', 'lg:border', 'lg:border-primary/30', 'lg:rounded-lg', 'lg:shadow-sm');
-        }
-        return classes.join(' ');
-    }, ...(ngDevMode ? [{ debugName: "frameClasses" }] : /* istanbul ignore next */ []));
-    mainClasses = computed(() => {
-        const classes = ['min-w-0', 'flex-1', 'overflow-auto'];
-        if (this.layoutWidth() === 'container') {
-            classes.push('w-full', 'max-w-7xl');
-        }
-        else if (this.isWideWidth()) {
-            classes.push('w-full', 'max-w-screen-2xl');
-        }
-        return classes.join(' ');
-    }, ...(ngDevMode ? [{ debugName: "mainClasses" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: VerticalLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.14", type: VerticalLayoutComponent, isStandalone: true, selector: "vertical", inputs: { sidebarAppearance: { classPropertyName: "sidebarAppearance", publicName: "sidebarAppearance", isSignal: true, isRequired: false, transformFunction: null }, sidebarPosition: { classPropertyName: "sidebarPosition", publicName: "sidebarPosition", isSignal: true, isRequired: false, transformFunction: null }, sidebarMode: { classPropertyName: "sidebarMode", publicName: "sidebarMode", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()", "attr.data-layout-width": "layoutWidth()", "attr.data-style": "themeStyle()" } }, ngImport: i0, template: `
-    <div [class]="frameClasses()" [style.border-width]="shellBorderWidth()">
-      <sidebar [appearance]="sidebarAppearance()" [position]="sidebarPosition()" [ariaLabel]="ariaLabel()">
-        <div sidebar-header class="contents">
-          <ng-content select="[ui-layout-brand],[sidebar-header]" />
-        </div>
-        <div sidebar-footer class="contents">
-          <ng-content select="[ui-layout-profile],[sidebar-footer]" />
-        </div>
-      </sidebar>
-      <main [class]="mainClasses()">
-        <router-outlet />
-      </main>
-    </div>
-  `, isInline: true, dependencies: [{ kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: SidebarComponent, selector: "sidebar", inputs: ["items", "navigationId", "appearance", "borderSource", "position", "ariaLabel", "header", "class", "autoMobile", "autoRegister"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: VerticalLayoutComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'vertical',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [RouterOutlet, SidebarComponent],
-                    host: {
-                        '[class]': 'hostClasses()',
-                        '[attr.data-layout-width]': 'layoutWidth()',
-                        '[attr.data-style]': 'themeStyle()',
-                    },
-                    template: `
-    <div [class]="frameClasses()" [style.border-width]="shellBorderWidth()">
-      <sidebar [appearance]="sidebarAppearance()" [position]="sidebarPosition()" [ariaLabel]="ariaLabel()">
-        <div sidebar-header class="contents">
-          <ng-content select="[ui-layout-brand],[sidebar-header]" />
-        </div>
-        <div sidebar-footer class="contents">
-          <ng-content select="[ui-layout-profile],[sidebar-footer]" />
-        </div>
-      </sidebar>
-      <main [class]="mainClasses()">
-        <router-outlet />
-      </main>
-    </div>
-  `,
-                }]
-        }], propDecorators: { sidebarAppearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "sidebarAppearance", required: false }] }], sidebarPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "sidebarPosition", required: false }] }], sidebarMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "sidebarMode", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { VerticalLayoutComponent };
-//# sourceMappingURL=ojiepermana-angular-layout-vertical.mjs.map

package/fesm2022/ojiepermana-angular-layout-vertical.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"ojiepermana-angular-layout-vertical.mjs","sources":["../../../projects/angular/layout/vertical/src/lib/vertical.component.ts","../../../projects/angular/layout/vertical/ojiepermana-angular-layout-vertical.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, inject, input } from '@angular/core';\nimport { RouterOutlet } from '@angular/router';\nimport { LayoutService } from '@ojiepermana/angular/layout/services';\nimport { SidebarComponent } from '@ojiepermana/angular/navigation/sidebar';\nimport type { SidebarAppearance, SidebarMode, SidebarPosition } from '@ojiepermana/angular/navigation/types';\nimport { ThemeService } from '@ojiepermana/angular/theme';\n\n/**\n * Vertical layout — sidebar + main (scrollable).\n *\n * Data navigasi diambil dari `NavigationService` (register via\n * `NavigationService.registerItems()` di bootstrap). Main memegang\n * `<router-outlet>` dan scroll jika konten panjang.\n *\n * Markup:\n * ```html\n * <vertical>\n *   <a ui-layout-brand>Brand</a>\n *   <button ui-layout-profile type=\"button\">Profile</button>\n * </vertical>\n * ```\n */\n@Component({\n  selector: 'vertical',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [RouterOutlet, SidebarComponent],\n  host: {\n    '[class]': 'hostClasses()',\n    '[attr.data-layout-width]': 'layoutWidth()',\n    '[attr.data-style]': 'themeStyle()',\n  },\n  template: `\n    <div [class]=\"frameClasses()\" [style.border-width]=\"shellBorderWidth()\">\n      <sidebar [appearance]=\"sidebarAppearance()\" [position]=\"sidebarPosition()\" [ariaLabel]=\"ariaLabel()\">\n        <div sidebar-header class=\"contents\">\n          <ng-content select=\"[ui-layout-brand],[sidebar-header]\" />\n        </div>\n        <div sidebar-footer class=\"contents\">\n          <ng-content select=\"[ui-layout-profile],[sidebar-footer]\" />\n        </div>\n      </sidebar>\n      <main [class]=\"mainClasses()\">\n        <router-outlet />\n      </main>\n    </div>\n  `,\n})\nexport class VerticalLayoutComponent {\n  private readonly layout = inject(LayoutService);\n  private readonly theme = inject(ThemeService);\n\n  readonly sidebarAppearance = input<SidebarAppearance>('default');\n  readonly sidebarPosition = input<SidebarPosition>('left');\n  readonly sidebarMode = input<SidebarMode>('side');\n  readonly ariaLabel = input<string>('Primary');\n\n  protected readonly layoutWidth = this.layout.width;\n  protected readonly themeStyle = this.theme.style;\n  protected readonly isConstrainedWidth = computed(() => this.layoutWidth() !== 'full');\n  protected readonly isWideWidth = computed(() => this.layoutWidth() === 'wide');\n  protected readonly shellBorderWidth = computed(() => (this.isConstrainedWidth() ? 'var(--border-width)' : null));\n\n  protected readonly hostClasses = computed(() => {\n    const classes = ['block', 'h-dvh', 'w-full', 'overflow-hidden', 'text-foreground'];\n    if (this.isConstrainedWidth()) {\n      classes.push('bg-primary/10', 'box-border', 'lg:p-8');\n    } else {\n      classes.push('bg-background');\n    }\n    return classes.join(' ');\n  });\n\n  protected readonly frameClasses = computed(() => {\n    const classes = ['flex', 'h-full', 'w-full', 'overflow-hidden', 'bg-background'];\n    if (this.isConstrainedWidth()) {\n      classes.push(\n        'lg:mx-auto',\n        this.isWideWidth() ? 'lg:max-w-[calc(17.5rem+96rem)]' : 'lg:max-w-[calc(17.5rem+80rem)]',\n        'lg:border',\n        'lg:border-primary/30',\n        'lg:rounded-lg',\n        'lg:shadow-sm',\n      );\n    }\n    return classes.join(' ');\n  });\n\n  protected readonly mainClasses = computed(() => {\n    const classes = ['min-w-0', 'flex-1', 'overflow-auto'];\n    if (this.layoutWidth() === 'container') {\n      classes.push('w-full', 'max-w-7xl');\n    } else if (this.isWideWidth()) {\n      classes.push('w-full', 'max-w-screen-2xl');\n    }\n    return classes.join(' ');\n  });\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/ojiepermana-angular-layout.mjs

@@ -1,461 +0,0 @@
-import * as i0 from '@angular/core';
-import { inject, input, computed, ChangeDetectionStrategy, Component, makeEnvironmentProviders, provideEnvironmentInitializer, signal, effect, Injectable, InjectionToken, Directive } from '@angular/core';
-import { RouterOutlet } from '@angular/router';
-import { LayoutService as LayoutService$1 } from '@ojiepermana/angular/layout/services';
-import { SidebarComponent } from '@ojiepermana/angular/navigation/sidebar';
-import { ThemeService } from '@ojiepermana/angular/theme';
-import { TopbarComponent } from '@ojiepermana/angular/navigation/topbar';
-import { THEME_PANEL_LAYOUT_PORT } from '@ojiepermana/angular/layout/component';
-import { MATERIAL_LAYOUT_CONFIG as MATERIAL_LAYOUT_CONFIG$1, LAYOUT_WIDTHS as LAYOUT_WIDTHS$1, DEFAULT_MATERIAL_LAYOUT_CONFIG as DEFAULT_MATERIAL_LAYOUT_CONFIG$1, normalizeLayoutWidth as normalizeLayoutWidth$1, isLayoutMode as isLayoutMode$1 } from '@ojiepermana/angular/layout/token';
-import { DOCUMENT } from '@angular/common';
-import { POPOVER_TRIGGER_DEFAULTS } from '@ojiepermana/angular/component/popover';
-
-/**
- * Vertical layout — sidebar + main (scrollable).
- *
- * Data navigasi diambil dari `NavigationService` (register via
- * `NavigationService.registerItems()` di bootstrap). Main memegang
- * `<router-outlet>` dan scroll jika konten panjang.
- *
- * Markup:
- * ```html
- * <vertical>
- *   <a ui-layout-brand>Brand</a>
- *   <button ui-layout-profile type="button">Profile</button>
- * </vertical>
- * ```
- */
-class VerticalLayoutComponent {
-    layout = inject(LayoutService$1);
-    theme = inject(ThemeService);
-    sidebarAppearance = input('default', ...(ngDevMode ? [{ debugName: "sidebarAppearance" }] : /* istanbul ignore next */ []));
-    sidebarPosition = input('left', ...(ngDevMode ? [{ debugName: "sidebarPosition" }] : /* istanbul ignore next */ []));
-    sidebarMode = input('side', ...(ngDevMode ? [{ debugName: "sidebarMode" }] : /* istanbul ignore next */ []));
-    ariaLabel = input('Primary', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
-    layoutWidth = this.layout.width;
-    themeStyle = this.theme.style;
-    isConstrainedWidth = computed(() => this.layoutWidth() !== 'full', ...(ngDevMode ? [{ debugName: "isConstrainedWidth" }] : /* istanbul ignore next */ []));
-    isWideWidth = computed(() => this.layoutWidth() === 'wide', ...(ngDevMode ? [{ debugName: "isWideWidth" }] : /* istanbul ignore next */ []));
-    shellBorderWidth = computed(() => (this.isConstrainedWidth() ? 'var(--border-width)' : null), ...(ngDevMode ? [{ debugName: "shellBorderWidth" }] : /* istanbul ignore next */ []));
-    hostClasses = computed(() => {
-        const classes = ['block', 'h-dvh', 'w-full', 'overflow-hidden', 'text-foreground'];
-        if (this.isConstrainedWidth()) {
-            classes.push('bg-primary/10', 'box-border', 'lg:p-8');
-        }
-        else {
-            classes.push('bg-background');
-        }
-        return classes.join(' ');
-    }, ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
-    frameClasses = computed(() => {
-        const classes = ['flex', 'h-full', 'w-full', 'overflow-hidden', 'bg-background'];
-        if (this.isConstrainedWidth()) {
-            classes.push('lg:mx-auto', this.isWideWidth() ? 'lg:max-w-[calc(17.5rem+96rem)]' : 'lg:max-w-[calc(17.5rem+80rem)]', 'lg:border', 'lg:border-primary/30', 'lg:rounded-lg', 'lg:shadow-sm');
-        }
-        return classes.join(' ');
-    }, ...(ngDevMode ? [{ debugName: "frameClasses" }] : /* istanbul ignore next */ []));
-    mainClasses = computed(() => {
-        const classes = ['min-w-0', 'flex-1', 'overflow-auto'];
-        if (this.layoutWidth() === 'container') {
-            classes.push('w-full', 'max-w-7xl');
-        }
-        else if (this.isWideWidth()) {
-            classes.push('w-full', 'max-w-screen-2xl');
-        }
-        return classes.join(' ');
-    }, ...(ngDevMode ? [{ debugName: "mainClasses" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: VerticalLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.14", type: VerticalLayoutComponent, isStandalone: true, selector: "vertical", inputs: { sidebarAppearance: { classPropertyName: "sidebarAppearance", publicName: "sidebarAppearance", isSignal: true, isRequired: false, transformFunction: null }, sidebarPosition: { classPropertyName: "sidebarPosition", publicName: "sidebarPosition", isSignal: true, isRequired: false, transformFunction: null }, sidebarMode: { classPropertyName: "sidebarMode", publicName: "sidebarMode", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()", "attr.data-layout-width": "layoutWidth()", "attr.data-style": "themeStyle()" } }, ngImport: i0, template: `
-    <div [class]="frameClasses()" [style.border-width]="shellBorderWidth()">
-      <sidebar [appearance]="sidebarAppearance()" [position]="sidebarPosition()" [ariaLabel]="ariaLabel()">
-        <div sidebar-header class="contents">
-          <ng-content select="[ui-layout-brand],[sidebar-header]" />
-        </div>
-        <div sidebar-footer class="contents">
-          <ng-content select="[ui-layout-profile],[sidebar-footer]" />
-        </div>
-      </sidebar>
-      <main [class]="mainClasses()">
-        <router-outlet />
-      </main>
-    </div>
-  `, isInline: true, dependencies: [{ kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: SidebarComponent, selector: "sidebar", inputs: ["items", "navigationId", "appearance", "borderSource", "position", "ariaLabel", "header", "class", "autoMobile", "autoRegister"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: VerticalLayoutComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'vertical',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [RouterOutlet, SidebarComponent],
-                    host: {
-                        '[class]': 'hostClasses()',
-                        '[attr.data-layout-width]': 'layoutWidth()',
-                        '[attr.data-style]': 'themeStyle()',
-                    },
-                    template: `
-    <div [class]="frameClasses()" [style.border-width]="shellBorderWidth()">
-      <sidebar [appearance]="sidebarAppearance()" [position]="sidebarPosition()" [ariaLabel]="ariaLabel()">
-        <div sidebar-header class="contents">
-          <ng-content select="[ui-layout-brand],[sidebar-header]" />
-        </div>
-        <div sidebar-footer class="contents">
-          <ng-content select="[ui-layout-profile],[sidebar-footer]" />
-        </div>
-      </sidebar>
-      <main [class]="mainClasses()">
-        <router-outlet />
-      </main>
-    </div>
-  `,
-                }]
-        }], propDecorators: { sidebarAppearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "sidebarAppearance", required: false }] }], sidebarPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "sidebarPosition", required: false }] }], sidebarMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "sidebarMode", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
-
-/**
- * Horizontal layout — themed topbar + main (scrollable).
- *
- * Data navigasi diambil dari `NavigationService`.
- * Consumer app dapat memproyeksikan brand kiri dan profile kanan.
- *
- * Markup:
- * ```html
- * <horizontal>
- *   <a ui-layout-brand>Brand</a>
- *   <button ui-layout-profile type="button">Profile</button>
- * </horizontal>
- * ```
- */
-class HorizontalLayoutComponent {
-    layout = inject(LayoutService$1);
-    theme = inject(ThemeService);
-    topbarAppearance = input('default', ...(ngDevMode ? [{ debugName: "topbarAppearance" }] : /* istanbul ignore next */ []));
-    ariaLabel = input('Primary', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
-    layoutWidth = this.layout.width;
-    themeStyle = this.theme.style;
-    isConstrainedWidth = computed(() => this.layoutWidth() !== 'full', ...(ngDevMode ? [{ debugName: "isConstrainedWidth" }] : /* istanbul ignore next */ []));
-    isWideWidth = computed(() => this.layoutWidth() === 'wide', ...(ngDevMode ? [{ debugName: "isWideWidth" }] : /* istanbul ignore next */ []));
-    shellBorderWidth = computed(() => (this.isConstrainedWidth() ? 'var(--border-width)' : null), ...(ngDevMode ? [{ debugName: "shellBorderWidth" }] : /* istanbul ignore next */ []));
-    dividerBorderWidth = computed(() => 'var(--border-width)', ...(ngDevMode ? [{ debugName: "dividerBorderWidth" }] : /* istanbul ignore next */ []));
-    hostClasses = computed(() => {
-        const classes = ['block', 'h-dvh', 'w-full', 'overflow-hidden', 'text-foreground'];
-        if (this.isConstrainedWidth()) {
-            classes.push('bg-primary/10', 'box-border', 'lg:p-8');
-        }
-        else {
-            classes.push('bg-background');
-        }
-        return classes.join(' ');
-    }, ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
-    frameClasses = computed(() => {
-        const classes = ['flex', 'h-full', 'w-full', 'flex-col', 'overflow-hidden', 'bg-background'];
-        if (this.isConstrainedWidth()) {
-            classes.push('lg:border', 'lg:border-primary/30', 'lg:rounded-lg', 'lg:shadow-sm');
-        }
-        return classes.join(' ');
-    }, ...(ngDevMode ? [{ debugName: "frameClasses" }] : /* istanbul ignore next */ []));
-    mainClasses = computed(() => {
-        const classes = ['min-w-0', 'flex-1', 'overflow-auto'];
-        if (this.layoutWidth() === 'container') {
-            classes.push('mx-auto', 'w-full', 'max-w-7xl');
-        }
-        else if (this.isWideWidth()) {
-            classes.push('mx-auto', 'w-full', 'max-w-screen-2xl');
-        }
-        return classes.join(' ');
-    }, ...(ngDevMode ? [{ debugName: "mainClasses" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: HorizontalLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.14", type: HorizontalLayoutComponent, isStandalone: true, selector: "horizontal", inputs: { topbarAppearance: { classPropertyName: "topbarAppearance", publicName: "topbarAppearance", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()", "attr.data-layout-width": "layoutWidth()", "attr.data-style": "themeStyle()" } }, ngImport: i0, template: `
-    <div [class]="frameClasses()" [style.border-width]="shellBorderWidth()">
-      <topbar
-        class="w-full shrink-0 border-b border-border"
-        [style.border-bottom-width]="dividerBorderWidth()"
-        [appearance]="topbarAppearance()"
-        [ariaLabel]="ariaLabel()">
-        <div topbar-start class="flex min-w-0 items-center">
-          <ng-content select="[ui-layout-brand],[topbar-start]" />
-        </div>
-        <div topbar-end class="flex min-w-0 items-center">
-          <ng-content select="[ui-layout-profile],[topbar-end]" />
-        </div>
-      </topbar>
-      <main [class]="mainClasses()">
-        <router-outlet />
-      </main>
-    </div>
-  `, isInline: true, dependencies: [{ kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: TopbarComponent, selector: "topbar", inputs: ["items", "navigationId", "appearance", "ariaLabel", "class", "autoRegister", "showHamburger", "hamburgerLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: HorizontalLayoutComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'horizontal',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [RouterOutlet, TopbarComponent],
-                    host: {
-                        '[class]': 'hostClasses()',
-                        '[attr.data-layout-width]': 'layoutWidth()',
-                        '[attr.data-style]': 'themeStyle()',
-                    },
-                    template: `
-    <div [class]="frameClasses()" [style.border-width]="shellBorderWidth()">
-      <topbar
-        class="w-full shrink-0 border-b border-border"
-        [style.border-bottom-width]="dividerBorderWidth()"
-        [appearance]="topbarAppearance()"
-        [ariaLabel]="ariaLabel()">
-        <div topbar-start class="flex min-w-0 items-center">
-          <ng-content select="[ui-layout-brand],[topbar-start]" />
-        </div>
-        <div topbar-end class="flex min-w-0 items-center">
-          <ng-content select="[ui-layout-profile],[topbar-end]" />
-        </div>
-      </topbar>
-      <main [class]="mainClasses()">
-        <router-outlet />
-      </main>
-    </div>
-  `,
-                }]
-        }], propDecorators: { topbarAppearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "topbarAppearance", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
-
-/**
- * Empty layout — full-viewport, flex-centered main.
- *
- * Cocok untuk halaman login / error / onboarding (pola shadcn `login-05`).
- * Konten dirender lewat `<router-outlet>`; consumer men-style card / form
- * milik halaman route sendiri.
- *
- * Markup:
- * ```html
- * <empty>
- *   <!-- router-outlet dirender oleh komponen -->
- * </empty>
- * ```
- */
-class EmptyLayoutComponent {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: EmptyLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.14", type: EmptyLayoutComponent, isStandalone: true, selector: "empty", host: { classAttribute: "flex min-h-dvh w-full items-center justify-center bg-background p-6 text-foreground" }, ngImport: i0, template: `
-    <main class="w-full max-w-sm">
-      <router-outlet />
-    </main>
-  `, isInline: true, dependencies: [{ kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: EmptyLayoutComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'empty',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [RouterOutlet],
-                    host: {
-                        class: 'flex min-h-dvh w-full items-center justify-center bg-background p-6 text-foreground',
-                    },
-                    template: `
-    <main class="w-full max-w-sm">
-      <router-outlet />
-    </main>
-  `,
-                }]
-        }] });
-
-class ShellPagesComponent {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: ShellPagesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.14", type: ShellPagesComponent, isStandalone: true, selector: "shell-pages", host: { classAttribute: "block h-full min-h-0" }, ngImport: i0, template: `
-    <div class="flex h-full flex-col overflow-hidden">
-      <header class="flex h-12 min-w-0 shrink-0 items-center gap-2 border-b border-primary/30 px-2">
-        <ng-content select="[shell-pages-header]" />
-      </header>
-
-      <main class="min-h-0 flex-1 overflow-y-auto scrollbar-thin scrollbar-thumb-primary scrollbar-track-primary/10">
-        <ng-content select="[shell-pages-main]" />
-      </main>
-
-      <footer class="flex h-12 min-w-0 shrink-0 items-center gap-2 border-t border-primary/30 px-2">
-        <ng-content select="[shell-pages-footer]" />
-      </footer>
-    </div>
-  `, isInline: true, styles: ["footer:empty{display:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: ShellPagesComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'shell-pages', changeDetection: ChangeDetectionStrategy.OnPush, host: {
-                        class: 'block h-full min-h-0',
-                    }, template: `
-    <div class="flex h-full flex-col overflow-hidden">
-      <header class="flex h-12 min-w-0 shrink-0 items-center gap-2 border-b border-primary/30 px-2">
-        <ng-content select="[shell-pages-header]" />
-      </header>
-
-      <main class="min-h-0 flex-1 overflow-y-auto scrollbar-thin scrollbar-thumb-primary scrollbar-track-primary/10">
-        <ng-content select="[shell-pages-main]" />
-      </main>
-
-      <footer class="flex h-12 min-w-0 shrink-0 items-center gap-2 border-t border-primary/30 px-2">
-        <ng-content select="[shell-pages-footer]" />
-      </footer>
-    </div>
-  `, styles: ["footer:empty{display:none}\n"] }]
-        }] });
-
-function provideMaterialLayout(config = {}) {
-    return makeEnvironmentProviders([
-        { provide: MATERIAL_LAYOUT_CONFIG$1, useValue: config },
-        { provide: THEME_PANEL_LAYOUT_PORT, useExisting: LayoutService$1 },
-        provideEnvironmentInitializer(() => {
-            inject(LayoutService$1);
-        }),
-    ]);
-}
-
-class LayoutService {
-    document = inject(DOCUMENT);
-    config = this.resolveConfig();
-    _mode = signal(this.readPersistedMode() ?? this.config.defaultMode, ...(ngDevMode ? [{ debugName: "_mode" }] : /* istanbul ignore next */ []));
-    _width = signal(this.readPersistedWidth() ?? this.config.defaultWidth, ...(ngDevMode ? [{ debugName: "_width" }] : /* istanbul ignore next */ []));
-    mode = this._mode.asReadonly();
-    width = this._width.asReadonly();
-    constructor() {
-        effect(() => {
-            this.persistMode(this._mode());
-        });
-        effect(() => {
-            this.persistWidth(this._width());
-        });
-    }
-    setMode(mode) {
-        this._mode.set(mode);
-    }
-    toggleMode() {
-        this._mode.update((mode) => {
-            if (mode === 'vertical') {
-                return 'horizontal';
-            }
-            if (mode === 'horizontal') {
-                return 'vertical';
-            }
-            return 'vertical';
-        });
-    }
-    setWidth(width) {
-        this._width.set(width);
-    }
-    toggleWidth() {
-        this._width.update((width) => {
-            const currentIndex = LAYOUT_WIDTHS$1.indexOf(width);
-            return LAYOUT_WIDTHS$1[(currentIndex + 1) % LAYOUT_WIDTHS$1.length] ?? LAYOUT_WIDTHS$1[0];
-        });
-    }
-    resolveConfig() {
-        const config = inject(MATERIAL_LAYOUT_CONFIG$1, { optional: true }) ?? {};
-        const configuredMode = config.mode ?? config.defaultMode;
-        const configuredWidth = config.width;
-        return {
-            defaultMode: isLayoutMode$1(configuredMode) ? configuredMode : DEFAULT_MATERIAL_LAYOUT_CONFIG$1.defaultMode,
-            defaultWidth: normalizeLayoutWidth$1(configuredWidth) ?? DEFAULT_MATERIAL_LAYOUT_CONFIG$1.defaultWidth,
-            storageKey: config.storageKey ?? DEFAULT_MATERIAL_LAYOUT_CONFIG$1.storageKey,
-            widthStorageKey: config.widthStorageKey ?? DEFAULT_MATERIAL_LAYOUT_CONFIG$1.widthStorageKey,
-        };
-    }
-    readPersistedMode() {
-        const key = this.config.storageKey;
-        if (!key)
-            return null;
-        try {
-            const value = this.document.defaultView?.localStorage?.getItem(key);
-            return isLayoutMode$1(value) ? value : null;
-        }
-        catch {
-            return null;
-        }
-    }
-    readPersistedWidth() {
-        const key = this.config.widthStorageKey;
-        if (!key)
-            return null;
-        try {
-            const value = this.document.defaultView?.localStorage?.getItem(key);
-            return normalizeLayoutWidth$1(value);
-        }
-        catch {
-            return null;
-        }
-    }
-    persistMode(mode) {
-        const key = this.config.storageKey;
-        if (!key)
-            return;
-        try {
-            this.document.defaultView?.localStorage?.setItem(key, mode);
-        }
-        catch {
-            /* ignore */
-        }
-    }
-    persistWidth(width) {
-        const key = this.config.widthStorageKey;
-        if (!key)
-            return;
-        try {
-            this.document.defaultView?.localStorage?.setItem(key, width);
-        }
-        catch {
-            /* ignore */
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: LayoutService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: LayoutService, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: LayoutService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [] });
-
-const LAYOUT_MODES = ['vertical', 'horizontal', 'empty'];
-const LAYOUT_WIDTHS = ['full', 'container', 'wide'];
-const MATERIAL_LAYOUT_CONFIG = new InjectionToken('MATERIAL_LAYOUT_CONFIG');
-const DEFAULT_MATERIAL_LAYOUT_CONFIG = {
-    defaultMode: 'vertical',
-    defaultWidth: 'wide',
-    storageKey: 'layout-mode',
-    widthStorageKey: 'layout-width',
-};
-function isLayoutMode(value) {
-    return LAYOUT_MODES.some((mode) => mode === value);
-}
-function isLayoutWidth(value) {
-    return LAYOUT_WIDTHS.some((width) => width === value);
-}
-function normalizeLayoutWidth(value) {
-    if (isLayoutWidth(value)) {
-        return value;
-    }
-    if (value === 'fixed') {
-        return 'container';
-    }
-    return null;
-}
-
-class LayoutProfilePopoverDefaultsDirective {
-    layout = inject(LayoutService$1);
-    side = computed(() => (this.layout.mode() === 'horizontal' ? 'bottom' : 'right'), ...(ngDevMode ? [{ debugName: "side" }] : /* istanbul ignore next */ []));
-    align = computed(() => 'end', ...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
-    sideOffset = computed(() => (this.layout.mode() === 'horizontal' ? -20 : 12), ...(ngDevMode ? [{ debugName: "sideOffset" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: LayoutProfilePopoverDefaultsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.14", type: LayoutProfilePopoverDefaultsDirective, isStandalone: true, selector: "[ui-layout-profile][uiPopoverTrigger]", providers: [{ provide: POPOVER_TRIGGER_DEFAULTS, useExisting: LayoutProfilePopoverDefaultsDirective }], ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: LayoutProfilePopoverDefaultsDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[ui-layout-profile][uiPopoverTrigger]',
-                    providers: [{ provide: POPOVER_TRIGGER_DEFAULTS, useExisting: LayoutProfilePopoverDefaultsDirective }],
-                }]
-        }] });
-
-/*
- * Public API Surface of @ojiepermana/angular/layout
- */
-const LAYOUT_VERSION = '0.0.1';
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { DEFAULT_MATERIAL_LAYOUT_CONFIG, EmptyLayoutComponent, HorizontalLayoutComponent, LAYOUT_MODES, LAYOUT_VERSION, LAYOUT_WIDTHS, LayoutProfilePopoverDefaultsDirective, LayoutService, MATERIAL_LAYOUT_CONFIG, ShellPagesComponent, VerticalLayoutComponent, isLayoutMode, isLayoutWidth, normalizeLayoutWidth, provideMaterialLayout };
-//# sourceMappingURL=ojiepermana-angular-layout.mjs.map