@rolster/react-components 18.12.7 → 18.12.9

package/dist/cjs/index.js

@@ -1114,6 +1114,24 @@ const reactI18n = i18n.i18n({
     }
 });
 
+function useDatatable() {
+    const [scrolleable, setScrolleable] = react.useState(false);
+    const bodyRef = react.useRef(null);
+    react.useEffect(() => {
+        let observer;
+        if (bodyRef?.current) {
+            observer = new ResizeObserver(() => {
+                const scrollHeight = bodyRef?.current?.scrollHeight || 0;
+                const clientHeight = bodyRef?.current?.clientHeight || 0;
+                setScrolleable(scrollHeight > clientHeight);
+            });
+            observer.observe(bodyRef?.current);
+        }
+        return () => observer?.disconnect();
+    }, []);
+    return { bodyRef, scrolleable };
+}
+
 class ListCollection {
     constructor(value) {
         this.value = value;
@@ -1528,19 +1546,24 @@ function RlsDatatableHeader({ children }) {
     return jsxRuntime.jsx("tr", { className: "rls-datatable__header", children: children });
 }
 function RlsDatatableTitle({ children, className, control }) {
-    return (jsxRuntime.jsx("th", { className: (renderClassStatus('rls-datatable__title', { control }) +
-            ` ${className || ''}`).trim(), children: children }));
+    return (jsxRuntime.jsx("th", { className: renderClassStatus('rls-datatable__title', { control }, className).trim(), children: children }));
 }
 function RlsDatatableData({ children, className, error }) {
-    return (jsxRuntime.jsx("tr", { className: (renderClassStatus('rls-datatable__data', { error }) +
-            ` ${className || ''}`).trim(), children: children }));
+    return (jsxRuntime.jsx("tr", { className: renderClassStatus('rls-datatable__data', { error }, className).trim(), children: children }));
 }
 function RlsDatatableCell({ children, className, control, overflow }) {
-    return (jsxRuntime.jsx("th", { className: (renderClassStatus('rls-datatable__cell', { control, overflow }) +
-            ` ${className || ''}`).trim(), children: children }));
+    return (jsxRuntime.jsx("th", { className: renderClassStatus('rls-datatable__cell', { control, overflow }, className).trim(), children: children }));
+}
+function RlsDatatableTotals({ children, className, error }) {
+    return (jsxRuntime.jsx("div", { className: renderClassStatus('rls-datatable__totals', { error }, className).trim(), children: children }));
+}
+function RlsDatatableInfo({ children, className, control, overflow }) {
+    return (jsxRuntime.jsx("div", { className: renderClassStatus('rls-datatable__info', { control, overflow }, className).trim(), children: children }));
 }
-function RlsDatatable({ bodyRef, children, footer, header, rlsTheme }) {
-    return (jsxRuntime.jsxs("div", { className: "rls-datatable", "rls-theme": rlsTheme, children: [jsxRuntime.jsxs("table", { children: [header && jsxRuntime.jsx("thead", { className: "rls-datatable__thead", children: header }), jsxRuntime.jsx("tbody", { ref: bodyRef, className: "rls-datatable__tbody", children: children })] }), footer && jsxRuntime.jsx("div", { className: "rls-datatable__tfooter", children: footer })] }));
+function RlsDatatable({ children, datatable, footer, header, rlsTheme, summary }) {
+    return (jsxRuntime.jsxs("div", { className: renderClassStatus('rls-datatable', {
+            scrolleable: datatable?.scrolleable
+        }), "rls-theme": rlsTheme, children: [jsxRuntime.jsxs("table", { children: [header && jsxRuntime.jsx("thead", { className: "rls-datatable__thead", children: header }), jsxRuntime.jsx("tbody", { ref: datatable?.bodyRef, className: "rls-datatable__tbody", children: children })] }), summary && jsxRuntime.jsx("div", { className: "rls-datatable__tsummary", children: summary }), footer && jsxRuntime.jsx("div", { className: "rls-datatable__tfooter", children: footer })] }));
 }
 
 const controlIsValid = (props) => {
@@ -2111,7 +2134,9 @@ exports.RlsDatatable = RlsDatatable;
 exports.RlsDatatableCell = RlsDatatableCell;
 exports.RlsDatatableData = RlsDatatableData;
 exports.RlsDatatableHeader = RlsDatatableHeader;
+exports.RlsDatatableInfo = RlsDatatableInfo;
 exports.RlsDatatableTitle = RlsDatatableTitle;
+exports.RlsDatatableTotals = RlsDatatableTotals;
 exports.RlsDateField = RlsDateField;
 exports.RlsDatePicker = RlsDatePicker;
 exports.RlsDateRangeField = RlsDateRangeField;
@@ -2153,6 +2178,7 @@ exports.RlsToolbar = RlsToolbar;
 exports.RlsYearPicker = RlsYearPicker;
 exports.renderClassStatus = renderClassStatus;
 exports.useConfirmationService = useConfirmationService;
+exports.useDatatable = useDatatable;
 exports.useListControl = useListControl;
 exports.useSnackbarService = useSnackbarService;
 //# sourceMappingURL=index.js.map