@coreui/vue-pro 5.14.0 → 5.16.0

package/dist/cjs/components/focus-trap/CFocusTrap.js

@@ -0,0 +1,254 @@
+'use strict';
+
+var vue = require('vue');
+var utils = require('./utils.js');
+
+const CFocusTrap = vue.defineComponent({
+    name: 'CFocusTrap',
+    props: {
+        /**
+         * Controls whether the focus trap is active or inactive.
+         * When `true`, focus will be trapped within the child element.
+         * When `false`, normal focus behavior is restored.
+         */
+        active: {
+            type: Boolean,
+            default: true,
+        },
+        /**
+         * Additional container elements to include in the focus trap.
+         * Useful for floating elements like tooltips or popovers that are
+         * rendered outside the main container but should be part of the trap.
+         */
+        additionalContainer: {
+            type: Object,
+            default: undefined,
+        },
+        /**
+         * Controls whether to focus the first selectable element or the container itself.
+         * When `true`, focuses the first tabbable element within the container.
+         * When `false`, focuses the container element directly.
+         *
+         * This is useful for containers that should receive focus themselves,
+         * such as scrollable regions or custom interactive components.
+         */
+        focusFirstElement: {
+            type: Boolean,
+            default: false,
+        },
+        /**
+         * Automatically restores focus to the previously focused element when the trap is deactivated.
+         * This is crucial for accessibility as it maintains the user's place in the document
+         * when returning from modal dialogs or overlay components.
+         *
+         * Recommended to be `true` for modal dialogs and popover components.
+         */
+        restoreFocus: {
+            type: Boolean,
+            default: true,
+        },
+    },
+    emits: {
+        /**
+         * Emitted when the focus trap becomes active.
+         * Useful for triggering additional accessibility announcements or analytics.
+         */
+        activate: () => true,
+        /**
+         * Emitted when the focus trap is deactivated.
+         * Can be used for cleanup, analytics, or triggering state changes.
+         */
+        deactivate: () => true,
+    },
+    setup(props, { emit, slots, expose }) {
+        const containerRef = vue.ref(null);
+        const prevFocusedRef = vue.ref(null);
+        const isActiveRef = vue.ref(false);
+        const lastTabNavDirectionRef = vue.ref('forward');
+        const tabEventSourceRef = vue.ref(null);
+        let handleKeyDown = null;
+        let handleFocusIn = null;
+        const activateTrap = () => {
+            const container = containerRef.value;
+            const additionalContainer = props.additionalContainer?.value || null;
+            if (!container) {
+                return;
+            }
+            prevFocusedRef.value = document.activeElement;
+            // Activating...
+            isActiveRef.value = true;
+            // Set initial focus
+            if (props.focusFirstElement) {
+                const elements = utils.focusableChildren(container);
+                if (elements.length > 0) {
+                    elements[0].focus({ preventScroll: true });
+                }
+                else {
+                    // Fallback to container if no focusable elements
+                    container.focus({ preventScroll: true });
+                }
+            }
+            else {
+                container.focus({ preventScroll: true });
+            }
+            emit('activate');
+            // Create event handlers
+            handleFocusIn = (event) => {
+                // Only handle focus events from tab navigation
+                if (containerRef.value !== tabEventSourceRef.value) {
+                    return;
+                }
+                const target = event.target;
+                // Allow focus within container
+                if (target === document || target === container || container.contains(target)) {
+                    return;
+                }
+                // Allow focus within additional elements
+                if (additionalContainer &&
+                    (target === additionalContainer || additionalContainer.contains(target))) {
+                    return;
+                }
+                // Focus escaped, bring it back
+                const elements = utils.focusableChildren(container);
+                if (elements.length === 0) {
+                    container.focus({ preventScroll: true });
+                }
+                else if (lastTabNavDirectionRef.value === 'backward') {
+                    elements.at(-1)?.focus({ preventScroll: true });
+                }
+                else {
+                    elements[0].focus({ preventScroll: true });
+                }
+            };
+            handleKeyDown = (event) => {
+                if (event.key !== 'Tab') {
+                    return;
+                }
+                tabEventSourceRef.value = container;
+                lastTabNavDirectionRef.value = event.shiftKey ? 'backward' : 'forward';
+                if (!additionalContainer) {
+                    return;
+                }
+                const containerElements = utils.focusableChildren(container);
+                const additionalElements = utils.focusableChildren(additionalContainer);
+                if (containerElements.length === 0 && additionalElements.length === 0) {
+                    // No focusable elements, prevent tab
+                    event.preventDefault();
+                    return;
+                }
+                const activeElement = document.activeElement;
+                const isInContainer = containerElements.includes(activeElement);
+                const isInAdditional = additionalElements.includes(activeElement);
+                // Handle tab navigation between container and additional elements
+                if (isInContainer) {
+                    const index = containerElements.indexOf(activeElement);
+                    if (!event.shiftKey &&
+                        index === containerElements.length - 1 &&
+                        additionalElements.length > 0) {
+                        // Tab forward from last container element to first additional element
+                        event.preventDefault();
+                        additionalElements[0].focus({ preventScroll: true });
+                    }
+                    else if (event.shiftKey && index === 0 && additionalElements.length > 0) {
+                        // Tab backward from first container element to last additional element
+                        event.preventDefault();
+                        additionalElements.at(-1)?.focus({ preventScroll: true });
+                    }
+                }
+                else if (isInAdditional) {
+                    const index = additionalElements.indexOf(activeElement);
+                    if (!event.shiftKey &&
+                        index === additionalElements.length - 1 &&
+                        containerElements.length > 0) {
+                        // Tab forward from last additional element to first container element
+                        event.preventDefault();
+                        containerElements[0].focus({ preventScroll: true });
+                    }
+                    else if (event.shiftKey && index === 0 && containerElements.length > 0) {
+                        // Tab backward from first additional element to last container element
+                        event.preventDefault();
+                        containerElements.at(-1)?.focus({ preventScroll: true });
+                    }
+                }
+            };
+            // Add event listeners
+            container.addEventListener('keydown', handleKeyDown, true);
+            if (additionalContainer) {
+                additionalContainer.addEventListener('keydown', handleKeyDown, true);
+            }
+            document.addEventListener('focusin', handleFocusIn, true);
+        };
+        const deactivateTrap = () => {
+            if (!isActiveRef.value) {
+                return;
+            }
+            // Cleanup event listeners
+            const container = containerRef.value;
+            const additionalContainer = props.additionalContainer?.value || null;
+            if (container && handleKeyDown) {
+                container.removeEventListener('keydown', handleKeyDown, true);
+            }
+            if (additionalContainer && handleKeyDown) {
+                additionalContainer.removeEventListener('keydown', handleKeyDown, true);
+            }
+            if (handleFocusIn) {
+                document.removeEventListener('focusin', handleFocusIn, true);
+            }
+            // Restore focus
+            if (props.restoreFocus && prevFocusedRef.value?.isConnected) {
+                prevFocusedRef.value.focus({ preventScroll: true });
+            }
+            emit('deactivate');
+            isActiveRef.value = false;
+            prevFocusedRef.value = null;
+        };
+        vue.watch(() => props.active, (newActive) => {
+            if (newActive && containerRef.value) {
+                activateTrap();
+            }
+            else {
+                deactivateTrap();
+            }
+        }, { immediate: false });
+        vue.watch(() => props.additionalContainer?.value, () => {
+            if (props.active && isActiveRef.value) {
+                // Reactivate to update event listeners
+                deactivateTrap();
+                activateTrap();
+            }
+        });
+        vue.onMounted(() => {
+            if (props.active && containerRef.value) {
+                activateTrap();
+            }
+        });
+        vue.onUnmounted(() => {
+            deactivateTrap();
+        });
+        // Expose containerRef for parent components
+        expose({
+            containerRef,
+        });
+        return () => {
+            const vnodes = slots.default?.();
+            const vnode = vnodes?.[0];
+            if (!vnode)
+                return null;
+            const originalRef = vnode.props?.ref;
+            return vue.cloneVNode(vnode, {
+                ref: (el) => {
+                    containerRef.value = el;
+                    if (typeof originalRef === 'function') {
+                        originalRef(el);
+                    }
+                    else if (originalRef && typeof originalRef === 'object' && 'value' in originalRef) {
+                        originalRef.value = el;
+                    }
+                },
+            });
+        };
+    },
+});
+
+exports.CFocusTrap = CFocusTrap;
+//# sourceMappingURL=CFocusTrap.js.map

package/dist/cjs/components/focus-trap/CFocusTrap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CFocusTrap.js","sources":["../../../../src/components/focus-trap/CFocusTrap.ts"],"sourcesContent":[null],"names":["defineComponent","ref","focusableChildren","watch","onMounted","onUnmounted","cloneVNode"],"mappings":"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"}

package/dist/cjs/components/focus-trap/index.d.ts

@@ -0,0 +1,6 @@
+import { App } from 'vue';
+import { CFocusTrap } from './CFocusTrap';
+declare const CFocusTrapPlugin: {
+    install: (app: App) => void;
+};
+export { CFocusTrapPlugin, CFocusTrap };

package/dist/cjs/components/focus-trap/index.js

@@ -0,0 +1,13 @@
+'use strict';
+
+var CFocusTrap = require('./CFocusTrap.js');
+
+const CFocusTrapPlugin = {
+    install: (app) => {
+        app.component(CFocusTrap.CFocusTrap.name, CFocusTrap.CFocusTrap);
+    },
+};
+
+exports.CFocusTrap = CFocusTrap.CFocusTrap;
+exports.CFocusTrapPlugin = CFocusTrapPlugin;
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/focus-trap/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/focus-trap/index.ts"],"sourcesContent":[null],"names":["CFocusTrap"],"mappings":";;;;AAGA,MAAM,gBAAgB,GAAG;AACvB,IAAA,OAAO,EAAE,CAAC,GAAQ,KAAU;QAC1B,GAAG,CAAC,SAAS,CAACA,qBAAU,CAAC,IAAc,EAAEA,qBAAU,CAAC;IACtD,CAAC;;;;;;"}

package/dist/cjs/components/focus-trap/utils.d.ts

@@ -0,0 +1,28 @@
+/**
+ * Gets all focusable child elements within a container.
+ * Uses a comprehensive selector to find elements that can receive focus.
+ * @param element - The container element to search within
+ * @returns Array of focusable HTML elements
+ */
+export declare const focusableChildren: (element: HTMLElement) => HTMLElement[];
+/**
+ * Checks if an element is disabled.
+ * Considers various ways an element can be disabled including CSS classes and attributes.
+ * @param element - The HTML element to check
+ * @returns True if the element is disabled, false otherwise
+ */
+export declare const isDisabled: (element: HTMLElement) => boolean;
+/**
+ * Type guard to check if an object is an Element.
+ * Handles edge cases including jQuery objects.
+ * @param object - The object to check
+ * @returns True if the object is an Element, false otherwise
+ */
+export declare const isElement: (object: unknown) => object is Element;
+/**
+ * Checks if an element is visible in the DOM.
+ * Considers client rects and computed visibility styles, handling edge cases like details elements.
+ * @param element - The HTML element to check for visibility
+ * @returns True if the element is visible, false otherwise
+ */
+export declare const isVisible: (element: HTMLElement) => boolean;

package/dist/cjs/components/focus-trap/utils.js

@@ -0,0 +1,83 @@
+'use strict';
+
+/**
+ * Gets all focusable child elements within a container.
+ * Uses a comprehensive selector to find elements that can receive focus.
+ * @param element - The container element to search within
+ * @returns Array of focusable HTML elements
+ */
+const focusableChildren = (element) => {
+    const focusableSelectors = [
+        'a[href]',
+        'button:not([disabled])',
+        'input:not([disabled])',
+        'textarea:not([disabled])',
+        'select:not([disabled])',
+        'details',
+        '[tabindex]:not([tabindex="-1"])',
+        '[contenteditable="true"]',
+    ].join(',');
+    const elements = [...element.querySelectorAll(focusableSelectors)];
+    return elements.filter((el) => !isDisabled(el) && isVisible(el));
+};
+/**
+ * Checks if an element is disabled.
+ * Considers various ways an element can be disabled including CSS classes and attributes.
+ * @param element - The HTML element to check
+ * @returns True if the element is disabled, false otherwise
+ */
+const isDisabled = (element) => {
+    if (!element || element.nodeType !== Node.ELEMENT_NODE) {
+        return true;
+    }
+    if (element.classList.contains('disabled')) {
+        return true;
+    }
+    if ('disabled' in element && typeof element.disabled === 'boolean') {
+        return element.disabled;
+    }
+    return element.hasAttribute('disabled') && element.getAttribute('disabled') !== 'false';
+};
+/**
+ * Type guard to check if an object is an Element.
+ * Handles edge cases including jQuery objects.
+ * @param object - The object to check
+ * @returns True if the object is an Element, false otherwise
+ */
+const isElement = (object) => {
+    if (!object || typeof object !== 'object') {
+        return false;
+    }
+    return 'nodeType' in object && typeof object.nodeType === 'number';
+};
+/**
+ * Checks if an element is visible in the DOM.
+ * Considers client rects and computed visibility styles, handling edge cases like details elements.
+ * @param element - The HTML element to check for visibility
+ * @returns True if the element is visible, false otherwise
+ */
+const isVisible = (element) => {
+    if (!isElement(element) || element.getClientRects().length === 0) {
+        return false;
+    }
+    const elementIsVisible = getComputedStyle(element).getPropertyValue('visibility') === 'visible';
+    // Handle `details` element as its content may falsely appear visible when it is closed
+    const closedDetails = element.closest('details:not([open])');
+    if (!closedDetails) {
+        return elementIsVisible;
+    }
+    if (closedDetails !== element) {
+        const summary = element.closest('summary');
+        // Check if summary is a direct child of the closed details
+        if (summary?.parentNode !== closedDetails) {
+            return false;
+        }
+    }
+    return elementIsVisible;
+};
+
+exports.focusableChildren = focusableChildren;
+exports.isDisabled = isDisabled;
+exports.isElement = isElement;
+exports.isVisible = isVisible;
+//# sourceMappingURL=utils.js.map

package/dist/cjs/components/focus-trap/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sources":["../../../../src/components/focus-trap/utils.ts"],"sourcesContent":[null],"names":[],"mappings":";;AAAA;;;;;AAKG;AACI,MAAM,iBAAiB,GAAG,CAAC,OAAoB,KAAmB;AACvE,IAAA,MAAM,kBAAkB,GAAG;QACzB,SAAS;QACT,wBAAwB;QACxB,uBAAuB;QACvB,0BAA0B;QAC1B,wBAAwB;QACxB,SAAS;QACT,iCAAiC;QACjC,0BAA0B;AAC3B,KAAA,CAAC,IAAI,CAAC,GAAG,CAAC;IAEX,MAAM,QAAQ,GAAG,CAAC,GAAG,OAAO,CAAC,gBAAgB,CAAc,kBAAkB,CAAC,CAAkB;IAEhG,OAAO,QAAQ,CAAC,MAAM,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,EAAE,CAAC,IAAI,SAAS,CAAC,EAAE,CAAC,CAAC;AAClE;AAEA;;;;;AAKG;AACI,MAAM,UAAU,GAAG,CAAC,OAAoB,KAAa;IAC1D,IAAI,CAAC,OAAO,IAAI,OAAO,CAAC,QAAQ,KAAK,IAAI,CAAC,YAAY,EAAE;AACtD,QAAA,OAAO,IAAI;IACb;IAEA,IAAI,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE;AAC1C,QAAA,OAAO,IAAI;IACb;IAEA,IAAI,UAAU,IAAI,OAAO,IAAI,OAAO,OAAO,CAAC,QAAQ,KAAK,SAAS,EAAE;QAClE,OAAO,OAAO,CAAC,QAAQ;IACzB;AAEA,IAAA,OAAO,OAAO,CAAC,YAAY,CAAC,UAAU,CAAC,IAAI,OAAO,CAAC,YAAY,CAAC,UAAU,CAAC,KAAK,OAAO;AACzF;AAEA;;;;;AAKG;AACI,MAAM,SAAS,GAAG,CAAC,MAAe,KAAuB;IAC9D,IAAI,CAAC,MAAM,IAAI,OAAO,MAAM,KAAK,QAAQ,EAAE;AACzC,QAAA,OAAO,KAAK;IACd;IAEA,OAAO,UAAU,IAAI,MAAM,IAAI,OAAO,MAAM,CAAC,QAAQ,KAAK,QAAQ;AACpE;AAEA;;;;;AAKG;AACI,MAAM,SAAS,GAAG,CAAC,OAAoB,KAAa;AACzD,IAAA,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,OAAO,CAAC,cAAc,EAAE,CAAC,MAAM,KAAK,CAAC,EAAE;AAChE,QAAA,OAAO,KAAK;IACd;AAEA,IAAA,MAAM,gBAAgB,GAAG,gBAAgB,CAAC,OAAO,CAAC,CAAC,gBAAgB,CAAC,YAAY,CAAC,KAAK,SAAS;;IAG/F,MAAM,aAAa,GAAG,OAAO,CAAC,OAAO,CAAC,qBAAqB,CAAC;IAE5D,IAAI,CAAC,aAAa,EAAE;AAClB,QAAA,OAAO,gBAAgB;IACzB;AAEA,IAAA,IAAI,aAAa,KAAK,OAAO,EAAE;QAC7B,MAAM,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC;;AAG1C,QAAA,IAAI,OAAO,EAAE,UAAU,KAAK,aAAa,EAAE;AACzC,YAAA,OAAO,KAAK;QACd;IACF;AAEA,IAAA,OAAO,gBAAgB;AACzB;;;;;;;"}

package/dist/cjs/components/index.d.ts

@@ -18,6 +18,7 @@ export * from './date-picker';
 export * from './date-range-picker';
 export * from './dropdown';
 export * from './element-cover';
+export * from './focus-trap';
 export * from './footer';
 export * from './form';
 export * from './grid';

package/dist/cjs/components/index.js

@@ -20,39 +20,40 @@ var index$g = require('./date-picker/index.js');
 var index$h = require('./date-range-picker/index.js');
 var index$i = require('./dropdown/index.js');
 var index$j = require('./element-cover/index.js');
-var index$k = require('./footer/index.js');
-var index$l = require('./form/index.js');
-var index$m = require('./grid/index.js');
-var index$n = require('./header/index.js');
-var index$o = require('./image/index.js');
-var index$p = require('./link/index.js');
-var index$q = require('./list-group/index.js');
-var index$r = require('./loading-button/index.js');
-var index$s = require('./modal/index.js');
-var index$t = require('./multi-select/index.js');
-var index$u = require('./nav/index.js');
-var index$v = require('./navbar/index.js');
-var index$w = require('./offcanvas/index.js');
-var index$x = require('./password-input/index.js');
-var index$y = require('./pagination/index.js');
-var index$z = require('./picker/index.js');
-var index$A = require('./placeholder/index.js');
-var index$B = require('./progress/index.js');
-var index$C = require('./popover/index.js');
-var index$D = require('./range-slider/index.js');
-var index$E = require('./rating/index.js');
-var index$F = require('./sidebar/index.js');
-var index$G = require('./smart-pagination/index.js');
-var index$H = require('./smart-table/index.js');
-var index$I = require('./spinner/index.js');
-var index$J = require('./stepper/index.js');
-var index$K = require('./table/index.js');
-var index$L = require('./tabs/index.js');
-var index$M = require('./time-picker/index.js');
-var index$N = require('./toast/index.js');
-var index$O = require('./tooltip/index.js');
-var index$P = require('./virtual-scroller/index.js');
-var index$Q = require('./widgets/index.js');
+var index$k = require('./focus-trap/index.js');
+var index$l = require('./footer/index.js');
+var index$m = require('./form/index.js');
+var index$n = require('./grid/index.js');
+var index$o = require('./header/index.js');
+var index$p = require('./image/index.js');
+var index$q = require('./link/index.js');
+var index$r = require('./list-group/index.js');
+var index$s = require('./loading-button/index.js');
+var index$t = require('./modal/index.js');
+var index$u = require('./multi-select/index.js');
+var index$v = require('./nav/index.js');
+var index$w = require('./navbar/index.js');
+var index$x = require('./offcanvas/index.js');
+var index$y = require('./password-input/index.js');
+var index$z = require('./pagination/index.js');
+var index$A = require('./picker/index.js');
+var index$B = require('./placeholder/index.js');
+var index$C = require('./progress/index.js');
+var index$D = require('./popover/index.js');
+var index$E = require('./range-slider/index.js');
+var index$F = require('./rating/index.js');
+var index$G = require('./sidebar/index.js');
+var index$H = require('./smart-pagination/index.js');
+var index$I = require('./smart-table/index.js');
+var index$J = require('./spinner/index.js');
+var index$K = require('./stepper/index.js');
+var index$L = require('./table/index.js');
+var index$M = require('./tabs/index.js');
+var index$N = require('./time-picker/index.js');
+var index$O = require('./toast/index.js');
+var index$P = require('./tooltip/index.js');
+var index$Q = require('./virtual-scroller/index.js');
+var index$R = require('./widgets/index.js');
 var CAccordion = require('./accordion/CAccordion.js');
 var CAccordionBody = require('./accordion/CAccordionBody.js');
 var CAccordionButton = require('./accordion/CAccordionButton.js');
@@ -98,6 +99,7 @@ var CDropdownDivider = require('./dropdown/CDropdownDivider.js');
 var CDropdownMenu = require('./dropdown/CDropdownMenu.js');
 var CDropdownToggle = require('./dropdown/CDropdownToggle.js');
 var CElementCover = require('./element-cover/CElementCover.js');
+var CFocusTrap = require('./focus-trap/CFocusTrap.js');
 var CFooter = require('./footer/CFooter.js');
 var CForm = require('./form/CForm.js');
 var CFormCheck = require('./form/CFormCheck.js');
@@ -219,39 +221,40 @@ exports.CDatePickerPlugin = index$g.CDatePickerPlugin;
 exports.CDateRangePickerPlugin = index$h.CDateRangePickerPlugin;
 exports.CDropdownPlugin = index$i.CDropdownPlugin;
 exports.CElementCoverPlugin = index$j.CElementCoverPlugin;
-exports.CFooterPlugin = index$k.CFooterPlugin;
-exports.CFormPlugin = index$l.CFormPlugin;
-exports.CGridPlugin = index$m.CGridPlugin;
-exports.CHeaderPlugin = index$n.CHeaderPlugin;
-exports.CImagePlugin = index$o.CImagePlugin;
-exports.CCLinkPlugin = index$p.CCLinkPlugin;
-exports.CListGroupPlugin = index$q.CListGroupPlugin;
-exports.CLoadingButtonPlugin = index$r.CLoadingButtonPlugin;
-exports.CModalPlugin = index$s.CModalPlugin;
-exports.CMultiSelectPlugin = index$t.CMultiSelectPlugin;
-exports.CNavPlugin = index$u.CNavPlugin;
-exports.CNavbarPlugin = index$v.CNavbarPlugin;
-exports.COffcanvasPlugin = index$w.COffcanvasPlugin;
-exports.CPasswordInputPlugin = index$x.CPasswordInputPlugin;
-exports.CPaginationPlugin = index$y.CPaginationPlugin;
-exports.CPickerPlugin = index$z.CPickerPlugin;
-exports.CPlaceholderPlugin = index$A.CPlaceholderPlugin;
-exports.CProgressPlugin = index$B.CProgressPlugin;
-exports.CPopoverPlugin = index$C.CPopoverPlugin;
-exports.CRangeSliderPlugin = index$D.CRangeSliderPlugin;
-exports.CRatingPlugin = index$E.CRatingPlugin;
-exports.CSidebarPlugin = index$F.CSidebarPlugin;
-exports.CSmartPaginationPlugin = index$G.CSmartPaginationPlugin;
-exports.CSmartTablePlugin = index$H.CSmartTablePlugin;
-exports.CSpinnerPlugin = index$I.CSpinnerPlugin;
-exports.CStepperPlugin = index$J.CStepperPlugin;
-exports.CTablePlugin = index$K.CTablePlugin;
-exports.CTabsPlugin = index$L.CTabsPlugin;
-exports.CTimePickerPlugin = index$M.CTimePickerPlugin;
-exports.CToastPlugin = index$N.CToastPlugin;
-exports.CTooltipPlugin = index$O.CTooltipPlugin;
-exports.CVirtualScrollerPlugin = index$P.CVirtualScrollerPlugin;
-exports.CWidgetsStatsPlugin = index$Q.CWidgetsStatsPlugin;
+exports.CFocusTrapPlugin = index$k.CFocusTrapPlugin;
+exports.CFooterPlugin = index$l.CFooterPlugin;
+exports.CFormPlugin = index$m.CFormPlugin;
+exports.CGridPlugin = index$n.CGridPlugin;
+exports.CHeaderPlugin = index$o.CHeaderPlugin;
+exports.CImagePlugin = index$p.CImagePlugin;
+exports.CCLinkPlugin = index$q.CCLinkPlugin;
+exports.CListGroupPlugin = index$r.CListGroupPlugin;
+exports.CLoadingButtonPlugin = index$s.CLoadingButtonPlugin;
+exports.CModalPlugin = index$t.CModalPlugin;
+exports.CMultiSelectPlugin = index$u.CMultiSelectPlugin;
+exports.CNavPlugin = index$v.CNavPlugin;
+exports.CNavbarPlugin = index$w.CNavbarPlugin;
+exports.COffcanvasPlugin = index$x.COffcanvasPlugin;
+exports.CPasswordInputPlugin = index$y.CPasswordInputPlugin;
+exports.CPaginationPlugin = index$z.CPaginationPlugin;
+exports.CPickerPlugin = index$A.CPickerPlugin;
+exports.CPlaceholderPlugin = index$B.CPlaceholderPlugin;
+exports.CProgressPlugin = index$C.CProgressPlugin;
+exports.CPopoverPlugin = index$D.CPopoverPlugin;
+exports.CRangeSliderPlugin = index$E.CRangeSliderPlugin;
+exports.CRatingPlugin = index$F.CRatingPlugin;
+exports.CSidebarPlugin = index$G.CSidebarPlugin;
+exports.CSmartPaginationPlugin = index$H.CSmartPaginationPlugin;
+exports.CSmartTablePlugin = index$I.CSmartTablePlugin;
+exports.CSpinnerPlugin = index$J.CSpinnerPlugin;
+exports.CStepperPlugin = index$K.CStepperPlugin;
+exports.CTablePlugin = index$L.CTablePlugin;
+exports.CTabsPlugin = index$M.CTabsPlugin;
+exports.CTimePickerPlugin = index$N.CTimePickerPlugin;
+exports.CToastPlugin = index$O.CToastPlugin;
+exports.CTooltipPlugin = index$P.CTooltipPlugin;
+exports.CVirtualScrollerPlugin = index$Q.CVirtualScrollerPlugin;
+exports.CWidgetsStatsPlugin = index$R.CWidgetsStatsPlugin;
 exports.CAccordion = CAccordion.CAccordion;
 exports.CAccordionBody = CAccordionBody.CAccordionBody;
 exports.CAccordionButton = CAccordionButton.CAccordionButton;
@@ -297,6 +300,7 @@ exports.CDropdownDivider = CDropdownDivider.CDropdownDivider;
 exports.CDropdownMenu = CDropdownMenu.CDropdownMenu;
 exports.CDropdownToggle = CDropdownToggle.CDropdownToggle;
 exports.CElementCover = CElementCover.CElementCover;
+exports.CFocusTrap = CFocusTrap.CFocusTrap;
 exports.CFooter = CFooter.CFooter;
 exports.CForm = CForm.CForm;
 exports.CFormCheck = CFormCheck.CFormCheck;

package/dist/cjs/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/components/modal/CModal.d.ts

@@ -10,7 +10,7 @@ declare const CModal: import("vue").DefineComponent<import("vue").ExtractPropTyp
         validator: (value: string) => boolean;
     };
     /**
-     * Apply a backdrop on body while offcanvas is open.
+     * Apply a backdrop on body while modal is open.
      *
      * @values boolean | 'static'
      */
@@ -110,7 +110,7 @@ declare const CModal: import("vue").DefineComponent<import("vue").ExtractPropTyp
         validator: (value: string) => boolean;
     };
     /**
-     * Apply a backdrop on body while offcanvas is open.
+     * Apply a backdrop on body while modal is open.
      *
      * @values boolean | 'static'
      */