@eagami/ui 3.2.0 → 3.2.1

package/README.md

@@ -96,6 +96,10 @@ Every brand-role pairing is checked against WCAG 2.1 AA at bootstrap; a contrast
 
 Built-in strings ship in English, French (France), Greek, Polish, and Spanish (Spain), with runtime switching via `EagamiI18nService`. See [internationalization](https://eagami.com/ui/i18n) for setup and per-string overrides.
 
+## Server-side rendering
+
+The library is SSR-safe and renders on the server (Angular Universal / `@angular/ssr`) without reaching for `window` or `document`. Browser-only work (focus management, the native `<dialog>`, overlay positioning, resize/intersection observers) is deferred to the client via `afterNextRender` and `isPlatformBrowser` guards, so prerendering, streaming SSR, and hydration work with no extra configuration.
+
 ## Framework integration
 
 `@eagami/ui` is Angular-only, but its design tokens are framework-agnostic. Copy-and-paste guides for non-Angular targets:
@@ -109,6 +113,7 @@ Built-in strings ship in English, French (France), Greek, Polish, and Spanish (S
 |---|---|
 | Angular | `^21.0.0` (peer dep) |
 | Node | `>= 20` for build/dev tooling |
+| Rendering | Browser, SSR / prerender (Angular Universal), hydration |
 | Browsers | Last 2 stable versions of Chrome, Edge, Firefox (plus current ESR), Safari |
 
 > **Upgrading from v0.x?** See [MIGRATION.md](MIGRATION.md).

package/fesm2022/eagami-ui.mjs

@@ -1,6 +1,6 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, makeEnvironmentProviders, provideEnvironmentInitializer, signal, inject, effect, computed, Injectable, input, ChangeDetectionStrategy, Component, HostBinding, Directive, model, output, Injector, DestroyRef, afterNextRender, viewChild, ElementRef, HostListener, forwardRef, Renderer2, untracked, ViewEncapsulation, contentChild, viewChildren } from '@angular/core';
-import { NgClass, NgComponentOutlet, NgTemplateOutlet } from '@angular/common';
+import { InjectionToken, makeEnvironmentProviders, provideEnvironmentInitializer, signal, inject, effect, computed, Injectable, input, ChangeDetectionStrategy, Component, HostBinding, Directive, model, output, Injector, DestroyRef, afterNextRender, viewChild, ElementRef, HostListener, forwardRef, Renderer2, untracked, ViewEncapsulation, contentChild, viewChildren, PLATFORM_ID } from '@angular/core';
+import { NgClass, NgComponentOutlet, NgTemplateOutlet, isPlatformBrowser } from '@angular/common';
 import { NgControl, NG_VALUE_ACCESSOR } from '@angular/forms';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 
@@ -7320,6 +7320,7 @@ class DialogComponent {
     dialogEl = viewChild('dialogEl', ...(ngDevMode ? [{ debugName: "dialogEl" }] : /* istanbul ignore next */ []));
     previouslyFocused = null;
     i18n = inject(EagamiI18nService);
+    isBrowser = isPlatformBrowser(inject(PLATFORM_ID));
     width = input('md', ...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
     closeOnBackdrop = input(true, ...(ngDevMode ? [{ debugName: "closeOnBackdrop" }] : /* istanbul ignore next */ []));
     closeOnEscape = input(true, ...(ngDevMode ? [{ debugName: "closeOnEscape" }] : /* istanbul ignore next */ []));
@@ -7337,10 +7338,13 @@ class DialogComponent {
     constructor() {
         effect(() => {
             const dialogRef = this.dialogEl()?.nativeElement;
-            if (!dialogRef) {
+            const open = this.open();
+            // `<dialog>` APIs and focus management are browser-only, but the effect
+            // still runs during SSR, so skip the DOM work on the server.
+            if (!dialogRef || !this.isBrowser) {
                 return;
             }
-            if (this.open()) {
+            if (open) {
                 if (!dialogRef.open) {
                     this.previouslyFocused = document.activeElement;
                     dialogRef.showModal();
@@ -7394,6 +7398,7 @@ class DrawerComponent {
     drawerEl = viewChild('drawerEl', ...(ngDevMode ? [{ debugName: "drawerEl" }] : /* istanbul ignore next */ []));
     previouslyFocused = null;
     i18n = inject(EagamiI18nService);
+    isBrowser = isPlatformBrowser(inject(PLATFORM_ID));
     position = input('right', ...(ngDevMode ? [{ debugName: "position" }] : /* istanbul ignore next */ []));
     width = input('md', ...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
     closeOnBackdrop = input(true, ...(ngDevMode ? [{ debugName: "closeOnBackdrop" }] : /* istanbul ignore next */ []));
@@ -7415,10 +7420,13 @@ class DrawerComponent {
     constructor() {
         effect(() => {
             const drawerRef = this.drawerEl()?.nativeElement;
-            if (!drawerRef) {
+            const open = this.open();
+            // `<dialog>` APIs and focus management are browser-only, but the effect
+            // still runs during SSR, so skip the DOM work on the server.
+            if (!drawerRef || !this.isBrowser) {
                 return;
             }
-            if (this.open()) {
+            if (open) {
                 if (!drawerRef.open) {
                     this.previouslyFocused = document.activeElement;
                     drawerRef.showModal();