@a.nemreen/dga-ui 0.3.2 → 0.3.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@a.nemreen/dga-ui",
-  "version": "0.3.2",
+  "version": "0.3.3",
   "description": "DGA Angular UI library — standalone forms, overlays, navigation, and portal shell with RTL-first Tailwind styling",
   "license": "MIT",
   "author": {

package/types/a.nemreen-dga-ui-header.d.ts

@@ -124,6 +124,12 @@ interface DgaHeaderNotificationsConfig {
     items?: DgaHeaderNotification[];
 }
 type DgaHeaderNotificationAction = 'read' | 'view' | 'dismiss' | 'select';
+/** Link row inside the login panel footer. */
+interface DgaHeaderLoginLink {
+    id?: string;
+    label: string;
+    href?: string;
+}
 /** Guest login form opened from the login action. */
 interface DgaHeaderLoginConfig {
     actionId?: string;
@@ -142,6 +148,45 @@ interface DgaHeaderLoginConfig {
     forgotPasswordHref?: string;
     showPasswordLabel?: string;
     hidePasswordLabel?: string;
+    /** Panel width CSS value. Default: `'24rem'`. */
+    panelWidth?: string;
+    /** Max inner scroll height. Default: `'44rem'`. */
+    maxHeight?: string;
+    /** Register prompt (e.g. "Don't have an account?"). */
+    registerPrompt?: string;
+    registerLabel?: string;
+    registerHref?: string;
+    /** Extra links below actions (help, SSO, etc.). */
+    footerLinks?: DgaHeaderLoginLink[];
+    /** Submit button label while loading. Default: `'…'`. */
+    submittingLabel?: string;
+    /** Form-level error shown above action buttons. */
+    errorMessage?: string;
+    emailRequiredMessage?: string;
+    emailInvalidMessage?: string;
+    passwordRequiredMessage?: string;
+    /** Show cancel button. Default: `true`. */
+    showCancel?: boolean;
+}
+/** Projected content after the login title, before fields. */
+declare class DgaHeaderLoginBeforeForm {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DgaHeaderLoginBeforeForm, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<DgaHeaderLoginBeforeForm, "[dgaHeaderLoginBeforeForm]", never, {}, {}, never, never, true, never>;
+}
+/** Projected content between fields and action buttons. */
+declare class DgaHeaderLoginAfterFields {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DgaHeaderLoginAfterFields, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<DgaHeaderLoginAfterFields, "[dgaHeaderLoginAfterFields]", never, {}, {}, never, never, true, never>;
+}
+/** Projected footer; overrides config register/footer links when present. */
+declare class DgaHeaderLoginFooter {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DgaHeaderLoginFooter, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<DgaHeaderLoginFooter, "[dgaHeaderLoginFooter]", never, {}, {}, never, never, true, never>;
+}
+/** Replaces the built-in email/password form; panel chrome remains. */
+declare class DgaHeaderLoginForm {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DgaHeaderLoginForm, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<DgaHeaderLoginForm, "[dgaHeaderLoginForm]", never, {}, {}, never, never, true, never>;
 }
 interface DgaHeaderUserMenuLink {
     id: string;
@@ -210,6 +255,10 @@ declare class DgaHeader {
     readonly user: _angular_core.InputSignal<DgaHeaderUserConfig | null>;
     /** Whether the user is signed in (two-way). */
     readonly authenticated: _angular_core.ModelSignal<boolean>;
+    /** Login submit loading state (two-way). Parent clears after API response. */
+    readonly loginSubmitting: _angular_core.ModelSignal<boolean>;
+    /** Form-level login error (two-way). Cleared when the panel closes. */
+    readonly loginError: _angular_core.ModelSignal<string>;
     readonly actionClick: _angular_core.OutputEmitterRef<DgaHeaderAction>;
     readonly searchSubmit: _angular_core.OutputEmitterRef<string>;
     readonly searchSuggestionSelect: _angular_core.OutputEmitterRef<DgaHeaderSearchSuggestion>;
@@ -237,9 +286,12 @@ declare class DgaHeader {
     readonly loginEmail: _angular_core.WritableSignal<string>;
     readonly loginPassword: _angular_core.WritableSignal<string>;
     readonly showLoginPassword: _angular_core.WritableSignal<boolean>;
-    readonly loginSubmitting: _angular_core.WritableSignal<boolean>;
+    readonly loginEmailError: _angular_core.WritableSignal<string>;
+    readonly loginPasswordError: _angular_core.WritableSignal<string>;
     /** Fixed coords for notifications / login / user panels (anchored to trigger). */
     readonly dropdownPanelStyle: _angular_core.WritableSignal<Record<string, string>>;
+    private readonly customLoginForm;
+    private readonly customLoginFooter;
     private readonly dismissedNotificationIds;
     private readonly readNotificationIds;
     private dropdownTrigger;
@@ -263,6 +315,8 @@ declare class DgaHeader {
     readonly loginConfig: _angular_core.Signal<DgaHeaderLoginConfig | null>;
     readonly loginActionId: _angular_core.Signal<string>;
     readonly userConfig: _angular_core.Signal<DgaHeaderUserConfig | null>;
+    readonly hasCustomLoginForm: _angular_core.Signal<boolean>;
+    readonly hasCustomLoginFooter: _angular_core.Signal<boolean>;
     readonly utilityOverlayOpen: _angular_core.Signal<boolean>;
     readonly visibleNotifications: _angular_core.Signal<{
         read: boolean;
@@ -337,6 +391,11 @@ declare class DgaHeader {
     closeLogin(): void;
     toggleUserMenu(trigger?: HTMLElement | null): void;
     closeUserMenu(): void;
+    onLoginEmailInput(value: string): void;
+    onLoginPasswordInput(value: string): void;
+    showLoginRegisterRow(lcfg: DgaHeaderLoginConfig): boolean;
+    loginPanelOuterStyle(): Record<string, string>;
+    loginPanelInnerStyle(): Record<string, string>;
     onLoginSubmit(event: Event): void;
     onUserLink(link: DgaHeaderUserMenuLink): void;
     toggleNotificationExpand(item: DgaHeaderNotification): void;
@@ -353,6 +412,7 @@ declare class DgaHeader {
     private requestDropdownSync;
     private clearDropdownAnchor;
     private findActionTrigger;
+    private activeUtilityPanelWidthPx;
     private syncDropdownPanel;
     onKey(event: KeyboardEvent): void;
     onScroll(): void;
@@ -360,8 +420,8 @@ declare class DgaHeader {
     onNavLinkClick(link: DgaNavLink | DgaNavItem, event: MouseEvent): void;
     onDocClick(event: MouseEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<DgaHeader, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DgaHeader, "dga-header", never, { "brand": { "alias": "brand"; "required": false; "isSignal": true; }; "brandSlogan": { "alias": "brandSlogan"; "required": false; "isSignal": true; }; "brandLogo": { "alias": "brandLogo"; "required": false; "isSignal": true; }; "brandLogoAlt": { "alias": "brandLogoAlt"; "required": false; "isSignal": true; }; "brandPlaceholder": { "alias": "brandPlaceholder"; "required": false; "isSignal": true; }; "brandHref": { "alias": "brandHref"; "required": false; "isSignal": true; }; "navLabel": { "alias": "navLabel"; "required": false; "isSignal": true; }; "menuToggleLabel": { "alias": "menuToggleLabel"; "required": false; "isSignal": true; }; "menuCloseLabel": { "alias": "menuCloseLabel"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "mobileNav": { "alias": "mobileNav"; "required": false; "isSignal": true; }; "sticky": { "alias": "sticky"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "actions": { "alias": "actions"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; "searchQuery": { "alias": "searchQuery"; "required": false; "isSignal": true; }; "notifications": { "alias": "notifications"; "required": false; "isSignal": true; }; "login": { "alias": "login"; "required": false; "isSignal": true; }; "user": { "alias": "user"; "required": false; "isSignal": true; }; "authenticated": { "alias": "authenticated"; "required": false; "isSignal": true; }; }, { "searchQuery": "searchQueryChange"; "authenticated": "authenticatedChange"; "actionClick": "actionClick"; "searchSubmit": "searchSubmit"; "searchSuggestionSelect": "searchSuggestionSelect"; "searchVoice": "searchVoice"; "notificationAction": "notificationAction"; "loginSubmit": "loginSubmit"; "logout": "logout"; "userLinkClick": "userLinkClick"; "navLinkClick": "navLinkClick"; }, never, ["[dgaHeaderBrand]", "*", "[dgaHeaderEnd]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DgaHeader, "dga-header", never, { "brand": { "alias": "brand"; "required": false; "isSignal": true; }; "brandSlogan": { "alias": "brandSlogan"; "required": false; "isSignal": true; }; "brandLogo": { "alias": "brandLogo"; "required": false; "isSignal": true; }; "brandLogoAlt": { "alias": "brandLogoAlt"; "required": false; "isSignal": true; }; "brandPlaceholder": { "alias": "brandPlaceholder"; "required": false; "isSignal": true; }; "brandHref": { "alias": "brandHref"; "required": false; "isSignal": true; }; "navLabel": { "alias": "navLabel"; "required": false; "isSignal": true; }; "menuToggleLabel": { "alias": "menuToggleLabel"; "required": false; "isSignal": true; }; "menuCloseLabel": { "alias": "menuCloseLabel"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "mobileNav": { "alias": "mobileNav"; "required": false; "isSignal": true; }; "sticky": { "alias": "sticky"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "actions": { "alias": "actions"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; "searchQuery": { "alias": "searchQuery"; "required": false; "isSignal": true; }; "notifications": { "alias": "notifications"; "required": false; "isSignal": true; }; "login": { "alias": "login"; "required": false; "isSignal": true; }; "user": { "alias": "user"; "required": false; "isSignal": true; }; "authenticated": { "alias": "authenticated"; "required": false; "isSignal": true; }; "loginSubmitting": { "alias": "loginSubmitting"; "required": false; "isSignal": true; }; "loginError": { "alias": "loginError"; "required": false; "isSignal": true; }; }, { "searchQuery": "searchQueryChange"; "authenticated": "authenticatedChange"; "loginSubmitting": "loginSubmittingChange"; "loginError": "loginErrorChange"; "actionClick": "actionClick"; "searchSubmit": "searchSubmit"; "searchSuggestionSelect": "searchSuggestionSelect"; "searchVoice": "searchVoice"; "notificationAction": "notificationAction"; "loginSubmit": "loginSubmit"; "logout": "logout"; "userLinkClick": "userLinkClick"; "navLinkClick": "navLinkClick"; }, ["customLoginForm", "customLoginFooter"], ["[dgaHeaderBrand]", "*", "[dgaHeaderEnd]", "[dgaHeaderLoginBeforeForm]", "[dgaHeaderLoginForm]", "[dgaHeaderLoginAfterFields]", "[dgaHeaderLoginFooter]"], true, never>;
 }
 
-export { DgaHeader };
-export type { DgaHeaderAction, DgaHeaderAppearance, DgaHeaderLoginConfig, DgaHeaderNotification, DgaHeaderNotificationAction, DgaHeaderNotificationTone, DgaHeaderNotificationsConfig, DgaHeaderSearchConfig, DgaHeaderSearchSuggestion, DgaHeaderUserConfig, DgaHeaderUserMenuLink, DgaMobileNavMode, DgaNavColumn, DgaNavDropdown, DgaNavDropdownLayout, DgaNavDropdownVariant, DgaNavFeatured, DgaNavItem, DgaNavLink };
+export { DgaHeader, DgaHeaderLoginAfterFields, DgaHeaderLoginBeforeForm, DgaHeaderLoginFooter, DgaHeaderLoginForm };
+export type { DgaHeaderAction, DgaHeaderAppearance, DgaHeaderLoginConfig, DgaHeaderLoginLink, DgaHeaderNotification, DgaHeaderNotificationAction, DgaHeaderNotificationTone, DgaHeaderNotificationsConfig, DgaHeaderSearchConfig, DgaHeaderSearchSuggestion, DgaHeaderUserConfig, DgaHeaderUserMenuLink, DgaMobileNavMode, DgaNavColumn, DgaNavDropdown, DgaNavDropdownLayout, DgaNavDropdownVariant, DgaNavFeatured, DgaNavItem, DgaNavLink };

package/types/a.nemreen-dga-ui.d.ts

@@ -513,6 +513,8 @@ declare class DgaSelect implements ControlValueAccessor {
     readonly disabled: _angular_core.Signal<boolean>;
     readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly valueChange: _angular_core.OutputEmitterRef<string | string[]>;
+    /** Emitted when the searchable query changes (remote lookup fields). */
+    readonly searchChange: _angular_core.OutputEmitterRef<string>;
     private onChange;
     private onTouched;
     readonly open: _angular_core.WritableSignal<boolean>;
@@ -552,7 +554,7 @@ declare class DgaSelect implements ControlValueAccessor {
     private firstEnabledIndex;
     private lastEnabledIndex;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<DgaSelect, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DgaSelect, "dga-select", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "valueInput": { "alias": "value"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "openMode": { "alias": "openMode"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "removeLabel": { "alias": "removeLabel"; "required": false; "isSignal": true; }; "clearLabel": { "alias": "clearLabel"; "required": false; "isSignal": true; }; "emptyLabel": { "alias": "emptyLabel"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "dgaInvalid"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DgaSelect, "dga-select", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "valueInput": { "alias": "value"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "openMode": { "alias": "openMode"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "removeLabel": { "alias": "removeLabel"; "required": false; "isSignal": true; }; "clearLabel": { "alias": "clearLabel"; "required": false; "isSignal": true; }; "emptyLabel": { "alias": "emptyLabel"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "dgaInvalid"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; "searchChange": "searchChange"; }, never, never, true, never>;
 }
 
 /**
@@ -686,6 +688,7 @@ declare class DgaChipInput implements ControlValueAccessor {
     readonly disabledInput: _angular_core.InputSignalWithTransform<boolean, unknown>;
     private readonly cvaDisabled;
     readonly disabled: _angular_core.Signal<boolean>;
+    readonly allowDuplicates: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly status: _angular_core.InputSignal<DgaFormStatus>;
     readonly valueChange: _angular_core.OutputEmitterRef<string[]>;
@@ -703,7 +706,7 @@ declare class DgaChipInput implements ControlValueAccessor {
     setDisabledState(isDisabled: boolean): void;
     private emitValue;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<DgaChipInput, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DgaChipInput, "dga-chip-input", never, { "valueInput": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "removeLabel": { "alias": "removeLabel"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "dgaInvalid"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DgaChipInput, "dga-chip-input", never, { "valueInput": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "removeLabel": { "alias": "removeLabel"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; "allowDuplicates": { "alias": "allowDuplicates"; "required": false; "isSignal": true; }; "invalid": { "alias": "dgaInvalid"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
 }
 
 interface DgaUploadFile {
@@ -3503,6 +3506,7 @@ declare class DgaCarousel {
     private pageScrollAmount;
     private scrollToPage;
     private isRtl;
+    private normalizedScrollLeft;
     onKeydown(event: KeyboardEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<DgaCarousel, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<DgaCarousel, "dga-carousel", never, { "slides": { "alias": "slides"; "required": false; "isSignal": true; }; "index": { "alias": "index"; "required": false; "isSignal": true; }; "slidesMax": { "alias": "slidesMax"; "required": false; "isSignal": true; }; "slidesMid": { "alias": "slidesMid"; "required": false; "isSignal": true; }; "slidesMin": { "alias": "slidesMin"; "required": false; "isSignal": true; }; "peek": { "alias": "peek"; "required": false; "isSignal": true; }; "gap": { "alias": "gap"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "prevLabel": { "alias": "prevLabel"; "required": false; "isSignal": true; }; "nextLabel": { "alias": "nextLabel"; "required": false; "isSignal": true; }; "dotsLabel": { "alias": "dotsLabel"; "required": false; "isSignal": true; }; "emptyLabel": { "alias": "emptyLabel"; "required": false; "isSignal": true; }; }, { "index": "indexChange"; }, ["projected"], ["*"], true, never>;