@kubit-ui-web/react-components 1.8.1 → 1.8.3

package/dist/esm/components/dataTable/dataTable.js

@@ -3,7 +3,7 @@ import * as React from 'react';
 import { STYLES_NAME } from '../../constants';
 import { useStylesV2 } from '../../hooks';
 import { DataTableStandAlone } from './dataTableStandAlone';
-import { useDataTableHasScroll, useDataTableShadow, useDataTableStickyColumns } from './hooks';
+import { useDataTableHasScroll, useDataTableShadow, useDataTableStickyDividers, useDataTableStickyLeftColumns, useDataTableStickyRightColumns, } from './hooks';
 const DataTableComponent = ({ variant, ctv, ...props }, ref) => {
     const styles = useStylesV2({
         styleName: STYLES_NAME.DATA_TABLE,
@@ -15,8 +15,12 @@ const DataTableComponent = ({ variant, ctv, ...props }, ref) => {
     React.useImperativeHandle(ref, () => innerRef.current, []);
     // Indicates if the data-table has scroll in order to add accesibility aria props
     const { hasScroll } = useDataTableHasScroll({ ref: innerRef });
-    // Set column sticky if data table has horizontal scroll
-    useDataTableStickyColumns({ ref: innerRef });
+    // Set column sticky right if data table has horizontal scroll
+    useDataTableStickyRightColumns({ ref: innerRef });
+    // Set column sticky left if data table has horizontal scroll
+    useDataTableStickyLeftColumns({ ref: innerRef });
+    // Set dividers sticky position and width if data table has horizontal scroll
+    useDataTableStickyDividers({ ref: innerRef });
     // Set shadow when scrolling
     useDataTableShadow({
         ref: innerRef,

package/dist/esm/components/dataTable/dataTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"dataTable.js","sourceRoot":"","sources":["../../../../src/components/dataTable/dataTable.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAEtC,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,qBAAqB,EAAE,kBAAkB,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAC;AAG/F,MAAM,kBAAkB,GAAG,CACzB,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,KAAK,EAAc,EACtC,GAAuC,EACvC,EAAE;IACF,MAAM,MAAM,GAAG,WAAW,CAA2B;QACnD,SAAS,EAAE,WAAW,CAAC,UAAU;QACjC,WAAW,EAAE,OAAO;QACpB,YAAY,EAAE,GAAG;QACjB,UAAU,EAAE,IAAI;KACjB,CAAC,CAAC;IAEH,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IACpD,KAAK,CAAC,mBAAmB,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,OAAyB,EAAE,EAAE,CAAC,CAAC;IAE7E,iFAAiF;IACjF,MAAM,EAAE,SAAS,EAAE,GAAG,qBAAqB,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,CAAC,CAAC;IAC/D,wDAAwD;IACxD,yBAAyB,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,CAAC,CAAC;IAC7C,4BAA4B;IAC5B,kBAAkB,CAAC;QACjB,GAAG,EAAE,QAAQ;QACb,aAAa,EAAE,MAAM,EAAE,aAAa;QACpC,aAAa,EAAE,MAAM,EAAE,aAAa;QACpC,cAAc,EAAE,MAAM,EAAE,cAAc;KACvC,CAAC,CAAC;IAEH,OAAO,KAAC,mBAAmB,IAAC,GAAG,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,KAAM,KAAK,GAAI,CAAC;AACjG,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC,kBAAkB,CAAC,CAAC"}
+{"version":3,"file":"dataTable.js","sourceRoot":"","sources":["../../../../src/components/dataTable/dataTable.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAEtC,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EACL,qBAAqB,EACrB,kBAAkB,EAClB,0BAA0B,EAC1B,6BAA6B,EAC7B,8BAA8B,GAC/B,MAAM,SAAS,CAAC;AAGjB,MAAM,kBAAkB,GAAG,CACzB,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,KAAK,EAAc,EACtC,GAAuC,EACvC,EAAE;IACF,MAAM,MAAM,GAAG,WAAW,CAA2B;QACnD,SAAS,EAAE,WAAW,CAAC,UAAU;QACjC,WAAW,EAAE,OAAO;QACpB,YAAY,EAAE,GAAG;QACjB,UAAU,EAAE,IAAI;KACjB,CAAC,CAAC;IAEH,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IACpD,KAAK,CAAC,mBAAmB,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,OAAyB,EAAE,EAAE,CAAC,CAAC;IAE7E,iFAAiF;IACjF,MAAM,EAAE,SAAS,EAAE,GAAG,qBAAqB,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,CAAC,CAAC;IAC/D,8DAA8D;IAC9D,8BAA8B,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,CAAC,CAAC;IAClD,6DAA6D;IAC7D,6BAA6B,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,CAAC,CAAC;IACjD,6EAA6E;IAC7E,0BAA0B,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,CAAC,CAAC;IAC9C,4BAA4B;IAC5B,kBAAkB,CAAC;QACjB,GAAG,EAAE,QAAQ;QACb,aAAa,EAAE,MAAM,EAAE,aAAa;QACpC,aAAa,EAAE,MAAM,EAAE,aAAa;QACpC,cAAc,EAAE,MAAM,EAAE,cAAc;KACvC,CAAC,CAAC;IAEH,OAAO,KAAC,mBAAmB,IAAC,GAAG,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,KAAM,KAAK,GAAI,CAAC;AACjG,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC,kBAAkB,CAAC,CAAC"}

package/dist/esm/components/dataTable/dataTableStandAlone.js

@@ -10,8 +10,8 @@ import { LeftBoxShadowContainerStyled, RightBoxShadowContainerStyled, Scrollable
 import { applyPositionToWrapper, applyZIndexToWrapper } from './utils';
 const DataTableStandAloneComponent = ({ dataTestId = 'dataTable', styles, hasScroll, columns, rowGroups, rows, activeRows, hoverable, hoverableRows, nonHoverableRows, stickyHead, config, caption, ...props }, ref) => {
     const usingRowGroups = rowGroups && rowGroups.length > 0;
-    return (_jsxs(WrapperStyled, { ref: ref, "$styles": styles, "data-testid": dataTestId, children: [_jsxs(ScrollableContainerStyled, { "data-datatable-scrollable-container": true, "$styles": styles, "aria-label": hasScroll ? props['aria-label'] : undefined, "aria-labelledby": hasScroll ? props['aria-labelledby'] : undefined, role: hasScroll ? ROLES.REGION : undefined, tabIndex: hasScroll ? 0 : undefined, children: [_jsxs(TableV2, { autoRightStickyCalc: false, component: usingRowGroups ? 'div' : undefined, disableShadowEffects: true, hasScrollDisabled: true, sticky: stickyHead, variant: styles?.table?.variant, ...applyZIndexToWrapper({ tableConfig: config?.table, zIndex: styles?.table?.z_index }), children: [caption?.content && (_jsx(TableCaption, { component: usingRowGroups ? 'div' : undefined, variant: styles?.tableCaption?.variant, ...caption, children: caption.content })), _jsx(DataTableHead, { columns: columns, sticky: stickyHead, tableHeadCellVariant: styles?.tableHeadCell?.variant, tableHeadConfig: config?.tableHead, tableHeadRowConfig: config?.tableHeadRow, tableHeadRowVariant: styles?.tableHeadRow?.variant, tableHeadVariant: styles?.tableHead?.variant, usingRowGroups: usingRowGroups }), !usingRowGroups && rows && rows.length > 0 && (_jsx(TableBody, { variant: styles?.tableBody?.variant, ...config?.tableBody, children: _jsx(DataTableRows, { activeRows: activeRows, columns: columns, hoverable: hoverable, hoverableRows: hoverableRows, nonHoverableRows: nonHoverableRows, rows: rows, tableBodyCellVariant: styles?.tableBodyCell?.variant, tableBodyRowVariant: styles?.tableBodyRow?.variant, usingRowGroups: usingRowGroups }) }))] }), rowGroups?.map((rowGroup, index) => {
-                        return (_jsxs(React.Fragment, { children: [rowGroup.divider && (_jsx(TableDivider, { variant: "DEFAULT", ...rowGroup.divider, children: rowGroup.divider?.content })), _jsxs(TableV2, { autoRightStickyCalc: false, disableShadowEffects: true, hasScrollDisabled: true, variant: styles?.rowGroup?.table?.variant, ...applyPositionToWrapper({
+    return (_jsxs(WrapperStyled, { ref: ref, "$styles": styles, "data-testid": dataTestId, children: [_jsxs(ScrollableContainerStyled, { "data-datatable-scrollable-container": true, "$styles": styles, "aria-label": hasScroll ? props['aria-label'] : undefined, "aria-labelledby": hasScroll ? props['aria-labelledby'] : undefined, role: hasScroll ? ROLES.REGION : undefined, tabIndex: hasScroll ? 0 : undefined, children: [_jsxs(TableV2, { autoLeftStickyCalc: false, autoRightStickyCalc: false, component: usingRowGroups ? 'div' : undefined, disableShadowEffects: true, hasScrollDisabled: true, sticky: stickyHead, variant: styles?.table?.variant, ...applyZIndexToWrapper({ tableConfig: config?.table, zIndex: styles?.table?.z_index }), children: [caption?.content && (_jsx(TableCaption, { component: usingRowGroups ? 'div' : undefined, variant: styles?.tableCaption?.variant, ...caption, children: caption.content })), _jsx(DataTableHead, { columns: columns, sticky: stickyHead, tableHeadCellVariant: styles?.tableHeadCell?.variant, tableHeadConfig: config?.tableHead, tableHeadRowConfig: config?.tableHeadRow, tableHeadRowVariant: styles?.tableHeadRow?.variant, tableHeadVariant: styles?.tableHead?.variant, usingRowGroups: usingRowGroups }), !usingRowGroups && rows && rows.length > 0 && (_jsx(TableBody, { variant: styles?.tableBody?.variant, ...config?.tableBody, children: _jsx(DataTableRows, { activeRows: activeRows, columns: columns, hoverable: hoverable, hoverableRows: hoverableRows, nonHoverableRows: nonHoverableRows, rows: rows, tableBodyCellVariant: styles?.tableBodyCell?.variant, tableBodyRowVariant: styles?.tableBodyRow?.variant, usingRowGroups: usingRowGroups }) }))] }), rowGroups?.map((rowGroup, index) => {
+                        return (_jsxs(React.Fragment, { children: [rowGroup.divider && (_jsx(TableDivider, { variant: "DEFAULT", ...rowGroup.divider, children: rowGroup.divider?.content })), _jsxs(TableV2, { autoLeftStickyCalc: false, autoRightStickyCalc: false, disableShadowEffects: true, hasScrollDisabled: true, variant: styles?.rowGroup?.table?.variant, ...applyPositionToWrapper({
                                         tableConfig: rowGroup.config?.table,
                                         position: 'static',
                                     }), children: [rowGroup.caption?.content && (_jsx(TableCaption, { variant: styles?.rowGroup?.tableCaption?.variant, ...rowGroup.caption, children: rowGroup.caption?.content })), _jsx(HiddenDataTableHead, { columns: columns, tableHeadCellVariant: styles?.rowGroup?.tableHeadCell?.variant, tableHeadRowVariant: styles?.rowGroup?.tableHeadRow?.variant, tableHeadVariant: styles?.rowGroup?.tableHead?.variant }), _jsx(TableBody, { variant: styles?.rowGroup?.tableBody?.variant, ...rowGroup.config?.tableBody, children: _jsx(DataTableRows, { activeRows: activeRows, columns: columns, hoverable: hoverable, hoverableRows: hoverableRows, nonHoverableRows: nonHoverableRows, rows: rowGroup.rows, tableBodyCellVariant: styles?.rowGroup?.tableBodyCell?.variant, tableBodyRowVariant: styles?.rowGroup?.tableBodyRow?.variant, usingRowGroups: usingRowGroups }) })] })] }, index));

package/dist/esm/components/dataTable/dataTableStandAlone.js.map

@@ -1 +1 @@
-{"version":3,"file":"dataTableStandAlone.js","sourceRoot":"","sources":["../../../../src/components/dataTable/dataTableStandAlone.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"dataTableStandAlone.js","sourceRoot":"","sources":["../../../../src/components/dataTable/dataTableStandAlone.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/dataTable/hooks/index.d.ts

@@ -1,3 +1,5 @@
 export * from './useDataTableHasScroll';
-export * from './useDataTableStickyColumns';
+export * from './useDataTableStickyRightColumns';
+export * from './useDataTableStickyLeftColumns';
 export * from './useDataTableShadow';
+export * from './useDataTableStickyDividers';

package/dist/esm/components/dataTable/hooks/index.js

@@ -1,4 +1,6 @@
 export * from './useDataTableHasScroll';
-export * from './useDataTableStickyColumns';
+export * from './useDataTableStickyRightColumns';
+export * from './useDataTableStickyLeftColumns';
 export * from './useDataTableShadow';
+export * from './useDataTableStickyDividers';
 //# sourceMappingURL=index.js.map

package/dist/esm/components/dataTable/hooks/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/dataTable/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC;AACxC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,sBAAsB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/dataTable/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC;AACxC,cAAc,kCAAkC,CAAC;AACjD,cAAc,iCAAiC,CAAC;AAChD,cAAc,sBAAsB,CAAC;AACrC,cAAc,8BAA8B,CAAC"}

package/dist/esm/components/dataTable/hooks/useDataTableStickyDividers.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+type UseDataTableStickyDividersParamsType = {
+    ref: React.RefObject<HTMLDivElement>;
+};
+type UseDataTableStickyDividersReturnType = object;
+export declare const useDataTableStickyDividers: ({ ref, }: UseDataTableStickyDividersParamsType) => UseDataTableStickyDividersReturnType;
+export {};

package/dist/esm/components/dataTable/hooks/useDataTableStickyDividers.js

@@ -0,0 +1,64 @@
+import * as React from 'react';
+import { hasHorizontalScroll } from '../../../utils';
+export const useDataTableStickyDividers = ({ ref, }) => {
+    React.useEffect(() => {
+        const scrollableContainer = ref.current?.querySelector('[data-datatable-scrollable-container]');
+        let resizeObserver;
+        if (scrollableContainer instanceof HTMLElement) {
+            const handleElementResize = (element) => {
+                const _hasHorizontalScroll = hasHorizontalScroll(element);
+                // If there are sticky left cells:
+                // -> dividers should be sticky to the left too
+                // -> left and right datatable shadows should remain under the divider (z-index in the divider should be greather than the z-index of the shadows)
+                // If there are not sticky left cells:
+                // -> dividers with should be updated with the offset width of the table in order to have a width of 100% (in case the datatable has horizontal scroll)
+                const dividers = element.querySelectorAll('[data-table-divider]');
+                const stickyLeft = element.querySelectorAll('[data-sticky="left"]').length > 0;
+                // Calc shadow z-index when sticky left
+                let shadowZIndex = 0;
+                // Calc divider width when !sticky left
+                let dividerWidth = 0;
+                if (stickyLeft) {
+                    const leftBoxShadowContainer = ref.current?.querySelector('[data-datatable-left-shadow]');
+                    if (leftBoxShadowContainer) {
+                        const shadowContainerStyle = window.getComputedStyle(leftBoxShadowContainer);
+                        const _shadowZIndex = shadowContainerStyle.getPropertyValue('z-index');
+                        if (_shadowZIndex) {
+                            shadowZIndex = parseInt(_shadowZIndex, 10);
+                        }
+                    }
+                }
+                else {
+                    const rows = element.querySelectorAll('[data-table-row]');
+                    rows.forEach(row => {
+                        if (row instanceof HTMLElement) {
+                            dividerWidth = Math.max(dividerWidth, row.offsetWidth);
+                        }
+                    });
+                }
+                dividers.forEach(divider => {
+                    if (divider instanceof HTMLElement) {
+                        if (stickyLeft) {
+                            divider.style.position = _hasHorizontalScroll ? 'sticky' : '';
+                            divider.style.left = _hasHorizontalScroll ? '0' : '';
+                            divider.style.zIndex = _hasHorizontalScroll ? `${shadowZIndex + 1}` : '';
+                        }
+                        else {
+                            divider.style.width = _hasHorizontalScroll ? `${dividerWidth}px` : '';
+                        }
+                    }
+                });
+            };
+            handleElementResize(scrollableContainer);
+            resizeObserver = new ResizeObserver(() => {
+                handleElementResize(scrollableContainer);
+            });
+            resizeObserver.observe(scrollableContainer);
+        }
+        return () => {
+            resizeObserver?.disconnect();
+        };
+    }, []);
+    return {};
+};
+//# sourceMappingURL=useDataTableStickyDividers.js.map

package/dist/esm/components/dataTable/hooks/useDataTableStickyDividers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDataTableStickyDividers.js","sourceRoot":"","sources":["../../../../../src/components/dataTable/hooks/useDataTableStickyDividers.ts"],"names":[],"mappings":"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"}

package/dist/esm/components/dataTable/hooks/useDataTableStickyLeftColumns.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+type UseDataTableStickyLeftColumnsParamsType = {
+    ref: React.RefObject<HTMLDivElement>;
+};
+type UseDataTableStickyLeftColumnsReturnType = object;
+export declare const useDataTableStickyLeftColumns: ({ ref, }: UseDataTableStickyLeftColumnsParamsType) => UseDataTableStickyLeftColumnsReturnType;
+export {};

package/dist/esm/components/dataTable/hooks/useDataTableStickyLeftColumns.js

@@ -0,0 +1,47 @@
+import * as React from 'react';
+import { hasHorizontalScroll } from '../../../utils';
+export const useDataTableStickyLeftColumns = ({ ref, }) => {
+    React.useEffect(() => {
+        const scrollableContainer = ref.current?.querySelector('[data-datatable-scrollable-container]');
+        const leftBoxShadowContainer = ref.current?.querySelector('[data-datatable-left-shadow]');
+        let resizeObserver;
+        if (scrollableContainer instanceof HTMLElement) {
+            const handleElementResize = (element) => {
+                const _hasHorizontalScroll = hasHorizontalScroll(element);
+                // For each row, set the left position of its sticky cells
+                const rows = element.querySelectorAll('[data-table-row]');
+                // used to calc leftBoxShadowContainer position
+                let maxStickyLeftWidth = 0;
+                rows.forEach(row => {
+                    if (row instanceof HTMLElement) {
+                        // Retrieve all the cell with sticky attribute
+                        const stickyCells = Array.from(row.querySelectorAll('[data-sticky="left"]'));
+                        let left = 0;
+                        stickyCells.forEach(stickyCell => {
+                            if (stickyCell instanceof HTMLElement) {
+                                stickyCell.style.left = _hasHorizontalScroll ? `${left}px` : 'auto';
+                                left += stickyCell.offsetWidth;
+                            }
+                        });
+                        maxStickyLeftWidth = Math.max(maxStickyLeftWidth, left);
+                    }
+                });
+                // Once the sticky position have been added, set the position of the leftBoxShadowContainer
+                // This position should be the same as the max width of the sticky cells
+                if (leftBoxShadowContainer instanceof HTMLElement) {
+                    leftBoxShadowContainer.style.left = `${maxStickyLeftWidth}px`;
+                }
+            };
+            handleElementResize(scrollableContainer);
+            resizeObserver = new ResizeObserver(() => {
+                handleElementResize(scrollableContainer);
+            });
+            resizeObserver.observe(scrollableContainer);
+        }
+        return () => {
+            resizeObserver?.disconnect();
+        };
+    }, []);
+    return {};
+};
+//# sourceMappingURL=useDataTableStickyLeftColumns.js.map

package/dist/esm/components/dataTable/hooks/useDataTableStickyLeftColumns.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDataTableStickyLeftColumns.js","sourceRoot":"","sources":["../../../../../src/components/dataTable/hooks/useDataTableStickyLeftColumns.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAQ9C,MAAM,CAAC,MAAM,6BAA6B,GAAG,CAAC,EAC5C,GAAG,GACqC,EAA2C,EAAE;IACrF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,mBAAmB,GAAG,GAAG,CAAC,OAAO,EAAE,aAAa,CAAC,uCAAuC,CAAC,CAAC;QAChG,MAAM,sBAAsB,GAAG,GAAG,CAAC,OAAO,EAAE,aAAa,CAAC,8BAA8B,CAAC,CAAC;QAC1F,IAAI,cAA8B,CAAC;QACnC,IAAI,mBAAmB,YAAY,WAAW,EAAE,CAAC;YAC/C,MAAM,mBAAmB,GAAG,CAAC,OAAoB,EAAE,EAAE;gBACnD,MAAM,oBAAoB,GAAG,mBAAmB,CAAC,OAAO,CAAC,CAAC;gBAC1D,0DAA0D;gBAC1D,MAAM,IAAI,GAAG,OAAO,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,CAAC;gBAC1D,+CAA+C;gBAC/C,IAAI,kBAAkB,GAAG,CAAC,CAAC;gBAC3B,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE;oBACjB,IAAI,GAAG,YAAY,WAAW,EAAE,CAAC;wBAC/B,8CAA8C;wBAC9C,MAAM,WAAW,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,gBAAgB,CAAC,sBAAsB,CAAC,CAAC,CAAC;wBAC7E,IAAI,IAAI,GAAG,CAAC,CAAC;wBACb,WAAW,CAAC,OAAO,CAAC,UAAU,CAAC,EAAE;4BAC/B,IAAI,UAAU,YAAY,WAAW,EAAE,CAAC;gCACtC,UAAU,CAAC,KAAK,CAAC,IAAI,GAAG,oBAAoB,CAAC,CAAC,CAAC,GAAG,IAAI,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC;gCACpE,IAAI,IAAI,UAAU,CAAC,WAAW,CAAC;4BACjC,CAAC;wBACH,CAAC,CAAC,CAAC;wBACH,kBAAkB,GAAG,IAAI,CAAC,GAAG,CAAC,kBAAkB,EAAE,IAAI,CAAC,CAAC;oBAC1D,CAAC;gBACH,CAAC,CAAC,CAAC;gBACH,2FAA2F;gBAC3F,wEAAwE;gBACxE,IAAI,sBAAsB,YAAY,WAAW,EAAE,CAAC;oBAClD,sBAAsB,CAAC,KAAK,CAAC,IAAI,GAAG,GAAG,kBAAkB,IAAI,CAAC;gBAChE,CAAC;YACH,CAAC,CAAC;YACF,mBAAmB,CAAC,mBAAmB,CAAC,CAAC;YACzC,cAAc,GAAG,IAAI,cAAc,CAAC,GAAG,EAAE;gBACvC,mBAAmB,CAAC,mBAAmB,CAAC,CAAC;YAC3C,CAAC,CAAC,CAAC;YACH,cAAc,CAAC,OAAO,CAAC,mBAAmB,CAAC,CAAC;QAC9C,CAAC;QACD,OAAO,GAAG,EAAE;YACV,cAAc,EAAE,UAAU,EAAE,CAAC;QAC/B,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,EAAE,CAAC;AACZ,CAAC,CAAC"}

package/dist/esm/components/dataTable/hooks/useDataTableStickyRightColumns.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+type UseDataTableStickyRightColumnsParamsType = {
+    ref: React.RefObject<HTMLDivElement>;
+};
+type UseDataTableStickyRightColumnsReturnType = object;
+export declare const useDataTableStickyRightColumns: ({ ref, }: UseDataTableStickyRightColumnsParamsType) => UseDataTableStickyRightColumnsReturnType;
+export {};

package/dist/esm/components/dataTable/hooks/useDataTableStickyRightColumns.js

@@ -0,0 +1,55 @@
+import * as React from 'react';
+import { hasHorizontalScroll, hasVerticalScroll } from '../../../utils';
+export const useDataTableStickyRightColumns = ({ ref, }) => {
+    React.useEffect(() => {
+        const scrollableContainer = ref.current?.querySelector('[data-datatable-scrollable-container]');
+        const rightBoxShadowContainer = ref.current?.querySelector('[data-datatable-right-shadow]');
+        let resizeObserver;
+        if (scrollableContainer instanceof HTMLElement) {
+            const handleElementResize = (element) => {
+                const _hasHorizontalScroll = hasHorizontalScroll(element);
+                // For each row, set the right position of its sticky cells
+                const rows = element.querySelectorAll('[data-table-row]');
+                // used to calc rightBoxShadowContainer position
+                let maxStickyRightWidth = 0;
+                rows.forEach(row => {
+                    if (row instanceof HTMLElement) {
+                        // Retrieve all the cell with sticky attribute
+                        const stickyCells = Array.from(
+                        // deprecated - delete [data-sticky="true"] after boolean is deleted from the sticky type
+                        row.querySelectorAll('[data-sticky="true"], [data-sticky="right"]')).reverse();
+                        let right = 0;
+                        stickyCells.forEach(stickyCell => {
+                            if (stickyCell instanceof HTMLElement) {
+                                stickyCell.style.right = _hasHorizontalScroll ? `${right}px` : 'auto';
+                                right += stickyCell.offsetWidth;
+                            }
+                        });
+                        maxStickyRightWidth = Math.max(maxStickyRightWidth, right);
+                    }
+                });
+                // Once the sticky position have been added, set the position of the rightBoxShadowContainer
+                // This position should be the same as the max width of the sticky cells
+                if (rightBoxShadowContainer instanceof HTMLElement) {
+                    // If vertical scroll, add scroll bar size to maxStickyRightWidth
+                    const _hasVerticalScroll = hasVerticalScroll(element);
+                    if (_hasVerticalScroll) {
+                        const scrollBarSize = element.offsetWidth - element.clientWidth;
+                        maxStickyRightWidth += scrollBarSize;
+                    }
+                    rightBoxShadowContainer.style.right = `${maxStickyRightWidth}px`;
+                }
+            };
+            handleElementResize(scrollableContainer);
+            resizeObserver = new ResizeObserver(() => {
+                handleElementResize(scrollableContainer);
+            });
+            resizeObserver.observe(scrollableContainer);
+        }
+        return () => {
+            resizeObserver?.disconnect();
+        };
+    }, []);
+    return {};
+};
+//# sourceMappingURL=useDataTableStickyRightColumns.js.map

package/dist/esm/components/dataTable/hooks/useDataTableStickyRightColumns.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDataTableStickyRightColumns.js","sourceRoot":"","sources":["../../../../../src/components/dataTable/hooks/useDataTableStickyRightColumns.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAQjE,MAAM,CAAC,MAAM,8BAA8B,GAAG,CAAC,EAC7C,GAAG,GACsC,EAA4C,EAAE;IACvF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,mBAAmB,GAAG,GAAG,CAAC,OAAO,EAAE,aAAa,CAAC,uCAAuC,CAAC,CAAC;QAChG,MAAM,uBAAuB,GAAG,GAAG,CAAC,OAAO,EAAE,aAAa,CAAC,+BAA+B,CAAC,CAAC;QAC5F,IAAI,cAA8B,CAAC;QACnC,IAAI,mBAAmB,YAAY,WAAW,EAAE,CAAC;YAC/C,MAAM,mBAAmB,GAAG,CAAC,OAAoB,EAAE,EAAE;gBACnD,MAAM,oBAAoB,GAAG,mBAAmB,CAAC,OAAO,CAAC,CAAC;gBAC1D,2DAA2D;gBAC3D,MAAM,IAAI,GAAG,OAAO,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,CAAC;gBAC1D,gDAAgD;gBAChD,IAAI,mBAAmB,GAAG,CAAC,CAAC;gBAC5B,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE;oBACjB,IAAI,GAAG,YAAY,WAAW,EAAE,CAAC;wBAC/B,8CAA8C;wBAC9C,MAAM,WAAW,GAAG,KAAK,CAAC,IAAI;wBAC5B,yFAAyF;wBACzF,GAAG,CAAC,gBAAgB,CAAC,6CAA6C,CAAC,CACpE,CAAC,OAAO,EAAE,CAAC;wBACZ,IAAI,KAAK,GAAG,CAAC,CAAC;wBACd,WAAW,CAAC,OAAO,CAAC,UAAU,CAAC,EAAE;4BAC/B,IAAI,UAAU,YAAY,WAAW,EAAE,CAAC;gCACtC,UAAU,CAAC,KAAK,CAAC,KAAK,GAAG,oBAAoB,CAAC,CAAC,CAAC,GAAG,KAAK,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC;gCACtE,KAAK,IAAI,UAAU,CAAC,WAAW,CAAC;4BAClC,CAAC;wBACH,CAAC,CAAC,CAAC;wBACH,mBAAmB,GAAG,IAAI,CAAC,GAAG,CAAC,mBAAmB,EAAE,KAAK,CAAC,CAAC;oBAC7D,CAAC;gBACH,CAAC,CAAC,CAAC;gBACH,4FAA4F;gBAC5F,wEAAwE;gBACxE,IAAI,uBAAuB,YAAY,WAAW,EAAE,CAAC;oBACnD,iEAAiE;oBACjE,MAAM,kBAAkB,GAAG,iBAAiB,CAAC,OAAO,CAAC,CAAC;oBACtD,IAAI,kBAAkB,EAAE,CAAC;wBACvB,MAAM,aAAa,GAAG,OAAO,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW,CAAC;wBAChE,mBAAmB,IAAI,aAAa,CAAC;oBACvC,CAAC;oBACD,uBAAuB,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,mBAAmB,IAAI,CAAC;gBACnE,CAAC;YACH,CAAC,CAAC;YACF,mBAAmB,CAAC,mBAAmB,CAAC,CAAC;YACzC,cAAc,GAAG,IAAI,cAAc,CAAC,GAAG,EAAE;gBACvC,mBAAmB,CAAC,mBAAmB,CAAC,CAAC;YAC3C,CAAC,CAAC,CAAC;YACH,cAAc,CAAC,OAAO,CAAC,mBAAmB,CAAC,CAAC;QAC9C,CAAC;QACD,OAAO,GAAG,EAAE;YACV,cAAc,EAAE,UAAU,EAAE,CAAC;QAC/B,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,EAAE,CAAC;AACZ,CAAC,CAAC"}

package/dist/esm/components/dataTable/types/dataTable.d.ts

@@ -38,7 +38,10 @@ export type DataTableColumnType = {
     minWidth?: string;
     maxWidth?: string;
     hidden?: boolean;
-    sticky?: boolean;
+    /**
+     * @remarks Avoid using boolean values for `sticky`. Prefer specifying 'left' or 'right' to define the sticky side.
+     */
+    sticky?: boolean | 'left' | 'right';
     textAlign?: string;
     valueTextAlign?: string;
     valueGetter?: (value: DataTableCellValueType, row: DataTableRowType) => DataTableCellValueType;

package/dist/esm/components/elementOrIcon/elementOrIcon.d.ts

@@ -1,9 +1,8 @@
 import * as React from 'react';
 import { IElementOrIcon } from './types';
 /**
- * @description
- * ElementOrIcon component is a component that can be used to display an element or an icon.
- * It can be used to display an icon or a component.
+ * ElementOrIcon component is a component that can be used to display either an element or an icon.
+ * It offers flexibility in rendering either icons or more complex components within a given context.
  * @param {IElementOrIcon} props
  * @returns {JSX.Element}
  * @constructor

package/dist/esm/components/elementOrIcon/elementOrIcon.js

@@ -15,9 +15,8 @@ const ElementOrIconComponent = ({ basic = false, ...props }, ref) => {
     return _jsx(_Fragment, { children: element });
 };
 /**
- * @description
- * ElementOrIcon component is a component that can be used to display an element or an icon.
- * It can be used to display an icon or a component.
+ * ElementOrIcon component is a component that can be used to display either an element or an icon.
+ * It offers flexibility in rendering either icons or more complex components within a given context.
  * @param {IElementOrIcon} props
  * @returns {JSX.Element}
  * @constructor

package/dist/esm/components/elementOrIcon/elementOrIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"elementOrIcon.js","sourceRoot":"","sources":["../../../../src/components/elementOrIcon/elementOrIcon.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,QAAQ,IAAI,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAGpD,MAAM,sBAAsB,GAAG,CAC7B,EAAE,KAAK,GAAG,KAAK,EAAE,GAAG,KAAK,EAAkB,EAC3C,GAAwC,EAC3B,EAAE;IACf,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IAEzC,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,OAAO,mBAAK,CAAC;IACf,CAAC;IAED,oBAAoB;IACpB,IAAI,OAAO,OAAO,KAAK,QAAQ,EAAE,CAAC;QAChC,OAAO,KAAK,CAAC,CAAC,CAAC,CACb,KAAC,SAAS,OAAK,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,OAAO,GAAI,CACjD,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,OAAK,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,OAAO,GAAI,CAC5C,CAAC;IACJ,CAAC;IACD,yBAAyB;IACzB,OAAO,4BAAG,OAAO,GAAI,CAAC;AACxB,CAAC,CAAC;AAEF;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,KAAK,CAAC,UAAU,CAAC,sBAAsB,CAAC,CAAC"}
+{"version":3,"file":"elementOrIcon.js","sourceRoot":"","sources":["../../../../src/components/elementOrIcon/elementOrIcon.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,QAAQ,IAAI,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAGpD,MAAM,sBAAsB,GAAG,CAC7B,EAAE,KAAK,GAAG,KAAK,EAAE,GAAG,KAAK,EAAkB,EAC3C,GAAwC,EAC3B,EAAE;IACf,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IAEzC,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,OAAO,mBAAK,CAAC;IACf,CAAC;IAED,oBAAoB;IACpB,IAAI,OAAO,OAAO,KAAK,QAAQ,EAAE,CAAC;QAChC,OAAO,KAAK,CAAC,CAAC,CAAC,CACb,KAAC,SAAS,OAAK,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,OAAO,GAAI,CACjD,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,OAAK,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,OAAO,GAAI,CAC5C,CAAC;IACJ,CAAC;IACD,yBAAyB;IACzB,OAAO,4BAAG,OAAO,GAAI,CAAC;AACxB,CAAC,CAAC;AAEF;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,KAAK,CAAC,UAAU,CAAC,sBAAsB,CAAC,CAAC"}

package/dist/esm/components/elementOrIllustration/elementOrIllustration.d.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { IElementOrillustration } from './types';
 /**
- * @description
  * ElementOrIllustration component is a component that can be used to display an element or an illustration.
  * It can be used to display an illustration or a component.
  * @param {IElementOrillustration} props

package/dist/esm/components/elementOrIllustration/elementOrIllustration.js

@@ -14,7 +14,6 @@ const ElementOrIllustrationComponent = (props, ref) => {
     return _jsx(_Fragment, { children: element });
 };
 /**
- * @description
  * ElementOrIllustration component is a component that can be used to display an element or an illustration.
  * It can be used to display an illustration or a component.
  * @param {IElementOrillustration} props

package/dist/esm/components/elementOrIllustration/elementOrIllustration.js.map

@@ -1 +1 @@
-{"version":3,"file":"elementOrIllustration.js","sourceRoot":"","sources":["../../../../src/components/elementOrIllustration/elementOrIllustration.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAG/C,MAAM,8BAA8B,GAAG,CACrC,KAA6B,EAC7B,GAA4D,EAC/C,EAAE;IACf,MAAM,EAAE,YAAY,EAAE,OAAO,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IAEjD,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,OAAO,mBAAK,CAAC;IACf,CAAC;IAED,oBAAoB;IACpB,IAAI,OAAO,OAAO,KAAK,QAAQ,EAAE,CAAC;QAChC,OAAO,KAAC,YAAY,OAAK,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,YAAY,EAAE,OAAO,GAAI,CAAC;IACrE,CAAC;IACD,yBAAyB;IACzB,OAAO,4BAAG,OAAO,GAAI,CAAC;AACxB,CAAC,CAAC;AAEF;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,KAAK,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC"}
+{"version":3,"file":"elementOrIllustration.js","sourceRoot":"","sources":["../../../../src/components/elementOrIllustration/elementOrIllustration.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAG/C,MAAM,8BAA8B,GAAG,CACrC,KAA6B,EAC7B,GAA4D,EAC/C,EAAE;IACf,MAAM,EAAE,YAAY,EAAE,OAAO,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IAEjD,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,OAAO,mBAAK,CAAC;IACf,CAAC;IAED,oBAAoB;IACpB,IAAI,OAAO,OAAO,KAAK,QAAQ,EAAE,CAAC;QAChC,OAAO,KAAC,YAAY,OAAK,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,YAAY,EAAE,OAAO,GAAI,CAAC;IACrE,CAAC;IACD,yBAAyB;IACzB,OAAO,4BAAG,OAAO,GAAI,CAAC;AACxB,CAAC,CAAC;AAEF;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,KAAK,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC"}

package/dist/esm/components/emptyState/emptyState.d.ts

@@ -1,5 +1,8 @@
 import * as React from 'react';
 import { IEmptyState } from './types';
+/**
+ *  @deprecated This component has been deprecated and will be removed in the next MAJOR release.
+ */
 declare const EmptyState: <V extends string | unknown>(props: IEmptyState<V> & {
     ref?: React.ForwardedRef<HTMLDivElement> | undefined | null;
 }) => JSX.Element;

package/dist/esm/components/emptyState/emptyState.js

@@ -10,6 +10,9 @@ const EmptyStateComponent = React.forwardRef(({ ctv, ...props }, ref) => {
 });
 EmptyStateComponent.displayName = 'EmptyStateComponent';
 const EmptyStateBoundary = (props, ref) => (_jsx(ErrorBoundary, { fallBackComponent: _jsx(FallbackComponent, { children: _jsx(EmptyStateStandAlone, { ...props, ref: ref }) }), children: _jsx(EmptyStateComponent, { ...props, ref: ref }) }));
+/**
+ *  @deprecated This component has been deprecated and will be removed in the next MAJOR release.
+ */
 const EmptyState = React.forwardRef(EmptyStateBoundary);
 export { EmptyState };
 //# sourceMappingURL=emptyState.js.map

package/dist/esm/components/emptyState/emptyState.js.map

@@ -1 +1 @@
-{"version":3,"file":"emptyState.js","sourceRoot":"","sources":["../../../../src/components/emptyState/emptyState.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,6BAA6B,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAE5E,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAI9D,MAAM,mBAAmB,GAAG,KAAK,CAAC,UAAU,CAC1C,CACE,EAAE,GAAG,EAAE,GAAG,KAAK,EAAkB,EACjC,GAA0D,EAC7C,EAAE;IACf,MAAM,MAAM,GAAmC,SAAS,CACtD,WAAW,CAAC,WAAW,EACvB,KAAK,CAAC,OAAO,EACb,GAAG,CACJ,CAAC;IAEF,OAAO,KAAC,oBAAoB,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,GAAI,CAAC;AACtF,CAAC,CACF,CAAC;AACF,mBAAmB,CAAC,WAAW,GAAG,qBAAqB,CAAC;AAExD,MAAM,kBAAkB,GAAG,CACzB,KAAqB,EACrB,GAA0D,EAC7C,EAAE,CAAC,CAChB,KAAC,aAAa,IACZ,iBAAiB,EACf,KAAC,iBAAiB,cAChB,KAAC,oBAAoB,OAAM,KAA0C,EAAE,GAAG,EAAE,GAAG,GAAI,GACjE,YAGtB,KAAC,mBAAmB,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,GAAI,GAC9B,CACjB,CAAC;AAEF,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAAC,kBAAkB,CAItC,CAAC;AAEjB,OAAO,EAAE,UAAU,EAAE,CAAC"}
+{"version":3,"file":"emptyState.js","sourceRoot":"","sources":["../../../../src/components/emptyState/emptyState.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,6BAA6B,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAE5E,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAI9D,MAAM,mBAAmB,GAAG,KAAK,CAAC,UAAU,CAC1C,CACE,EAAE,GAAG,EAAE,GAAG,KAAK,EAAkB,EACjC,GAA0D,EAC7C,EAAE;IACf,MAAM,MAAM,GAAmC,SAAS,CACtD,WAAW,CAAC,WAAW,EACvB,KAAK,CAAC,OAAO,EACb,GAAG,CACJ,CAAC;IAEF,OAAO,KAAC,oBAAoB,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,GAAI,CAAC;AACtF,CAAC,CACF,CAAC;AACF,mBAAmB,CAAC,WAAW,GAAG,qBAAqB,CAAC;AAExD,MAAM,kBAAkB,GAAG,CACzB,KAAqB,EACrB,GAA0D,EAC7C,EAAE,CAAC,CAChB,KAAC,aAAa,IACZ,iBAAiB,EACf,KAAC,iBAAiB,cAChB,KAAC,oBAAoB,OAAM,KAA0C,EAAE,GAAG,EAAE,GAAG,GAAI,GACjE,YAGtB,KAAC,mBAAmB,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,GAAI,GAC9B,CACjB,CAAC;AAEF;;GAEG;AACH,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAAC,kBAAkB,CAItC,CAAC;AAEjB,OAAO,EAAE,UAAU,EAAE,CAAC"}

package/dist/esm/components/footer/components/footerSection.d.ts

@@ -2,9 +2,16 @@ import * as React from 'react';
 import { FooterPropsStylesType } from '../types';
 interface IFooterSection {
     styles: FooterPropsStylesType;
-    forceVertical?: boolean;
+    setVertical?: boolean;
     position: string;
-    tabInverse?: boolean;
+    orderConfiguration: {
+        flexReverse?: boolean;
+        reverse?: boolean;
+    };
+    /**
+     * @deprecated
+     */
+    alignItems?: string;
     children: React.ReactNode[];
 }
 export declare const FooterSection: (props: IFooterSection) => JSX.Element | null;

package/dist/esm/components/footer/components/footerSection.js

@@ -7,12 +7,12 @@ export const FooterSection = (props) => {
     }
     const getElementJustify = (position) => {
         const styles = {
-            [FooterPositionType.LEFT]: props.tabInverse ? 'flex-end' : 'flex-start',
+            [FooterPositionType.LEFT]: props.orderConfiguration.reverse ? 'flex-end' : 'flex-start',
             [FooterPositionType.CENTER]: 'center',
-            [FooterPositionType.RIGHT]: props.tabInverse ? 'flex-start' : 'flex-end',
+            [FooterPositionType.RIGHT]: props.orderConfiguration.reverse ? 'flex-start' : 'flex-end',
         };
         return styles[position] || 'center';
     };
-    return (_jsx(FooterSectionStyled, { "$forceVertical": props.forceVertical, "$justifyContent": getElementJustify(props.position), "$tabInverse": props.tabInverse, "aria-hidden": !props.children.length, styles: props.styles, children: props.tabInverse ? props.children.reverse() : props.children }));
+    return (_jsx(FooterSectionStyled, { "$alignItems": props.alignItems, "$flexReverse": props.orderConfiguration.flexReverse, "$justifyContent": getElementJustify(props.position), "$setVertical": props.setVertical, "aria-hidden": !props.children.length, styles: props.styles, children: props.orderConfiguration.reverse ? props.children.reverse() : props.children }));
 };
 //# sourceMappingURL=footerSection.js.map

package/dist/esm/components/footer/components/footerSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"footerSection.js","sourceRoot":"","sources":["../../../../../src/components/footer/components/footerSection.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,kBAAkB,EAAyB,MAAM,UAAU,CAAC;AAUrE,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,KAAqB,EAAsB,EAAE;IACzE,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC;QAC3B,OAAO,IAAI,CAAC;IACd,CAAC;IAED,MAAM,iBAAiB,GAAG,CAAC,QAAgB,EAAE,EAAE;QAC7C,MAAM,MAAM,GAAG;YACb,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY;YACvE,CAAC,kBAAkB,CAAC,MAAM,CAAC,EAAE,QAAQ;YACrC,CAAC,kBAAkB,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,UAAU;SACzE,CAAC;QACF,OAAO,MAAM,CAAC,QAAQ,CAAC,IAAI,QAAQ,CAAC;IACtC,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,mBAAmB,sBACF,KAAK,CAAC,aAAa,qBAClB,iBAAiB,CAAC,KAAK,CAAC,QAAQ,CAAC,iBACrC,KAAK,CAAC,UAAU,iBAChB,CAAC,KAAK,CAAC,QAAQ,CAAC,MAAM,EACnC,MAAM,EAAE,KAAK,CAAC,MAAM,YAEnB,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,GACzC,CACvB,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"footerSection.js","sourceRoot":"","sources":["../../../../../src/components/footer/components/footerSection.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,kBAAkB,EAAyB,MAAM,UAAU,CAAC;AAiBrE,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,KAAqB,EAAsB,EAAE;IACzE,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC;QAC3B,OAAO,IAAI,CAAC;IACd,CAAC;IAED,MAAM,iBAAiB,GAAG,CAAC,QAAgB,EAAE,EAAE;QAC7C,MAAM,MAAM,GAAG;YACb,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,KAAK,CAAC,kBAAkB,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY;YACvF,CAAC,kBAAkB,CAAC,MAAM,CAAC,EAAE,QAAQ;YACrC,CAAC,kBAAkB,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,kBAAkB,CAAC,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,UAAU;SACzF,CAAC;QACF,OAAO,MAAM,CAAC,QAAQ,CAAC,IAAI,QAAQ,CAAC;IACtC,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,mBAAmB,mBACL,KAAK,CAAC,UAAU,kBACf,KAAK,CAAC,kBAAkB,CAAC,WAAW,qBACjC,iBAAiB,CAAC,KAAK,CAAC,QAAQ,CAAC,kBACpC,KAAK,CAAC,WAAW,iBAClB,CAAC,KAAK,CAAC,QAAQ,CAAC,MAAM,EACnC,MAAM,EAAE,KAAK,CAAC,MAAM,YAEnB,KAAK,CAAC,kBAAkB,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,GACzD,CACvB,CAAC;AACJ,CAAC,CAAC"}

package/dist/esm/components/footer/footer.d.ts

@@ -1,6 +1,9 @@
 import * as React from 'react';
 import { IFooter } from './types';
 declare const FooterBoundary: <V extends string | unknown>(props: IFooter<V>, ref: React.ForwardedRef<HTMLElement> | undefined | null) => JSX.Element;
+/**
+ * @deprecated This component has been deprecated and will be removed in the next MAJOR release. Will include all this on the CheckBox component
+ */
 declare const Footer: <V extends string | unknown>(props: React.PropsWithChildren<IFooter<V>> & {
     ref?: React.ForwardedRef<HTMLElement> | undefined | null;
 }) => ReturnType<typeof FooterBoundary>;

package/dist/esm/components/footer/footer.js

@@ -13,6 +13,9 @@ const FooterComponent = React.forwardRef(({ variant, ctv, extraCt, ...props }, r
 });
 FooterComponent.displayName = 'FooterComponent';
 const FooterBoundary = (props, ref) => (_jsx(ErrorBoundary, { fallBackComponent: _jsx(FallbackComponent, { children: _jsx(FooterStandAlone, { ...props, ref: ref }) }), children: _jsx(FooterComponent, { ...props, ref: ref }) }));
+/**
+ * @deprecated This component has been deprecated and will be removed in the next MAJOR release. Will include all this on the CheckBox component
+ */
 const Footer = React.forwardRef(FooterBoundary);
 export { Footer };
 //# sourceMappingURL=footer.js.map

package/dist/esm/components/footer/footer.js.map

@@ -1 +1 @@
-{"version":3,"file":"footer.js","sourceRoot":"","sources":["../../../../src/components/footer/footer.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AACzC,OAAO,EAAE,SAAS,EAAE,MAAM,6BAA6B,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAG5E,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAGtD,MAAM,eAAe,GAAG,KAAK,CAAC,UAAU,CACtC,CACE,EAAE,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE,GAAG,KAAK,EAAc,EAC/C,GAAuD,EAC1C,EAAE;IACf,MAAM,MAAM,GAAG,cAAc,EAAE,CAAC;IAChC,MAAM,MAAM,GAAG,SAAS,CAA2B,WAAW,CAAC,MAAM,EAAE,OAAO,EAAE,GAAG,CAAC,CAAC;IACrF,MAAM,uBAAuB,GAAG,SAAS,CACvC,WAAW,CAAC,cAAc,EAC1B,MAAM,CAAC,aAAa,EAAE,CAAC,MAAM,CAAC,EAAE,OAAO,IAAI,MAAM,CAAC,aAAa,EAAE,OAAO,EACxE,OAAO,CACR,CAAC;IACF,OAAO,CACL,KAAC,gBAAgB,IACf,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,MAAM,EACd,uBAAuB,EAAE,uBAAuB,EAChD,MAAM,EAAE,MAAM,KACV,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AACF,eAAe,CAAC,WAAW,GAAG,iBAAiB,CAAC;AAEhD,MAAM,cAAc,GAAG,CACrB,KAAiB,EACjB,GAAuD,EAC1C,EAAE,CAAC,CAChB,KAAC,aAAa,IACZ,iBAAiB,EACf,KAAC,iBAAiB,cAChB,KAAC,gBAAgB,OAAM,KAAsC,EAAE,GAAG,EAAE,GAAG,GAAI,GACzD,YAGtB,KAAC,eAAe,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,GAAI,GAC1B,CACjB,CAAC;AAEF,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,cAAc,CAIR,CAAC;AAEvC,OAAO,EAAE,MAAM,EAAE,CAAC"}
+{"version":3,"file":"footer.js","sourceRoot":"","sources":["../../../../src/components/footer/footer.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AACzC,OAAO,EAAE,SAAS,EAAE,MAAM,6BAA6B,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAG5E,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAGtD,MAAM,eAAe,GAAG,KAAK,CAAC,UAAU,CACtC,CACE,EAAE,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE,GAAG,KAAK,EAAc,EAC/C,GAAuD,EAC1C,EAAE;IACf,MAAM,MAAM,GAAG,cAAc,EAAE,CAAC;IAChC,MAAM,MAAM,GAAG,SAAS,CAA2B,WAAW,CAAC,MAAM,EAAE,OAAO,EAAE,GAAG,CAAC,CAAC;IACrF,MAAM,uBAAuB,GAAG,SAAS,CACvC,WAAW,CAAC,cAAc,EAC1B,MAAM,CAAC,aAAa,EAAE,CAAC,MAAM,CAAC,EAAE,OAAO,IAAI,MAAM,CAAC,aAAa,EAAE,OAAO,EACxE,OAAO,CACR,CAAC;IACF,OAAO,CACL,KAAC,gBAAgB,IACf,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,MAAM,EACd,uBAAuB,EAAE,uBAAuB,EAChD,MAAM,EAAE,MAAM,KACV,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AACF,eAAe,CAAC,WAAW,GAAG,iBAAiB,CAAC;AAEhD,MAAM,cAAc,GAAG,CACrB,KAAiB,EACjB,GAAuD,EAC1C,EAAE,CAAC,CAChB,KAAC,aAAa,IACZ,iBAAiB,EACf,KAAC,iBAAiB,cAChB,KAAC,gBAAgB,OAAM,KAAsC,EAAE,GAAG,EAAE,GAAG,GAAI,GACzD,YAGtB,KAAC,eAAe,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,GAAI,GAC1B,CACjB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,cAAc,CAIR,CAAC;AAEvC,OAAO,EAAE,MAAM,EAAE,CAAC"}

package/dist/esm/components/footer/footer.styled.d.ts

@@ -2,8 +2,12 @@ import { LineSeparatorLinePropsStylesType } from '../lineSeparator';
 import { FooterPropsStylesType } from './types';
 type FooterStylesType = {
     styles: FooterPropsStylesType;
-    $forceVertical?: boolean;
-    $tabInverse?: boolean;
+    $setVertical?: boolean;
+    $flexReverse?: boolean;
+    /**
+     * @deprecated
+     */
+    $alignItems?: string;
 };
 type FooterSectionStyledType = FooterStylesType & {
     $justifyContent: string;
@@ -11,6 +15,6 @@ type FooterSectionStyledType = FooterStylesType & {
 type RootContainerStyledType = FooterStylesType & {
     lineSeparatorLineStyles: LineSeparatorLinePropsStylesType;
 };
-export declare const FooterStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, RootContainerStyledType>> & string;
 export declare const FooterSectionStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, FooterSectionStyledType>> & string;
+export declare const FooterStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, RootContainerStyledType>> & string;
 export {};

package/dist/esm/components/footer/footer.styled.js

@@ -1,49 +1,48 @@
 import styled, { css } from 'styled-components';
 import { getStyles } from '../../utils';
 import { LineSeparatorPositionType } from '../lineSeparator';
-export const FooterStyled = styled.div `
-  ${({ lineSeparatorLineStyles }) => lineSeparatorLineStyles?.buildLineStyles?.(LineSeparatorPositionType.TOP)}
-  ${props => getStyles(props.styles?.rootContainer)}
+export const FooterSectionStyled = styled.div `
+  ${props => getStyles(props.styles?.contentContainer)}
 
   display: flex;
-  ${() => ({ theme: { MEDIA_QUERIES: { onlyMobile, tabletAndDesktop }, }, $forceVertical, $tabInverse, }) => css `
-      ${tabletAndDesktop} {
-        flex-direction: ${$forceVertical
-    ? $tabInverse
+  width: 100%;
+  ${({ $justifyContent, $setVertical, $flexReverse, $alignItems, theme: { MEDIA_QUERIES: { onlyMobile, tabletAndDesktop }, }, }) => css `
+    ${onlyMobile} {
+      flex-direction: ${$flexReverse ? 'column-reverse' : 'column'};
+    }
+
+    ${tabletAndDesktop} {
+      align-items: ${$alignItems};
+      justify-content: ${$setVertical ? 'center' : $justifyContent};
+      flex-direction: ${$setVertical
+    ? $flexReverse
         ? 'column-reverse'
         : 'column'
-    : $tabInverse
+    : $flexReverse
         ? 'row-reverse'
         : 'row'};
-      }
-      ${onlyMobile} {
-        flex-direction: ${$tabInverse ? 'column-reverse' : 'column'};
-        justify-content: center;
-      }
-    `};
+    }
+  `};
 `;
-export const FooterSectionStyled = styled.div `
-  ${props => getStyles(props.styles?.contentContainer)}
+export const FooterStyled = styled.div `
+  ${({ lineSeparatorLineStyles }) => lineSeparatorLineStyles?.buildLineStyles?.(LineSeparatorPositionType.TOP)}
+  ${props => getStyles(props.styles?.rootContainer)}
 
   display: flex;
-  width: 100%;
-  ${() => ({ theme: { MEDIA_QUERIES: { onlyMobile, tabletAndDesktop }, }, $justifyContent, $forceVertical, $tabInverse, }) => css `
-      ${tabletAndDesktop} {
-        justify-content: ${$forceVertical ? 'center' : $justifyContent};
-        flex-direction: ${$forceVertical
-    ? $tabInverse
+  ${({ $setVertical, $flexReverse, theme: { MEDIA_QUERIES: { onlyMobile, tabletAndDesktop }, }, }) => css `
+    ${onlyMobile} {
+      flex-direction: ${$flexReverse ? 'column-reverse' : 'column'};
+    }
+
+    ${tabletAndDesktop} {
+      flex-direction: ${$setVertical
+    ? $flexReverse
         ? 'column-reverse'
         : 'column'
-    : $tabInverse
+    : $flexReverse
         ? 'row-reverse'
         : 'row'};
-
-        align-items: ${$forceVertical && 'center'};
-      }
-      ${onlyMobile} {
-        flex-direction: ${$tabInverse ? 'column-reverse' : 'column'};
-        align-items: center;
-      }
-    `};
+    }
+  `};
 `;
 //# sourceMappingURL=footer.styled.js.map