@coreui/angular-pro 5.7.23 → 5.7.24

package/fesm2022/coreui-angular-pro.mjs

@@ -1647,7 +1647,7 @@ class MultiSelectOptionComponent {
     #multiSelectService = inject(MultiSelectService);
     /**
      * Option style
-     * @returns ('checkbox' | 'text')
+     * @returns 'checkbox' | 'text'
      * @default 'checkbox'
      */
     optionsStyleInput = input(undefined, { ...(ngDevMode ? { debugName: "optionsStyleInput" } : /* istanbul ignore next */ {}), alias: 'optionsStyle' });
@@ -1669,10 +1669,14 @@ class MultiSelectOptionComponent {
      * Option visible.
      * @returns boolean
      * @default true
+     * @ignore
      */
     set visible(value) {
         this.#visible.set(value);
     }
+    /**
+     * @ignore
+     */
     get visible() {
         return this.#visible();
     }
@@ -1729,12 +1733,22 @@ class MultiSelectOptionComponent {
     ...(ngDevMode ? [{ debugName: "#value" }] : /* istanbul ignore next */ []));
     #dropdownVisible = signal(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "#dropdownVisible" }] : /* istanbul ignore next */ []));
+    /**
+     * Marks the option as the active one for keyboard navigation. Reads back as `false`
+     * while the option is hidden or disabled.
+     * @returns boolean
+     * @default false
+     * @ignore
+     */
     set active(value) {
         const active = value && this.#visible() && !this.disabled;
         if (this.#active() !== active) {
             this.#active.set(active);
         }
     }
+    /**
+     * @ignore
+     */
     get active() {
         return this.#active() && this.#visible();
     }
@@ -1748,6 +1762,10 @@ class MultiSelectOptionComponent {
     ...(ngDevMode ? [{ debugName: "#active" }] : /* istanbul ignore next */ []));
     #focused = signal(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "#focused" }] : /* istanbul ignore next */ []));
+    /**
+     * Emits the option when it gains focus.
+     * @returns MultiSelectOptionComponent
+     */
     focusChange = output();
     hostClasses = computed(() => {
         const optionsStyle = this.optionsStyle();
@@ -5770,6 +5788,8 @@ class BackdropService {
     backdropClick$ = this.#backdropClick.asObservable();
     #document = inject(DOCUMENT);
     activeBackdrop;
+    #clearBackdropId;
+    #pendingBackdrop;
     get #scrollbarWidth() {
         // https://developer.mozilla.org/en-US/docs/Web/API/Window/innerWidth#usage_notes
         const documentWidth = this.#document.documentElement.clientWidth;
@@ -5778,6 +5798,7 @@ class BackdropService {
     }
     scrollbarWidth = this.#scrollbarWidth;
     setBackdrop(type = 'modal') {
+        this.#flushClearBackdrop();
         const backdropElement = this.#document.createElement('div');
         backdropElement.classList.add(`${type}-backdrop`);
         backdropElement.classList.add('fade');
@@ -5803,17 +5824,37 @@ class BackdropService {
                 delete backdropElement.__backdropClickHandler;
             }
             backdropElement.classList.remove('show');
-            setTimeout(() => {
+            this.#flushClearBackdrop();
+            this.#pendingBackdrop = backdropElement;
+            this.#clearBackdropId = setTimeout(() => {
+                this.#clearBackdropId = undefined;
+                this.#pendingBackdrop = undefined;
                 if (this.activeBackdrop === backdropElement) {
                     this.resetScrollbar();
+                    this.activeBackdrop = undefined;
                 }
-                if (backdropElement.parentElement === this.#document.body) {
-                    this.#document.body.removeChild(backdropElement);
-                }
+                this.#removeBackdrop(backdropElement);
             }, 300);
         }
         return undefined;
     }
+    #flushClearBackdrop() {
+        if (this.#clearBackdropId === undefined) {
+            return;
+        }
+        clearTimeout(this.#clearBackdropId);
+        this.#clearBackdropId = undefined;
+        const pending = this.#pendingBackdrop;
+        this.#pendingBackdrop = undefined;
+        if (pending) {
+            this.#removeBackdrop(pending);
+        }
+    }
+    #removeBackdrop(backdropElement) {
+        if (backdropElement.parentElement === this.#document.body) {
+            this.#document.body.removeChild(backdropElement);
+        }
+    }
     get #isRTL() {
         return [this.#document.documentElement.dir, this.#document.body.dir].includes('rtl');
     }
@@ -14223,6 +14264,12 @@ class OtpDirective {
     #otpService = inject(OtpService);
     focusable = signal(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "focusable" }] : /* istanbul ignore next */ []));
+    /**
+     * Placeholder for the slot. A string longer than one character is spread across the
+     * slots, one character each; when unset the parent component's placeholder is used.
+     * @returns string
+     * @default ''
+     */
     placeholderInput = input('', { ...(ngDevMode ? { debugName: "placeholderInput" } : /* istanbul ignore next */ {}), alias: 'placeholder' });
     placeholder = computed(() => {
         const placeholder = this.placeholderInput() || this.#otpService.placeholder();
@@ -14230,6 +14277,11 @@ class OtpDirective {
         return placeholder.length > 1 ? placeholder?.charAt(index) : placeholder;
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    /**
+     * Value of the slot, kept in sync with the input element.
+     * @returns string | number
+     * @default ''
+     */
     valueInput = input('', { ...(ngDevMode ? { debugName: "valueInput" } : /* istanbul ignore next */ {}), alias: 'value' });
     value = linkedSignal(this.valueInput, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
@@ -14238,6 +14290,12 @@ class OtpDirective {
         this.hostElement.nativeElement.value = String(value);
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "#valueEffect" }] : /* istanbul ignore next */ []));
+    /**
+     * Toggle the disabled state for the slot. Disabled slots are skipped when moving focus
+     * between them.
+     * @returns boolean
+     * @default false
+     */
     disabledInput = input(false, { ...(ngDevMode ? { debugName: "disabledInput" } : /* istanbul ignore next */ {}), transform: booleanAttribute, alias: 'disabled' });
     #disabled = linkedSignal(this.disabledInput, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "#disabled" }] : /* istanbul ignore next */ []));
@@ -19751,7 +19809,8 @@ class StepperStepComponent {
      * If true, the step can be modified by the user.
      * @returns boolean
      * @default true
-     * todo - implement editable functionality
+     * @ignore
+     * @todo implement editable functionality
      */
     editable = input(true, { ...(ngDevMode ? { debugName: "editable" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     /**
@@ -19759,7 +19818,8 @@ class StepperStepComponent {
      * If true, the step does not need to be completed for the overall process to succeed.
      * @returns boolean
      * @default false
-     * todo - implement optional functionality
+     * @ignore
+     * @todo implement optional functionality
      */
     optional = input(false, { ...(ngDevMode ? { debugName: "optional" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     /**