@crystaldesign/diva-seller 25.2.0-beta.2 → 25.2.0-beta.21

package/build/esm/index.js

@@ -17,7 +17,7 @@ import CardMedia from '@mui/material/CardMedia';
 import Typography$1 from '@mui/material/Typography';
 import createStyles from '@mui/styles/createStyles';
 import makeStyles from '@mui/styles/makeStyles';
-import { styled, Typography, Card as Card$1, CardActionArea as CardActionArea$1, CardMedia as CardMedia$1, Button as Button$1, TextField, ButtonGroup as ButtonGroup$1, Tooltip, Stack, Paper as Paper$1, Skeleton, IconButton as IconButton$1, FormControlLabel as FormControlLabel$1, Checkbox as Checkbox$1, Divider as Divider$1, Alert as Alert$1, AlertTitle as AlertTitle$1, Link, InputBase, Accordion, AccordionSummary, Tabs, Tab, AccordionDetails, Table as Table$1, TableBody as TableBody$1, TableRow as TableRow$1, TableCell as TableCell$1, CardHeader, CardContent, FormControl as FormControl$1, FormHelperText, TextareaAutosize, Box as Box$1, Select as Select$1, MenuItem as MenuItem$1, ListItemButton, ListItemIcon } from '@mui/material';
+import { styled, Typography, Card as Card$1, CardActionArea as CardActionArea$1, CardMedia as CardMedia$1, Button as Button$1, TextField, ButtonGroup as ButtonGroup$1, Tooltip, Stack, Paper as Paper$1, Skeleton, IconButton as IconButton$1, FormControlLabel as FormControlLabel$1, Checkbox as Checkbox$1, Divider as Divider$1, Alert as Alert$1, AlertTitle as AlertTitle$1, Link, InputBase, Accordion, AccordionSummary, Tabs, Tab, AccordionDetails, Table as Table$1, TableBody as TableBody$1, TableRow as TableRow$1, TableCell as TableCell$1, CardHeader, CardContent, FormControl as FormControl$1, FormHelperText, TextareaAutosize, Box as Box$1, Autocomplete as Autocomplete$2, Select as Select$1, MenuItem as MenuItem$1, ListItemButton, ListItemIcon } from '@mui/material';
 import { Histogram, useFilterState, FilterComponent, AnalyticsComponent } from '@crystaldesign/analytics';
 import Button from '@mui/material/Button';
 import ButtonGroup from '@mui/material/ButtonGroup';
@@ -56,11 +56,11 @@ import { styled as styled$1 } from '@mui/material/styles';
 import TextField$1 from '@mui/material/TextField';
 import Select from '@mui/material/Select';
 import Input from '@mui/material/Input';
-import OrderEntry, { apiSaveRenderJobs, VariantSelector } from '@crystaldesign/order-entry';
 import _toArray from '@babel/runtime/helpers/toArray';
 import Box from '@mui/material/Box';
 import StarBorderIcon from '@mui/icons-material/StarBorder';
 import EditIcon from '@mui/icons-material/Edit';
+import OrderEntry, { apiSaveRenderJobs, VariantSelector } from '@crystaldesign/order-entry';
 import classnames from 'classnames';
 import { InfoRounded, Remove, Add, Delete } from '@mui/icons-material';
 import { Swiper, SwiperSlide } from 'swiper/react';
@@ -194,7 +194,8 @@ var SellerContext = /*#__PURE__*/createContext({
     copyArticleInfoToClipboard: function copyArticleInfoToClipboard() {},
     loadAnalyticScore: function loadAnalyticScore() {
       return Promise.resolve({});
-    }
+    },
+    loadManualCustomDataFields: function loadManualCustomDataFields() {}
   }
 });
 
@@ -1148,19 +1149,55 @@ function _apiGetProductCreator() {
   }));
   return _apiGetProductCreator.apply(this, arguments);
 }
-function apiGetAffiliates(_x13) {
+function apiGetManualCustomDataFields(_x13) {
+  return _apiGetManualCustomDataFields.apply(this, arguments);
+}
+function _apiGetManualCustomDataFields() {
+  _apiGetManualCustomDataFields = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee13(_ref13) {
+    var serviceUrl, res, resData;
+    return _regeneratorRuntime.wrap(function _callee13$(_context13) {
+      while (1) switch (_context13.prev = _context13.next) {
+        case 0:
+          serviceUrl = _ref13.serviceUrl;
+          _context13.prev = 1;
+          _context13.next = 4;
+          return fetch("".concat(serviceUrl, "/v1/customdata/fields"), {
+            headers: {
+              'Content-Type': 'application/json'
+            }
+          });
+        case 4:
+          res = _context13.sent;
+          _context13.next = 7;
+          return res.json();
+        case 7:
+          resData = _context13.sent;
+          return _context13.abrupt("return", resData);
+        case 11:
+          _context13.prev = 11;
+          _context13.t0 = _context13["catch"](1);
+          throw new Error('Could not custom data field keys');
+        case 14:
+        case "end":
+          return _context13.stop();
+      }
+    }, _callee13, null, [[1, 11]]);
+  }));
+  return _apiGetManualCustomDataFields.apply(this, arguments);
+}
+function apiGetAffiliates(_x14) {
   return _apiGetAffiliates.apply(this, arguments);
 }
 function _apiGetAffiliates() {
-  _apiGetAffiliates = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee13(_ref13) {
+  _apiGetAffiliates = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee14(_ref14) {
     var serviceUrl, organizationId, jwt, fullUrl, res, resOrg;
-    return _regeneratorRuntime.wrap(function _callee13$(_context13) {
-      while (1) switch (_context13.prev = _context13.next) {
+    return _regeneratorRuntime.wrap(function _callee14$(_context14) {
+      while (1) switch (_context14.prev = _context14.next) {
         case 0:
-          serviceUrl = _ref13.serviceUrl, organizationId = _ref13.organizationId, jwt = _ref13.jwt;
+          serviceUrl = _ref14.serviceUrl, organizationId = _ref14.organizationId, jwt = _ref14.jwt;
           fullUrl = serviceUrl + '/v2/organizations/' + organizationId + '/affiliate?inherit=true';
-          _context13.prev = 2;
-          _context13.next = 5;
+          _context14.prev = 2;
+          _context14.next = 5;
           return fetch(fullUrl, {
             headers: {
               Authorization: 'Bearer ' + jwt,
@@ -1168,24 +1205,24 @@ function _apiGetAffiliates() {
             }
           });
         case 5:
-          res = _context13.sent;
-          _context13.next = 8;
+          res = _context14.sent;
+          _context14.next = 8;
           return res.json();
         case 8:
-          resOrg = _context13.sent;
-          _context13.next = 14;
+          resOrg = _context14.sent;
+          _context14.next = 14;
           break;
         case 11:
-          _context13.prev = 11;
-          _context13.t0 = _context13["catch"](2);
+          _context14.prev = 11;
+          _context14.t0 = _context14["catch"](2);
           throw new Error('Could not fetch existing affiliates for organization');
         case 14:
-          return _context13.abrupt("return", resOrg.data);
+          return _context14.abrupt("return", resOrg.data);
         case 15:
         case "end":
-          return _context13.stop();
+          return _context14.stop();
       }
-    }, _callee13, null, [[2, 11]]);
+    }, _callee14, null, [[2, 11]]);
   }));
   return _apiGetAffiliates.apply(this, arguments);
 }
@@ -2092,6 +2129,15 @@ function useSellerStateData(_ref) {
     }
     return configData === null || configData === void 0 ? void 0 : configData.BasketStatusArr;
   };
+  var setManualCustomDataFields = function setManualCustomDataFields(manualCustomDataFields) {
+    dispatch({
+      type: 'update',
+      payload: [{
+        field: 'manualCustomDataFields',
+        value: manualCustomDataFields
+      }]
+    });
+  };
   var setReturnTo = function setReturnTo(returnTo) {
     dispatch({
       type: 'update',
@@ -2258,11 +2304,12 @@ function useSellerStateData(_ref) {
     copyArticleInfoToClipboard: copyArticleInfoToClipboard,
     resetState: resetState,
     resetForCache: resetForCache,
-    loadAnalyticScore: loadAnalyticScore
+    loadAnalyticScore: loadAnalyticScore,
+    setManualCustomDataFields: setManualCustomDataFields
   };
 }
 
-var _excluded$9 = ["state", "setFirstLoginApiUrl", "updateBasketState", "setPlannerParams", "setReturnTo", "setOriginProductId", "setProductCategories", "resetState", "resetForCache"];
+var _excluded$9 = ["state", "setFirstLoginApiUrl", "updateBasketState", "setPlannerParams", "setReturnTo", "setOriginProductId", "setProductCategories", "setManualCustomDataFields", "resetState", "resetForCache"];
 function ownKeys$z(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; }
 function _objectSpread$z(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$z(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$z(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var LOG$8 = getLogger('Seller', 'SellerStateProvider');
@@ -2343,6 +2390,7 @@ var SellerStateProvider = function SellerStateProvider(_ref) {
     setReturnTo = _useSellerStateData.setReturnTo,
     setOriginProductId = _useSellerStateData.setOriginProductId,
     setProductCategories = _useSellerStateData.setProductCategories,
+    setManualCustomDataFields = _useSellerStateData.setManualCustomDataFields,
     resetState = _useSellerStateData.resetState,
     resetForCache = _useSellerStateData.resetForCache,
     stateFunctions = _objectWithoutProperties(_useSellerStateData, _excluded$9);
@@ -2997,6 +3045,29 @@ var SellerStateProvider = function SellerStateProvider(_ref) {
       return _ref7.apply(this, arguments);
     };
   }();
+  var loadManualCustomDataFields = /*#__PURE__*/function () {
+    var _ref8 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee7() {
+      var data;
+      return _regeneratorRuntime.wrap(function _callee7$(_context7) {
+        while (1) switch (_context7.prev = _context7.next) {
+          case 0:
+            _context7.next = 2;
+            return apiGetManualCustomDataFields({
+              serviceUrl: apiConfig.catalogService
+            });
+          case 2:
+            data = _context7.sent;
+            if (data !== null && data !== void 0 && data.length) setManualCustomDataFields(data);
+          case 4:
+          case "end":
+            return _context7.stop();
+        }
+      }, _callee7);
+    }));
+    return function loadManualCustomDataFields() {
+      return _ref8.apply(this, arguments);
+    };
+  }();
   var contextData = {
     state: {
       loadingBasket: loadingBasket,
@@ -3022,7 +3093,8 @@ var SellerStateProvider = function SellerStateProvider(_ref) {
       doShowPrices: !hidePrices,
       returnTo: state.returnTo,
       originProductId: state.originProductId,
-      productCategories: state.productCategories
+      productCategories: state.productCategories,
+      manualCustomDataFields: state.manualCustomDataFields
     },
     actions: _objectSpread$z(_objectSpread$z({}, stateFunctions), {}, {
       openComponent: openComponent,
@@ -3035,7 +3107,8 @@ var SellerStateProvider = function SellerStateProvider(_ref) {
       sendEmail: sendEmail,
       fetchBasket: fetchBasket,
       updateBasketState: updateBasketState,
-      loadUniqueDivaNr: loadUniqueDivaNr
+      loadUniqueDivaNr: loadUniqueDivaNr,
+      loadManualCustomDataFields: loadManualCustomDataFields
     })
   };
   return /*#__PURE__*/jsx(SellerContext.Provider, {
@@ -5404,8 +5477,9 @@ function styleInject(css, ref) {
 }
 
 var infocontainer = "infocontainer-ir9gv";
-var css_248z$b = ".infocontainer-ir9gv {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n";
-styleInject(css_248z$b);
+var stepsContent = "steps-content-jDbLc";
+var css_248z$c = ".infocontainer-ir9gv {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.steps-content-jDbLc {\n  margin-left: 10px;\n  padding-top: 10px;\n  padding-right: 10px;\n  height: 100%;\n  overflow-y: auto;\n}\n\n.steps-content-jDbLc #diva-order-entry-footer > span > div {\n  width: 500px;\n}\n\n.steps-content-jDbLc #diva-order-entry-footer > span > div > span {\n  margin-left: 110px;\n}\n";
+styleInject(css_248z$c);
 
 function Step2ClientData(_ref) {
   var _config$clientData, _config$clientData2;
@@ -5880,8 +5954,8 @@ var productDetailText = "productDetailText-wkk6U";
 var productDetailSkeleton = "productDetailSkeleton-3-RLq";
 var productDetailDivider = "productDetailDivider-C1Cdh";
 var alertTitle = "alertTitle-Bm1NO";
-var css_248z$a = ".container-3kPdM {\n  padding-bottom: 10px;\n  margin-top: 2px;\n}\n\n.mainStack-1xE4c {\n  width: 100%;\n  margin-top: 16px;\n}\n\n.productContainer-JcVn0 {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding-bottom: 16px;\n  width: 100%;\n}\n\n.productNameContainer-35ZZc {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n  width: 100%;\n}\n\n.productNameField-hPNbW {\n  margin: 8px;\n  width: 70%;\n}\n\n.productImage-Vn0l- {\n  width: 70%;\n  display: block;\n}\n\n.productImage-Vn0l-.hidden-zZ8fS {\n  display: none;\n}\n\n.productDetailsContainer-5c-V9 {\n  margin: 20px;\n  max-height: 100%;\n}\n\n.productDetailRow-9KtDG {\n  display: flex;\n}\n\n.productDetailLabel-t7Mn7 {\n  font-weight: 600;\n  width: 40%;\n}\n\n.favoriteContainer-ka7lC {\n  display: flex;\n  align-items: center;\n  margin-top: 16px;\n}\n.favoriteCheckbox-JYnH- {\n  margin-left: 10px;\n}\n\n.actionButtonContainer-WfYfD {\n  display: flex;\n  gap: 16px;\n  margin-top: 16px;\n  justify-content: right;\n}\n@media (max-width: 768px) {\n  .actionButtonContainer-WfYfD {\n    display: flex;\n    justify-content: space-between;\n  }\n}\n\n.productDetailsPaper-VsWfW {\n  width: 100%;\n  max-height: 100%;\n  overflow: auto;\n}\n\n.productDetailText-wkk6U {\n  white-space: pre-wrap;\n}\n\n.productDetailSkeleton-3-RLq {\n  margin-left: 30px;\n  height: 28px;\n}\n\n.productDetailDivider-C1Cdh {\n  margin-bottom: 16px;\n}\n\n.alertTitle-Bm1NO {\n  font-weight: 600;\n}\n\n/* Responsive styles */\n@media (min-width: 900px) {\n  .productDetailsPaper-VsWfW {\n    width: 60%;\n  }\n}\n";
-styleInject(css_248z$a);
+var css_248z$b = ".container-3kPdM {\n  padding-bottom: 10px;\n  margin-top: 2px;\n}\n\n.mainStack-1xE4c {\n  width: 100%;\n  margin-top: 16px;\n}\n\n.productContainer-JcVn0 {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding-bottom: 16px;\n  width: 100%;\n}\n\n.productNameContainer-35ZZc {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n  width: 100%;\n}\n\n.productNameField-hPNbW {\n  margin: 8px;\n  width: 70%;\n}\n\n.productImage-Vn0l- {\n  width: 70%;\n  display: block;\n}\n\n.productImage-Vn0l-.hidden-zZ8fS {\n  display: none;\n}\n\n.productDetailsContainer-5c-V9 {\n  margin: 20px;\n  max-height: 100%;\n}\n\n.productDetailRow-9KtDG {\n  display: flex;\n}\n\n.productDetailLabel-t7Mn7 {\n  font-weight: 600;\n  width: 40%;\n}\n\n.favoriteContainer-ka7lC {\n  display: flex;\n  align-items: center;\n  margin-top: 16px;\n}\n.favoriteCheckbox-JYnH- {\n  margin-left: 10px;\n}\n\n.actionButtonContainer-WfYfD {\n  display: flex;\n  gap: 16px;\n  margin-top: 16px;\n  justify-content: right;\n}\n@media (max-width: 768px) {\n  .actionButtonContainer-WfYfD {\n    display: flex;\n    justify-content: space-between;\n  }\n}\n\n.productDetailsPaper-VsWfW {\n  width: 100%;\n  max-height: 100%;\n  overflow: auto;\n}\n\n.productDetailText-wkk6U {\n  white-space: pre-wrap;\n}\n\n.productDetailSkeleton-3-RLq {\n  margin-left: 30px;\n  height: 28px;\n}\n\n.productDetailDivider-C1Cdh {\n  margin-bottom: 16px;\n}\n\n.alertTitle-Bm1NO {\n  font-weight: 600;\n}\n\n/* Responsive styles */\n@media (min-width: 900px) {\n  .productDetailsPaper-VsWfW {\n    width: 60%;\n  }\n}\n";
+styleInject(css_248z$b);
 
 function Step3Product(_ref) {
   var _currentProduct$techn;
@@ -6139,22 +6213,19 @@ function CheckOut(_ref) {
     userHasPermission = _useDivaCore$actions.userHasPermission,
     toggleLoading = _useDivaCore$actions.toggleLoading,
     openModal = _useDivaCore$actions.openModal,
-    _useDivaCore$state = _useDivaCore.state,
-    apiConfig = _useDivaCore$state.apiConfig,
-    jwt = _useDivaCore$state.jwt,
-    organization = _useDivaCore$state.organization;
+    organization = _useDivaCore.state.organization;
   var handleSave = useCallback(/*#__PURE__*/function () {
-    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2(openPDF, sendMail, isFav) {
-      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-        while (1) switch (_context2.prev = _context2.next) {
+    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(openPDF, sendMail, isFav) {
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
           case 0:
             if (!(status === 'BASE_CONFIGURATION')) {
-              _context2.next = 17;
+              _context.next = 17;
               break;
             }
             toggleLoading('saveProduct');
-            _context2.prev = 2;
-            _context2.next = 5;
+            _context.prev = 2;
+            _context.next = 5;
             return saveProduct(isFav);
           case 5:
             toggleLoading('saveProduct');
@@ -6164,11 +6235,11 @@ function CheckOut(_ref) {
               accept: true,
               text: t('basket.checkout.productsavedtext')
             });
-            _context2.next = 14;
+            _context.next = 14;
             break;
           case 10:
-            _context2.prev = 10;
-            _context2.t0 = _context2["catch"](2);
+            _context.prev = 10;
+            _context.t0 = _context["catch"](2);
             toggleLoading('saveProduct');
             openModal({
               title: t('Error'),
@@ -6176,64 +6247,27 @@ function CheckOut(_ref) {
               text: t('basket.checkout.errorsavingproduct')
             });
           case 14:
-            _context2.prev = 14;
-            return _context2.abrupt("return");
+            _context.prev = 14;
+            return _context.abrupt("return");
           case 17:
             if (!isSaving) {
               setIsSaving(true);
-              onClickSave(openPDF, sendMail).then(/*#__PURE__*/function () {
-                var _ref3 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(p) {
-                  var newRenderJob;
-                  return _regeneratorRuntime.wrap(function _callee$(_context) {
-                    while (1) switch (_context.prev = _context.next) {
-                      case 0:
-                        if (!basket3DExportChecked) {
-                          _context.next = 4;
-                          break;
-                        }
-                        newRenderJob = {
-                          divaNr: basket.DivaNr,
-                          organization: basket.OrganizationId,
-                          job: '3DEXPORT',
-                          diva3DProject: basket.Diva3DProject ? atob(basket.Diva3DProject) : undefined,
-                          hQRenderScript: basket.OrderSets[0].HQRenderScript,
-                          divaNrVariantId: basket.DocumentVersion,
-                          organizationName: basket.OrganizationId_displayText,
-                          productName: basket.SetName
-                        };
-                        _context.next = 4;
-                        return apiSaveRenderJobs({
-                          serviceUrl: apiConfig.mediaService,
-                          jobs: [newRenderJob],
-                          jwt: jwt
-                        });
-                      case 4:
-                        setIsSaving(false);
-                      case 5:
-                      case "end":
-                        return _context.stop();
-                    }
-                  }, _callee);
-                }));
-                return function (_x4) {
-                  return _ref3.apply(this, arguments);
-                };
-              }())["catch"](function () {
+              onClickSave(openPDF, sendMail, basket3DExportChecked)["finally"](function () {
                 return setIsSaving(false);
               });
             }
           case 18:
           case "end":
-            return _context2.stop();
+            return _context.stop();
         }
-      }, _callee2, null, [[2, 10, 14, 17]]);
+      }, _callee, null, [[2, 10, 14, 17]]);
     }));
     return function (_x, _x2, _x3) {
       return _ref2.apply(this, arguments);
     };
   }(), [isSaving, onClickSave, basket3DExportChecked]);
-  var onChangeForm = function onChangeForm(_ref4) {
-    var data = _ref4.data;
+  var onChangeForm = function onChangeForm(_ref3) {
+    var data = _ref3.data;
     for (var key in data) {
       basket[key] = data[key];
     }
@@ -6850,6 +6884,7 @@ function Basket(_ref) {
     _useDivaCore$state = _useDivaCore.state,
     organization = _useDivaCore$state.organization,
     jwt = _useDivaCore$state.jwt,
+    apiConfig = _useDivaCore$state.apiConfig,
     _useDivaCore$actions = _useDivaCore.actions,
     userHasPermission = _useDivaCore$actions.userHasPermission,
     openSnackBar = _useDivaCore$actions.openSnackBar;
@@ -7027,9 +7062,9 @@ function Basket(_ref) {
     }
   };
   var onClickSave = /*#__PURE__*/function () {
-    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(pdf, doSendEmail) {
+    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(pdf, doSendEmail, export3D) {
       var _configurationData$Ch, _configurationData$re;
-      var getPdf, response, _configurationData$Ch2, _ref3, pdfUrl, _configurationData$Ch3, _configurationData$Ch4, _currentBasket$Client, _opener;
+      var getPdf, response, _configurationData$Ch2, _ref3, pdfUrl, newRenderJob, _configurationData$Ch3, _configurationData$Ch4, _currentBasket$Client, _opener;
       return _regeneratorRuntime.wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
@@ -7046,83 +7081,118 @@ function Basket(_ref) {
           case 6:
             response = _context.sent;
             currentBasket.clearRenderData();
-            if (Object.values(BASKET_SAVE_ERROR).includes(response)) {
-              errorOnSaving(response);
+            if (!Object.values(BASKET_SAVE_ERROR).includes(response)) {
+              _context.next = 12;
+              break;
+            }
+            errorOnSaving(response);
+            _context.next = 29;
+            break;
+          case 12:
+            _ref3 = response, pdfUrl = _ref3.pdfUrl;
+            if (!export3D) {
+              _context.next = 24;
+              break;
+            }
+            _context.prev = 14;
+            newRenderJob = {
+              divaNr: currentBasket.DivaNr,
+              organization: currentBasket.OrganizationId,
+              job: '3DEXPORT',
+              diva3DProject: currentBasket.Diva3DProject ? atob(currentBasket.Diva3DProject) : undefined,
+              hQRenderScript: currentBasket.OrderSets[0].HQRenderScript,
+              divaNrVariantId: currentBasket.DocumentVersion,
+              organizationName: currentBasket.OrganizationId_displayText,
+              separateMaterials: organization.settings.renderjobSeparateMaterials,
+              productName: currentBasket.SetName
+            };
+            _context.next = 18;
+            return apiSaveRenderJobs({
+              serviceUrl: apiConfig.mediaService,
+              jobs: [newRenderJob],
+              jwt: jwt
+            });
+          case 18:
+            _context.next = 24;
+            break;
+          case 20:
+            _context.prev = 20;
+            _context.t0 = _context["catch"](14);
+            errorOnSaving(BASKET_SAVE_ERROR.ERROR_BASKET_AFTER_SAVE, t('modals.3dexport_unsuccessful'));
+            return _context.abrupt("return");
+          case 24:
+            if (configurationData !== null && configurationData !== void 0 && (_configurationData$Ch2 = configurationData.Checkout) !== null && _configurationData$Ch2 !== void 0 && _configurationData$Ch2.showPdfQR) {
+              openSnackBar({
+                qrCode: pdfUrl,
+                message: t('basket.checkout.pdfqr'),
+                type: 'big',
+                clickable: true,
+                qrCodeSize: 312,
+                autoHideDuration: (_configurationData$Ch3 = configurationData === null || configurationData === void 0 || (_configurationData$Ch4 = configurationData.Checkout) === null || _configurationData$Ch4 === void 0 ? void 0 : _configurationData$Ch4.pdfQRAutoHideDuration) !== null && _configurationData$Ch3 !== void 0 ? _configurationData$Ch3 : 1000 * 60 * 2
+              });
+            }
+            if (doSendEmail) {
+              sendEmail({
+                dialogText: t('basket.modals.email.text', {
+                  divaNr: currentBasket.DivaNr + '-' + currentBasket.getDocumentVersion()
+                }),
+                content: {
+                  type: 'basket',
+                  to: ((_currentBasket$Client = currentBasket.Client) === null || _currentBasket$Client === void 0 ? void 0 : _currentBasket$Client.email) || '',
+                  divaNr: currentBasket.DivaNr,
+                  version: currentBasket.getDocumentVersion().toString(),
+                  language: i18n.language
+                }
+              });
             } else {
-              _ref3 = response, pdfUrl = _ref3.pdfUrl;
-              if (configurationData !== null && configurationData !== void 0 && (_configurationData$Ch2 = configurationData.Checkout) !== null && _configurationData$Ch2 !== void 0 && _configurationData$Ch2.showPdfQR) {
-                openSnackBar({
-                  qrCode: pdfUrl,
-                  message: t('basket.checkout.pdfqr'),
-                  type: 'big',
-                  clickable: true,
-                  qrCodeSize: 312,
-                  autoHideDuration: (_configurationData$Ch3 = configurationData === null || configurationData === void 0 || (_configurationData$Ch4 = configurationData.Checkout) === null || _configurationData$Ch4 === void 0 ? void 0 : _configurationData$Ch4.pdfQRAutoHideDuration) !== null && _configurationData$Ch3 !== void 0 ? _configurationData$Ch3 : 1000 * 60 * 2
-                });
-              }
-              if (doSendEmail) {
-                sendEmail({
-                  dialogText: t('basket.modals.email.text', {
-                    divaNr: currentBasket.DivaNr + '-' + currentBasket.getDocumentVersion()
-                  }),
-                  content: {
-                    type: 'basket',
-                    to: ((_currentBasket$Client = currentBasket.Client) === null || _currentBasket$Client === void 0 ? void 0 : _currentBasket$Client.email) || '',
-                    divaNr: currentBasket.DivaNr,
-                    version: currentBasket.getDocumentVersion().toString(),
-                    language: i18n.language
-                  }
-                });
+              if (returnTo == 'toAssortmentManager') {
+                (_opener = opener) === null || _opener === void 0 || _opener.postMessage({
+                  event: 'message',
+                  detail: 'onLoadBasketConfiguration' + ';' + currentBasket.DivaNr
+                }, '*');
+                window.close();
               } else {
-                if (returnTo == 'toAssortmentManager') {
-                  (_opener = opener) === null || _opener === void 0 || _opener.postMessage({
-                    event: 'message',
-                    detail: 'onLoadBasketConfiguration' + ';' + currentBasket.DivaNr
-                  }, '*');
-                  window.close();
-                } else {
-                  openModal({
-                    title: t('modals.saving'),
-                    reject: false,
-                    accept: pdf == 'open' ? t('modals.open_now') : true,
-                    text: t('modals.saving_successful').replace('%1', currentBasket.DivaNr + '-' + currentBasket.getDocumentVersion()),
-                    callback: function callback() {
-                      if (pdf == 'open') {
-                        window.open(pdfUrl, '_blank');
-                      }
+                openModal({
+                  title: t('modals.saving'),
+                  reject: false,
+                  accept: pdf == 'open' ? t('modals.open_now') : true,
+                  text: t('modals.saving_successful').replace('%1', currentBasket.DivaNr + '-' + currentBasket.getDocumentVersion()),
+                  callback: function callback() {
+                    if (pdf == 'open') {
+                      window.open(pdfUrl, '_blank');
                     }
-                  });
-                }
-                /* TODO used with SM integration in divaProtal
-                   openModal({
-                    title: t('modals.saving'),
-                    reject: false,
-                    accept: true,
-                    text: t('modals.saving_successful').replace('%1', currentBasket.DivaNr + '-' + currentBasket.getDocumentVersion()),
-                    callback: () => {
-                      if (openPDF) {
-                        window.open(pdfUrl, '_blank');
-                      }
-                    },
-                  });
-                  */
+                  }
+                });
               }
-              LOG$4.successTransaction('ON_SAVE_BASKET', {
-                divaNr: currentBasket.DivaNr,
-                status: currentBasket.Status,
-                documentVersion: currentBasket.DocumentVersion,
-                bv: (currentBasket === null || currentBasket === void 0 ? void 0 : currentBasket.SetPrice) / 1000
-              });
-              currentBasket.setDocumentVersion(currentBasket.getDocumentVersion() + 1);
-              setActBasketPage('Step1');
+              /* TODO used with SM integration in divaProtal
+                 openModal({
+                  title: t('modals.saving'),
+                  reject: false,
+                  accept: true,
+                  text: t('modals.saving_successful').replace('%1', currentBasket.DivaNr + '-' + currentBasket.getDocumentVersion()),
+                  callback: () => {
+                    if (openPDF) {
+                      window.open(pdfUrl, '_blank');
+                    }
+                  },
+                });
+                */
             }
-          case 9:
+            LOG$4.successTransaction('ON_SAVE_BASKET', {
+              divaNr: currentBasket.DivaNr,
+              status: currentBasket.Status,
+              documentVersion: currentBasket.DocumentVersion,
+              bv: (currentBasket === null || currentBasket === void 0 ? void 0 : currentBasket.SetPrice) / 1000
+            });
+            currentBasket.setDocumentVersion(currentBasket.getDocumentVersion() + 1);
+            setActBasketPage('Step1');
+          case 29:
           case "end":
             return _context.stop();
         }
-      }, _callee);
+      }, _callee, null, [[14, 20]]);
     }));
-    return function onClickSave(_x, _x2) {
+    return function onClickSave(_x, _x2, _x3) {
       return _ref2.apply(this, arguments);
     };
   }();
@@ -7173,7 +7243,7 @@ function Basket(_ref) {
       return _ref4.apply(this, arguments);
     };
   }();
-  var errorOnSaving = function errorOnSaving(type) {
+  var errorOnSaving = function errorOnSaving(type, errorText) {
     LOG$4.errorTransaction('ON_SAVE_BASKET', 'SELLER_0003', 'Error Saving Basket', {
       divaNr: currentBasket.DivaNr,
       status: currentBasket.Status,
@@ -7184,7 +7254,7 @@ function Basket(_ref) {
       title: t('modals.error_saving'),
       reject: false,
       accept: true,
-      text: t(type == 'ERROR_NO_BASKET_SAVED' ? 'modals.saving_unsuccessful' : 'modals.postsave_unsuccessful').replace('%1', currentBasket.DivaNr + '-' + currentBasket.getDocumentVersion()) + ' --- ' + DivaUtils$1.formatDate(new Date(), true, undefined, true) + (DivaUtils$1.getCurrentTraceId() ? ' --- ' + t('modal.errorcode') + ': ' + DivaUtils$1.getCurrentTraceId() : '')
+      text: t(type == 'ERROR_NO_BASKET_SAVED' ? 'modals.saving_unsuccessful' : 'modals.postsave_unsuccessful').replace('%1', currentBasket.DivaNr + '-' + currentBasket.getDocumentVersion()) + (errorText ? ' ' + errorText : '') + ' --- ' + DivaUtils$1.formatDate(new Date(), true, undefined, true) + (DivaUtils$1.getCurrentTraceId() ? ' --- ' + t('modal.errorcode') + ': ' + DivaUtils$1.getCurrentTraceId() : '')
     });
   };
   var openInfo = function openInfo() {
@@ -7233,13 +7303,7 @@ function Basket(_ref) {
       showProductCreator: userHasPermission('productcreator') && !(configurationData !== null && configurationData !== void 0 && configurationData.hideProductCreator),
       enableVKPExportButton: !currentBasket.catalogStatus || currentBasket.catalogStatus == 'LISTED' || userHasPermission('alwaysenablevkpexport')
     }), /*#__PURE__*/jsxs("div", {
-      style: {
-        marginLeft: 10,
-        paddingTop: 10,
-        paddingRight: 10,
-        height: '100%',
-        overflowY: 'auto'
-      },
+      className: stepsContent,
       children: [actBasketPage == 'Step1' && /*#__PURE__*/jsx(Step1PriceOverview, {
         config: configurationData === null || configurationData === void 0 ? void 0 : configurationData.Checkout,
         basket: currentBasket,
@@ -7290,8 +7354,8 @@ var modelTitle = "model-title-Sgm-0";
 var description = "description-GyPZq";
 var pdf = "pdf-oNnao";
 var hidden = "hidden-xYPOr";
-var css_248z$9 = ".wrapper-fSL18 {\n  display: flex;\n  flex-direction: column;\n  padding: 0 12px;\n  height: 100%;\n}\n\n.title-iTDPA {\n  padding: 16px 8px;\n  font-size: 36px;\n}\n\n.title-iTDPA .MuiButtonBase-root {\n  display: none;\n}\n\n.subTitle-4-0PW {\n  padding: 12px 18px;\n  font-size: 28px;\n}\n\n.description-container-k1vLT {\n  display: flex;\n  flex-direction: column;\n  background-color: #f2f2f2;\n  padding: 18px;\n  gap: 12px;\n  height: 100%;\n  overflow: auto;\n}\n\n.model-title-Sgm-0 {\n  font-size: 24px;\n  font-weight: 600;\n}\n.description-GyPZq {\n  font-size: 16px;\n  overflow: auto;\n  flex-grow: 3;\n  scrollbar-width: thin;\n}\n\n.pdf-oNnao {\n  display: 'flex';\n  flex: 1 1 10px;\n}\n\n.pdf-oNnao svg {\n  margin-right: 10px;\n}\n\n@media (max-width: 820px) {\n  .wrapper-fSL18 {\n    height: 75px;\n  }\n  .description-container-k1vLT {\n    position: fixed;\n    top: 22px;\n    width: 80%;\n    z-index: 101;\n    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);\n    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);\n    margin-top: 135px;\n    margin-left: -10px;\n    transition: width 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n    height: calc(100% - 195px);\n  }\n  .title-iTDPA .MuiButtonBase-root {\n    display: inline-flex;\n  }\n  .hidden-xYPOr .description-container-k1vLT {\n    padding: 0;\n    width: 0;\n  }\n\n  .hidden-xYPOr .pdf-oNnao {\n    display: none;\n  }\n\n  .hidden-xYPOr .model-title-Sgm-0 {\n    display: none;\n  }\n\n  .hidden-xYPOr .description-GyPZq {\n    display: none;\n  }\n}\n";
-styleInject(css_248z$9);
+var css_248z$a = ".wrapper-fSL18 {\n  display: flex;\n  flex-direction: column;\n  padding: 0 12px;\n  height: 100%;\n}\n\n.title-iTDPA {\n  padding: 16px 8px;\n  font-size: 36px;\n}\n\n.title-iTDPA .MuiButtonBase-root {\n  display: none;\n}\n\n.subTitle-4-0PW {\n  padding: 12px 18px;\n  font-size: 28px;\n}\n\n.description-container-k1vLT {\n  display: flex;\n  flex-direction: column;\n  background-color: #f2f2f2;\n  padding: 18px;\n  gap: 12px;\n  height: 100%;\n  overflow: auto;\n}\n\n.model-title-Sgm-0 {\n  font-size: 24px;\n  font-weight: 600;\n}\n.description-GyPZq {\n  font-size: 16px;\n  overflow: auto;\n  flex-grow: 3;\n  scrollbar-width: thin;\n}\n\n.pdf-oNnao {\n  display: 'flex';\n  flex: 1 1 10px;\n}\n\n.pdf-oNnao svg {\n  margin-right: 10px;\n}\n\n@media (max-width: 820px) {\n  .wrapper-fSL18 {\n    height: 75px;\n  }\n  .description-container-k1vLT {\n    position: fixed;\n    top: 22px;\n    width: 80%;\n    z-index: 101;\n    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);\n    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);\n    margin-top: 135px;\n    margin-left: -10px;\n    transition: width 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n    height: calc(100% - 195px);\n  }\n  .title-iTDPA .MuiButtonBase-root {\n    display: inline-flex;\n  }\n  .hidden-xYPOr .description-container-k1vLT {\n    padding: 0;\n    width: 0;\n  }\n\n  .hidden-xYPOr .pdf-oNnao {\n    display: none;\n  }\n\n  .hidden-xYPOr .model-title-Sgm-0 {\n    display: none;\n  }\n\n  .hidden-xYPOr .description-GyPZq {\n    display: none;\n  }\n}\n";
+styleInject(css_248z$a);
 
 var _excluded$6 = ["data", "text"];
 function ownKeys$o(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; }
@@ -7347,8 +7411,8 @@ function Description$1 (_ref) {
 var container = "container-Sr3pC";
 var iconOnly = "icon-only-2SJ6e";
 var icon$1 = "icon-0h-39";
-var css_248z$8 = ".container-Sr3pC {\n  display: flex;\n  gap: 12px;\n  justify-content: flex-end;\n  padding: 8px;\n  flex-wrap: wrap;\n}\n.container-Sr3pC .MuiButton-root {\n  height: 45px;\n}\n\n.icon-only-2SJ6e span {\n  margin-right: 2px;\n}\n\n.icon-0h-39 {\n  width: 24px;\n  height: 24px;\n}\n";
-styleInject(css_248z$8);
+var css_248z$9 = ".container-Sr3pC {\n  display: flex;\n  gap: 12px;\n  justify-content: flex-end;\n  padding: 8px;\n  flex-wrap: wrap;\n}\n.container-Sr3pC .MuiButton-root {\n  height: 45px;\n}\n\n.icon-only-2SJ6e span {\n  margin-right: 2px;\n}\n\n.icon-0h-39 {\n  width: 24px;\n  height: 24px;\n}\n";
+styleInject(css_248z$9);
 
 function ownKeys$n(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; }
 function _objectSpread$n(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$n(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$n(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -7467,19 +7531,19 @@ function NavBar (buttons) {
 }
 
 var layout$1 = "layout-NhUpB";
-var content = "content-t8Rtl";
+var content$1 = "content-t8Rtl";
 var leftSide = "left-side-10jmj";
 var rightSide$1 = "right-side-64-Yz";
 var catalogImages = "catalog-images-jJGqW";
 var footer = "footer-1ONIt";
-var css_248z$7 = ".layout-NhUpB {\n  display: flex;\n  height: 100%;\n  flex-direction: column;\n}\n\n.content-t8Rtl {\n  display: flex;\n  flex: 1;\n  overflow: auto;\n}\n\n.left-side-10jmj {\n  width: 25%;\n  min-width: 300px;\n}\n\n.right-side-64-Yz {\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  flex: 1;\n  overflow: auto;\n  justify-content: flex-end;\n}\n\n.catalog-images-jJGqW {\n  flex: 1;\n  padding: 12px;\n}\n\n.footer-1ONIt {\n  display: flex;\n  justify-content: flex-end;\n}\n\n@media (max-width: 820px) {\n  .content-t8Rtl {\n    flex-direction: column;\n  }\n}\n";
-styleInject(css_248z$7);
+var css_248z$8 = ".layout-NhUpB {\n  display: flex;\n  height: 100%;\n  flex-direction: column;\n}\n\n.content-t8Rtl {\n  display: flex;\n  flex: 1;\n  overflow: auto;\n}\n\n.left-side-10jmj {\n  width: 25%;\n  min-width: 300px;\n}\n\n.right-side-64-Yz {\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  flex: 1;\n  overflow: auto;\n  justify-content: flex-end;\n}\n\n.catalog-images-jJGqW {\n  flex: 1;\n  padding: 12px;\n}\n\n.footer-1ONIt {\n  display: flex;\n  justify-content: flex-end;\n}\n\n@media (max-width: 820px) {\n  .content-t8Rtl {\n    flex-direction: column;\n  }\n}\n";
+styleInject(css_248z$8);
 
 var wrapper$5 = "wrapper-D5Cmc";
 var thumbs = "thumbs-cWKAj";
 var mainSlider = "mainSlider-S8opH";
-var css_248z$6 = ".wrapper-D5Cmc {\n  display: flex;\n  position: relative;\n  gap: 12px;\n  overflow: auto;\n}\n\n.thumbs-cWKAj .swiper-slide {\n  opacity: 0.4;\n}\n\n.thumbs-cWKAj .swiper-slide-thumb-active {\n  opacity: 1;\n}\n\n.mainSlider-S8opH .swiper-pagination-bullet-active {\n  background-color: var(--diva-theme-palette-primary-main) !important;\n}\n\n.mainSlider-S8opH .swiper-pagination-bullet-active { /* Active bullet color */\n}\n\n@media (max-width: 820px) {\n  .thumbs-cWKAj {\n    display: none;\n  }\n}\n";
-styleInject(css_248z$6);
+var css_248z$7 = ".wrapper-D5Cmc {\n  display: flex;\n  position: relative;\n  gap: 12px;\n  overflow: auto;\n}\n\n.thumbs-cWKAj .swiper-slide {\n  opacity: 0.4;\n}\n\n.thumbs-cWKAj .swiper-slide-thumb-active {\n  opacity: 1;\n}\n\n.mainSlider-S8opH .swiper-pagination-bullet-active {\n  background-color: var(--diva-theme-palette-primary-main) !important;\n}\n\n.mainSlider-S8opH .swiper-pagination-bullet-active { /* Active bullet color */\n}\n\n@media (max-width: 820px) {\n  .thumbs-cWKAj {\n    display: none;\n  }\n}\n";
+styleInject(css_248z$7);
 
 var _excluded$5 = ["data"];
 var CatalogImages = function CatalogImages(_ref) {
@@ -7567,14 +7631,14 @@ var wrapper$4 = "wrapper-3d2zl";
 var fullHeight = "full-height-CQ8Cy";
 var tabBar = "tab-bar-lQQ28";
 var nothingFound = "nothing-found-0eqZ5";
-var css_248z$5 = ".wrapper-3d2zl {\n  max-height: 50%;\n  overflow: hidden;\n}\n\n.wrapper-3d2zl.MuiAccordion-root.Mui-expanded {\n  height: 50%;\n}\n\n.wrapper-3d2zl.full-height-CQ8Cy {\n  max-height: 100%;\n}\n\n.wrapper-3d2zl.full-height-CQ8Cy.MuiAccordion-root.Mui-expanded {\n  height: 100%;\n}\n\n.wrapper-3d2zl .MuiAccordionSummary-root.Mui-expanded {\n  min-height: 0;\n}\n\n.wrapper-3d2zl .MuiAccordionSummary-root.Mui-focused {\n  background-color: #fff8f8;\n}\n\n.wrapper-3d2zl .MuiAccordionSummary-content {\n  justify-content: space-between;\n  height: 100%;\n}\n\n.wrapper-3d2zl .MuiTabs-root {\n  height: 100%;\n}\n\n.wrapper-3d2zl .MuiCollapse-root {\n  height: calc(100% - 46px) !important;\n}\n\n.wrapper-3d2zl .MuiCollapse-root {\n  scrollbar-width: thin;\n  overflow-y: scroll;\n}\n\n.wrapper-3d2zl .MuiCollapse-root .MuiCollapse-wrapper {\n  display: none;\n  height: 100%;\n}\n\n.wrapper-3d2zl .MuiCollapse-root.MuiCollapse-entered .MuiCollapse-wrapper {\n  display: flex;\n}\n\n.wrapper-3d2zl .MuiCollapse-root .MuiCollapse-wrapperInner {\n  height: 100%;\n}\n\n.wrapper-3d2zl .MuiCollapse-root .MuiCollapse-wrapperInner > div {\n  height: 100%;\n}\n\n.wrapper-3d2zl .MuiAccordionDetails-root {\n  height: calc(100% - 24px);\n  width: calc(100% - 32px);\n}\n\n.tab-bar-lQQ28 {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  background-color: #f8f8f8;\n  height: 46px;\n}\n\n.nothing-found-0eqZ5 {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 100%;\n  flex-direction: column;\n  gap: 15px;\n  margin: auto;\n}\n";
-styleInject(css_248z$5);
+var css_248z$6 = ".wrapper-3d2zl {\n  max-height: 50%;\n  overflow: hidden;\n}\n\n.wrapper-3d2zl.MuiAccordion-root.Mui-expanded {\n  height: 50%;\n}\n\n.wrapper-3d2zl.full-height-CQ8Cy {\n  max-height: 100%;\n}\n\n.wrapper-3d2zl.full-height-CQ8Cy.MuiAccordion-root.Mui-expanded {\n  height: 100%;\n}\n\n.wrapper-3d2zl .MuiAccordionSummary-root.Mui-expanded {\n  min-height: 0;\n}\n\n.wrapper-3d2zl .MuiAccordionSummary-root.Mui-focused {\n  background-color: #fff8f8;\n}\n\n.wrapper-3d2zl .MuiAccordionSummary-content {\n  justify-content: space-between;\n  height: 100%;\n}\n\n.wrapper-3d2zl .MuiTabs-root {\n  height: 100%;\n}\n\n.wrapper-3d2zl .MuiCollapse-root {\n  height: calc(100% - 46px) !important;\n}\n\n.wrapper-3d2zl .MuiCollapse-root {\n  scrollbar-width: thin;\n  overflow-y: scroll;\n}\n\n.wrapper-3d2zl .MuiCollapse-root .MuiCollapse-wrapper {\n  display: none;\n  height: 100%;\n}\n\n.wrapper-3d2zl .MuiCollapse-root.MuiCollapse-entered .MuiCollapse-wrapper {\n  display: flex;\n}\n\n.wrapper-3d2zl .MuiCollapse-root .MuiCollapse-wrapperInner {\n  height: 100%;\n}\n\n.wrapper-3d2zl .MuiCollapse-root .MuiCollapse-wrapperInner > div {\n  height: 100%;\n}\n\n.wrapper-3d2zl .MuiAccordionDetails-root {\n  height: calc(100% - 24px);\n  width: calc(100% - 32px);\n}\n\n.tab-bar-lQQ28 {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  background-color: #f8f8f8;\n  height: 46px;\n}\n\n.nothing-found-0eqZ5 {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 100%;\n  flex-direction: column;\n  gap: 15px;\n  margin: auto;\n}\n";
+styleInject(css_248z$6);
 
 var wrapper$3 = "wrapper-i9mNn";
 var searchText = "search-text-grXdY";
 var icon = "icon-ydD53";
-var css_248z$4 = ".wrapper-i9mNn {\n  display: flex;\n  height: 36px;\n  align-items: center;\n  background-color: #fefefe;\n  margin: 6px 0;\n  border-radius: 5px;\n}\n\n.search-text-grXdY {\n  padding: 8px 8px 8px 0px;\n  transition: width 300ms cubic-bezier(0.4, 0, 0.2, 1);\n  width: 130px;\n}\n\n.search-text-grXdY.Mui-focused {\n  width: 200px;\n}\n\n.search-text-grXdY .MuiInputBase-input {\n  padding-left: 36px;\n}\n\n.icon-ydD53 {\n  width: 36px;\n  height: 36px;\n  background: center / contain no-repeat url(\"data:image/svg+xml,%3Csvg width%3D%2259%22 height%3D%2259%22 viewBox%3D%220 0 59 59%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M39.9163 41.38C40.3208 41.7844 40.9765 41.7844 41.3809 41.38C41.7854 40.9755 41.7854 40.3198 41.3809 39.9153L39.9163 41.38ZM36.851 27.5286C36.851 32.6767 32.6776 36.85 27.5296 36.85V38.9215C33.8216 38.9215 38.9224 33.8206 38.9224 27.5286H36.851ZM27.5296 36.85C22.3815 36.85 18.2081 32.6767 18.2081 27.5286H16.1367C16.1367 33.8206 21.2375 38.9215 27.5296 38.9215V36.85ZM18.2081 27.5286C18.2081 22.3805 22.3815 18.2072 27.5296 18.2072V16.1357C21.2375 16.1357 16.1367 21.2365 16.1367 27.5286H18.2081ZM27.5296 18.2072C32.6776 18.2072 36.851 22.3805 36.851 27.5286H38.9224C38.9224 21.2365 33.8216 16.1357 27.5296 16.1357V18.2072ZM41.3809 39.9153L35.5982 34.1325L34.1334 35.5972L39.9163 41.38L41.3809 39.9153Z%22 fill%3D%22%234F4F4F%22%2F%3E%3C%2Fsvg%3E\");\n  position: absolute;\n  pointer-events: none;\n}\n";
-styleInject(css_248z$4);
+var css_248z$5 = ".wrapper-i9mNn {\n  display: flex;\n  height: 36px;\n  align-items: center;\n  background-color: #fefefe;\n  margin: 6px 0;\n  border-radius: 5px;\n}\n\n.search-text-grXdY {\n  padding: 8px 8px 8px 0px;\n  transition: width 300ms cubic-bezier(0.4, 0, 0.2, 1);\n  width: 130px;\n}\n\n.search-text-grXdY.Mui-focused {\n  width: 200px;\n}\n\n.search-text-grXdY .MuiInputBase-input {\n  padding-left: 36px;\n}\n\n.icon-ydD53 {\n  width: 36px;\n  height: 36px;\n  background: center / contain no-repeat url(\"data:image/svg+xml,%3Csvg width%3D%2259%22 height%3D%2259%22 viewBox%3D%220 0 59 59%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M39.9163 41.38C40.3208 41.7844 40.9765 41.7844 41.3809 41.38C41.7854 40.9755 41.7854 40.3198 41.3809 39.9153L39.9163 41.38ZM36.851 27.5286C36.851 32.6767 32.6776 36.85 27.5296 36.85V38.9215C33.8216 38.9215 38.9224 33.8206 38.9224 27.5286H36.851ZM27.5296 36.85C22.3815 36.85 18.2081 32.6767 18.2081 27.5286H16.1367C16.1367 33.8206 21.2375 38.9215 27.5296 38.9215V36.85ZM18.2081 27.5286C18.2081 22.3805 22.3815 18.2072 27.5296 18.2072V16.1357C21.2375 16.1357 16.1367 21.2365 16.1367 27.5286H18.2081ZM27.5296 18.2072C32.6776 18.2072 36.851 22.3805 36.851 27.5286H38.9224C38.9224 21.2365 33.8216 16.1357 27.5296 16.1357V18.2072ZM41.3809 39.9153L35.5982 34.1325L34.1334 35.5972L39.9163 41.38L41.3809 39.9153Z%22 fill%3D%22%234F4F4F%22%2F%3E%3C%2Fsvg%3E\");\n  position: absolute;\n  pointer-events: none;\n}\n";
+styleInject(css_248z$5);
 
 var Search = function Search(_ref) {
   var searchValue = _ref.searchValue,
@@ -7993,7 +8057,7 @@ function Info(props) {
     children: !loading && /*#__PURE__*/jsxs("div", {
       className: layout$1,
       children: [/*#__PURE__*/jsxs("div", {
-        className: content,
+        className: content$1,
         children: [/*#__PURE__*/jsx(Description$1, {
           data: catalogData,
           className: leftSide,
@@ -8933,14 +8997,16 @@ var typeDropDown = "typeDropDown-A1ExF";
 var objectListWrapper = "objectListWrapper-141eT";
 var inputValueElement = "inputValueElement-XljUd";
 var inputValueElementItem = "inputValueElementItem-s6dG0";
-var css_248z$3 = ".wrapper-D74am {\n  display: flex;\n  grid-gap: 25px;\n  margin-bottom: 10px;\n  align-items: top;\n  width: 100%;\n}\n.typeDropDown-A1ExF {\n  min-width: 10%;\n  max-height: 48px;\n}\n\n.objectListWrapper-141eT {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n}\n\n.inputValueElement-XljUd {\n  width: 100%;\n}\n.inputValueElementItem-s6dG0 {\n  display: flex;\n  align-items: center;\n  margin-bottom: 8px;\n  gap: 10px; /* Use 'gap' instead of 'grid-gap' for flex containers */\n}\n";
-styleInject(css_248z$3);
+var css_248z$4 = ".wrapper-D74am {\n  display: flex;\n  grid-gap: 25px;\n  margin-bottom: 10px;\n  align-items: top;\n  width: 100%;\n}\n.typeDropDown-A1ExF {\n  min-width: 10%;\n  max-height: 48px;\n}\n\n.objectListWrapper-141eT {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n}\n\n.inputValueElement-XljUd {\n  width: 100%;\n}\n.inputValueElementItem-s6dG0 {\n  display: flex;\n  align-items: center;\n  margin-bottom: 8px;\n  gap: 10px; /* Use 'gap' instead of 'grid-gap' for flex containers */\n}\n";
+styleInject(css_248z$4);
 
 function ownKeys$b(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; }
 function _objectSpread$b(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$b(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$b(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var CustomDataFields = function CustomDataFields(_ref) {
   var productData = _ref.productData,
-    update = _ref.update;
+    update = _ref.update,
+    manualCustomDataFields = _ref.manualCustomDataFields,
+    classificationFields = _ref.classificationFields;
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
   var _useState = useState([{
@@ -8951,6 +9017,10 @@ var CustomDataFields = function CustomDataFields(_ref) {
     _useState2 = _slicedToArray(_useState, 2),
     pairs = _useState2[0],
     setPairs = _useState2[1];
+  var _useState3 = useState(manualCustomDataFields !== null && manualCustomDataFields !== void 0 ? manualCustomDataFields : []),
+    _useState4 = _slicedToArray(_useState3, 2),
+    customFieldKeys = _useState4[0];
+    _useState4[1];
   useEffect(function () {
     var manualCustomData = Object.entries(productData.customData);
     var filteredData = [];
@@ -8965,21 +9035,28 @@ var CustomDataFields = function CustomDataFields(_ref) {
     }
     manualCustomData = filteredData;
     var manualPairs = [];
-    for (var _i = 0; _i < manualCustomData.length; _i++) {
+    var _loop = function _loop() {
       var _manualCustomData$_i = _slicedToArray(manualCustomData[_i], 2),
-        _key = _manualCustomData$_i[0],
-        _valueObj = _manualCustomData$_i[1];
+        key = _manualCustomData$_i[0],
+        valueObj = _manualCustomData$_i[1];
       var type = 'TEXT';
-      if (Array.isArray(_valueObj.value) && _typeof(_valueObj.value[0]) === 'object') {
+      if (Array.isArray(valueObj.value) && _typeof(valueObj.value[0]) === 'object') {
         type = 'OBJECTLIST';
-      } else if (Array.isArray(_valueObj.value)) {
+      } else if (classificationFields && classificationFields.find(function (field) {
+        return field.field === valueObj.value;
+      })) {
+        type = 'CLASS';
+      } else if (Array.isArray(valueObj.value)) {
         type = 'LIST';
       }
       manualPairs.push({
-        key: _key,
+        key: key,
         type: type,
-        value: _valueObj.value
+        value: valueObj.value
       });
+    };
+    for (var _i = 0; _i < manualCustomData.length; _i++) {
+      _loop();
     }
     setPairs(manualPairs);
   }, [productData]);
@@ -9140,7 +9217,7 @@ var CustomDataFields = function CustomDataFields(_ref) {
     }));
     setPairs(actPairs);
   };
-  var handleListBoxChange = function handleListBoxChange(index, value) {
+  var handleListBoxTypeChange = function handleListBoxTypeChange(index, value) {
     var actPairs = _toConsumableArray(pairs);
     actPairs[index].type = value;
     if (value === 'TEXT') {
@@ -9151,9 +9228,22 @@ var CustomDataFields = function CustomDataFields(_ref) {
       actPairs[index].value = [{
         '': ''
       }];
+    } else if (value === 'CLASS') {
+      actPairs[index].value = '';
     }
     setPairs(actPairs);
   };
+  var handleListBoxValueChange = function handleListBoxValueChange(index, value) {
+    var actPairs = _toConsumableArray(pairs);
+    actPairs[index].value = value;
+    update(_objectSpread$b(_objectSpread$b({}, productData), {}, {
+      customData: _objectSpread$b(_objectSpread$b({}, productData.customData), {}, _defineProperty({}, actPairs[index].key, {
+        value: actPairs[index].value,
+        manual: true
+      }))
+    }));
+    setPairs(actPairs);
+  };
   return /*#__PURE__*/jsxs(Card$1, {
     style: {
       marginBottom: '10px'
@@ -9165,19 +9255,31 @@ var CustomDataFields = function CustomDataFields(_ref) {
         children: [pairs.map(function (pair, index) {
           return /*#__PURE__*/jsxs(Box$1, {
             className: wrapper$2,
-            children: [/*#__PURE__*/jsx(TextField, {
+            children: [/*#__PURE__*/jsx(Autocomplete$2, {
+              freeSolo: true,
               style: {
-                maxWidth: '10%'
+                width: '20%'
+              },
+              options: customFieldKeys !== null && customFieldKeys !== void 0 ? customFieldKeys : [],
+              getOptionDisabled: function getOptionDisabled(option) {
+                return pairs.map(function (pair) {
+                  return pair.key;
+                }).includes(option);
               },
-              label: t('fieldname'),
               value: pair.key,
-              onChange: function onChange(e) {
-                return handleChange(index, 'key', e.target.value);
+              onBlur: function onBlur(e) {
+                var inputValue = e.target.value;
+                handleChange(index, 'key', inputValue);
+              },
+              renderInput: function renderInput(params) {
+                return /*#__PURE__*/jsx(TextField, _objectSpread$b(_objectSpread$b({}, params), {}, {
+                  label: t('productcreator.customfields.keylabel')
+                }));
               }
             }), /*#__PURE__*/jsxs(Select$1, {
               value: pair.type,
               onChange: function onChange(e) {
-                return handleListBoxChange(index, e.target.value);
+                return handleListBoxTypeChange(index, e.target.value);
               },
               className: typeDropDown,
               displayEmpty: true,
@@ -9190,6 +9292,9 @@ var CustomDataFields = function CustomDataFields(_ref) {
               }), /*#__PURE__*/jsx(MenuItem$1, {
                 value: "OBJECTLIST",
                 children: t('objectlist')
+              }), /*#__PURE__*/jsx(MenuItem$1, {
+                value: "CLASS",
+                children: t('class')
               })]
             }), pair.type === 'TEXT' && /*#__PURE__*/jsx(TextField, {
               label: t('value'),
@@ -9320,6 +9425,19 @@ var CustomDataFields = function CustomDataFields(_ref) {
                   children: t('addentry')
                 })]
               })
+            }), pair.type === 'CLASS' && /*#__PURE__*/jsx(Select$1, {
+              className: inputValueElement,
+              value: pair.value,
+              onChange: function onChange(e) {
+                return handleListBoxValueChange(index, e.target.value);
+              },
+              displayEmpty: true,
+              children: classificationFields === null || classificationFields === void 0 ? void 0 : classificationFields.map(function (field, i) {
+                return /*#__PURE__*/jsx(MenuItem$1, {
+                  value: field.field,
+                  children: field.title ? t(field.title) : field.field
+                }, i);
+              })
             }), /*#__PURE__*/jsx(IconButton$1, {
               onClick: function onClick() {
                 return handleRemovePair(index);
@@ -9349,7 +9467,9 @@ var CustomDataFields = function CustomDataFields(_ref) {
 function BaseDataFormInfo (_ref) {
   var productData = _ref.productData,
     additionalBaseFields = _ref.additionalBaseFields,
-    _update = _ref.update;
+    _update = _ref.update,
+    manualCustomDataFields = _ref.manualCustomDataFields,
+    classificationFields = _ref.classificationFields;
   return /*#__PURE__*/jsxs(Fragment, {
     children: [/*#__PURE__*/jsx(TranslationWrapper, {
       title: 'productcreator.basedata.baseinfo',
@@ -9386,7 +9506,9 @@ function BaseDataFormInfo (_ref) {
       productData: productData,
       update: function update(d) {
         return _update(d || productData);
-      }
+      },
+      manualCustomDataFields: manualCustomDataFields,
+      classificationFields: classificationFields
     })]
   });
 }
@@ -9552,7 +9674,9 @@ function BaseDataForm (_ref) {
     additionalBaseFields = _ref.additionalBaseFields,
     configurationData = _ref.configurationData,
     customFormData = _ref.customFormData,
-    hasVariants = _ref.hasVariants;
+    hasVariants = _ref.hasVariants,
+    manualCustomDataFields = _ref.manualCustomDataFields,
+    classificationFields = _ref.classificationFields;
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
   return /*#__PURE__*/jsxs(Fragment, {
@@ -9608,7 +9732,9 @@ function BaseDataForm (_ref) {
           }), /*#__PURE__*/jsx(BaseDataFormInfo, {
             productData: productData,
             update: update,
-            additionalBaseFields: additionalBaseFields
+            additionalBaseFields: additionalBaseFields,
+            manualCustomDataFields: manualCustomDataFields,
+            classificationFields: classificationFields
           }), !!(configurationData !== null && configurationData !== void 0 && (_configurationData$fi = configurationData.fields) !== null && _configurationData$fi !== void 0 && _configurationData$fi.delivery) && /*#__PURE__*/jsx(BaseDataFormDeliveryInfo, {
             productData: productData,
             update: update,
@@ -10256,7 +10382,7 @@ function VariantTable (_ref) {
         style: {
           width: '100%',
           height: '100%',
-          overflow: 'hidden'
+          display: 'flex'
         },
         children: /*#__PURE__*/jsx(Grid, {
           options: options,
@@ -10329,8 +10455,8 @@ function _preUpdateData(field, value, row) {
 
 var wrapper$1 = "wrapper-I8eY4";
 var dataTable = "data-table-ImAxQ";
-var css_248z$2 = ".wrapper-I8eY4 {\n  display: flex;\n  height: calc(100% - 67px);\n  border-bottom: 1px solid rgb(224, 224, 224);\n}\n\n.data-table-ImAxQ {\n  position: relative;\n  height: 100%;\n  flex-grow: 1;\n  overflow: hidden;\n}\n";
-styleInject(css_248z$2);
+var css_248z$3 = ".wrapper-I8eY4 {\n  display: flex;\n  height: calc(100% - 67px);\n  border-bottom: 1px solid rgb(224, 224, 224);\n}\n\n.data-table-ImAxQ {\n  position: relative;\n  height: 100%;\n  flex-grow: 1;\n  overflow: hidden;\n}\n";
+styleInject(css_248z$3);
 
 function ownKeys$6(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; }
 function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$6(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$6(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -11770,15 +11896,26 @@ function updateVariants(prevState, currentState, configurationData, baseDataFiel
           _modified = _ProductHandler$calcu.modified;
         finalVariant[field] = _value;
         newModified[field] = _modified;
+      } else if (field.includes('customFlags')) {
+        var path = field.split('.');
+        var prevValue = getData(path, variant);
+        var newValue = getData(path, newVariant);
+        if (prevValue !== newValue) {
+          if (newValue === true || newValue !== null && newValue !== void 0 && newValue.length) {
+            setData(path, [variant.organizationId], finalVariant);
+          } else {
+            setData(path, [], finalVariant);
+          }
+        }
       } else if (field.includes('.')) {
         var _currentState$modifie2;
         //handle nested fields
 
-        var path = field.split('.');
-        var _ProductHandler$calcu2 = ProductHandler.calculateComputedValue(getData(path, variant), newVariant ? getData(path, newVariant) : undefined, getData(path, currentState.baseData), (_currentState$modifie2 = currentState.modified.variantData[_i]) === null || _currentState$modifie2 === void 0 ? void 0 : _currentState$modifie2[field]),
+        var _path = field.split('.');
+        var _ProductHandler$calcu2 = ProductHandler.calculateComputedValue(getData(_path, variant), newVariant ? getData(_path, newVariant) : undefined, getData(_path, currentState.baseData), (_currentState$modifie2 = currentState.modified.variantData[_i]) === null || _currentState$modifie2 === void 0 ? void 0 : _currentState$modifie2[field]),
           _value2 = _ProductHandler$calcu2.value,
           _modified2 = _ProductHandler$calcu2.modified;
-        setData(path, _value2, finalVariant);
+        setData(_path, _value2, finalVariant);
         finalVariant.media = variant.media;
         newModified[field] = _modified2;
       } else if (custom) {
@@ -12456,6 +12593,13 @@ function intersection() {
   });
 }
 
+var main = "main-ERs2i";
+var content = "content-KMewq";
+var tabContent = "tab-content-nIlnM";
+var renderjob = "renderjob-Yt11W";
+var css_248z$2 = ".main-ERs2i {\n  display: flex;\n  overflow: hidden;\n  width: 100%;\n  flex-direction: column;\n  height: 100%;\n}\n\n.content-KMewq {\n  position: relative;\n  width: 100%;\n  overflow: hidden;\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n}\n\n.tab-content-nIlnM {\n  display: flex;\n  overflow: hidden;\n  flex-direction: column;\n  flex: 1;\n}\n\n.renderjob-Yt11W {\n  display: flex;\n  height: calc(100% - 20px);\n  margin: 10px;\n}\n\n.renderjob-Yt11W #diva-order-entry-footer > span > div {\n  width: 500px;\n}\n\n.renderjob-Yt11W #diva-order-entry-footer > span > div > span {\n  margin-left: 110px;\n}\n";
+styleInject(css_248z$2);
+
 function ProductCreator (_ref) {
   var _state$variantData, _state$variantData2, _state$variantData$fi, _state$variantData3, _state$baseData$custo2, _currentBasket$DivaNr, _currentBasket$OrderS;
   var basket = _ref.basket,
@@ -12467,10 +12611,12 @@ function ProductCreator (_ref) {
     openModal = _useSellerState$actio.openModal,
     toggleLoading = _useSellerState$actio.toggleLoading,
     clearOriginProductId = _useSellerState$actio.clearOriginProductId,
+    loadManualCustomDataFields = _useSellerState$actio.loadManualCustomDataFields,
     _useSellerState$state = _useSellerState.state,
     configurationData = _useSellerState$state.configurationData,
     returnTo = _useSellerState$state.returnTo,
-    originProductId = _useSellerState$state.originProductId;
+    originProductId = _useSellerState$state.originProductId,
+    manualCustomDataFields = _useSellerState$state.manualCustomDataFields;
   var _useDivaCore = useDivaCore(),
     userHasPermission = _useDivaCore.actions.userHasPermission;
   var _useTranslation = useTranslation(),
@@ -12592,6 +12738,9 @@ function ProductCreator (_ref) {
     //reset selection if new data is loaded
     setSelectedFields((_state$initialSelecte = state === null || state === void 0 ? void 0 : state.initialSelectedFields) !== null && _state$initialSelecte !== void 0 ? _state$initialSelecte : []);
   }, [state === null || state === void 0 ? void 0 : state.initialSelectedFields]);
+  useEffect(function () {
+    loadManualCustomDataFields();
+  }, []);
   var onOpenPlanner = function onOpenPlanner() {
     var basketToInit = new BasketData(state === null || state === void 0 ? void 0 : state.baseData.configuration);
     basketToInit.OrderSets[0].TinyVariantConfiguration = state === null || state === void 0 ? void 0 : state.variantData.map(function (v) {
@@ -12803,24 +12952,11 @@ function ProductCreator (_ref) {
     onCancel: onCancel
   });
   return /*#__PURE__*/jsxs("div", {
-    style: {
-      display: 'flex',
-      overflow: 'hidden',
-      width: '100%',
-      flexDirection: 'column',
-      height: '100%'
-    },
+    className: main,
     children: [/*#__PURE__*/jsx(Title, {
       text: "".concat(t('productcreator.title'), " - ").concat((_currentBasket$DivaNr = currentBasket === null || currentBasket === void 0 ? void 0 : currentBasket.DivaNr) !== null && _currentBasket$DivaNr !== void 0 ? _currentBasket$DivaNr : state.baseData.divaNr)
     }), /*#__PURE__*/jsxs("div", {
-      style: {
-        position: 'relative',
-        width: '100%',
-        overflow: 'hidden',
-        flex: 1,
-        display: 'flex',
-        flexDirection: 'column'
-      },
+      className: content,
       children: [/*#__PURE__*/jsx(Paper, {
         style: {
           marginBottom: 1
@@ -12876,12 +13012,7 @@ function ProductCreator (_ref) {
         },
         children: t(warn)
       }), /*#__PURE__*/jsxs("div", {
-        style: {
-          display: 'flex',
-          overflow: 'hidden',
-          flexDirection: 'column',
-          flex: 1
-        },
+        className: tabContent,
         children: [tab == 'AFFILIATE' && /*#__PURE__*/jsx(AffiliateTable, {
           variantData: validVariantData,
           baseData: state.baseData,
@@ -12890,11 +13021,7 @@ function ProductCreator (_ref) {
           affiliateData: affiliates,
           children: ButtonsElement
         }), tab == 'RENDERJOB' && /*#__PURE__*/jsx("div", {
-          style: {
-            display: 'flex',
-            flex: 1,
-            margin: 10
-          },
+          className: renderjob,
           children: /*#__PURE__*/jsx(OrderEntry, {
             variantData: validVariantData,
             baseData: state.baseData,
@@ -12946,6 +13073,8 @@ function ProductCreator (_ref) {
           additionalBaseFields: additional,
           customFormData: customFormData,
           hasVariants: showVarinats,
+          manualCustomDataFields: manualCustomDataFields,
+          classificationFields: state === null || state === void 0 ? void 0 : state.classificationFields,
           children: ButtonsElement
         }), tab == 'BASECONFIG' && /*#__PURE__*/jsx(VariantTable, {
           update: updateVariants,