@ojiepermana/angular 21.1.2 → 21.1.4

package/types/ojiepermana-angular-etos.d.ts

@@ -1 +1,73 @@
-export * from '@ojiepermana/angular/brand/etos';
+import * as _angular_core from '@angular/core';
+import { EnvironmentProviders } from '@angular/core';
+import { MaterialLayoutConfig } from '@ojiepermana/angular/layout';
+import { NavigationItem, TopbarAppearance, SidebarAppearance, SidebarPosition } from '@ojiepermana/angular/navigation';
+import { MaterialThemeConfig, MaterialThemeFeature } from '@ojiepermana/angular/theme';
+
+declare const ETOS_BRAND_NAME = "etos";
+declare const ETOS_THEME_CONFIG: {
+    mode: "light";
+    brand: "etos";
+};
+declare const ETOS_LAYOUT_CONFIG: {
+    mode: "vertical";
+    width: "fixed";
+};
+
+interface EtosBrandOptions {
+    readonly theme?: MaterialThemeConfig;
+    readonly layout?: MaterialLayoutConfig;
+    readonly navigation?: NavigationItem[];
+    readonly navigationId?: string;
+    readonly materialDefaults?: boolean;
+}
+declare function provideEtosTheme(config?: MaterialThemeConfig, ...features: MaterialThemeFeature[]): EnvironmentProviders;
+declare function provideEtosLayout(config?: MaterialLayoutConfig): EnvironmentProviders;
+declare function provideEtosBrand(options?: EtosBrandOptions): EnvironmentProviders;
+
+declare class EtosEmptyLayoutComponent {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EtosEmptyLayoutComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EtosEmptyLayoutComponent, "etos-empty-layout", never, {}, {}, never, never, true, never>;
+}
+
+declare class EtosHorizontalLayoutComponent {
+    private readonly layout;
+    readonly topbarAppearance: _angular_core.InputSignal<TopbarAppearance>;
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    protected readonly brandLayout = "etos-horizontal";
+    protected readonly layoutWidth: _angular_core.Signal<"fixed" | "full">;
+    protected readonly dividerBorderWidth: _angular_core.Signal<string>;
+    protected readonly hostClasses: _angular_core.Signal<string>;
+    protected readonly frameClasses: _angular_core.Signal<string>;
+    protected readonly mainClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EtosHorizontalLayoutComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EtosHorizontalLayoutComponent, "etos-horizontal-layout", never, { "topbarAppearance": { "alias": "topbarAppearance"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, never, ["[ui-layout-brand],[ui-topbar-start]", "[ui-layout-profile],[ui-topbar-end]"], true, never>;
+}
+
+declare class EtosLayoutComponent {
+    private readonly layout;
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    protected readonly layoutMode: _angular_core.Signal<"vertical" | "horizontal">;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EtosLayoutComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EtosLayoutComponent, "etos-layout", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, never, ["[ui-layout-brand],[ui-topbar-start]", "[ui-layout-profile],[ui-topbar-end]"], true, never>;
+}
+
+declare class EtosVerticalLayoutComponent {
+    private readonly layout;
+    readonly sidebarAppearance: _angular_core.InputSignal<SidebarAppearance>;
+    readonly sidebarPosition: _angular_core.InputSignal<SidebarPosition>;
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    protected readonly brandLayout = "etos-vertical";
+    protected readonly layoutWidth: _angular_core.Signal<"fixed" | "full">;
+    protected readonly dividerBorderWidth: _angular_core.Signal<string>;
+    protected readonly hostClasses: _angular_core.Signal<string>;
+    protected readonly frameClasses: _angular_core.Signal<string>;
+    protected readonly mainClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EtosVerticalLayoutComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EtosVerticalLayoutComponent, "etos-vertical-layout", never, { "sidebarAppearance": { "alias": "sidebarAppearance"; "required": false; "isSignal": true; }; "sidebarPosition": { "alias": "sidebarPosition"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+declare const ETOS_BRAND_VERSION = "0.0.1";
+
+export { ETOS_BRAND_NAME, ETOS_BRAND_VERSION, ETOS_LAYOUT_CONFIG, ETOS_THEME_CONFIG, EtosEmptyLayoutComponent, EtosHorizontalLayoutComponent, EtosLayoutComponent, EtosVerticalLayoutComponent, provideEtosBrand, provideEtosLayout, provideEtosTheme };
+export type { EtosBrandOptions };

package/brand/etos/package.json

@@ -1,4 +0,0 @@
-{
-  "module": "../../fesm2022/ojiepermana-angular-brand-etos.mjs",
-  "typings": "../../types/ojiepermana-angular-brand-etos.d.ts"
-}

package/brand/etos/styles/color.css

@@ -1,21 +0,0 @@
-/**
- * Etos brand color layer.
- */
-@layer tokens {
-  [theme-brand='etos'] {
-    --primary: 211 95% 29%;
-    --primary-foreground: 0 0% 100%;
-    --accent: 211 95% 96%;
-    --accent-foreground: 211 95% 22%;
-    --secondary: 211 24% 95%;
-    --secondary-foreground: 211 75% 24%;
-    --ring: 211 95% 29%;
-  }
-
-  [data-mode='dark'][theme-brand='etos'] {
-    --accent: 211 58% 18%;
-    --accent-foreground: 211 90% 84%;
-    --secondary: 211 24% 18%;
-    --secondary-foreground: 211 82% 84%;
-  }
-}

package/brand/etos/styles/index.css

@@ -1,15 +0,0 @@
-/**
- * @ojiepermana/angular/etos — complete Etos brand stylesheet.
- *
- * Import before Tailwind, then import the shared Tailwind token bridge.
- */
-@import '@ojiepermana/angular/theme/styles/themes/library/_layers.css';
-@import '@ojiepermana/angular/theme/styles/themes/mode/index.css';
-@import '@ojiepermana/angular/theme/styles/themes/library/color/index.css';
-@import '@ojiepermana/angular/theme/styles/themes/library/style/index.css';
-@import './color.css';
-@import './style.css';
-@import './layout.css';
-@import '@ojiepermana/angular/theme/styles/themes/library/_tokens.css';
-@import '@ojiepermana/angular/theme/styles/themes/library/_material-overrides.css';
-@import '@ojiepermana/angular/theme/styles/themes/library/_components.css';

package/brand/etos/styles/layout.css

@@ -1,175 +0,0 @@
-/**
- * Etos brand layout layer.
- */
-@layer tokens {
-  [theme-brand='etos'] {
-    --etos-layout-shell-padding: clamp(1rem, 2vw, 2rem);
-    --etos-layout-frame-radius: var(--radius-lg);
-    --etos-layout-frame-shadow: var(--shadow-sm);
-    --etos-layout-main-max-width: 80rem;
-    --etos-layout-empty-max-width: 24rem;
-    --etos-layout-empty-padding: clamp(1.5rem, 4vw, 3rem);
-    --etos-layout-topbar-inline: 0.875rem;
-    --etos-layout-brand-mark-size: 2rem;
-  }
-
-  [data-mode='dark'][theme-brand='etos'] {
-    --etos-layout-frame-shadow: 0 0 0 1px hsl(var(--border));
-  }
-}
-
-@layer components {
-  .etos-layout-host {
-    display: block;
-    height: 100dvh;
-    width: 100%;
-    overflow: hidden;
-    background: hsl(var(--background));
-    color: hsl(var(--foreground));
-  }
-
-  .etos-layout-host--fixed {
-    box-sizing: border-box;
-  }
-
-  .etos-layout-frame {
-    display: flex;
-    height: 100%;
-    width: 100%;
-    overflow: hidden;
-    background: hsl(var(--background));
-  }
-
-  .etos-layout-frame--horizontal {
-    flex-direction: column;
-  }
-
-  .etos-layout-main {
-    min-width: 0;
-    flex: 1 1 0%;
-    overflow: auto;
-  }
-
-  .etos-layout-main--fixed {
-    width: 100%;
-    max-width: var(--etos-layout-main-max-width);
-    margin-inline: auto;
-  }
-
-  .etos-layout-topbar {
-    width: 100%;
-    flex-shrink: 0;
-    border-bottom: var(--border-width) solid hsl(var(--border));
-  }
-
-  .etos-layout-topbar-slot {
-    display: flex;
-    min-width: 0;
-    align-items: center;
-  }
-
-  .etos-layout-topbar-slot--end {
-    justify-content: flex-end;
-  }
-
-  .etos-layout-empty-host {
-    display: flex;
-    min-height: 100dvh;
-    width: 100%;
-    align-items: center;
-    justify-content: center;
-    padding: var(--etos-layout-empty-padding);
-    background: hsl(var(--background));
-    color: hsl(var(--foreground));
-  }
-
-  .etos-layout-empty-main {
-    width: 100%;
-    max-width: var(--etos-layout-empty-max-width);
-  }
-
-  .etos-brand-link,
-  .etos-profile-trigger {
-    display: inline-flex;
-    align-items: center;
-    gap: 0.75rem;
-    min-height: 2.5rem;
-    padding: 0.375rem 0.5rem;
-    color: hsl(var(--foreground));
-    text-decoration: none;
-    transition:
-      color 160ms ease,
-      background-color 160ms ease;
-  }
-
-  .etos-brand-link:focus-visible,
-  .etos-profile-trigger:focus-visible {
-    outline: 2px solid hsl(var(--ring));
-    outline-offset: 2px;
-  }
-
-  .etos-brand-mark,
-  .etos-profile-mark {
-    display: inline-flex;
-    height: var(--etos-layout-brand-mark-size);
-    width: var(--etos-layout-brand-mark-size);
-    align-items: center;
-    justify-content: center;
-    border-radius: var(--radius-md);
-    background: hsl(var(--primary));
-    color: hsl(var(--primary-foreground));
-    font-size: 0.7rem;
-    font-weight: 700;
-    letter-spacing: 0.18em;
-    line-height: 1;
-  }
-
-  .etos-profile-mark {
-    border-radius: 999px;
-    letter-spacing: 0;
-  }
-
-  .etos-brand-copy {
-    display: none;
-    min-width: 0;
-    flex-direction: column;
-    gap: 0.125rem;
-  }
-
-  .etos-brand-name {
-    font-size: var(--text-sm);
-    font-weight: 700;
-    line-height: 1;
-  }
-
-  .etos-brand-subtitle,
-  .etos-profile-name {
-    font-size: var(--text-xs);
-    line-height: 1;
-    color: hsl(var(--muted-foreground));
-  }
-
-  .etos-profile-name {
-    display: none;
-    font-weight: 600;
-  }
-
-  @media (min-width: 40rem) {
-    .etos-brand-copy,
-    .etos-profile-name {
-      display: flex;
-    }
-  }
-
-  @media (min-width: 64rem) {
-    .etos-layout-host--fixed {
-      padding: var(--etos-layout-shell-padding);
-    }
-
-    .etos-layout-frame--fixed {
-      border: var(--border-width) solid hsl(var(--border));
-      border-radius: var(--etos-layout-frame-radius);
-      box-shadow: var(--etos-layout-frame-shadow);
-    }
-  }
-}

package/brand/etos/styles/style.css

@@ -1,51 +0,0 @@
-/**
- * Etos brand style layer.
- */
-@layer tokens {
-  [theme-brand='etos'] {
-    --theme-radius-base: 0.375rem;
-    --theme-radius-sm: calc(var(--theme-radius-base) - 2px);
-    --theme-radius-md: var(--theme-radius-base);
-    --theme-radius-lg: calc(var(--theme-radius-base) + 2px);
-
-    --radius: var(--theme-radius-base);
-    --radius-sm: var(--theme-radius-sm);
-    --radius-md: var(--theme-radius-md);
-    --radius-lg: var(--theme-radius-lg);
-
-    --border-width: 1px;
-
-    --theme-shadow-sm: 0 1px 0 0 hsl(211 95% 12% / 0.08);
-    --theme-shadow: 0 2px 4px -2px hsl(211 95% 12% / 0.14);
-    --theme-shadow-md: 0 8px 18px -14px hsl(211 95% 12% / 0.24);
-    --theme-shadow-lg: 0 18px 36px -28px hsl(211 95% 12% / 0.34);
-
-    --shadow-sm: var(--theme-shadow-sm);
-    --shadow: var(--theme-shadow);
-    --shadow-md: var(--theme-shadow-md);
-    --shadow-lg: var(--theme-shadow-lg);
-
-    --theme-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
-    --theme-font-mono: 'JetBrains Mono', 'Fira Code', monospace;
-
-    --font-sans: var(--theme-font-sans);
-    --font-mono: var(--theme-font-mono);
-    --font-weight-bold: 650;
-    --theme-text-scale: 1;
-    --nav-font-family: var(--font-sans);
-    --nav-text-size: var(--text-sm);
-    --nav-text-line-height: var(--text-sm--line-height);
-    --nav-heading-font-family: var(--font-sans);
-    --nav-heading-size: var(--text-xs);
-    --nav-heading-line-height: var(--text-xs--line-height);
-    --nav-heading-weight: 700;
-    --nav-heading-letter-spacing: 0.14em;
-    --nav-badge-font-family: var(--font-sans);
-    --nav-badge-size: var(--text-xs);
-    --nav-badge-line-height: var(--text-xs--line-height);
-    --nav-badge-weight: 600;
-    --letter-spacing: 0;
-    --space-unit: 0.25rem;
-    --layout-topbar-height: 3.25rem;
-  }
-}

package/fesm2022/ojiepermana-angular-brand-etos.mjs

@@ -1,285 +0,0 @@
-import * as i0 from '@angular/core';
-import { provideEnvironmentInitializer, inject, makeEnvironmentProviders, ChangeDetectionStrategy, Component, input, computed } from '@angular/core';
-import { provideMaterialLayout, LayoutService } from '@ojiepermana/angular/layout';
-import { NavigationService, DEFAULT_NAVIGATION_ID, TopbarComponent, SidebarComponent } from '@ojiepermana/angular/navigation';
-import { provideMaterialTheme, withMaterialDefaults } from '@ojiepermana/angular/theme';
-import { RouterOutlet } from '@angular/router';
-
-const ETOS_BRAND_NAME = 'etos';
-const ETOS_THEME_CONFIG = {
-    mode: 'light',
-    brand: ETOS_BRAND_NAME,
-};
-const ETOS_LAYOUT_CONFIG = {
-    mode: 'vertical',
-    width: 'fixed',
-};
-
-function provideEtosTheme(config = {}, ...features) {
-    return provideMaterialTheme({
-        ...ETOS_THEME_CONFIG,
-        ...config,
-        brand: ETOS_BRAND_NAME,
-        'theme-brand': ETOS_BRAND_NAME,
-    }, ...features);
-}
-function provideEtosLayout(config = {}) {
-    return provideMaterialLayout({
-        ...ETOS_LAYOUT_CONFIG,
-        ...config,
-    });
-}
-function provideEtosBrand(options = {}) {
-    const providers = [
-        provideEtosTheme(options.theme, ...(options.materialDefaults === false ? [] : [withMaterialDefaults()])),
-        provideEtosLayout(options.layout),
-    ];
-    const navigation = options.navigation;
-    if (navigation) {
-        providers.push(provideEnvironmentInitializer(() => {
-            inject(NavigationService).registerItems(options.navigationId ?? DEFAULT_NAVIGATION_ID, navigation);
-        }));
-    }
-    return makeEnvironmentProviders(providers);
-}
-
-class EtosEmptyLayoutComponent {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: EtosEmptyLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: EtosEmptyLayoutComponent, isStandalone: true, selector: "etos-empty-layout", host: { attributes: { "data-brand-layout": "etos-empty" }, classAttribute: "etos-layout-empty-host" }, ngImport: i0, template: `
-    <main class="etos-layout-empty-main">
-      <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.9", ngImport: i0, type: EtosEmptyLayoutComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'etos-empty-layout',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [RouterOutlet],
-                    host: {
-                        class: 'etos-layout-empty-host',
-                        'data-brand-layout': 'etos-empty',
-                    },
-                    template: `
-    <main class="etos-layout-empty-main">
-      <router-outlet />
-    </main>
-  `,
-                }]
-        }] });
-
-class EtosHorizontalLayoutComponent {
-    layout = inject(LayoutService);
-    topbarAppearance = input('default', ...(ngDevMode ? [{ debugName: "topbarAppearance" }] : /* istanbul ignore next */ []));
-    ariaLabel = input('Primary', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
-    brandLayout = 'etos-horizontal';
-    layoutWidth = this.layout.width;
-    dividerBorderWidth = computed(() => 'var(--border-width)', ...(ngDevMode ? [{ debugName: "dividerBorderWidth" }] : /* istanbul ignore next */ []));
-    hostClasses = computed(() => {
-        const classes = ['etos-layout-host', 'etos-layout-host--horizontal'];
-        if (this.layoutWidth() === 'fixed') {
-            classes.push('etos-layout-host--fixed');
-        }
-        return classes.join(' ');
-    }, ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
-    frameClasses = computed(() => {
-        const classes = ['etos-layout-frame', 'etos-layout-frame--horizontal'];
-        if (this.layoutWidth() === 'fixed') {
-            classes.push('etos-layout-frame--fixed');
-        }
-        return classes.join(' ');
-    }, ...(ngDevMode ? [{ debugName: "frameClasses" }] : /* istanbul ignore next */ []));
-    mainClasses = computed(() => {
-        const classes = ['etos-layout-main'];
-        if (this.layoutWidth() === 'fixed') {
-            classes.push('etos-layout-main--fixed');
-        }
-        return classes.join(' ');
-    }, ...(ngDevMode ? [{ debugName: "mainClasses" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: EtosHorizontalLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: EtosHorizontalLayoutComponent, isStandalone: true, selector: "etos-horizontal-layout", 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-brand-layout": "brandLayout", "attr.data-layout-width": "layoutWidth()" } }, ngImport: i0, template: `
-    <div [class]="frameClasses()">
-      <ui-topbar
-        class="etos-layout-topbar"
-        [appearance]="topbarAppearance()"
-        [ariaLabel]="ariaLabel()"
-        [style.border-bottom-width]="dividerBorderWidth()">
-        <div ui-topbar-start class="etos-layout-topbar-slot etos-layout-topbar-slot--start">
-          <ng-content select="[ui-layout-brand],[ui-topbar-start]" />
-        </div>
-        <div ui-topbar-end class="etos-layout-topbar-slot etos-layout-topbar-slot--end">
-          <ng-content select="[ui-layout-profile],[ui-topbar-end]" />
-        </div>
-      </ui-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: "ui-topbar", inputs: ["items", "navigationId", "appearance", "ariaLabel", "class", "autoRegister", "showHamburger", "hamburgerLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: EtosHorizontalLayoutComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'etos-horizontal-layout',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [RouterOutlet, TopbarComponent],
-                    host: {
-                        '[class]': 'hostClasses()',
-                        '[attr.data-brand-layout]': 'brandLayout',
-                        '[attr.data-layout-width]': 'layoutWidth()',
-                    },
-                    template: `
-    <div [class]="frameClasses()">
-      <ui-topbar
-        class="etos-layout-topbar"
-        [appearance]="topbarAppearance()"
-        [ariaLabel]="ariaLabel()"
-        [style.border-bottom-width]="dividerBorderWidth()">
-        <div ui-topbar-start class="etos-layout-topbar-slot etos-layout-topbar-slot--start">
-          <ng-content select="[ui-layout-brand],[ui-topbar-start]" />
-        </div>
-        <div ui-topbar-end class="etos-layout-topbar-slot etos-layout-topbar-slot--end">
-          <ng-content select="[ui-layout-profile],[ui-topbar-end]" />
-        </div>
-      </ui-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 }] }] } });
-
-class EtosVerticalLayoutComponent {
-    layout = inject(LayoutService);
-    sidebarAppearance = input('default', ...(ngDevMode ? [{ debugName: "sidebarAppearance" }] : /* istanbul ignore next */ []));
-    sidebarPosition = input('left', ...(ngDevMode ? [{ debugName: "sidebarPosition" }] : /* istanbul ignore next */ []));
-    ariaLabel = input('Primary', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
-    brandLayout = 'etos-vertical';
-    layoutWidth = this.layout.width;
-    dividerBorderWidth = computed(() => 'var(--border-width)', ...(ngDevMode ? [{ debugName: "dividerBorderWidth" }] : /* istanbul ignore next */ []));
-    hostClasses = computed(() => {
-        const classes = ['etos-layout-host', 'etos-layout-host--vertical'];
-        if (this.layoutWidth() === 'fixed') {
-            classes.push('etos-layout-host--fixed');
-        }
-        return classes.join(' ');
-    }, ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
-    frameClasses = computed(() => {
-        const classes = ['etos-layout-frame', 'etos-layout-frame--vertical'];
-        if (this.layoutWidth() === 'fixed') {
-            classes.push('etos-layout-frame--fixed');
-        }
-        return classes.join(' ');
-    }, ...(ngDevMode ? [{ debugName: "frameClasses" }] : /* istanbul ignore next */ []));
-    mainClasses = computed(() => {
-        const classes = ['etos-layout-main'];
-        if (this.layoutWidth() === 'fixed') {
-            classes.push('etos-layout-main--fixed');
-        }
-        return classes.join(' ');
-    }, ...(ngDevMode ? [{ debugName: "mainClasses" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: EtosVerticalLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.9", type: EtosVerticalLayoutComponent, isStandalone: true, selector: "etos-vertical-layout", inputs: { sidebarAppearance: { classPropertyName: "sidebarAppearance", publicName: "sidebarAppearance", isSignal: true, isRequired: false, transformFunction: null }, sidebarPosition: { classPropertyName: "sidebarPosition", publicName: "sidebarPosition", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()", "attr.data-brand-layout": "brandLayout", "attr.data-layout-width": "layoutWidth()" } }, ngImport: i0, template: `
-    <div [class]="frameClasses()">
-      <ui-sidebar
-        class="etos-layout-sidebar"
-        [appearance]="sidebarAppearance()"
-        [position]="sidebarPosition()"
-        [ariaLabel]="ariaLabel()"
-        [style.border-left-width]="dividerBorderWidth()"
-        [style.border-right-width]="dividerBorderWidth()" />
-      <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: "ui-sidebar", inputs: ["items", "navigationId", "appearance", "position", "ariaLabel", "header", "class", "autoMobile", "autoRegister"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: EtosVerticalLayoutComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'etos-vertical-layout',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [RouterOutlet, SidebarComponent],
-                    host: {
-                        '[class]': 'hostClasses()',
-                        '[attr.data-brand-layout]': 'brandLayout',
-                        '[attr.data-layout-width]': 'layoutWidth()',
-                    },
-                    template: `
-    <div [class]="frameClasses()">
-      <ui-sidebar
-        class="etos-layout-sidebar"
-        [appearance]="sidebarAppearance()"
-        [position]="sidebarPosition()"
-        [ariaLabel]="ariaLabel()"
-        [style.border-left-width]="dividerBorderWidth()"
-        [style.border-right-width]="dividerBorderWidth()" />
-      <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 }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
-
-class EtosLayoutComponent {
-    layout = inject(LayoutService);
-    ariaLabel = input('Primary', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
-    layoutMode = this.layout.mode;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: EtosLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: EtosLayoutComponent, isStandalone: true, selector: "etos-layout", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "contents" }, ngImport: i0, template: `
-    @switch (layoutMode()) {
-      @case ('horizontal') {
-        <etos-horizontal-layout [ariaLabel]="ariaLabel()">
-          <ng-content select="[ui-layout-brand],[ui-topbar-start]" />
-          <ng-content select="[ui-layout-profile],[ui-topbar-end]" />
-        </etos-horizontal-layout>
-      }
-      @default {
-        <etos-vertical-layout [ariaLabel]="ariaLabel()" />
-      }
-    }
-  `, isInline: true, dependencies: [{ kind: "component", type: EtosHorizontalLayoutComponent, selector: "etos-horizontal-layout", inputs: ["topbarAppearance", "ariaLabel"] }, { kind: "component", type: EtosVerticalLayoutComponent, selector: "etos-vertical-layout", inputs: ["sidebarAppearance", "sidebarPosition", "ariaLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: EtosLayoutComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'etos-layout',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [EtosHorizontalLayoutComponent, EtosVerticalLayoutComponent],
-                    host: {
-                        class: 'contents',
-                    },
-                    template: `
-    @switch (layoutMode()) {
-      @case ('horizontal') {
-        <etos-horizontal-layout [ariaLabel]="ariaLabel()">
-          <ng-content select="[ui-layout-brand],[ui-topbar-start]" />
-          <ng-content select="[ui-layout-profile],[ui-topbar-end]" />
-        </etos-horizontal-layout>
-      }
-      @default {
-        <etos-vertical-layout [ariaLabel]="ariaLabel()" />
-      }
-    }
-  `,
-                }]
-        }], propDecorators: { ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
-
-/*
- * Implementation surface for @ojiepermana/angular/etos
- *
- * Etos is a brand umbrella entrypoint. Etos-specific layout, theme,
- * navigation composition, and brand defaults live here while shared
- * primitives remain in @ojiepermana/angular/theme, /layout, and /navigation.
- */
-const ETOS_BRAND_VERSION = '0.0.1';
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { ETOS_BRAND_NAME, ETOS_BRAND_VERSION, ETOS_LAYOUT_CONFIG, ETOS_THEME_CONFIG, EtosEmptyLayoutComponent, EtosHorizontalLayoutComponent, EtosLayoutComponent, EtosVerticalLayoutComponent, provideEtosBrand, provideEtosLayout, provideEtosTheme };
-//# sourceMappingURL=ojiepermana-angular-brand-etos.mjs.map