contentoh-components-library 21.0.72 → 21.0.75

package/dist/components/pages/RetailerProductEdition/styles.js

@@ -13,7 +13,7 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
 
 var _templateObject;
 
-var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n\n  .data-container {\n    display: flex;\n    flex: 0%;\n    height: calc(100% - ", "px);\n    .image-data-panel {\n      width: 340px;\n\n      & + * {\n        margin-left: 10px;\n      }\n    }\n\n    .product-information {\n      width: 100%;\n      display: flex;\n      flex-direction: column;\n\n      .services-information-container {\n        overflow: auto;\n      }\n\n      .image-services {\n        display: grid;\n        grid-template-columns: repeat(auto-fill, 179px);\n        column-gap: 15px;\n        row-gap: 15px;\n      }\n    }\n  }\n"])), function (_ref) {
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  flex: 1;\n  overflow: auto;\n\n  .data-container {\n    display: flex;\n    flex: 0%;\n    height: calc(100% - ", "px);\n    .image-data-panel {\n      width: 340px;\n\n      & + * {\n        margin-left: 10px;\n      }\n    }\n\n    .product-information {\n      width: 100%;\n      display: flex;\n      flex-direction: column;\n\n      .services-information-container {\n        height: 100%;\n        overflow: auto;\n      }\n\n      .image-services {\n        aside {\n          display: grid;\n          grid-template-columns: repeat(auto-fill, 179px);\n          column-gap: 15px;\n          row-gap: 15px;\n          padding: 20px;\n        }\n      }\n\n      .commentary-box {\n        display: flex;\n        justify-content: space-between;\n        align-items: flex-end;\n        padding: 10px;\n        padding-left: 0;\n\n        .commentary {\n          display: flex;\n          align-items: flex-end;\n\n          .input-container {\n            width: 500px;\n\n            .quill {\n              height: 100px;\n            }\n\n            & + * {\n              margin-left: 5px;\n            }\n          }\n\n          .buttons-box {\n            display: flex;\n            width: 210px;\n            flex-wrap: wrap;\n\n            .general-transparent-button {\n              & + * {\n                margin-top: 5px;\n              }\n            }\n\n            .general-transparent-button,\n            .general-green-button,\n            .general-button-disabled {\n              width: fit-content;\n              min-width: 201px;\n              height: 40px;\n            }\n          }\n        }\n      }\n\n      .feedback-box {\n        display: flex;\n      }\n    }\n  }\n  .container {\n    width: 100%;\n    height: 100%;\n    .dropzone {\n      height: 100%;\n      width: 100%;\n    }\n  }\n"])), function (_ref) {
   var headerTop = _ref.headerTop;
   return headerTop;
 });

package/dist/global-files/data.js

@@ -5,66 +5,46 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getRetailerServices = exports.getImage = void 0;
+exports.getRetailerServices = exports.getProfilePicture = exports.getPercentage = exports.getNewStatus = exports.getImage = exports.fetchUsers = void 0;
 
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
 
 var _axios = _interopRequireDefault(require("axios"));
 
 var _jsBase = require("js-base64");
 
-var _defaultUpdate = _interopRequireDefault(require("../assets/images/defaultImages/defaultUpdate.png"));
+var _uuid = require("uuid");
 
 var getRetailerServices = /*#__PURE__*/function () {
-  var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
-    var _images$attrForImgs, _images$attrForImgs$g;
+  var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(articleId, category, version) {
+    var _images$values;
 
-    var responseArray, datasheets, descriptions, images, code;
+    var responseArray, datasheets, descriptions, images;
     return _regenerator.default.wrap(function _callee$(_context) {
       while (1) {
         switch (_context.prev = _context.next) {
           case 0:
             _context.next = 2;
-            return Promise.all([_axios.default.post("".concat(process.env.REACT_APP_ARTICLE_DATA_DATASHEET_ENDPOINT, "?idCategory=846&articleId=238&version=2")), _axios.default.get("".concat(process.env.REACT_APP_ARTICLE_DATA_DESCRIPTION_ENDPOINT, "?idCategory=846&articleId=238&version=2")), _axios.default.post("".concat(process.env.REACT_APP_ARTICLE_DATA_IMAGES_ENDPOINT, "?idCategory=846&articleId=238&version=2"))]);
+            return Promise.all([_axios.default.post("".concat(process.env.REACT_APP_ARTICLE_DATA_DATASHEET_ENDPOINT, "?idCategory=").concat(category, "&articleId=").concat(articleId, "&version=").concat(version)), _axios.default.get("".concat(process.env.REACT_APP_ARTICLE_DATA_DESCRIPTION_ENDPOINT, "?idCategory=").concat(category, "&articleId=").concat(articleId, "&version=").concat(version)), _axios.default.post("".concat(process.env.REACT_APP_ARTICLE_DATA_IMAGES_ENDPOINT, "?idCategory=").concat(category, "&articleId=").concat(articleId, "&version=").concat(version))]);
 
           case 2:
             responseArray = _context.sent;
             datasheets = JSON.parse(responseArray[0].data.body).data;
             descriptions = JSON.parse(responseArray[1].data.body).data;
             images = JSON.parse(responseArray[2].data.body).data;
-            code = images === null || images === void 0 ? void 0 : (_images$attrForImgs = images.attrForImgs) === null || _images$attrForImgs === void 0 ? void 0 : (_images$attrForImgs$g = _images$attrForImgs.general[0]) === null || _images$attrForImgs$g === void 0 ? void 0 : _images$attrForImgs$g.value;
-            images === null || images === void 0 ? void 0 : images.values.map(function (value) {
-              value.imageName = images.inputs.filter(function (e) {
+            images.values = images === null || images === void 0 ? void 0 : (_images$values = images.values) === null || _images$values === void 0 ? void 0 : _images$values.map(function (value) {
+              value.name = images.inputs.find(function (e) {
                 return e.id === value.image_id;
-              })[0].name;
-              value.data = [{
-                feature: "Tipo de empaque",
-                value: images === null || images === void 0 ? void 0 : images.imagePackagingType[(value === null || value === void 0 ? void 0 : value.packing_type) - 1].name
-              }, {
-                feature: "Tipo de imagen",
-                value: images === null || images === void 0 ? void 0 : images.imageType.filter(function (e) {
-                  return value.image_type == e.id;
-                })[0].name
-              }, {
-                feature: "Código de Fabricante",
-                value: code
-              }, {
-                feature: "Formato",
-                value: value.src.split(".")[1]
-              }, {
-                feature: "Tamaño de imagen",
-                value: "".concat(value.width, "x").concat(value.height)
-              }, {
-                feature: "Subfijo de imagen",
-                value: ""
-              }];
-              return value;
+              }).name;
+              return getImage(value);
             });
             return _context.abrupt("return", [datasheets, descriptions, images]);
 
-          case 9:
+          case 8:
           case "end":
             return _context.stop();
         }
@@ -72,35 +52,29 @@ var getRetailerServices = /*#__PURE__*/function () {
     }, _callee);
   }));
 
-  return function getRetailerServices() {
+  return function getRetailerServices(_x, _x2, _x3) {
     return _ref.apply(this, arguments);
   };
 }();
 
 exports.getRetailerServices = getRetailerServices;
 
-var getImage = function getImage(imageGeneral, width, height) {
+var getImage = function getImage(imageGeneral) {
+  var width = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 250;
+  var height = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 250;
+
   try {
     var image = imageGeneral;
     var ext = image.src.split(".");
     var uuid = ext[0].split("-");
-    return {
-      id: image.id,
-      image_id: image.image_id,
-      packing_type: +image.packing_type,
-      image_type: +image.image_type,
-      name: image.name,
-      imageName: image.imageName,
-      data: image.data,
+    return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, image), {}, {
       version: image.id_version,
-      width: image.width,
-      height: image.height,
       ext: ext[ext.length - 1],
       uuid: uuid.reduce(function (prevVal, currVal, idx) {
         if (idx < 2) return "";else return idx === 2 ? currVal : prevVal + "-" + currVal;
-      }, "") || uuidv4(),
+      }, "") || (0, _uuid.v4)(),
       srcDB: image.src,
-      src: "https://d24s337exbt5zr.cloudfront.net/" + _jsBase.Base64.encode(JSON.stringify({
+      src: image.image_id ? "https://d24s337exbt5zr.cloudfront.net/" + _jsBase.Base64.encode(JSON.stringify({
         bucket: process.env.REACT_APP_IMAGES_BUCKET,
         key: image.src,
         edits: {
@@ -116,14 +90,200 @@ var getImage = function getImage(imageGeneral, width, height) {
             }
           }
         }
-      }))
-    };
+      })) : image.src
+    });
+  } catch (err) {
+    console.log("err", err);
+    return imageGeneral["error"] = err;
+  }
+};
+
+exports.getImage = getImage;
+
+var getPercentage = /*#__PURE__*/function () {
+  var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3() {
+    var params,
+        func,
+        _args3 = arguments;
+    return _regenerator.default.wrap(function _callee3$(_context3) {
+      while (1) {
+        switch (_context3.prev = _context3.next) {
+          case 0:
+            params = _args3.length > 0 && _args3[0] !== undefined ? _args3[0] : {};
+
+            func = /*#__PURE__*/function () {
+              var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
+                var dataToSend, retailers;
+                return _regenerator.default.wrap(function _callee2$(_context2) {
+                  while (1) {
+                    switch (_context2.prev = _context2.next) {
+                      case 0:
+                        dataToSend = [];
+                        retailers = params.data[0].retailers || params.data[0].retailersAvailable;
+                        params.data.forEach(function (product) {
+                          retailers.forEach(function (retailer) {
+                            dataToSend.push(product.article ? {
+                              id_article: product.article.id_article,
+                              id_category: product.article.id_category,
+                              id_retailer: retailer.id,
+                              version: product.version,
+                              upc: product.article.upc,
+                              name: product.article.name,
+                              retailerName: retailer.name
+                            } : {
+                              id_article: product.id_article,
+                              id_category: product.id_category,
+                              id_retailer: retailer.id,
+                              version: product.version,
+                              upc: product.upc,
+                              name: product.name,
+                              retailerName: retailer.name
+                            });
+                          });
+                        });
+                        _context2.next = 5;
+                        return _axios.default.post(process.env.REACT_APP_VALID_EXPORT_ENDPOINT, {
+                          data: dataToSend
+                        }, {
+                          headers: {
+                            Authorization: sessionStorage.getItem("jwt")
+                          }
+                        }).then(function (response) {
+                          return response.data;
+                        }).catch(function (err) {
+                          return console.log(err, "Errror");
+                        });
+
+                      case 5:
+                        return _context2.abrupt("return", _context2.sent);
+
+                      case 6:
+                      case "end":
+                        return _context2.stop();
+                    }
+                  }
+                }, _callee2);
+              }));
+
+              return function func() {
+                return _ref3.apply(this, arguments);
+              };
+            }();
+
+            _context3.next = 4;
+            return func();
+
+          case 4:
+            return _context3.abrupt("return", _context3.sent);
+
+          case 5:
+          case "end":
+            return _context3.stop();
+        }
+      }
+    }, _callee3);
+  }));
+
+  return function getPercentage() {
+    return _ref2.apply(this, arguments);
+  };
+}();
+
+exports.getPercentage = getPercentage;
+
+var getProfilePicture = function getProfilePicture(userId, width, height) {
+  try {
+    return "https://d24s337exbt5zr.cloudfront.net/" + _jsBase.Base64.encode(JSON.stringify({
+      bucket: process.env.REACT_APP_IMAGES_PROFILE_BUCKET,
+      key: "id-".concat(userId, "/").concat(userId, ".png"),
+      edits: {
+        resize: {
+          width: width,
+          height: height,
+          fit: "contain",
+          background: {
+            r: 255,
+            g: 255,
+            b: 255,
+            alpha: 0
+          }
+        }
+      }
+    }));
   } catch (err) {
     console.log("err", err);
-    return {
-      src: _defaultUpdate.default
-    };
+    return defaultUpdate;
   }
 };
 
-exports.getImage = getImage;
+exports.getProfilePicture = getProfilePicture;
+
+var fetchUsers = /*#__PURE__*/function () {
+  var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee4(auth) {
+    var usersPromises, usersGroups, header, usersResponse;
+    return _regenerator.default.wrap(function _callee4$(_context4) {
+      while (1) {
+        switch (_context4.prev = _context4.next) {
+          case 0:
+            usersPromises = [];
+            usersGroups = [];
+            header = {
+              headers: {
+                Authorization: auth
+              }
+            };
+            /**
+             * 7 will fetch all text specialists
+             * 8 will fetch all img specialists
+             * 4 will fetch all text facilitators
+             * 5 will fetch all img facilitators
+             * 6 will fetch all auditors
+             */
+
+            usersPromises.push(_axios.default.get("".concat(process.env.REACT_APP_USER_ENDPOINT, "?fetchRole=7"), header), _axios.default.get("".concat(process.env.REACT_APP_USER_ENDPOINT, "?fetchRole=8"), header), _axios.default.get("".concat(process.env.REACT_APP_USER_ENDPOINT, "?fetchRole=4"), header), _axios.default.get("".concat(process.env.REACT_APP_USER_ENDPOINT, "?fetchRole=5"), header), _axios.default.get("".concat(process.env.REACT_APP_USER_ENDPOINT, "?fetchRole=6"), header));
+            _context4.next = 6;
+            return Promise.all(usersPromises);
+
+          case 6:
+            usersResponse = _context4.sent;
+            usersResponse.forEach(function (item, i) {
+              usersGroups.push(item.data.data);
+            });
+            return _context4.abrupt("return", usersGroups);
+
+          case 9:
+          case "end":
+            return _context4.stop();
+        }
+      }
+    }, _callee4);
+  }));
+
+  return function fetchUsers(_x4) {
+    return _ref4.apply(this, arguments);
+  };
+}();
+
+exports.fetchUsers = fetchUsers;
+
+var getNewStatus = function getNewStatus(statusArray) {
+  var lookupString = "";
+  statusArray.forEach(function (element) {
+    return lookupString += element + "/";
+  });
+  console.log(lookupString, "productTemp");
+  if (lookupString.includes("RF")) return "RF";
+  if (lookupString.includes("RA")) return "RA";
+  if (lookupString.includes("RP")) return "RP";
+  if (lookupString.includes("RC")) return "RC";
+  if (lookupString.includes("UNASSIGNED")) return "IN_PROGRESS";
+  if (lookupString.includes("IN_PROGRESS")) return "IN_PROGRESS";
+  if (lookupString.includes("QF")) return "QF";
+  if (lookupString.includes("AF")) return "AF";
+  if (lookupString.includes("AA")) return "AA";
+  if (lookupString.includes("AP")) return "AP";
+  if (lookupString.includes("AC")) return "AC";
+  return new Error("Status not found");
+};
+
+exports.getNewStatus = getNewStatus;

package/dist/global-files/global-styles.css

@@ -11,6 +11,7 @@
 body.sb-main-padded.sb-show-main {
   padding: 0;
   height: 100vh;
+  overflow: hidden;
 }
 
 .sb-main-padded.sb-show-main #root {

package/dist/global-files/variables.js

@@ -12,6 +12,7 @@ var GlobalColors = {
   s5: "#503D66",
   original_magenta: "#B12D84",
   secondary_magenta: "#BA0070",
+  rejected_status: "#D74DED",
   magenta_s2: "#E33AA9",
   original_purpura: "#603888",
   in_progress: "#ED9A4D",

package/dist/index.js

@@ -836,6 +836,19 @@ Object.keys(_RetailerProductEdition).forEach(function (key) {
   });
 });
 
+var _ProviderProductEdition = require("./components/pages/ProviderProductEdition");
+
+Object.keys(_ProviderProductEdition).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _ProviderProductEdition[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _ProviderProductEdition[key];
+    }
+  });
+});
+
 var _VerificationCodeResetPassword = require("./components/pages/VerificationCodeResetPassword");
 
 Object.keys(_VerificationCodeResetPassword).forEach(function (key) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "contentoh-components-library",
-  "version": "21.0.72",
+  "version": "21.0.75",
   "dependencies": {
     "@aws-amplify/auth": "^4.5.3",
     "@aws-amplify/datastore": "^3.11.0",
@@ -10,19 +10,26 @@
     "@testing-library/jest-dom": "^5.11.4",
     "@testing-library/react": "^11.1.0",
     "@testing-library/user-event": "^12.1.10",
-    "aws-amplify": "^4.3.21",
-    "aws-sdk": "^2.959.0",
+    "aws-sdk": "^2.1088.0",
     "axios": "^0.25.0",
     "babel-preset-react-app": "^10.0.1",
     "chart.js": "^3.7.1",
+    "draft-js": "^0.11.7",
+    "file-saver": "^2.0.5",
+    "contentoh-components-library": "^21.0.18",
+    "aws-amplify": "^4.3.21",
     "js-base64": "^3.7.2",
     "prop-types": "^15.7.2",
     "react": "^17.0.2",
-    "react-chartjs-2": "^4.1.0",
+    "react-chartjs-2": "^4.0.1",
     "react-dom": "^17.0.2",
+    "react-draft-wysiwyg": "^1.14.7",
+    "react-dropzone": "^12.0.4",
     "react-image-fallback": "^8.0.0",
+    "react-quill": "^1.3.5",
     "react-router-dom": "^5.2.0",
     "styled-components": "^5.3.3",
+    "uuid": "^8.3.2",
     "web-vitals": "^1.0.1"
   },
   "scripts": {
@@ -69,10 +76,10 @@
   "devDependencies": {
     "@babel/cli": "^7.17.10",
     "@babel/core": "^7.16.0",
-    "@storybook/addon-actions": "^6.4.1",
-    "@storybook/addon-essentials": "^6.4.1",
-    "@storybook/addon-links": "^6.4.1",
-    "@storybook/react": "^6.4.1",
+    "@storybook/addon-actions": "^6.5.7",
+    "@storybook/addon-essentials": "^6.5.7",
+    "@storybook/addon-links": "^6.5.7",
+    "@storybook/react": "^6.5.7",
     "auth": "^0.0.9",
     "auto": "^10.36.5",
     "babel-loader": "^8.2.3",
@@ -83,7 +90,7 @@
   },
   "description": "contentoh components packed library.",
   "main": "dist/index.js",
-  "repository": "git@github.com:Content-oh/components-library.git",
+  "repository": "https://git@github.com:Content-oh/components-library.git",
   "author": "asael06 <asael.mb@hotmail.com>",
   "license": "MIT"
 }

package/src/assets/images/generalButton/downloadIcon.svg

@@ -0,0 +1,3 @@
+<svg width="17" height="18" viewBox="0 0 17 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M13.7063 7.61134C13.2246 5.16759 11.0783 3.33301 8.5 3.33301C6.45292 3.33301 4.675 4.49467 3.78958 6.19467C1.6575 6.42134 0 8.22759 0 10.4163C0 12.7609 1.90542 14.6663 4.25 14.6663H13.4583C15.4133 14.6663 17 13.0797 17 11.1247C17 9.25467 15.5479 7.73884 13.7063 7.61134ZM12.0417 9.70801L8.5 13.2497L4.95833 9.70801H7.08333V6.87467H9.91667V9.70801H12.0417Z" fill="#817393"/>
+</svg>

package/src/assets/images/genericModal/closeWhite.svg

@@ -0,0 +1,3 @@
+<svg width="8" height="8" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6.59 0L4 2.59L1.41 0L0 1.41L2.59 4L0 6.59L1.41 8L4 5.41L6.59 8L8 6.59L5.41 4L8 1.41L6.59 0Z" fill="#FBFBFB"/>
+</svg>

package/src/assets/images/genericModal/errorModal.svg

@@ -0,0 +1,3 @@
+<svg width="120" height="120" viewBox="0 0 120 120" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M75.3243 36.333L60.0002 51.6572L44.676 36.333L36.3335 44.6755L51.6577 59.9997L36.3335 75.3238L44.676 83.6663L60.0002 68.3422L75.3243 83.6663L83.6668 75.3238L68.3427 59.9997L83.6668 44.6755L75.3243 36.333ZM60.0002 0.833008C27.281 0.833008 0.833496 27.2805 0.833496 59.9997C0.833496 92.7188 27.281 119.166 60.0002 119.166C92.7193 119.166 119.167 92.7188 119.167 59.9997C119.167 27.2805 92.7193 0.833008 60.0002 0.833008ZM60.0002 107.333C33.9077 107.333 12.6668 86.0922 12.6668 59.9997C12.6668 33.9072 33.9077 12.6663 60.0002 12.6663C86.0927 12.6663 107.334 33.9072 107.334 59.9997C107.334 86.0922 86.0927 107.333 60.0002 107.333Z" fill="#FC3030"/>
+</svg>

package/src/assets/images/genericModal/yellowAlert.svg

@@ -0,0 +1,12 @@
+<svg width="81" height="81" viewBox="0 0 81 81" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clipPath="url(#clip0)">
+<path d="M79.7088 62.5501L48.7485 8.92531C47.0269 5.9435 43.9434 4.16309 40.5 4.16309C37.0567 4.16309 33.973 5.9435 32.2514 8.92531L1.29129 62.5499C-0.43043 65.532 -0.43043 69.0925 1.29129 72.0745C3.01301 75.0565 6.09639 76.8367 9.53983 76.8367H71.4601C74.9034 76.8367 77.9869 75.0563 79.7088 72.0747C81.4305 69.0925 81.4305 65.532 79.7088 62.5501ZM75.599 69.7019C74.7351 71.1982 73.1878 72.0914 71.4601 72.0914H9.53983C7.81194 72.0914 6.26471 71.1982 5.40093 69.7019C4.53714 68.2056 4.53714 66.4192 5.40093 64.9229L36.3614 11.2982C37.2252 9.80191 38.7724 8.9087 40.5001 8.9087C42.2277 8.9087 43.7751 9.80191 44.6389 11.2982L75.5992 64.9229C76.4628 66.4192 76.4628 68.2056 75.599 69.7019Z" fill="#EDD34D"/>
+<path d="M42.8724 27.8452H38.127V51.5729H42.8724V27.8452Z" fill="#EDD34D"/>
+<path d="M40.4997 56.3179C38.7552 56.3179 37.3359 57.7371 37.3359 59.4816C37.3359 61.2261 38.7552 62.6454 40.4997 62.6454C42.2441 62.6454 43.6635 61.2261 43.6635 59.4816C43.6635 57.7371 42.2442 56.3179 40.4997 56.3179Z" fill="#EDD34D"/>
+</g>
+<defs>
+<clipPath id="clip0">
+<rect width="81" height="81" fill="white"/>
+</clipPath>
+</defs>
+</svg>