@crystaldesign/diva-seller 24.15.0-beta.43 → 24.15.0-beta.44

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, IconButton as IconButton$1, FormControlLabel as FormControlLabel$1, Checkbox as Checkbox$1, Divider as Divider$1, Alert, AlertTitle, 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, AlertTitle, 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 { Histogram, useFilterState, FilterComponent, AnalyticsComponent } from '@crystaldesign/analytics';
 import Button from '@mui/material/Button';
 import ButtonGroup from '@mui/material/ButtonGroup';
@@ -5894,9 +5894,10 @@ var favoriteCheckbox = "favoriteCheckbox-JYnH-";
 var actionButtonContainer = "actionButtonContainer-WfYfD";
 var productDetailsPaper = "productDetailsPaper-VsWfW";
 var productDetailText = "productDetailText-wkk6U";
+var productDetailSkeleton = "productDetailSkeleton-3-RLq";
 var productDetailDivider = "productDetailDivider-C1Cdh";
 var alertTitle = "alertTitle-Bm1NO";
-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.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";
+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) {
@@ -5916,12 +5917,16 @@ function Step3Product(_ref) {
     setIsFavorite = _useState4[1];
   var _useState5 = useState(false),
     _useState6 = _slicedToArray(_useState5, 2),
-    editProductName = _useState6[0],
-    setEditProductName = _useState6[1];
-  var _useState7 = useState((_currentProduct$short = currentProduct === null || currentProduct === void 0 ? void 0 : currentProduct.shortDescription) !== null && _currentProduct$short !== void 0 ? _currentProduct$short : ''),
+    dataIsReady = _useState6[0],
+    setDataIsReady = _useState6[1];
+  var _useState7 = useState(false),
     _useState8 = _slicedToArray(_useState7, 2),
-    text = _useState8[0],
-    setText = _useState8[1];
+    editProductName = _useState8[0],
+    setEditProductName = _useState8[1];
+  var _useState9 = useState((_currentProduct$short = currentProduct === null || currentProduct === void 0 ? void 0 : currentProduct.shortDescription) !== null && _currentProduct$short !== void 0 ? _currentProduct$short : ''),
+    _useState10 = _slicedToArray(_useState9, 2),
+    text = _useState10[0],
+    setText = _useState10[1];
   useEffect(function () {
     setText(currentProduct === null || currentProduct === void 0 ? void 0 : currentProduct.shortDescription);
   }, [currentProduct]);
@@ -5938,6 +5943,9 @@ function Step3Product(_ref) {
   var handleFavoriteToggle = function handleFavoriteToggle() {
     setIsFavorite(!isFavorite);
   };
+  useEffect(function () {
+    setDataIsReady(currentProduct && imgIsLoaded);
+  }, [currentProduct, imgIsLoaded]);
   return /*#__PURE__*/jsxs(Box, {
     className: container$1,
     children: [/*#__PURE__*/jsx(InfoAlert$1, {
@@ -5972,8 +5980,13 @@ function Step3Product(_ref) {
                 onBlur: handleBlur,
                 autoFocus: true,
                 className: productNameField
-              }) : /*#__PURE__*/jsx("h2", {
+              }) : dataIsReady ? /*#__PURE__*/jsx("h2", {
                 children: text
+              }) : /*#__PURE__*/jsx(Skeleton, {
+                animation: "wave",
+                variant: "text",
+                width: "50%",
+                height: 50
               }), !editProductName && /*#__PURE__*/jsx(IconButton$1, {
                 size: "small",
                 onClick: handleEditProductName,
@@ -5983,11 +5996,16 @@ function Step3Product(_ref) {
               })]
             }), /*#__PURE__*/jsx("img", {
               src: (_currentProduct$image = currentProduct === null || currentProduct === void 0 ? void 0 : currentProduct.image) !== null && _currentProduct$image !== void 0 ? _currentProduct$image : currentProduct === null || currentProduct === void 0 ? void 0 : currentProduct.image2D,
-              className: "".concat(productImage, " ").concat(!imgIsLoaded ? hidden$1 : ''),
+              className: "".concat(productImage, " ").concat(!dataIsReady ? hidden$1 : ''),
               alt: "Product",
               onLoad: function onLoad() {
                 return setImgIsLoaded(true);
               }
+            }), !dataIsReady && /*#__PURE__*/jsx(Skeleton, {
+              animation: "wave",
+              variant: "text",
+              width: "75%",
+              height: 300
             })]
           })
         }), /*#__PURE__*/jsx(Box, {
@@ -6001,6 +6019,7 @@ function Step3Product(_ref) {
                 mb: 1,
                 children: t('basket.checkout.step4.favoriteinfo')
               }), /*#__PURE__*/jsx(FormControlLabel$1, {
+                disabled: !dataIsReady,
                 control: /*#__PURE__*/jsx(Checkbox$1, {
                   className: favoriteCheckbox,
                   checked: isFavorite,
@@ -6017,10 +6036,12 @@ function Step3Product(_ref) {
             onClick: function onClick() {
               return handleSave(undefined, false, isFavorite);
             },
+            disabled: !dataIsReady,
             children: t('basket.checkout.step4.saveproduct')
           }), /*#__PURE__*/jsx(Button$1, {
             onClick: startWithEmptyBasket,
             variant: "outlined",
+            disabled: !dataIsReady,
             children: t('basket.checkout.step4.cancel')
           })]
         })]
@@ -6031,7 +6052,26 @@ function Step3Product(_ref) {
           className: productDetailsContainer,
           children: [/*#__PURE__*/jsx("h2", {
             children: t('basket.checkout.step3.productdetails')
-          }), currentProduct === null || currentProduct === void 0 || (_currentProduct$techn = currentProduct.technicalDescription) === null || _currentProduct$techn === void 0 ? void 0 : _currentProduct$techn.split('\n').map(function (line, index) {
+          }), !dataIsReady && /*#__PURE__*/jsx(Fragment, {
+            children: _toConsumableArray(Array(13)).map(function (_, index) {
+              return /*#__PURE__*/jsxs(Box, {
+                className: productDetailRow,
+                children: [/*#__PURE__*/jsx(Skeleton, {
+                  animation: "wave",
+                  variant: "text",
+                  width: "40%",
+                  className: productDetailSkeleton
+                }), /*#__PURE__*/jsx(Skeleton, {
+                  animation: "wave",
+                  variant: "text",
+                  width: "60%",
+                  className: productDetailSkeleton
+                }), index < 12 && /*#__PURE__*/jsx(Divider$1, {
+                  className: productDetailDivider
+                })]
+              }, index);
+            })
+          }), dataIsReady && (currentProduct === null || currentProduct === void 0 || (_currentProduct$techn = currentProduct.technicalDescription) === null || _currentProduct$techn === void 0 ? void 0 : _currentProduct$techn.split('\n').map(function (line, index) {
             var _currentProduct$techn2;
             var formattedLine = line.trim().endsWith(',') ? line.slice(0, -1) : line;
             var _formattedLine$split = formattedLine.split(':'),
@@ -6062,7 +6102,7 @@ function Step3Product(_ref) {
                 className: productDetailDivider
               })]
             }, index);
-          })]
+          }))]
         })
       })]
     })]
@@ -6138,15 +6178,12 @@ function CheckOut(_ref) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
               if (!(status === 'BASE_CONFIGURATION' && !currentProduct)) {
-                _context.next = 5;
+                _context.next = 3;
                 break;
               }
-              toggleLoading('loadProduct');
-              _context.next = 4;
+              _context.next = 3;
               return loadProduct(basket);
-            case 4:
-              toggleLoading('loadProduct');
-            case 5:
+            case 3:
             case "end":
               return _context.stop();
           }

package/build/types/seller/src/ui/Basket/CheckOut/components/Step3Product.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Step3Product.d.ts","sourceRoot":"","sources":["../../../../../../../../src/ui/Basket/CheckOut/components/Step3Product.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAwBnD,UAAU,KAAK;IACb,cAAc,EAAE,GAAG,CAAC;IACpB,oBAAoB,EAAE,MAAM,IAAI,CAAC;IACjC,UAAU,EAAE,CAAC,OAAO,CAAC,EAAE,UAAU,GAAG,MAAM,EAAE,QAAQ,CAAC,EAAE,OAAO,EAAE,UAAU,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;CAC/F;AAED,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EAAE,cAAc,EAAE,oBAAoB,EAAE,UAAU,EAAE,EAAE,KAAK,qBAoH/F"}
+{"version":3,"file":"Step3Product.d.ts","sourceRoot":"","sources":["../../../../../../../../src/ui/Basket/CheckOut/components/Step3Product.tsx"],"names":[],"mappings":"AAeA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAyBnD,UAAU,KAAK;IACb,cAAc,EAAE,GAAG,CAAC;IACpB,oBAAoB,EAAE,MAAM,IAAI,CAAC;IACjC,UAAU,EAAE,CAAC,OAAO,CAAC,EAAE,UAAU,GAAG,MAAM,EAAE,QAAQ,CAAC,EAAE,OAAO,EAAE,UAAU,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;CAC/F;AAED,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EAAE,cAAc,EAAE,oBAAoB,EAAE,UAAU,EAAE,EAAE,KAAK,qBA0I/F"}

package/build/types/seller/src/ui/Basket/CheckOut/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/ui/Basket/CheckOut/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAChE,OAAO,EAAE,UAAU,EAA+B,MAAM,0BAA0B,CAAC;AACnF,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAK1C,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAQ1E,UAAU,KAAK;IACb,MAAM,EAAE,UAAU,CAAC;IACnB,MAAM,EAAE,WAAW,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,GAAG,CAAC;IACd,aAAa,CAAC,EAAE,OAAO,GAAG,aAAa,CAAC;IACxC,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,oBAAoB,EAAE,MAAM,IAAI,CAAC;IACjC,YAAY,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK,IAAI,CAAC;IAC3C,WAAW,EAAE,CAAC,OAAO,CAAC,EAAE,UAAU,GAAG,MAAM,EAAE,QAAQ,CAAC,EAAE,OAAO,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAClF,WAAW,EAAE,YAAY,EAAE,CAAC;IAC5B,iBAAiB,CAAC,EAAE,WAAW,EAAE,CAAC;IAClC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,cAAc,CAAC,EAAE,GAAG,CAAC;IACrB,iBAAiB,CAAC,EAAE,CAAC,cAAc,EAAE,GAAG,KAAK,IAAI,CAAC;IAClD,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CAC5C;AACD,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAC/B,MAAM,EACN,QAAQ,EACR,aAAa,EACb,MAAM,EACN,MAAM,EACN,oBAAoB,EACpB,SAAS,EACT,WAAW,EACX,YAAY,EACZ,WAAW,EACX,iBAAiB,EACjB,IAAI,EACJ,iBAAiB,EACjB,eAAe,GAChB,EAAE,KAAK,qBAoJP"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/ui/Basket/CheckOut/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAChE,OAAO,EAAE,UAAU,EAA+B,MAAM,0BAA0B,CAAC;AACnF,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAK1C,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAQ1E,UAAU,KAAK;IACb,MAAM,EAAE,UAAU,CAAC;IACnB,MAAM,EAAE,WAAW,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,GAAG,CAAC;IACd,aAAa,CAAC,EAAE,OAAO,GAAG,aAAa,CAAC;IACxC,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,oBAAoB,EAAE,MAAM,IAAI,CAAC;IACjC,YAAY,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK,IAAI,CAAC;IAC3C,WAAW,EAAE,CAAC,OAAO,CAAC,EAAE,UAAU,GAAG,MAAM,EAAE,QAAQ,CAAC,EAAE,OAAO,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAClF,WAAW,EAAE,YAAY,EAAE,CAAC;IAC5B,iBAAiB,CAAC,EAAE,WAAW,EAAE,CAAC;IAClC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,cAAc,CAAC,EAAE,GAAG,CAAC;IACrB,iBAAiB,CAAC,EAAE,CAAC,cAAc,EAAE,GAAG,KAAK,IAAI,CAAC;IAClD,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CAC5C;AACD,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAC/B,MAAM,EACN,QAAQ,EACR,aAAa,EACb,MAAM,EACN,MAAM,EACN,oBAAoB,EACpB,SAAS,EACT,WAAW,EACX,YAAY,EACZ,WAAW,EACX,iBAAiB,EACjB,IAAI,EACJ,iBAAiB,EACjB,eAAe,GAChB,EAAE,KAAK,qBAkJP"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crystaldesign/diva-seller",
-  "version": "24.15.0-beta.43",
+  "version": "24.15.0-beta.44",
   "description": "",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
@@ -29,9 +29,9 @@
     "react-dom": "^18.3.1"
   },
   "dependencies": {
-    "@crystaldesign/analytics": "24.15.0-beta.43",
-    "@crystaldesign/products-component": "24.15.0-beta.43",
-    "@crystaldesign/real-time-viewer": "24.15.0-beta.43",
+    "@crystaldesign/analytics": "24.15.0-beta.44",
+    "@crystaldesign/products-component": "24.15.0-beta.44",
+    "@crystaldesign/real-time-viewer": "24.15.0-beta.44",
     "@emotion/react": "^11.4.1",
     "@emotion/styled": "^11.3.0",
     "@mui/icons-material": "^6.1.5",
@@ -43,5 +43,5 @@
   },
   "types": "./build/types/seller/src/index.d.ts",
   "module": "build/esm/index.js",
-  "gitHead": "67c3f84588d7e31a864a94c8025b8682aae40279"
+  "gitHead": "8c0bebe70a221fed0ce3760ba491696fad6fb4ad"
 }