@crystaldesign/diva-backoffice 26.3.0-beta.16 → 26.3.0-beta.17

package/build/esm/index.js

@@ -23061,7 +23061,9 @@ var skeleton = "skeleton--xCI0";
 var filterField = "filterField-1kU1O";
 var parentScroll = "parent-scroll-GmaL9";
 var parent = "parent-NZJ3S";
-var css_248z$t = ".permission-Button-XctsZ {\n  position: relative;\n  top: 25px;\n  left: -30px;\n  float: right;\n  height: 20px;\n  z-index: 1000;\n}\n.select-lzft- {\n  width: 100%;\n}\n.loadingOption-qCkRw {\n  margin-top: 11px;\n  padding-left: 500px;\n}\n.scroller-lrdk9 {\n  overflow: auto;\n  height: 100%;\n}\n\n.skeleton--xCI0 {\n  padding-left: 25px;\n  padding-bottom: 10px;\n}\n.filterField-1kU1O {\n  display: flex;\n  gap: 10px;\n}\n.filterField-1kU1O button {\n  height: 32px;\n}\n.filterField-1kU1O div {\n  height: 32px;\n}\n\n.parent-scroll-GmaL9 {\n  overflow: auto;\n  padding: 24px;\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n}\n.parent-NZJ3S {\n  overflow: auto;\n  padding: 24px;\n  height: 100%;\n}\n\n.parent-scroll-GmaL9 .ant-spin-container {\n  height: 100%;\n}\n.parent-scroll-GmaL9 .infinite-scroll-component__outerdiv {\n  height: 100%;\n}\n.parent-scroll-GmaL9 .infinite-scroll-component {\n  height: 100% !important;\n}\n";
+var container$7 = "container--O28P";
+var infiniteScrollContainer = "infiniteScrollContainer-8G1wc";
+var css_248z$t = ".permission-Button-XctsZ {\n  position: relative;\n  top: 25px;\n  left: -30px;\n  float: right;\n  height: 20px;\n  z-index: 1000;\n}\n.select-lzft- {\n  width: 100%;\n}\n.loadingOption-qCkRw {\n  margin-top: 11px;\n  padding-left: 500px;\n}\n.scroller-lrdk9 {\n  overflow: auto;\n  flex: 1;\n  min-height: 0;\n}\n\n.skeleton--xCI0 {\n  padding-left: 25px;\n  padding-bottom: 10px;\n}\n.filterField-1kU1O {\n  display: flex;\n  gap: 10px;\n}\n.filterField-1kU1O button {\n  height: 32px;\n}\n.filterField-1kU1O div {\n  height: 32px;\n}\n\n.parent-scroll-GmaL9 {\n  overflow: hidden;\n  padding: 24px;\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n}\n.parent-NZJ3S {\n  overflow: auto;\n  padding: 24px;\n  height: 100%;\n}\n\n.container--O28P {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  min-height: 0;\n}\n\n.infiniteScrollContainer-8G1wc {\n  flex: 1;\n  min-height: 0;\n  display: flex;\n  flex-direction: column;\n}\n\n.infiniteScrollContainer-8G1wc .infinite-scroll-component__outerdiv {\n  flex: 1;\n  min-height: 0;\n  display: flex;\n  flex-direction: column;\n}\n\n.infiniteScrollContainer-8G1wc .infinite-scroll-component {\n  flex: 1 !important;\n  min-height: 0 !important;\n  height: auto !important;\n  display: flex !important;\n  flex-direction: column !important;\n}\n";
 styleInject(css_248z$t);
 
 function ownKeys$T(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -24446,7 +24448,8 @@ var RelationSelector = function RelationSelector(_ref, ref) {
     if (relationState.configuration.search === undefined) return;
     relationState.searchItems('');
   }, []);
-  return /*#__PURE__*/jsxs(Fragment, {
+  return /*#__PURE__*/jsxs("div", {
+    className: container$7,
     children: [relationState.configuration.search != undefined && (((_relationState$config = relationState.configuration.filter) === null || _relationState$config === void 0 ? void 0 : _relationState$config.type) === 'default' ? /*#__PURE__*/jsxs(Select$1, {
       className: select$3,
       showSearch: true,
@@ -24497,9 +24500,9 @@ var RelationSelector = function RelationSelector(_ref, ref) {
       getActiveItem: relationState.getActiveItem,
       filterFields: relationState.configuration.filter.fields,
       placeholder: relationState.configuration.filter.placeholder
-    }), /*#__PURE__*/jsxs(Spin, {
-      spinning: relationState.loading.activeItems,
-      children: [/*#__PURE__*/jsxs(InfiniteScroll, {
+    }), /*#__PURE__*/jsx("div", {
+      className: infiniteScrollContainer,
+      children: /*#__PURE__*/jsxs(InfiniteScroll, {
         dataLength: relationState.activeItems.length,
         next: relationState.getActiveItem,
         hasMore: relationState.activeItems.length >= relationState.totalActiveItems ? false : true,
@@ -24513,6 +24516,7 @@ var RelationSelector = function RelationSelector(_ref, ref) {
         }), /*#__PURE__*/jsx(List$1, {
           id: "scrollableDiv",
           className: scroller,
+          loading: relationState.loading.activeItems,
           bordered: true,
           style: {
             overflowY: 'auto'
@@ -24593,9 +24597,9 @@ var RelationSelector = function RelationSelector(_ref, ref) {
             });
           }
         })]
-      }), /*#__PURE__*/jsx(Typography.Text, {
-        children: "0-".concat(relationState.activeItems.length, " of ").concat(relationState.totalActiveItems, " Elements")
-      })]
+      })
+    }), /*#__PURE__*/jsx(Typography.Text, {
+      children: "0-".concat(relationState.activeItems.length, " of ").concat(relationState.totalActiveItems, " Elements")
     })]
   });
 };
@@ -33182,14 +33186,24 @@ function _objectSpread$p(e) { for (var r = 1; r < arguments.length; r++) { var t
 var SpreadsheetWrapper = /*#__PURE__*/forwardRef(function SpreadsheetWrapper(props, ref) {
   var _root$contentStore$bo, _root$contentStore$ri;
   var root = useStore();
-  return /*#__PURE__*/jsx(Spreadsheet$1, _objectSpread$p(_objectSpread$p({}, props), {}, {
-    ref: ref,
-    darkMode: root.contentStore.theme == 'darkmode',
-    jwt: root.dataStore.jwt,
-    refSecondaryGrids: [(_root$contentStore$bo = root.contentStore.bottomToolBar.toolbarElement) !== null && _root$contentStore$bo !== void 0 ? _root$contentStore$bo : undefined, (_root$contentStore$ri = root.contentStore.rightToolBar.toolbarElement) !== null && _root$contentStore$ri !== void 0 ? _root$contentStore$ri : undefined].filter(function (element) {
-      return element !== undefined;
-    })
-  }));
+  var containerRef = useRef(null);
+
+  //if the spreadsheet is inside a toolbar, we need to prevent it form referencing it self
+  var refSecondaryGrids = [(_root$contentStore$bo = root.contentStore.bottomToolBar.toolbarElement) !== null && _root$contentStore$bo !== void 0 ? _root$contentStore$bo : undefined, (_root$contentStore$ri = root.contentStore.rightToolBar.toolbarElement) !== null && _root$contentStore$ri !== void 0 ? _root$contentStore$ri : undefined].filter(function (element) {
+    return element !== undefined && !element.contains(containerRef.current);
+  });
+  return /*#__PURE__*/jsx("div", {
+    ref: containerRef,
+    style: {
+      display: 'contents'
+    },
+    children: /*#__PURE__*/jsx(Spreadsheet$1, _objectSpread$p(_objectSpread$p({}, props), {}, {
+      ref: ref,
+      darkMode: root.contentStore.theme == 'darkmode',
+      jwt: root.dataStore.jwt,
+      refSecondaryGrids: refSecondaryGrids
+    }))
+  });
 });
 var Spreadsheet = observer(SpreadsheetWrapper);
 

package/build/types/backoffice/src/ui/CommonComponents/SpreadsheetWrapper/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/ui/CommonComponents/SpreadsheetWrapper/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAe,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AAEhG,OAAO,KAAqB,MAAM,OAAO,CAAC;;AA2B1C,wBAA4C"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/ui/CommonComponents/SpreadsheetWrapper/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAe,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AAEhG,OAAO,KAA6B,MAAM,OAAO,CAAC;;AAiClD,wBAA4C"}

package/build/types/backoffice/src/ui/RelationSelector/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/ui/RelationSelector/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAE9D,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;;YAWkD,MAAM,IAAI;;YAAV,MAAM,IAAI;;AA6J5F,wBAA4D"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/ui/RelationSelector/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAE9D,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;;YAWkD,MAAM,IAAI;;YAAV,MAAM,IAAI;;AA8J5F,wBAA4D"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crystaldesign/diva-backoffice",
-  "version": "26.3.0-beta.16",
+  "version": "26.3.0-beta.17",
   "license": "COMMERCIAL",
   "devDependencies": {
     "@testing-library/jest-dom": "^6.5.0",
@@ -15,13 +15,13 @@
   "dependencies": {
     "@ant-design/icons": "6.1.0",
     "@babel/runtime": "7.24.7",
-    "@crystaldesign/content-box": "26.3.0-beta.16",
-    "@crystaldesign/content-item": "26.3.0-beta.16",
-    "@crystaldesign/diva-core": "26.3.0-beta.16",
-    "@crystaldesign/diva-utils": "26.3.0-beta.16",
-    "@crystaldesign/media-upload": "26.3.0-beta.16",
-    "@crystaldesign/rtf-editor": "26.3.0-beta.16",
-    "@crystaldesign/spreadsheet": "26.3.0-beta.16",
+    "@crystaldesign/content-box": "26.3.0-beta.17",
+    "@crystaldesign/content-item": "26.3.0-beta.17",
+    "@crystaldesign/diva-core": "26.3.0-beta.17",
+    "@crystaldesign/diva-utils": "26.3.0-beta.17",
+    "@crystaldesign/media-upload": "26.3.0-beta.17",
+    "@crystaldesign/rtf-editor": "26.3.0-beta.17",
+    "@crystaldesign/spreadsheet": "26.3.0-beta.17",
     "@google/model-viewer": "3.5.0",
     "ag-charts-community": "^10.1.0",
     "ag-charts-react": "^10.1.0",
@@ -51,5 +51,5 @@
   },
   "module": "build/esm/index.js",
   "types": "./build/types/backoffice/src/index.d.ts",
-  "gitHead": "86e19123c27192cc966e2bf91de89d8dc7f399bd"
+  "gitHead": "3567f4e65bf57c7e7f680720e5a8164df1b6eda3"
 }