@coreui/angular 5.7.19 → 5.7.20

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coreui/angular",
-  "version": "5.7.19",
+  "version": "5.7.20",
   "description": "CoreUI Components Library for Angular",
   "copyright": "Copyright 2026 creativeLabs Łukasz Holeczek",
   "license": "MIT",
@@ -30,7 +30,7 @@
     "@angular/core": "^22.1.0",
     "@angular/router": "^22.1.0",
     "@coreui/coreui": "^5.9.0",
-    "@coreui/icons-angular": "~5.7.19",
+    "@coreui/icons-angular": "~5.7.20",
     "rxjs": "^7.8.2"
   },
   "repository": {

package/types/coreui-angular.d.ts

@@ -8,6 +8,7 @@ import { FocusableOption, FocusOrigin } from '@angular/cdk/a11y';
 import * as _popperjs_core from '@popperjs/core';
 import { Placement, Options } from '@popperjs/core';
 import * as node_modules_rxjs_dist_types from 'node_modules/rxjs/dist/types';
+import { DomPortal, DomPortalOutlet } from '@angular/cdk/portal';
 import * as _coreui_angular from '@coreui/angular';
 import { AnimationEvent } from '@angular/animations';
 
@@ -2012,6 +2013,13 @@ declare class ModalComponent implements OnInit, OnDestroy, AfterViewInit {
      * @default true
      */
     readonly backdrop: _angular_core.InputSignal<boolean | "static">;
+    /**
+     * Appends the angular modal to a specific element. You can pass an HTML element or function that returns a single element. By default, `document.body`.
+     * @since 5.7.20
+     * @returns Element | (() => Element | null) | null
+     * @default document.body
+     */
+    readonly container: _angular_core.InputSignal<Element | (() => Element | null) | null>;
     /**
      * Set modal to cover the entire user viewport.
      * @returns {boolean | 'sm' | 'md' | 'lg' | 'xl' | 'xxl'}
@@ -2025,11 +2033,18 @@ declare class ModalComponent implements OnInit, OnDestroy, AfterViewInit {
      */
     readonly keyboard: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /**
-     * Html id attribute, required for programmatic visibility change.
+     * HTML id attribute, required for programmatic visibility change.
      * @returns string
      */
     readonly attrId: _angular_core.InputSignal<string | undefined>;
     get id(): string | undefined;
+    /**
+     * Generates modal using a portal
+     * @since 5.7.20
+     * @returns boolean
+     * @default false
+     */
+    readonly portal: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /**
      * Size the component small, large, or extra large.
      * @returns {'sm' | 'lg' | 'xl'}
@@ -2066,6 +2081,9 @@ declare class ModalComponent implements OnInit, OnDestroy, AfterViewInit {
      */
     readonly visibleInput: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly visible: _angular_core.WritableSignal<boolean>;
+    protected readonly domPortal: DomPortal<any>;
+    protected domPortalOutlet: DomPortalOutlet;
+    protected domPortalCleanup: () => void;
     /**
      * Event triggered on modal dismiss.
      * @returns boolean
@@ -2090,7 +2108,7 @@ declare class ModalComponent implements OnInit, OnDestroy, AfterViewInit {
     private setBodyStyles;
     private setStaticBackdrop;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ModalComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ModalComponent, "c-modal", ["cModal"], { "alignment": { "alias": "alignment"; "required": false; "isSignal": true; }; "backdrop": { "alias": "backdrop"; "required": false; "isSignal": true; }; "fullscreen": { "alias": "fullscreen"; "required": false; "isSignal": true; }; "keyboard": { "alias": "keyboard"; "required": false; "isSignal": true; }; "attrId": { "alias": "id"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "transition": { "alias": "transition"; "required": false; "isSignal": true; }; "role": { "alias": "role"; "required": false; "isSignal": true; }; "ariaModalInput": { "alias": "ariaModal"; "required": false; "isSignal": true; }; "scrollable": { "alias": "scrollable"; "required": false; "isSignal": true; }; "visibleInput": { "alias": "visible"; "required": false; "isSignal": true; }; }, { "visibleChange": "visibleChange"; }, never, ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ModalComponent, "c-modal", ["cModal"], { "alignment": { "alias": "alignment"; "required": false; "isSignal": true; }; "backdrop": { "alias": "backdrop"; "required": false; "isSignal": true; }; "container": { "alias": "container"; "required": false; "isSignal": true; }; "fullscreen": { "alias": "fullscreen"; "required": false; "isSignal": true; }; "keyboard": { "alias": "keyboard"; "required": false; "isSignal": true; }; "attrId": { "alias": "id"; "required": false; "isSignal": true; }; "portal": { "alias": "portal"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "transition": { "alias": "transition"; "required": false; "isSignal": true; }; "role": { "alias": "role"; "required": false; "isSignal": true; }; "ariaModalInput": { "alias": "ariaModal"; "required": false; "isSignal": true; }; "scrollable": { "alias": "scrollable"; "required": false; "isSignal": true; }; "visibleInput": { "alias": "visible"; "required": false; "isSignal": true; }; }, { "visibleChange": "visibleChange"; }, never, ["*"], true, never>;
 }
 
 interface IModalAction {