ods-component-lib 1.18.147 → 1.18.150

package/dist/components/devextreme/dataGridHandlers/OnToolbarButtonHandler.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Handles the rendering and configuration of the toolbar for ODS DataGrid.
+ * This hook prepares the toolbar based on the button configuration provided through props,
+ * rendering primary and secondary buttons directly and additional buttons in a dropdown if necessary.
+ *
+ * @param {Object} props - The properties including configuration for toolbar buttons and the page title.
+ * @returns {Function} A memoized function that configures and populates the toolbar with buttons and title.
+ *   This function is intended to be used as a callback in the toolbar's preparation phase of the DataGrid component.
+ */
+export declare const useOnToolbarButtonHandler: (props: any) => (e: any) => void;

package/dist/index.d.ts

@@ -54,6 +54,7 @@ import OdsBasicDataGrid from "./components/devextreme/OdsBasicDataGrid/OdsBasicD
 import OdsTransfer from "./components/devextreme/OdsTransfer";
 import OdsServerSideDatagrid from "./components/devextreme/OdsServerSideDatagrid/OdsServerSideDatagrid";
 import OdsInlineEditDataGrid from "./components/devextreme/OdsInlineEditDataGrid/OdsInlineEditDataGrid";
+import { useOnToolbarButtonHandler } from './components/devextreme/dataGridHandlers/OnToolbarButtonHandler';
 export { OdsButton };
 export { OdsInput };
 export { OdsDropdownButton };
@@ -106,6 +107,7 @@ export { OdsFilterTagView };
 export { OdsFileUpload };
 export { OdsDataGrid };
 export { OdsDisplayGrid };
+export { useOnToolbarButtonHandler };
 export { OdsRemoteDataGrid } from "./components/devextreme/index";
 export { OdsBasicDataGrid };
 export { OdsTransfer };

package/dist/index.js

@@ -35870,6 +35870,113 @@ var OdsInlineEditDataGrid = function OdsInlineEditDataGrid(props) {
   }, React__default.createElement("p", null, renderTotal())));
 };
 
+var client = createCommonjsModule(function (module, exports) {
+
+
+if (process.env.NODE_ENV === 'production') {
+  exports.createRoot = reactDom.createRoot;
+  exports.hydrateRoot = reactDom.hydrateRoot;
+} else {
+  var i = reactDom.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+  exports.createRoot = function(c, o) {
+    i.usingClientEntryPoint = true;
+    try {
+      return reactDom.createRoot(c, o);
+    } finally {
+      i.usingClientEntryPoint = false;
+    }
+  };
+  exports.hydrateRoot = function(c, h, o) {
+    i.usingClientEntryPoint = true;
+    try {
+      return reactDom.hydrateRoot(c, h, o);
+    } finally {
+      i.usingClientEntryPoint = false;
+    }
+  };
+}
+});
+var client_1 = client.createRoot;
+
+var useOnToolbarButtonHandler = function useOnToolbarButtonHandler(props) {
+  var _theme$useToken = antd.theme.useToken(),
+    token = _theme$useToken.token;
+  var onToolbarPreparing = React.useMemo(function () {
+    return function (e) {
+      var toolbarButtonGroup = props.toolbarButtonGroup;
+      var primaryButtons = toolbarButtonGroup.slice(0, 3);
+      var additionalButtons = toolbarButtonGroup.length > 3 ? toolbarButtonGroup.slice(3) : [];
+      primaryButtons.forEach(function (button, index) {
+        var buttonContainer = document.createElement('div');
+        var rootButton = client_1(buttonContainer);
+        rootButton.render(React__default.createElement(React__default.StrictMode, null, React__default.createElement(OdsButton, {
+          key: index,
+          style: {
+            marginLeft: token.margin
+          },
+          type: button.type,
+          onClick: function onClick() {
+            return button.onclick();
+          },
+          disabled: button.disabled
+        }, button.label)));
+        e.toolbarOptions.items.push({
+          location: 'before',
+          widget: 'dxTemplate',
+          template: function template(_, __, container) {
+            container.appendChild(buttonContainer);
+          }
+        });
+      });
+      if (additionalButtons.length > 0) {
+        var dropdownContainer = document.createElement('div');
+        dropdownContainer.style.marginLeft = '10px';
+        var rootDropdown = client_1(dropdownContainer);
+        rootDropdown.render(React__default.createElement(React__default.StrictMode, null, React__default.createElement(OdsDropdown, {
+          key: "dropdown-custom-toolbar",
+          menuItems: additionalButtons.map(function (button) {
+            return {
+              label: button.label,
+              onClick: button.onclick
+            };
+          })
+        }, React__default.createElement(OdsButton, {
+          type: "text",
+          icon: React__default.createElement(DynamicIcon, {
+            iconName: "kebabMenu"
+          })
+        }))));
+        e.toolbarOptions.items.push({
+          location: 'before',
+          widget: 'dxTemplate',
+          template: function template(_, __, container) {
+            container.appendChild(dropdownContainer);
+          }
+        });
+      }
+      var titleContainer = document.createElement('div');
+      var rootTitle = client_1(titleContainer);
+      rootTitle.render(React__default.createElement(React__default.StrictMode, null, React__default.createElement(OdsTitle, {
+        level: 5,
+        style: {
+          display: "flex",
+          alignItems: "center",
+          alignSelf: "stretch",
+          margin: 0
+        }
+      }, props.pageTitle)));
+      e.toolbarOptions.items.unshift({
+        location: 'before',
+        cssClass: 'toolbarTitleItem',
+        template: function template(_, __, container) {
+          container.appendChild(titleContainer);
+        }
+      });
+    };
+  }, [props.toolbarButtonGroup, props.pageTitle, token.margin]);
+  return onToolbarPreparing;
+};
+
 var checkCellSelectionConstraints$1 = function checkCellSelectionConstraints(e) {
   return e.rowType == "data" && e.columnIndex > -1 && e.rowIndex > -1;
 };
@@ -37060,4 +37167,5 @@ exports.OdsTimeline = OdsTimeline;
 exports.OdsTimepicker = OdsTimepicker;
 exports.OdsTitle = OdsTitle;
 exports.OdsTransfer = OdsTransfer;
+exports.useOnToolbarButtonHandler = useOnToolbarButtonHandler;
 //# sourceMappingURL=index.js.map