reso-ui 3.0.0-alpha.4 → 3.0.0-alpha.6

package/dist/cjs/components/Containers/Flex/Flex.js

@@ -6,7 +6,7 @@ var styles = require('../../../utils/styles.js');
 // BEWARE
 // when using this component you need to set specific height
 // 100% height would not work with flex
-const Flex = ({ direction = "row", justify = "space-between", align = "center", grow = false, shrink = true, basis = "auto", wrap = false, fullWidth = false, widthFitContent = false, children, rootClassName, borderColor = null, rootStyles = {}, ...props }) => {
+const Flex = React.forwardRef(({ direction = "row", justify = "space-between", align = "center", grow = false, shrink = true, basis = "auto", wrap = false, fullWidth = false, widthFitContent = false, children, rootClassName, borderColor = null, rootStyles = {}, ...props }, ref) => {
     const containerStyles = styles.createComponentStyles(styles.createLayoutStyles(styles.withSpacingsProps({
         resoui_flex_container: true,
         [`resoui_flex_${direction}`]: true,
@@ -20,13 +20,18 @@ const Flex = ({ direction = "row", justify = "space-between", align = "center",
         resoui_width_full: fullWidth,
         resoui_width_fit_content: widthFitContent,
     }));
-    const flexBasis = basis && basis === "auto" ? "auto" : typeof basis === "string" ? basis : 0;
-    return (React.createElement("div", { "data-testid": "flex-container-root", style: {
+    const flexBasis = basis && basis === "auto"
+        ? "auto"
+        : typeof basis === "string"
+            ? basis
+            : 0;
+    return (React.createElement("div", { ref: ref, "data-testid": "flex-container-root", style: {
             border: borderColor ? `2px solid ${borderColor}` : null,
             flexBasis,
             ...rootStyles,
         }, className: containerStyles, ...props }, children));
-};
+});
+Flex.displayName = "Flex";
 
 exports.Flex = Flex;
 //# sourceMappingURL=Flex.js.map

package/dist/cjs/components/Containers/Flex/Flex.js.map

@@ -1 +1 @@
-{"version":3,"file":"Flex.js","sources":["../../../../../src/library/components/Containers/Flex/Flex.tsx"],"sourcesContent":[null],"names":["createComponentStyles","createLayoutStyles","withSpacingsProps"],"mappings":";;;;;AAkCA;AACA;AACA;AAEO,MAAM,IAAI,GAAG,CAAC,EACnB,SAAS,GAAG,KAAK,EACjB,OAAO,GAAG,eAAe,EACzB,KAAK,GAAG,QAAQ,EAChB,IAAI,GAAG,KAAK,EACZ,MAAM,GAAG,IAAI,EACb,KAAK,GAAG,MAAM,EACd,IAAI,GAAG,KAAK,EACZ,SAAS,GAAG,KAAK,EACjB,eAAe,GAAG,KAAK,EACvB,QAAQ,EACR,aAAa,EACb,WAAW,GAAG,IAAI,EAClB,UAAU,GAAG,EAAE,EACf,GAAG,KAAK,EACG,KAAI;AACf,IAAA,MAAM,eAAe,GAAGA,4BAAqB,CAC3CC,yBAAkB,CAChBC,wBAAiB,CACf;AACE,QAAA,qBAAqB,EAAE,IAAI;AAC3B,QAAA,CAAC,CAAA,YAAA,EAAe,SAAS,CAAA,CAAE,GAAG,IAAI;AAClC,QAAA,CAAC,CAAA,oBAAA,EAAuB,OAAO,CAAA,CAAE,GAAG,IAAI;AACxC,QAAA,CAAC,CAAA,kBAAA,EAAqB,KAAK,CAAA,CAAE,GAAG,IAAI;AACpC,QAAA,gBAAgB,EAAE,IAAI;AACtB,QAAA,kBAAkB,EAAE,MAAM;QAC1B,qBAAqB,EAAE,CAAC,MAAM;AAC9B,QAAA,gBAAgB,EAAE,IAAI;AACvB,KAAA,EACD,KAAK,CACN,EACD,aAAa,EACb;AACE,QAAA,iBAAiB,EAAE,SAAS;AAC5B,QAAA,wBAAwB,EAAE,eAAe;AAC1C,KAAA,CACF,CACF;IAED,MAAM,SAAS,GACb,KAAK,IAAI,KAAK,KAAK,MAAM,GAAG,MAAM,GAAG,OAAO,KAAK,KAAK,QAAQ,GAAG,KAAK,GAAG,CAAC;AAE5E,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,aAAA,EACc,qBAAqB,EACjC,KAAK,EAAE;YACL,MAAM,EAAE,WAAW,GAAG,CAAA,UAAA,EAAa,WAAW,CAAA,CAAE,GAAG,IAAI;YACvD,SAAS;AACT,YAAA,GAAG,UAAU;SACd,EACD,SAAS,EAAE,eAAe,EAAA,GACtB,KAAK,EAAA,EAER,QAAQ,CACL;AAEV;;;;"}
+{"version":3,"file":"Flex.js","sources":["../../../../../src/library/components/Containers/Flex/Flex.tsx"],"sourcesContent":[null],"names":["createComponentStyles","createLayoutStyles","withSpacingsProps"],"mappings":";;;;;AAkCA;AACA;AACA;AAEO,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAClC,CACE,EACE,SAAS,GAAG,KAAK,EACjB,OAAO,GAAG,eAAe,EACzB,KAAK,GAAG,QAAQ,EAChB,IAAI,GAAG,KAAK,EACZ,MAAM,GAAG,IAAI,EACb,KAAK,GAAG,MAAM,EACd,IAAI,GAAG,KAAK,EACZ,SAAS,GAAG,KAAK,EACjB,eAAe,GAAG,KAAK,EACvB,QAAQ,EACR,aAAa,EACb,WAAW,GAAG,IAAI,EAClB,UAAU,GAAG,EAAE,EACf,GAAG,KAAK,EACT,EACD,GAAG,KACD;AACF,IAAA,MAAM,eAAe,GAAGA,4BAAqB,CAC3CC,yBAAkB,CAChBC,wBAAiB,CACf;AACE,QAAA,qBAAqB,EAAE,IAAI;AAC3B,QAAA,CAAC,CAAA,YAAA,EAAe,SAAS,CAAA,CAAE,GAAG,IAAI;AAClC,QAAA,CAAC,CAAA,oBAAA,EAAuB,OAAO,CAAA,CAAE,GAAG,IAAI;AACxC,QAAA,CAAC,CAAA,kBAAA,EAAqB,KAAK,CAAA,CAAE,GAAG,IAAI;AACpC,QAAA,gBAAgB,EAAE,IAAI;AACtB,QAAA,kBAAkB,EAAE,MAAM;QAC1B,qBAAqB,EAAE,CAAC,MAAM;AAC9B,QAAA,gBAAgB,EAAE,IAAI;AACvB,KAAA,EACD,KAAK,CACN,EACD,aAAa,EACb;AACE,QAAA,iBAAiB,EAAE,SAAS;AAC5B,QAAA,wBAAwB,EAAE,eAAe;AAC1C,KAAA,CACF,CACF;AAED,IAAA,MAAM,SAAS,GACb,KAAK,IAAI,KAAK,KAAK;AACjB,UAAE;AACF,UAAE,OAAO,KAAK,KAAK;AACjB,cAAE;cACA,CAAC;IAET,QACE,6BACE,GAAG,EAAE,GAAG,EAAA,aAAA,EACI,qBAAqB,EACjC,KAAK,EAAE;YACL,MAAM,EAAE,WAAW,GAAG,CAAA,UAAA,EAAa,WAAW,CAAA,CAAE,GAAG,IAAI;YACvD,SAAS;AACT,YAAA,GAAG,UAAU;SACd,EACD,SAAS,EAAE,eAAe,EAAA,GACtB,KAAK,EAAA,EAER,QAAQ,CACL;AAEV,CAAC;AAGH,IAAI,CAAC,WAAW,GAAG,MAAM;;;;"}

package/dist/cjs/components/Flex-Table/Flex-Table-Cell/Flex-Table-Cell.js

@@ -0,0 +1,23 @@
+'use strict';
+
+var React = require('react');
+var styles = require('../../../utils/styles.js');
+
+const FlexTableCell = ({ children, width, minWidth, isMobile, contentType = "text", label, showLabel = false, isHeader = false, rootClassName, rootStyles = {}, ...spacingsProps }) => {
+    const containerStyles = styles.createComponentStyles(styles.createLayoutStyles(styles.withSpacingsProps({
+        resoui_flexTable_cell: true,
+        resoui_flexTable_cell_mobile: isMobile,
+    }, spacingsProps), rootClassName));
+    const cellStyles = {
+        width: isMobile ? "100%" : width !== "auto" ? `${width}px` : undefined,
+        minWidth: `${minWidth}px`,
+        flex: width === "auto" ? 1 : undefined,
+        ...rootStyles,
+    };
+    return (React.createElement("div", { className: containerStyles, style: cellStyles, "data-testid": "flex-table-cell-root" },
+        showLabel && label && (React.createElement("span", { className: "resoui_flexTable_cell_label" }, label)),
+        contentType === "text" ? (React.createElement("span", { className: `resoui_flexTable_cell_text${isHeader ? " resoui_flexTable_cell_text_header" : ""}` }, children)) : (children)));
+};
+
+exports.FlexTableCell = FlexTableCell;
+//# sourceMappingURL=Flex-Table-Cell.js.map

package/dist/cjs/components/Flex-Table/Flex-Table-Cell/Flex-Table-Cell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Flex-Table-Cell.js","sources":["../../../../../src/library/components/Flex-Table/Flex-Table-Cell/Flex-Table-Cell.tsx"],"sourcesContent":[null],"names":["createComponentStyles","createLayoutStyles","withSpacingsProps"],"mappings":";;;;;AA4BO,MAAM,aAAa,GAAG,CAAC,EAC5B,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,WAAW,GAAG,MAAM,EACpB,KAAK,EACL,SAAS,GAAG,KAAK,EACjB,QAAQ,GAAG,KAAK,EAChB,aAAa,EACb,UAAU,GAAG,EAAE,EACf,GAAG,aAAa,EACI,KAAI;AACxB,IAAA,MAAM,eAAe,GAAGA,4BAAqB,CAC3CC,yBAAkB,CAChBC,wBAAiB,CACf;AACE,QAAA,qBAAqB,EAAE,IAAI;AAC3B,QAAA,4BAA4B,EAAE,QAAQ;AACvC,KAAA,EACD,aAAa,CACd,EACD,aAAa,CACd,CACF;AAED,IAAA,MAAM,UAAU,GAAwB;QACtC,KAAK,EAAE,QAAQ,GAAG,MAAM,GAAG,KAAK,KAAK,MAAM,GAAG,CAAA,EAAG,KAAK,CAAA,EAAA,CAAI,GAAG,SAAS;QACtE,QAAQ,EAAE,CAAA,EAAG,QAAQ,CAAA,EAAA,CAAI;QACzB,IAAI,EAAE,KAAK,KAAK,MAAM,GAAG,CAAC,GAAG,SAAS;AACtC,QAAA,GAAG,UAAU;KACd;IAED,QACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,eAAe,EAC1B,KAAK,EAAE,UAAU,EAAA,aAAA,EACL,sBAAsB,EAAA;QAEjC,SAAS,IAAI,KAAK,KACjB,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,6BAA6B,EAAA,EAAE,KAAK,CAAQ,CAC7D;AACA,QAAA,WAAW,KAAK,MAAM,IACrB,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EACE,SAAS,EAAE,CAAA,0BAAA,EAA6B,QAAQ,GAAG,oCAAoC,GAAG,EAAE,CAAA,CAAE,EAAA,EAE7F,QAAQ,CACJ,KAEP,QAAQ,CACT,CACG;AAEV;;;;"}

package/dist/cjs/components/Flex-Table/Flex-Table-Container/Flex-Table-Container.js

@@ -0,0 +1,15 @@
+'use strict';
+
+var React = require('react');
+var styles = require('../../../utils/styles.js');
+
+const FlexTableContainer = ({ children, autoHeight = false, rootClassName, rootStyles = {}, ...spacingsProps }) => {
+    const containerStyles = styles.createComponentStyles(styles.createLayoutStyles(styles.withSpacingsProps({
+        resoui_flexTable_container: true,
+        resoui_flexTable_container_autoHeight: autoHeight,
+    }, spacingsProps), rootClassName));
+    return (React.createElement("div", { className: containerStyles, style: rootStyles, "data-testid": "flex-table-container-root" }, children));
+};
+
+exports.FlexTableContainer = FlexTableContainer;
+//# sourceMappingURL=Flex-Table-Container.js.map

package/dist/cjs/components/Flex-Table/Flex-Table-Container/Flex-Table-Container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Flex-Table-Container.js","sources":["../../../../../src/library/components/Flex-Table/Flex-Table-Container/Flex-Table-Container.tsx"],"sourcesContent":[null],"names":["createComponentStyles","createLayoutStyles","withSpacingsProps"],"mappings":";;;;;MAsBa,kBAAkB,GAAG,CAAC,EACjC,QAAQ,EACR,UAAU,GAAG,KAAK,EAClB,aAAa,EACb,UAAU,GAAG,EAAE,EACf,GAAG,aAAa,EACS,KAAI;AAC7B,IAAA,MAAM,eAAe,GAAGA,4BAAqB,CAC3CC,yBAAkB,CAChBC,wBAAiB,CACf;AACE,QAAA,0BAA0B,EAAE,IAAI;AAChC,QAAA,qCAAqC,EAAE,UAAU;AAClD,KAAA,EACD,aAAa,CACd,EACD,aAAa,CACd,CACF;AAED,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,eAAe,EAC1B,KAAK,EAAE,UAAU,iBACL,2BAA2B,EAAA,EAEtC,QAAQ,CACL;AAEV;;;;"}

package/dist/cjs/components/Flex-Table/Flex-Table-Row/Flex-Table-Row.js

@@ -0,0 +1,28 @@
+'use strict';
+
+var React = require('react');
+var styles = require('../../../utils/styles.js');
+var validations = require('../../../utils/validations.js');
+
+const FlexTableRow = ({ children, itemId, namespace, isMobile, active = false, isHeader = false, onClick, disabled = false, rootClassName, rootStyles = {}, ...spacingsProps }) => {
+    const containerStyles = styles.createComponentStyles(styles.createLayoutStyles(styles.withSpacingsProps({
+        resoui_flexTable_row: true,
+        resoui_flexTable_row_desktop: !isMobile,
+        resoui_flexTable_row_mobile: isMobile,
+        resoui_flexTable_row_active: active,
+        resoui_flexTable_row_header: isHeader,
+        resoui_flexTable_row_disabled: disabled,
+    }, spacingsProps), rootClassName));
+    return (React.createElement("div", { id: itemId, key: `manage-${namespace}-page-list-${itemId}`, className: containerStyles, style: rootStyles, "data-testid": "flex-table-row-root", onClick: (e) => {
+            if (disabled)
+                return;
+            e.preventDefault();
+            e.stopPropagation();
+            if (validations.methodHasValue(onClick)) {
+                onClick();
+            }
+        } }, children));
+};
+
+exports.FlexTableRow = FlexTableRow;
+//# sourceMappingURL=Flex-Table-Row.js.map

package/dist/cjs/components/Flex-Table/Flex-Table-Row/Flex-Table-Row.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Flex-Table-Row.js","sources":["../../../../../src/library/components/Flex-Table/Flex-Table-Row/Flex-Table-Row.tsx"],"sourcesContent":[null],"names":["createComponentStyles","createLayoutStyles","withSpacingsProps","methodHasValue"],"mappings":";;;;;;AA6BO,MAAM,YAAY,GAAG,CAAC,EAC3B,QAAQ,EACR,MAAM,EACN,SAAS,EACT,QAAQ,EACR,MAAM,GAAG,KAAK,EACd,QAAQ,GAAG,KAAK,EAChB,OAAO,EACP,QAAQ,GAAG,KAAK,EAChB,aAAa,EACb,UAAU,GAAG,EAAE,EACf,GAAG,aAAa,EACG,KAAI;AACvB,IAAA,MAAM,eAAe,GAAGA,4BAAqB,CAC3CC,yBAAkB,CAChBC,wBAAiB,CACf;AACE,QAAA,oBAAoB,EAAE,IAAI;QAC1B,4BAA4B,EAAE,CAAC,QAAQ;AACvC,QAAA,2BAA2B,EAAE,QAAQ;AACrC,QAAA,2BAA2B,EAAE,MAAM;AACnC,QAAA,2BAA2B,EAAE,QAAQ;AACrC,QAAA,6BAA6B,EAAE,QAAQ;AACxC,KAAA,EACD,aAAa,CACd,EACD,aAAa,CACd,CACF;AAED,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,EAAE,EAAE,MAAM,EACV,GAAG,EAAE,CAAA,OAAA,EAAU,SAAS,CAAA,WAAA,EAAc,MAAM,CAAA,CAAE,EAC9C,SAAS,EAAE,eAAe,EAC1B,KAAK,EAAE,UAAU,EAAA,aAAA,EACL,qBAAqB,EACjC,OAAO,EAAE,CAAC,CAAC,KAAI;AACb,YAAA,IAAI,QAAQ;gBAAE;YACd,CAAC,CAAC,cAAc,EAAE;YAClB,CAAC,CAAC,eAAe,EAAE;AACnB,YAAA,IAAIC,0BAAc,CAAC,OAAO,CAAC,EAAE;AAC3B,gBAAA,OAAO,EAAE;YACX;AACF,QAAA,CAAC,EAAA,EAEA,QAAQ,CACL;AAEV;;;;"}

package/dist/cjs/forms/Controls/Dropdown/Dropdown-Select/Dropdown-Select.js

@@ -5,13 +5,13 @@ var classnames = require('classnames');
 var dropdown_down = require('../../../../icons/svg/dropdown_down.svg.js');
 var styles = require('../../../../utils/styles.js');
 var validations = require('../../../../utils/validations.js');
+require('../../../../components/Containers/Flex/Flex.js');
 require('../../../../components/Dnd/Dnd-Array-Sorter/Dnd-Array-Sorter-Draggable-Wrapper.js');
 require('../../../../components/Dnd/Dnd-Array-Sorter/context/DndArraySorterContext.js');
 var useClickOutside = require('../../../../hooks/useClickOutside.js');
 require('../../../../context/ThemeContext.js');
 var Icon = require('../../../../components/Icon/Icon.js');
 require('../../../../context/ResponsiveContext.js');
-require('../../../../components/Tabs/Tabs.js');
 var index = require('../../../Validators/index.js');
 var useInputValidatorsMemo = require('../../../Hooks/useInputValidatorsMemo.js');
 var DropdownOption = require('../Dropdown-Option/Dropdown-Option.js');

package/dist/cjs/forms/Controls/Text-Area/Text-Area.js

@@ -5,15 +5,7 @@ var styles = require('../../../utils/styles.js');
 var index = require('../../Validators/index.js');
 var useInputValidatorsMemo = require('../../Hooks/useInputValidatorsMemo.js');
 
-const TextArea = ({ id = null, value, onChange, onBlur, onFocus, onKeyDown, useHTMLErrorMessage = false, noShadowOnFocus = false, validateOnLoad, error, setError, disabled = false, required = false, readonly = false, autofocus = false, 
-/**
- * Text Area - specific props
- */
-wrap = "soft", placeholder, cols: _cols = 50, rows = 4, formId, minLength, maxLength = 255, name = "resoui_textarea_input", 
-/**
- * Inherited props
- */
-rootClassName, rootStyles = {}, inputClassName, inputStyles = {}, customValidators = [], ...spacingsProps }) => {
+const TextArea = React.forwardRef(({ id = null, value, onChange, onBlur, onFocus, onKeyDown, useHTMLErrorMessage = false, noShadowOnFocus = false, validateOnLoad, error, setError, disabled = false, required = false, readonly = false, autofocus = false, wrap = "soft", placeholder, cols: _cols = 50, rows = 4, formId, minLength, maxLength = 255, name = "resoui_textarea_input", rootClassName, rootStyles = {}, inputClassName, inputStyles = {}, customValidators = [], ...spacingsProps }, ref) => {
     const inputValidators = useInputValidatorsMemo.default("string", {
         required,
         minLength,
@@ -47,9 +39,10 @@ rootClassName, rootStyles = {}, inputClassName, inputStyles = {}, customValidato
         disabled,
     }));
     return (React.createElement("div", { "data-testid": `text-area-${id}-container`, className: containerClasses, style: rootStyles },
-        React.createElement("textarea", { "data-testid": `text-area-${id}-input`, wrap: wrap, id: id, value: value ? value : "", onChange: handleInputChange, onBlur: onBlur, onFocus: onFocus, onInvalid: handleInputInvalid, disabled: disabled, readOnly: readonly, required: required, autoFocus: autofocus, onKeyDown: onKeyDown, rows: rows, form: formId, name: name, placeholder: placeholder, minLength: minLength, maxLength: maxLength, className: inputClasses, style: inputStyles }),
+        React.createElement("textarea", { ref: ref, "data-testid": `text-area-${id}-input`, wrap: wrap, id: id, value: value ? value : "", onChange: handleInputChange, onBlur: onBlur, onFocus: onFocus, onInvalid: handleInputInvalid, disabled: disabled, readOnly: readonly, required: required, autoFocus: autofocus, onKeyDown: onKeyDown, rows: rows, form: formId, name: name, placeholder: placeholder, minLength: minLength, maxLength: maxLength, className: inputClasses, style: inputStyles }),
         error && (React.createElement("p", { "data-testid": `text-area-${id}-error`, className: "resoui_form_input_error" }, error))));
-};
+});
+TextArea.displayName = "TextArea";
 
 exports.TextArea = TextArea;
 //# sourceMappingURL=Text-Area.js.map

package/dist/cjs/forms/Controls/Text-Area/Text-Area.js.map

@@ -1 +1 @@
-{"version":3,"file":"Text-Area.js","sources":["../../../../../src/library/forms/Controls/Text-Area/Text-Area.tsx"],"sourcesContent":[null],"names":["useInputValidatorsMemo","useEffect","validate","createComponentStyles","createLayoutStyles","withSpacingsProps"],"mappings":"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"}
+{"version":3,"file":"Text-Area.js","sources":["../../../../../src/library/forms/Controls/Text-Area/Text-Area.tsx"],"sourcesContent":[null],"names":["useInputValidatorsMemo","useEffect","validate","createComponentStyles","createLayoutStyles","withSpacingsProps"],"mappings":"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"}

package/dist/cjs/index.js

@@ -11,7 +11,6 @@ var CenterContainer = require('./components/Containers/Center-Container/Center-C
 var Flex = require('./components/Containers/Flex/Flex.js');
 var HorizontalScrollContainer = require('./components/Containers/Horizontal-Scroll-Container/Horizontal-Scroll-Container.js');
 var HorizontalScrollItem = require('./components/Containers/Horizontal-Scroll-Item/Horizontal-Scroll-Item.js');
-var InfiniteScrollContainer = require('./components/Containers/Infinite-Scroll-Container/Infinite-Scroll-Container.js');
 var LoadingContainer = require('./components/Containers/Loading-Container/Loading-Container.js');
 var Main = require('./components/Containers/Main/Main.js');
 var View = require('./components/Containers/View/View.js');
@@ -22,6 +21,9 @@ var ComponentError = require('./components/Errors/Component-Error/Component-Erro
 var FullScreenError = require('./components/Errors/Full-Screen-Error/Full-Screen-Error.js');
 var Example = require('./components/Example/Example.js');
 var ExternalLinks = require('./components/External-Links/External-Links.js');
+var FlexTableContainer = require('./components/Flex-Table/Flex-Table-Container/Flex-Table-Container.js');
+var FlexTableRow = require('./components/Flex-Table/Flex-Table-Row/Flex-Table-Row.js');
+var FlexTableCell = require('./components/Flex-Table/Flex-Table-Cell/Flex-Table-Cell.js');
 var Footer = require('./components/Footer/Footer.js');
 var Icon = require('./components/Icon/Icon.js');
 var Hero = require('./components/Images/Hero/Hero.js');
@@ -34,18 +36,10 @@ var ModalBody = require('./components/Modal/Modal-Body/Modal-Body.js');
 var ModalHeader = require('./components/Modal/Modal-Header/Modal-Header.js');
 var Navbar = require('./components/Nav/Navbar/Navbar.js');
 var NavItem = require('./components/Nav/NavItem/NavItem.js');
-var Paginator = require('./components/Paginator/Paginator.js');
 var PanelContainer = require('./components/Panel/Panel-Container/Panel-Container.js');
 var PanelTitle = require('./components/Panel/Panel-Title/Panel-Title.js');
 var PanelRow = require('./components/Panel/Panel-Row/Panel-Row.js');
 var QuantityCounter = require('./components/Quantity-Counter/Quantity-Counter.js');
-var Sidebar = require('./components/Sidebar/Sidebar.js');
-var SidebarNavLink = require('./components/Sidebar/SidebarNavLink.js');
-var FlexTable = require('./components/Table/FlexTable.js');
-var Tabs = require('./components/Tabs/Tabs.js');
-var TabList = require('./components/Tabs/TabList.js');
-var Tab = require('./components/Tabs/Tab.js');
-var TabPanel = require('./components/Tabs/TabPanel.js');
 var Text = require('./components/Text/Text.js');
 var FormContainer = require('./forms/Containers/Form-Container/Form-Container.js');
 var SubFormContainer = require('./forms/Containers/Sub-Form-Container/Sub-Form-Container.js');
@@ -119,7 +113,6 @@ exports.CenterContainer = CenterContainer.CenterContainer;
 exports.Flex = Flex.Flex;
 exports.HorizontalScrollContainer = HorizontalScrollContainer.HorizontalScrollContainer;
 exports.HorizontalScrollItem = HorizontalScrollItem.HorizontalScrollItem;
-exports.InfiniteScrollContainer = InfiniteScrollContainer.InfiniteScrollContainer;
 exports.LoadingContainer = LoadingContainer.LoadingContainer;
 exports.Main = Main.Main;
 exports.View = View.View;
@@ -130,6 +123,9 @@ exports.ComponentError = ComponentError.ComponentError;
 exports.FullScreenError = FullScreenError.FullScreenError;
 exports.Example = Example.Example;
 exports.ExternalLinks = ExternalLinks.ExternalLinks;
+exports.FlexTableContainer = FlexTableContainer.FlexTableContainer;
+exports.FlexTableRow = FlexTableRow.FlexTableRow;
+exports.FlexTableCell = FlexTableCell.FlexTableCell;
 exports.Footer = Footer.Footer;
 exports.Icon = Icon.Icon;
 exports.Hero = Hero.Hero;
@@ -142,18 +138,10 @@ exports.ModalBody = ModalBody.ModalBody;
 exports.ModalHeader = ModalHeader.ModalHeader;
 exports.Navbar = Navbar.Navbar;
 exports.NavItem = NavItem.NavItem;
-exports.Paginator = Paginator.Paginator;
 exports.PanelContainer = PanelContainer.PanelContainer;
 exports.PanelTitle = PanelTitle.PanelTitle;
 exports.PanelRow = PanelRow.PanelRow;
 exports.QuantityCounter = QuantityCounter.QuantityCounter;
-exports.Sidebar = Sidebar.Sidebar;
-exports.SidebarNavLink = SidebarNavLink.SidebarNavLink;
-exports.FlexTable = FlexTable.FlexTable;
-exports.Tabs = Tabs.Tabs;
-exports.TabList = TabList.TabList;
-exports.Tab = Tab.Tab;
-exports.TabPanel = TabPanel.TabPanel;
 exports.Text = Text.Text;
 exports.FormContainer = FormContainer.FormContainer;
 exports.SubFormContainer = SubFormContainer.SubFormContainer;

package/dist/cjs/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/providers/ThemeProvider.js

@@ -25,8 +25,23 @@ const ThemeProvider = ({ children, theme: theme$1 = {}, mode: modeProp = "light"
     const handleSetMode = React.useCallback((newMode) => {
         setMode(newMode);
     }, []);
-    return (React.createElement(ThemeContext.ThemeContext.Provider, { value: { mode, resolvedMode, setMode: handleSetMode, theme: mergedConfig } },
-        React.createElement("div", { style: cssVars, "data-resoui-theme": resolvedMode }, children)));
+    React.useEffect(() => {
+        const el = document.getElementById("root");
+        if (!el)
+            return;
+        el.setAttribute("data-resoui-theme", resolvedMode);
+        const varKeys = Object.keys(cssVars);
+        varKeys.forEach((key) => {
+            el.style.setProperty(key, cssVars[key]);
+        });
+        return () => {
+            el.removeAttribute("data-resoui-theme");
+            varKeys.forEach((key) => {
+                el.style.removeProperty(key);
+            });
+        };
+    }, [cssVars, resolvedMode]);
+    return (React.createElement(ThemeContext.ThemeContext.Provider, { value: { mode, resolvedMode, setMode: handleSetMode, theme: mergedConfig } }, children));
 };
 
 exports.ThemeProvider = ThemeProvider;

package/dist/cjs/providers/ThemeProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.js","sources":["../../../src/library/providers/ThemeProvider.tsx"],"sourcesContent":[null],"names":["theme","useState","getSystemMode","useEffect","useMemo","buildCssVars","darkTheme","useCallback","ThemeContext"],"mappings":";;;;;;;AAYO,MAAM,aAAa,GAAG,CAAC,EAAE,QAAQ,SAAEA,OAAK,GAAG,EAAE,EAAE,IAAI,EAAE,QAAQ,GAAG,OAAO,EAAuB,KAAI;IACvG,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAGC,cAAQ,CAAY,QAAQ,CAAC;IACrD,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAGA,cAAQ,CAAmBC,mBAAa,CAAC;IAE7EC,eAAS,CAAC,MAAK;QACb,IAAI,IAAI,KAAK,QAAQ;YAAE;QACvB,MAAM,EAAE,GAAG,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC;QAC5D,MAAM,OAAO,GAAG,CAAC,CAAsB,KAAK,aAAa,CAAC,CAAC,CAAC,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC;AACvF,QAAA,EAAE,CAAC,gBAAgB,CAAC,QAAQ,EAAE,OAAO,CAAC;QACtC,OAAO,MAAM,EAAE,CAAC,mBAAmB,CAAC,QAAQ,EAAE,OAAO,CAAC;AACxD,IAAA,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC;AAEV,IAAA,MAAM,YAAY,GAAqB,IAAI,KAAK,QAAQ,GAAG,UAAU,GAAG,IAAI;AAE5E,IAAA,MAAM,YAAY,GAAGC,aAAO,CAC1B,OAAO;QACL,MAAM,EAAE,EAAE,IAAIJ,OAAK,CAAC,MAAM,IAAI,EAAE,CAAC,EAAE;QACnC,MAAM,EAAE,EAAE,IAAIA,OAAK,CAAC,MAAM,IAAI,EAAE,CAAC,EAAE;AACpC,KAAA,CAAC,EACF,CAACA,OAAK,CAAC,CACR;AAED,IAAA,MAAM,OAAO,GAAGI,aAAO,CACrB,MAAMC,kBAAY,CAAC,YAAY,EAAE,YAAY,KAAK,MAAM,GAAGC,mBAAS,GAAG,SAAS,CAAC,EACjF,CAAC,YAAY,EAAE,YAAY,CAAC,CAC7B;AAED,IAAA,MAAM,aAAa,GAAGC,iBAAW,CAAC,CAAC,OAAkB,KAAI;QACvD,OAAO,CAAC,OAAO,CAAC;IAClB,CAAC,EAAE,EAAE,CAAC;IAEN,QACE,oBAACC,yBAAY,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,YAAY,EAAE,EAAA;QAC/F,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,OAAO,EAAA,mBAAA,EAAqB,YAAY,IACjD,QAAQ,CACL,CACgB;AAE5B;;;;"}
+{"version":3,"file":"ThemeProvider.js","sources":["../../../src/library/providers/ThemeProvider.tsx"],"sourcesContent":[null],"names":["theme","useState","getSystemMode","useEffect","useMemo","buildCssVars","darkTheme","useCallback","ThemeContext"],"mappings":";;;;;;;AAYO,MAAM,aAAa,GAAG,CAAC,EAAE,QAAQ,SAAEA,OAAK,GAAG,EAAE,EAAE,IAAI,EAAE,QAAQ,GAAG,OAAO,EAAuB,KAAI;IACvG,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAGC,cAAQ,CAAY,QAAQ,CAAC;IACrD,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAGA,cAAQ,CAAmBC,mBAAa,CAAC;IAE7EC,eAAS,CAAC,MAAK;QACb,IAAI,IAAI,KAAK,QAAQ;YAAE;QACvB,MAAM,EAAE,GAAG,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC;QAC5D,MAAM,OAAO,GAAG,CAAC,CAAsB,KAAK,aAAa,CAAC,CAAC,CAAC,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC;AACvF,QAAA,EAAE,CAAC,gBAAgB,CAAC,QAAQ,EAAE,OAAO,CAAC;QACtC,OAAO,MAAM,EAAE,CAAC,mBAAmB,CAAC,QAAQ,EAAE,OAAO,CAAC;AACxD,IAAA,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC;AAEV,IAAA,MAAM,YAAY,GAAqB,IAAI,KAAK,QAAQ,GAAG,UAAU,GAAG,IAAI;AAE5E,IAAA,MAAM,YAAY,GAAGC,aAAO,CAC1B,OAAO;QACL,MAAM,EAAE,EAAE,IAAIJ,OAAK,CAAC,MAAM,IAAI,EAAE,CAAC,EAAE;QACnC,MAAM,EAAE,EAAE,IAAIA,OAAK,CAAC,MAAM,IAAI,EAAE,CAAC,EAAE;AACpC,KAAA,CAAC,EACF,CAACA,OAAK,CAAC,CACR;AAED,IAAA,MAAM,OAAO,GAAGI,aAAO,CACrB,MAAMC,kBAAY,CAAC,YAAY,EAAE,YAAY,KAAK,MAAM,GAAGC,mBAAS,GAAG,SAAS,CAAC,EACjF,CAAC,YAAY,EAAE,YAAY,CAAC,CAC7B;AAED,IAAA,MAAM,aAAa,GAAGC,iBAAW,CAAC,CAAC,OAAkB,KAAI;QACvD,OAAO,CAAC,OAAO,CAAC;IAClB,CAAC,EAAE,EAAE,CAAC;IAENJ,eAAS,CAAC,MAAK;QACb,MAAM,EAAE,GAAG,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC;AAC1C,QAAA,IAAI,CAAC,EAAE;YAAE;AAET,QAAA,EAAE,CAAC,YAAY,CAAC,mBAAmB,EAAE,YAAY,CAAC;QAElD,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC;AACpC,QAAA,OAAO,CAAC,OAAO,CAAC,CAAC,GAAG,KAAI;AACtB,YAAA,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,GAAG,EAAG,OAAkC,CAAC,GAAG,CAAC,CAAC;AACrE,QAAA,CAAC,CAAC;AAEF,QAAA,OAAO,MAAK;AACV,YAAA,EAAE,CAAC,eAAe,CAAC,mBAAmB,CAAC;AACvC,YAAA,OAAO,CAAC,OAAO,CAAC,CAAC,GAAG,KAAI;AACtB,gBAAA,EAAE,CAAC,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC;AAC9B,YAAA,CAAC,CAAC;AACJ,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,OAAO,EAAE,YAAY,CAAC,CAAC;IAE3B,QACE,KAAA,CAAA,aAAA,CAACK,yBAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,YAAY,EAAE,EAAA,EAC9F,QAAQ,CACa;AAE5B;;;;"}

package/dist/esm/components/Containers/Flex/Flex.d.ts

@@ -16,4 +16,4 @@ export interface IFlexProps extends IComponent, ISpacingsProps, React.HTMLAttrib
     className?: string;
     borderColor?: string;
 }
-export declare const Flex: ({ direction, justify, align, grow, shrink, basis, wrap, fullWidth, widthFitContent, children, rootClassName, borderColor, rootStyles, ...props }: IFlexProps) => React.JSX.Element;
+export declare const Flex: React.ForwardRefExoticComponent<IFlexProps & React.RefAttributes<HTMLDivElement>>;

package/dist/esm/components/Containers/Flex/Flex.js

@@ -4,7 +4,7 @@ import { createComponentStyles, createLayoutStyles, withSpacingsProps } from '..
 // BEWARE
 // when using this component you need to set specific height
 // 100% height would not work with flex
-const Flex = ({ direction = "row", justify = "space-between", align = "center", grow = false, shrink = true, basis = "auto", wrap = false, fullWidth = false, widthFitContent = false, children, rootClassName, borderColor = null, rootStyles = {}, ...props }) => {
+const Flex = React__default.forwardRef(({ direction = "row", justify = "space-between", align = "center", grow = false, shrink = true, basis = "auto", wrap = false, fullWidth = false, widthFitContent = false, children, rootClassName, borderColor = null, rootStyles = {}, ...props }, ref) => {
     const containerStyles = createComponentStyles(createLayoutStyles(withSpacingsProps({
         resoui_flex_container: true,
         [`resoui_flex_${direction}`]: true,
@@ -18,13 +18,18 @@ const Flex = ({ direction = "row", justify = "space-between", align = "center",
         resoui_width_full: fullWidth,
         resoui_width_fit_content: widthFitContent,
     }));
-    const flexBasis = basis && basis === "auto" ? "auto" : typeof basis === "string" ? basis : 0;
-    return (React__default.createElement("div", { "data-testid": "flex-container-root", style: {
+    const flexBasis = basis && basis === "auto"
+        ? "auto"
+        : typeof basis === "string"
+            ? basis
+            : 0;
+    return (React__default.createElement("div", { ref: ref, "data-testid": "flex-container-root", style: {
             border: borderColor ? `2px solid ${borderColor}` : null,
             flexBasis,
             ...rootStyles,
         }, className: containerStyles, ...props }, children));
-};
+});
+Flex.displayName = "Flex";
 
 export { Flex };
 //# sourceMappingURL=Flex.js.map

package/dist/esm/components/Containers/Flex/Flex.js.map

@@ -1 +1 @@
-{"version":3,"file":"Flex.js","sources":["../../../../../src/library/components/Containers/Flex/Flex.tsx"],"sourcesContent":[null],"names":["React"],"mappings":";;;AAkCA;AACA;AACA;AAEO,MAAM,IAAI,GAAG,CAAC,EACnB,SAAS,GAAG,KAAK,EACjB,OAAO,GAAG,eAAe,EACzB,KAAK,GAAG,QAAQ,EAChB,IAAI,GAAG,KAAK,EACZ,MAAM,GAAG,IAAI,EACb,KAAK,GAAG,MAAM,EACd,IAAI,GAAG,KAAK,EACZ,SAAS,GAAG,KAAK,EACjB,eAAe,GAAG,KAAK,EACvB,QAAQ,EACR,aAAa,EACb,WAAW,GAAG,IAAI,EAClB,UAAU,GAAG,EAAE,EACf,GAAG,KAAK,EACG,KAAI;AACf,IAAA,MAAM,eAAe,GAAG,qBAAqB,CAC3C,kBAAkB,CAChB,iBAAiB,CACf;AACE,QAAA,qBAAqB,EAAE,IAAI;AAC3B,QAAA,CAAC,CAAA,YAAA,EAAe,SAAS,CAAA,CAAE,GAAG,IAAI;AAClC,QAAA,CAAC,CAAA,oBAAA,EAAuB,OAAO,CAAA,CAAE,GAAG,IAAI;AACxC,QAAA,CAAC,CAAA,kBAAA,EAAqB,KAAK,CAAA,CAAE,GAAG,IAAI;AACpC,QAAA,gBAAgB,EAAE,IAAI;AACtB,QAAA,kBAAkB,EAAE,MAAM;QAC1B,qBAAqB,EAAE,CAAC,MAAM;AAC9B,QAAA,gBAAgB,EAAE,IAAI;AACvB,KAAA,EACD,KAAK,CACN,EACD,aAAa,EACb;AACE,QAAA,iBAAiB,EAAE,SAAS;AAC5B,QAAA,wBAAwB,EAAE,eAAe;AAC1C,KAAA,CACF,CACF;IAED,MAAM,SAAS,GACb,KAAK,IAAI,KAAK,KAAK,MAAM,GAAG,MAAM,GAAG,OAAO,KAAK,KAAK,QAAQ,GAAG,KAAK,GAAG,CAAC;AAE5E,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,aAAA,EACc,qBAAqB,EACjC,KAAK,EAAE;YACL,MAAM,EAAE,WAAW,GAAG,CAAA,UAAA,EAAa,WAAW,CAAA,CAAE,GAAG,IAAI;YACvD,SAAS;AACT,YAAA,GAAG,UAAU;SACd,EACD,SAAS,EAAE,eAAe,EAAA,GACtB,KAAK,EAAA,EAER,QAAQ,CACL;AAEV;;;;"}
+{"version":3,"file":"Flex.js","sources":["../../../../../src/library/components/Containers/Flex/Flex.tsx"],"sourcesContent":[null],"names":["React"],"mappings":";;;AAkCA;AACA;AACA;AAEO,MAAM,IAAI,GAAGA,cAAK,CAAC,UAAU,CAClC,CACE,EACE,SAAS,GAAG,KAAK,EACjB,OAAO,GAAG,eAAe,EACzB,KAAK,GAAG,QAAQ,EAChB,IAAI,GAAG,KAAK,EACZ,MAAM,GAAG,IAAI,EACb,KAAK,GAAG,MAAM,EACd,IAAI,GAAG,KAAK,EACZ,SAAS,GAAG,KAAK,EACjB,eAAe,GAAG,KAAK,EACvB,QAAQ,EACR,aAAa,EACb,WAAW,GAAG,IAAI,EAClB,UAAU,GAAG,EAAE,EACf,GAAG,KAAK,EACT,EACD,GAAG,KACD;AACF,IAAA,MAAM,eAAe,GAAG,qBAAqB,CAC3C,kBAAkB,CAChB,iBAAiB,CACf;AACE,QAAA,qBAAqB,EAAE,IAAI;AAC3B,QAAA,CAAC,CAAA,YAAA,EAAe,SAAS,CAAA,CAAE,GAAG,IAAI;AAClC,QAAA,CAAC,CAAA,oBAAA,EAAuB,OAAO,CAAA,CAAE,GAAG,IAAI;AACxC,QAAA,CAAC,CAAA,kBAAA,EAAqB,KAAK,CAAA,CAAE,GAAG,IAAI;AACpC,QAAA,gBAAgB,EAAE,IAAI;AACtB,QAAA,kBAAkB,EAAE,MAAM;QAC1B,qBAAqB,EAAE,CAAC,MAAM;AAC9B,QAAA,gBAAgB,EAAE,IAAI;AACvB,KAAA,EACD,KAAK,CACN,EACD,aAAa,EACb;AACE,QAAA,iBAAiB,EAAE,SAAS;AAC5B,QAAA,wBAAwB,EAAE,eAAe;AAC1C,KAAA,CACF,CACF;AAED,IAAA,MAAM,SAAS,GACb,KAAK,IAAI,KAAK,KAAK;AACjB,UAAE;AACF,UAAE,OAAO,KAAK,KAAK;AACjB,cAAE;cACA,CAAC;IAET,QACEA,sCACE,GAAG,EAAE,GAAG,EAAA,aAAA,EACI,qBAAqB,EACjC,KAAK,EAAE;YACL,MAAM,EAAE,WAAW,GAAG,CAAA,UAAA,EAAa,WAAW,CAAA,CAAE,GAAG,IAAI;YACvD,SAAS;AACT,YAAA,GAAG,UAAU;SACd,EACD,SAAS,EAAE,eAAe,EAAA,GACtB,KAAK,EAAA,EAER,QAAQ,CACL;AAEV,CAAC;AAGH,IAAI,CAAC,WAAW,GAAG,MAAM;;;;"}

package/dist/esm/components/Containers/index.d.ts

@@ -2,7 +2,6 @@ export * from "./Center-Container";
 export * from "./Flex";
 export * from "./Horizontal-Scroll-Container";
 export * from "./Horizontal-Scroll-Item";
-export * from "./Infinite-Scroll-Container";
 export * from "./Loading-Container";
 export * from "./Main";
 export * from "./View";

package/dist/esm/components/Flex-Table/Flex-Table-Cell/Flex-Table-Cell.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+import IComponent from "../../../interfaces/IComponent";
+import { IMarginProps } from "../../../interfaces/ISpacingsProps";
+import "./styles/Flex-Table-Cell.layout.scss";
+import "./styles/Flex-Table-Cell.theme.scss";
+export interface IFlexTableCellProps extends IComponent, IMarginProps {
+    children: React.ReactNode;
+    width: number | "auto";
+    minWidth: number;
+    isMobile: boolean;
+    contentType?: "text" | "custom";
+    label?: string;
+    showLabel?: boolean;
+    isHeader?: boolean;
+}
+export declare const FlexTableCell: ({ children, width, minWidth, isMobile, contentType, label, showLabel, isHeader, rootClassName, rootStyles, ...spacingsProps }: IFlexTableCellProps) => React.JSX.Element;

package/dist/esm/components/Flex-Table/Flex-Table-Cell/Flex-Table-Cell.js

@@ -0,0 +1,21 @@
+import React__default from 'react';
+import { createComponentStyles, createLayoutStyles, withSpacingsProps } from '../../../utils/styles.js';
+
+const FlexTableCell = ({ children, width, minWidth, isMobile, contentType = "text", label, showLabel = false, isHeader = false, rootClassName, rootStyles = {}, ...spacingsProps }) => {
+    const containerStyles = createComponentStyles(createLayoutStyles(withSpacingsProps({
+        resoui_flexTable_cell: true,
+        resoui_flexTable_cell_mobile: isMobile,
+    }, spacingsProps), rootClassName));
+    const cellStyles = {
+        width: isMobile ? "100%" : width !== "auto" ? `${width}px` : undefined,
+        minWidth: `${minWidth}px`,
+        flex: width === "auto" ? 1 : undefined,
+        ...rootStyles,
+    };
+    return (React__default.createElement("div", { className: containerStyles, style: cellStyles, "data-testid": "flex-table-cell-root" },
+        showLabel && label && (React__default.createElement("span", { className: "resoui_flexTable_cell_label" }, label)),
+        contentType === "text" ? (React__default.createElement("span", { className: `resoui_flexTable_cell_text${isHeader ? " resoui_flexTable_cell_text_header" : ""}` }, children)) : (children)));
+};
+
+export { FlexTableCell };
+//# sourceMappingURL=Flex-Table-Cell.js.map

package/dist/esm/components/Flex-Table/Flex-Table-Cell/Flex-Table-Cell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Flex-Table-Cell.js","sources":["../../../../../src/library/components/Flex-Table/Flex-Table-Cell/Flex-Table-Cell.tsx"],"sourcesContent":[null],"names":["React"],"mappings":";;;AA4BO,MAAM,aAAa,GAAG,CAAC,EAC5B,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,WAAW,GAAG,MAAM,EACpB,KAAK,EACL,SAAS,GAAG,KAAK,EACjB,QAAQ,GAAG,KAAK,EAChB,aAAa,EACb,UAAU,GAAG,EAAE,EACf,GAAG,aAAa,EACI,KAAI;AACxB,IAAA,MAAM,eAAe,GAAG,qBAAqB,CAC3C,kBAAkB,CAChB,iBAAiB,CACf;AACE,QAAA,qBAAqB,EAAE,IAAI;AAC3B,QAAA,4BAA4B,EAAE,QAAQ;AACvC,KAAA,EACD,aAAa,CACd,EACD,aAAa,CACd,CACF;AAED,IAAA,MAAM,UAAU,GAAwB;QACtC,KAAK,EAAE,QAAQ,GAAG,MAAM,GAAG,KAAK,KAAK,MAAM,GAAG,CAAA,EAAG,KAAK,CAAA,EAAA,CAAI,GAAG,SAAS;QACtE,QAAQ,EAAE,CAAA,EAAG,QAAQ,CAAA,EAAA,CAAI;QACzB,IAAI,EAAE,KAAK,KAAK,MAAM,GAAG,CAAC,GAAG,SAAS;AACtC,QAAA,GAAG,UAAU;KACd;IAED,QACEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,eAAe,EAC1B,KAAK,EAAE,UAAU,EAAA,aAAA,EACL,sBAAsB,EAAA;QAEjC,SAAS,IAAI,KAAK,KACjBA,cAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,6BAA6B,EAAA,EAAE,KAAK,CAAQ,CAC7D;AACA,QAAA,WAAW,KAAK,MAAM,IACrBA,cAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EACE,SAAS,EAAE,CAAA,0BAAA,EAA6B,QAAQ,GAAG,oCAAoC,GAAG,EAAE,CAAA,CAAE,EAAA,EAE7F,QAAQ,CACJ,KAEP,QAAQ,CACT,CACG;AAEV;;;;"}

package/dist/esm/components/Flex-Table/Flex-Table-Cell/index.d.ts

@@ -0,0 +1,2 @@
+import "../../../styles/global.scss";
+export * from "./Flex-Table-Cell";

package/dist/esm/components/Flex-Table/Flex-Table-Container/Flex-Table-Container.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import IComponent from "../../../interfaces/IComponent";
+import { IMarginProps } from "../../../interfaces/ISpacingsProps";
+import "./styles/Flex-Table-Container.layout.scss";
+import "./styles/Flex-Table-Container.theme.scss";
+export interface IFlexTableContainerProps extends IComponent, IMarginProps {
+    children: React.ReactNode;
+    autoHeight?: boolean;
+}
+export declare const FlexTableContainer: ({ children, autoHeight, rootClassName, rootStyles, ...spacingsProps }: IFlexTableContainerProps) => React.JSX.Element;

package/dist/esm/components/Flex-Table/Flex-Table-Container/Flex-Table-Container.js

@@ -0,0 +1,13 @@
+import React__default from 'react';
+import { createComponentStyles, createLayoutStyles, withSpacingsProps } from '../../../utils/styles.js';
+
+const FlexTableContainer = ({ children, autoHeight = false, rootClassName, rootStyles = {}, ...spacingsProps }) => {
+    const containerStyles = createComponentStyles(createLayoutStyles(withSpacingsProps({
+        resoui_flexTable_container: true,
+        resoui_flexTable_container_autoHeight: autoHeight,
+    }, spacingsProps), rootClassName));
+    return (React__default.createElement("div", { className: containerStyles, style: rootStyles, "data-testid": "flex-table-container-root" }, children));
+};
+
+export { FlexTableContainer };
+//# sourceMappingURL=Flex-Table-Container.js.map

package/dist/esm/components/Flex-Table/Flex-Table-Container/Flex-Table-Container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Flex-Table-Container.js","sources":["../../../../../src/library/components/Flex-Table/Flex-Table-Container/Flex-Table-Container.tsx"],"sourcesContent":[null],"names":["React"],"mappings":";;;MAsBa,kBAAkB,GAAG,CAAC,EACjC,QAAQ,EACR,UAAU,GAAG,KAAK,EAClB,aAAa,EACb,UAAU,GAAG,EAAE,EACf,GAAG,aAAa,EACS,KAAI;AAC7B,IAAA,MAAM,eAAe,GAAG,qBAAqB,CAC3C,kBAAkB,CAChB,iBAAiB,CACf;AACE,QAAA,0BAA0B,EAAE,IAAI;AAChC,QAAA,qCAAqC,EAAE,UAAU;AAClD,KAAA,EACD,aAAa,CACd,EACD,aAAa,CACd,CACF;AAED,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,eAAe,EAC1B,KAAK,EAAE,UAAU,iBACL,2BAA2B,EAAA,EAEtC,QAAQ,CACL;AAEV;;;;"}

package/dist/esm/components/Flex-Table/Flex-Table-Container/index.d.ts

@@ -0,0 +1,2 @@
+import "../../../styles/global.scss";
+export * from "./Flex-Table-Container";

package/dist/esm/components/Flex-Table/Flex-Table-Row/Flex-Table-Row.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+import IComponent from "../../../interfaces/IComponent";
+import { IMarginProps } from "../../../interfaces/ISpacingsProps";
+import "./styles/Flex-Table-Row.layout.scss";
+import "./styles/Flex-Table-Row.theme.scss";
+export interface IFlexTableRowProps extends IComponent, IMarginProps {
+    children: React.ReactNode;
+    itemId: string;
+    namespace: string;
+    isMobile: boolean;
+    active?: boolean;
+    isHeader?: boolean;
+    onClick?: () => void;
+    disabled?: boolean;
+}
+export declare const FlexTableRow: ({ children, itemId, namespace, isMobile, active, isHeader, onClick, disabled, rootClassName, rootStyles, ...spacingsProps }: IFlexTableRowProps) => React.JSX.Element;

package/dist/esm/components/Flex-Table/Flex-Table-Row/Flex-Table-Row.js

@@ -0,0 +1,26 @@
+import React__default from 'react';
+import { createComponentStyles, createLayoutStyles, withSpacingsProps } from '../../../utils/styles.js';
+import { methodHasValue } from '../../../utils/validations.js';
+
+const FlexTableRow = ({ children, itemId, namespace, isMobile, active = false, isHeader = false, onClick, disabled = false, rootClassName, rootStyles = {}, ...spacingsProps }) => {
+    const containerStyles = createComponentStyles(createLayoutStyles(withSpacingsProps({
+        resoui_flexTable_row: true,
+        resoui_flexTable_row_desktop: !isMobile,
+        resoui_flexTable_row_mobile: isMobile,
+        resoui_flexTable_row_active: active,
+        resoui_flexTable_row_header: isHeader,
+        resoui_flexTable_row_disabled: disabled,
+    }, spacingsProps), rootClassName));
+    return (React__default.createElement("div", { id: itemId, key: `manage-${namespace}-page-list-${itemId}`, className: containerStyles, style: rootStyles, "data-testid": "flex-table-row-root", onClick: (e) => {
+            if (disabled)
+                return;
+            e.preventDefault();
+            e.stopPropagation();
+            if (methodHasValue(onClick)) {
+                onClick();
+            }
+        } }, children));
+};
+
+export { FlexTableRow };
+//# sourceMappingURL=Flex-Table-Row.js.map

package/dist/esm/components/Flex-Table/Flex-Table-Row/Flex-Table-Row.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Flex-Table-Row.js","sources":["../../../../../src/library/components/Flex-Table/Flex-Table-Row/Flex-Table-Row.tsx"],"sourcesContent":[null],"names":["React"],"mappings":";;;;AA6BO,MAAM,YAAY,GAAG,CAAC,EAC3B,QAAQ,EACR,MAAM,EACN,SAAS,EACT,QAAQ,EACR,MAAM,GAAG,KAAK,EACd,QAAQ,GAAG,KAAK,EAChB,OAAO,EACP,QAAQ,GAAG,KAAK,EAChB,aAAa,EACb,UAAU,GAAG,EAAE,EACf,GAAG,aAAa,EACG,KAAI;AACvB,IAAA,MAAM,eAAe,GAAG,qBAAqB,CAC3C,kBAAkB,CAChB,iBAAiB,CACf;AACE,QAAA,oBAAoB,EAAE,IAAI;QAC1B,4BAA4B,EAAE,CAAC,QAAQ;AACvC,QAAA,2BAA2B,EAAE,QAAQ;AACrC,QAAA,2BAA2B,EAAE,MAAM;AACnC,QAAA,2BAA2B,EAAE,QAAQ;AACrC,QAAA,6BAA6B,EAAE,QAAQ;AACxC,KAAA,EACD,aAAa,CACd,EACD,aAAa,CACd,CACF;AAED,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,EAAE,EAAE,MAAM,EACV,GAAG,EAAE,CAAA,OAAA,EAAU,SAAS,CAAA,WAAA,EAAc,MAAM,CAAA,CAAE,EAC9C,SAAS,EAAE,eAAe,EAC1B,KAAK,EAAE,UAAU,EAAA,aAAA,EACL,qBAAqB,EACjC,OAAO,EAAE,CAAC,CAAC,KAAI;AACb,YAAA,IAAI,QAAQ;gBAAE;YACd,CAAC,CAAC,cAAc,EAAE;YAClB,CAAC,CAAC,eAAe,EAAE;AACnB,YAAA,IAAI,cAAc,CAAC,OAAO,CAAC,EAAE;AAC3B,gBAAA,OAAO,EAAE;YACX;AACF,QAAA,CAAC,EAAA,EAEA,QAAQ,CACL;AAEV;;;;"}

package/dist/esm/components/Flex-Table/Flex-Table-Row/index.d.ts

@@ -0,0 +1,2 @@
+import "../../../styles/global.scss";
+export * from "./Flex-Table-Row";

package/dist/esm/components/Flex-Table/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./Flex-Table-Container";
+export * from "./Flex-Table-Row";
+export * from "./Flex-Table-Cell";

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

@@ -8,16 +8,13 @@ export * from "./Drawer";
 export * from "./Errors";
 export * from "./Example";
 export * from "./External-Links";
+export * from "./Flex-Table";
 export * from "./Footer";
 export * from "./Icon";
 export * from "./Images";
 export * from "./Loaders";
 export * from "./Modal";
 export * from "./Nav";
-export * from "./Paginator";
 export * from "./Panel";
 export * from "./Quantity-Counter";
-export * from "./Sidebar";
-export * from "./Table";
-export * from "./Tabs";
 export * from "./Text";

package/dist/esm/forms/Controls/Dropdown/Dropdown-Select/Dropdown-Select.js

@@ -3,13 +3,13 @@ import classnames from 'classnames';
 import SvgDropdownDown from '../../../../icons/svg/dropdown_down.svg.js';
 import { createComponentStyles, createLayoutStyles, withSpacingsProps } from '../../../../utils/styles.js';
 import { stringHasValue, methodHasValue } from '../../../../utils/validations.js';
+import '../../../../components/Containers/Flex/Flex.js';
 import '../../../../components/Dnd/Dnd-Array-Sorter/Dnd-Array-Sorter-Draggable-Wrapper.js';
 import '../../../../components/Dnd/Dnd-Array-Sorter/context/DndArraySorterContext.js';
 import { useClickOutside } from '../../../../hooks/useClickOutside.js';
 import '../../../../context/ThemeContext.js';
 import { Icon } from '../../../../components/Icon/Icon.js';
 import '../../../../context/ResponsiveContext.js';
-import '../../../../components/Tabs/Tabs.js';
 import { validate } from '../../../Validators/index.js';
 import useInputValidatorsMemo from '../../../Hooks/useInputValidatorsMemo.js';
 import { DropdownOption } from '../Dropdown-Option/Dropdown-Option.js';

package/dist/esm/forms/Controls/Text-Area/Text-Area.d.ts

@@ -15,4 +15,4 @@ export interface ITextAreaProps extends IComponent, IFormInputProps<string>, IMa
     maxLength?: number;
     name?: string;
 }
-export declare const TextArea: ({ id, value, onChange, onBlur, onFocus, onKeyDown, useHTMLErrorMessage, noShadowOnFocus, validateOnLoad, error, setError, disabled, required, readonly, autofocus, wrap, placeholder, cols: _cols, rows, formId, minLength, maxLength, name, rootClassName, rootStyles, inputClassName, inputStyles, customValidators, ...spacingsProps }: ITextAreaProps) => React.JSX.Element;
+export declare const TextArea: React.ForwardRefExoticComponent<ITextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;

package/dist/esm/forms/Controls/Text-Area/Text-Area.js

@@ -3,15 +3,7 @@ import { createComponentStyles, createLayoutStyles, withSpacingsProps } from '..
 import { validate } from '../../Validators/index.js';
 import useInputValidatorsMemo from '../../Hooks/useInputValidatorsMemo.js';
 
-const TextArea = ({ id = null, value, onChange, onBlur, onFocus, onKeyDown, useHTMLErrorMessage = false, noShadowOnFocus = false, validateOnLoad, error, setError, disabled = false, required = false, readonly = false, autofocus = false, 
-/**
- * Text Area - specific props
- */
-wrap = "soft", placeholder, cols: _cols = 50, rows = 4, formId, minLength, maxLength = 255, name = "resoui_textarea_input", 
-/**
- * Inherited props
- */
-rootClassName, rootStyles = {}, inputClassName, inputStyles = {}, customValidators = [], ...spacingsProps }) => {
+const TextArea = React__default.forwardRef(({ id = null, value, onChange, onBlur, onFocus, onKeyDown, useHTMLErrorMessage = false, noShadowOnFocus = false, validateOnLoad, error, setError, disabled = false, required = false, readonly = false, autofocus = false, wrap = "soft", placeholder, cols: _cols = 50, rows = 4, formId, minLength, maxLength = 255, name = "resoui_textarea_input", rootClassName, rootStyles = {}, inputClassName, inputStyles = {}, customValidators = [], ...spacingsProps }, ref) => {
     const inputValidators = useInputValidatorsMemo("string", {
         required,
         minLength,
@@ -45,9 +37,10 @@ rootClassName, rootStyles = {}, inputClassName, inputStyles = {}, customValidato
         disabled,
     }));
     return (React__default.createElement("div", { "data-testid": `text-area-${id}-container`, className: containerClasses, style: rootStyles },
-        React__default.createElement("textarea", { "data-testid": `text-area-${id}-input`, wrap: wrap, id: id, value: value ? value : "", onChange: handleInputChange, onBlur: onBlur, onFocus: onFocus, onInvalid: handleInputInvalid, disabled: disabled, readOnly: readonly, required: required, autoFocus: autofocus, onKeyDown: onKeyDown, rows: rows, form: formId, name: name, placeholder: placeholder, minLength: minLength, maxLength: maxLength, className: inputClasses, style: inputStyles }),
+        React__default.createElement("textarea", { ref: ref, "data-testid": `text-area-${id}-input`, wrap: wrap, id: id, value: value ? value : "", onChange: handleInputChange, onBlur: onBlur, onFocus: onFocus, onInvalid: handleInputInvalid, disabled: disabled, readOnly: readonly, required: required, autoFocus: autofocus, onKeyDown: onKeyDown, rows: rows, form: formId, name: name, placeholder: placeholder, minLength: minLength, maxLength: maxLength, className: inputClasses, style: inputStyles }),
         error && (React__default.createElement("p", { "data-testid": `text-area-${id}-error`, className: "resoui_form_input_error" }, error))));
-};
+});
+TextArea.displayName = "TextArea";
 
 export { TextArea };
 //# sourceMappingURL=Text-Area.js.map