linear-react-components-ui 1.0.10-beta.2 → 1.0.10-beta.21

package/lib/treeview/treeview.spec.js

@@ -0,0 +1,279 @@
+"use strict";
+
+var _react = require("@testing-library/react");
+
+var _react2 = _interopRequireDefault(require("react"));
+
+require("@testing-library/jest-dom");
+
+require("babel-polyfill");
+
+var _ = _interopRequireDefault(require("."));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+
+function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+var dataMock = {
+  id: 1,
+  titulo: 'SG Linear',
+  codigo: 'SG_Linear',
+  permissoes: [{
+    codigo: 'ACESSO'
+  }, {
+    codigo: 'GRAVAR'
+  }],
+  itens: [{
+    id: 2,
+    titulo: 'Segurança',
+    codigo: 'seguranca',
+    permissoes: [{
+      codigo: 'ACESSO'
+    }, {
+      codigo: 'GRAVAR'
+    }],
+    itens: [{
+      id: 4,
+      titulo: 'Perfis',
+      codigo: 'perfis',
+      itens: [{
+        titulo: 'Editar',
+        codigo: 'Editar',
+        itens: [{
+          titulo: 'Editar permissão ERP',
+          codigo: 'Editar permissão ERP'
+        }]
+      }]
+    }]
+  }, {
+    id: 3,
+    titulo: 'Cadastros',
+    codigo: 'cadastros',
+    permissoes: [{
+      codigo: 'ACESSO'
+    }, {
+      codigo: 'GRAVAR'
+    }],
+    itens: [{
+      id: 5,
+      titulo: 'Empresas',
+      codigo: 'empresas'
+    }]
+  }]
+};
+
+var treeviewRenderMock = function treeviewRenderMock(props) {
+  return /*#__PURE__*/_react2.default.createElement(_.default, _extends({
+    data: dataMock,
+    valuePropName: "id",
+    labelPropName: "titulo",
+    parentPropName: "0"
+  }, props));
+};
+
+describe('Treeview', function () {
+  describe('Default', function () {
+    it('should render', function () {
+      var _render = (0, _react.render)(treeviewRenderMock()),
+          container = _render.container;
+
+      expect(container.firstChild).toBeTruthy();
+    });
+    it('should have start node visible', function () {
+      var _render2 = (0, _react.render)(treeviewRenderMock()),
+          queryByText = _render2.queryByText;
+
+      expect(queryByText(dataMock.titulo)).toBeTruthy();
+    });
+    it('should not have second node visible', function () {
+      var _render3 = (0, _react.render)(treeviewRenderMock()),
+          queryByText = _render3.queryByText;
+
+      expect(queryByText(dataMock.itens[0].titulo)).not.toBeTruthy();
+    });
+    it('should open on click', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+      var _render4, container, queryByText;
+
+      return regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              _render4 = (0, _react.render)(treeviewRenderMock()), container = _render4.container, queryByText = _render4.queryByText;
+
+              _react.fireEvent.click(container.querySelector('.treeviewitem .opencloseicon'));
+
+              _context.next = 4;
+              return (0, _react.waitFor)(function () {
+                return queryByText(dataMock.itens[0].titulo);
+              });
+
+            case 4:
+              expect(queryByText(dataMock.itens[0].titulo)).toBeTruthy();
+              expect(queryByText(dataMock.itens[1].titulo)).toBeTruthy();
+
+            case 6:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    })));
+    it('should open all layers', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
+      var _render5, container, queryByText;
+
+      return regeneratorRuntime.wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              _render5 = (0, _react.render)(treeviewRenderMock()), container = _render5.container, queryByText = _render5.queryByText;
+
+              _react.fireEvent.click(container.querySelector('.treeviewitem .opencloseicon'));
+
+              _context2.next = 4;
+              return (0, _react.waitFor)(function () {
+                return queryByText(dataMock.itens[0].titulo);
+              });
+
+            case 4:
+              _react.fireEvent.click(container.querySelectorAll('.treeviewitem .opencloseicon')[1]);
+
+              _context2.next = 7;
+              return (0, _react.waitFor)(function () {
+                return queryByText(dataMock.itens[0].itens[0].titulo);
+              });
+
+            case 7:
+              _react.fireEvent.click(container.querySelectorAll('.treeviewitem .opencloseicon')[2]);
+
+              _context2.next = 10;
+              return (0, _react.waitFor)(function () {
+                return queryByText(dataMock.itens[0].itens[0].itens[0].titulo);
+              });
+
+            case 10:
+              _react.fireEvent.click(container.querySelectorAll('.treeviewitem .opencloseicon')[3]);
+
+              _context2.next = 13;
+              return (0, _react.waitFor)(function () {
+                return queryByText(dataMock.itens[0].itens[0].itens[0].itens[0].titulo);
+              });
+
+            case 13:
+              _react.fireEvent.click(container.querySelectorAll('.treeviewitem .opencloseicon')[4]);
+
+              _context2.next = 16;
+              return (0, _react.waitFor)(function () {
+                return queryByText(dataMock.itens[1].itens[0].titulo);
+              });
+
+            case 16:
+              expect(queryByText(dataMock.itens[0].titulo)).toBeTruthy();
+              expect(queryByText(dataMock.itens[0].itens[0].titulo)).toBeTruthy();
+              expect(queryByText(dataMock.itens[0].itens[0].itens[0].titulo)).toBeTruthy();
+              expect(queryByText(dataMock.itens[0].itens[0].itens[0].itens[0].titulo)).toBeTruthy();
+              expect(queryByText(dataMock.itens[1].titulo)).toBeTruthy();
+              expect(queryByText(dataMock.itens[1].itens[0].titulo)).toBeTruthy();
+
+            case 22:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2);
+    })));
+    it('should render checkbox', function () {
+      var _render6 = (0, _react.render)(treeviewRenderMock({
+        showCheckBox: true
+      })),
+          container = _render6.container;
+
+      expect(container.querySelector('.checkbox-component')).toBeTruthy();
+    });
+    it('should call onSelectedIdsChange callback', function () {
+      var mockCallback = jest.fn(function (x) {
+        return x;
+      });
+
+      var _render7 = (0, _react.render)(treeviewRenderMock({
+        showCheckBox: true,
+        onSelectedIdsChange: mockCallback
+      })),
+          container = _render7.container;
+
+      _react.fireEvent.click(container.querySelector('.checkbox-component'));
+
+      expect(mockCallback.mock.calls.length).toBe(1);
+      expect(mockCallback.mock.calls[0][0]).toStrictEqual([1]);
+    });
+    it('should control checkbox by selectedIds', function () {
+      var _render8 = (0, _react.render)(treeviewRenderMock({
+        showCheckBox: true,
+        selectedIds: [1]
+      })),
+          container = _render8.container;
+
+      expect(container.querySelector('.checkbox-component input[type=checkbox]')).toBeChecked();
+    });
+    it('should start checkbox unchecked', function () {
+      var _render9 = (0, _react.render)(treeviewRenderMock({
+        showCheckBox: true
+      })),
+          container = _render9.container;
+
+      expect(container.querySelector('.checkbox-component input[type=checkbox]')).not.toBeChecked();
+    });
+    it('should start nodes open', function () {
+      var _render10 = (0, _react.render)(treeviewRenderMock({
+        startNodesOpened: true
+      })),
+          queryByText = _render10.queryByText;
+
+      expect(queryByText(dataMock.itens[0].titulo)).toBeTruthy();
+      expect(queryByText(dataMock.itens[0].itens[0].titulo)).toBeTruthy();
+      expect(queryByText(dataMock.itens[0].itens[0].itens[0].titulo)).toBeTruthy();
+      expect(queryByText(dataMock.itens[0].itens[0].itens[0].itens[0].titulo)).toBeTruthy();
+      expect(queryByText(dataMock.itens[1].titulo)).toBeTruthy();
+      expect(queryByText(dataMock.itens[1].itens[0].titulo)).toBeTruthy();
+    });
+    it('should apply customClass', function () {
+      var _render11 = (0, _react.render)(treeviewRenderMock({
+        customClass: 'customClass'
+      })),
+          container = _render11.container;
+
+      expect(container.firstChild).toHaveClass('customClass');
+    });
+    it('should apply style', function () {
+      var _render12 = (0, _react.render)(treeviewRenderMock({
+        styleForContainer: {
+          backgroundColor: '#000'
+        }
+      })),
+          container = _render12.container;
+
+      expect(container.querySelector('ul')).toHaveStyle('background-color: #000');
+    });
+    it('should apply idsInLoading', function () {
+      var _render13 = (0, _react.render)(treeviewRenderMock({
+        idsInLoading: [1]
+      })),
+          container = _render13.container;
+
+      var li = container.querySelector('li').firstChild;
+      expect(li.firstChild).toHaveClass('spinnerloading');
+    });
+    it('should apply selectedNodeId', function () {
+      var _render14 = (0, _react.render)(treeviewRenderMock({
+        selectedNodeId: 1
+      })),
+          container = _render14.container;
+
+      var filhosLi = container.querySelector('li').children;
+      expect(filhosLi[1]).toHaveStyle('background-color: rgb(209, 209, 209)');
+    });
+  });
+});

package/lib/{types-90c43ae1.d.ts → types-c1e2d0c9.d.ts}

@@ -1,6 +1,7 @@
 import React__default, { ReactNode, ReactElement } from 'react';
 import { PermissionAttr } from './@types/PermissionAttr.js';
 import ColorStyles from './internals/colorStyles.js';
+import { IconNames } from './@types/Icon.js';
 
 declare function numberAroundZeroAndOne({ props, propName, componentName }: IParameterFunction): Error | null;
 declare const PanelContext: React__default.Context<ContextProps>;
@@ -22,7 +23,7 @@ interface IPanelHeaderProps {
     title?: string;
     children?: ReactElement;
     icon?: ReactElement;
-    titleIcon?: string;
+    titleIcon?: IconNames;
     customClass?: string;
     style?: object;
     styleForTitle?: object;

package/lib/uitour/uitour.spec.js

@@ -0,0 +1,176 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+require("@testing-library/jest-dom");
+
+require("babel-polyfill");
+
+var _react2 = require("@testing-library/react");
+
+var _ = _interopRequireDefault(require("."));
+
+var _helpers = require("./helpers");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var data = [{
+  id: '1',
+  targetId: 'uitour-teste',
+  title: 'Título',
+  description: 'Lorem ipsum dolor sit <strong>amet</strong> consectetur adipisicing elit.'
+}, {
+  id: '2',
+  targetId: 'uitour-button',
+  title: 'Botão',
+  description: 'Lorem ipsum, dolor sit adipisicing elit. Repellendus, fuga.'
+}];
+var backButtonLabel = 'Voltar';
+var nextButtonLabel = 'Avançar';
+var finishButtonLabel = 'Finalizar';
+
+var UiTourMock = function UiTourMock(_ref) {
+  var onFinish = _ref.onFinish,
+      visible = _ref.visible,
+      showCloseButton = _ref.showCloseButton,
+      showBackButton = _ref.showBackButton;
+  return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("h1", {
+    style: {
+      width: 100
+    },
+    id: "uitour-teste"
+  }, "Teste UiTour"), /*#__PURE__*/_react.default.createElement("button", {
+    id: "uitour-button"
+  }, "Teste button"), /*#__PURE__*/_react.default.createElement(_.default, {
+    data: data,
+    backButtonLabel: backButtonLabel,
+    nextButtonLabel: nextButtonLabel,
+    finishButtonLabel: finishButtonLabel,
+    onFinish: onFinish,
+    showCloseButton: showCloseButton,
+    showBackButton: showBackButton,
+    visible: visible
+  }));
+};
+
+UiTourMock.propTypes = {
+  onFinish: _propTypes.default.func,
+  visible: _propTypes.default.bool,
+  showCloseButton: _propTypes.default.bool,
+  showBackButton: _propTypes.default.bool
+};
+UiTourMock.defaultProps = {
+  onFinish: undefined,
+  visible: true,
+  showCloseButton: true,
+  showBackButton: true
+};
+describe('UiTour', function () {
+  it('should render correctly', function () {
+    var _render = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, null)),
+        container = _render.container;
+
+    var uitourComponent = container.querySelector('.uitour-component');
+    expect(container.firstChild).toContainElement(uitourComponent);
+  });
+  it('should go to next step', function () {
+    var _render2 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, null)),
+        container = _render2.container;
+
+    var nextButton = container.querySelector('.next-button');
+
+    _react2.fireEvent.click(nextButton);
+
+    expect(container.querySelector('.content .number')).toHaveTextContent('2');
+  });
+  it('should execute callback on finish and close', function () {
+    var mockFinish = jest.fn();
+
+    var _render3 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, {
+      onFinish: mockFinish
+    })),
+        container = _render3.container;
+
+    var nextButton = container.querySelector('.next-button');
+
+    _react2.fireEvent.click(nextButton);
+
+    var finishButton = container.querySelector('.finish-button');
+
+    _react2.fireEvent.click(finishButton);
+
+    expect(mockFinish).toHaveBeenCalledTimes(1);
+    expect(container.querySelector('.uitour-component')).not.toBeInTheDocument();
+  });
+  it('should step render aside target position', function () {
+    var _render4 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, null)),
+        container = _render4.container;
+
+    var targetRect = container.querySelector('#uitour-teste');
+    var targetDimensions = targetRect.getBoundingClientRect();
+    var stepDimensions = container.querySelector('.uitour-component .step');
+    expect(stepDimensions.style.left).toBe("".concat(targetDimensions.left + targetDimensions.width + _helpers.ARROW_WIDTH, "px"));
+    expect(stepDimensions.style.top).toBe("".concat(targetDimensions.top - _helpers.ARROW_HEIGHT, "px"));
+  });
+  it('should render with backButtonLabel', function () {
+    var _render5 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, null)),
+        getByText = _render5.getByText;
+
+    expect(getByText(backButtonLabel)).toBeInTheDocument();
+  });
+  it('should render with nextButtonLabel', function () {
+    var _render6 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, null)),
+        getByText = _render6.getByText;
+
+    expect(getByText(nextButtonLabel)).toBeInTheDocument();
+  });
+  it('should render with finishButtonLabel', function () {
+    var _render7 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, null)),
+        container = _render7.container,
+        getByText = _render7.getByText;
+
+    var nextButton = container.querySelector('.next-button');
+
+    _react2.fireEvent.click(nextButton);
+
+    expect(getByText(finishButtonLabel)).toBeInTheDocument();
+  });
+  it('should render close button', function () {
+    var _render8 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, null)),
+        container = _render8.container;
+
+    expect(container.querySelector('.close-button')).toBeInTheDocument();
+  });
+  it('should not render close button', function () {
+    var _render9 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, {
+      showCloseButton: false
+    })),
+        container = _render9.container;
+
+    expect(container.querySelector('.close-button')).not.toBeInTheDocument();
+  });
+  it('should render back button', function () {
+    var _render10 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, null)),
+        getByText = _render10.getByText;
+
+    expect(getByText(backButtonLabel)).toBeInTheDocument();
+  });
+  it('should not render back button', function () {
+    var _render11 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, {
+      showBackButton: false
+    })),
+        container = _render11.container;
+
+    expect(container.querySelector('.back-button')).not.toBeInTheDocument();
+  });
+  it('should not visible', function () {
+    var _render12 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, {
+      visible: false
+    })),
+        container = _render12.container;
+
+    expect(container.querySelector('.uitour-component')).not.toBeInTheDocument();
+  });
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "linear-react-components-ui",
-  "version": "1.0.10-beta.2",
+  "version": "1.0.10-beta.21",
   "description": "Linear Sistemas ReactJs Components",
   "main": "lib/index.js",
   "module": "lib/index.cjs",
@@ -9,9 +9,10 @@
     "lib:types": "tsup --dts-only --dts --external react",
     "lib:watch": "babel src/lib -w -d lib/ ",
     "demo": "node scripts/start.js",
-    "demo:prod": "webpack -p",
+    "demo:prod": "webpack --config ./config/webpack.config.js --mode production",
     "check:js": "./node_modules/.bin/eslint ./src/* --ext=.jsx,.js,.tsx,.ts",
     "deploy:heroku": "npm run demo:prod && cd demo && git commit -am 'Deploy' && git push heroku master",
+    "deploy:vercel": "npm run demo:prod && vercel --prod demo",
     "publish:npm": "npm run lib && npm publish",
     "publish:npm:beta": "npm run lib && npm publish --tag beta",
     "publish:npm:rc": "npm run lib && npm publish --tag rc",
@@ -29,55 +30,57 @@
     "react-transition-group": "^4.4.2"
   },
   "devDependencies": {
-    "@babel/cli": "^7.5.5",
-    "@babel/core": "^7.5.5",
-    "@babel/plugin-proposal-class-properties": "7.0.0-beta.36",
-    "@babel/plugin-proposal-object-rest-spread": "7.0.0-beta.36",
-    "@babel/preset-env": "^7.0.0-beta.36",
-    "@babel/preset-react": "^7.0.0-beta.36",
-    "@babel/preset-typescript": "^7.16.7",
-    "@es-pack/esbuild-sass-plugin": "^2.0.1",
-    "@swc/core": "^1.3.14",
-    "@testing-library/jest-dom": "^5.14.1",
-    "@testing-library/react": "^12.0.0",
-    "@types/lodash": "^4.14.182",
-    "@types/node": "^17.0.31",
-    "@types/react": "^18.0.24",
-    "@types/react-dev-utils": "^9.0.10",
-    "@types/react-dom": "^18.0.5",
-    "@types/react-router-dom": "^5.3.3",
-    "@types/react-syntax-highlighter": "^15.5.5",
-    "@types/react-transition-group": "^4.4.5",
-    "@types/uuid": "^8.3.4",
-    "@typescript-eslint/eslint-plugin": "^5.23.0",
-    "@typescript-eslint/parser": "^5.23.0",
-    "babel-eslint": "^7.2.3",
-    "babel-jest": "^27.0.5",
-    "babel-loader": "^9.1.0",
-    "babel-polyfill": "^6.26.0",
-    "css-loader": "^0.28.8",
-    "esbuild": "^0.15.13",
-    "esbuild-plugin-babel": "^0.2.3",
-    "esbuild-plugin-sass": "^1.0.1",
-    "eslint": "^8.15.0",
+    "@babel/cli": "7.20.7",
+    "@babel/core": "7.20.12",
+    "@babel/plugin-proposal-class-properties": "7.18.6",
+    "@babel/plugin-proposal-object-rest-spread": "7.20.7",
+    "@babel/preset-env": "7.20.2",
+    "@babel/preset-react": "7.18.6",
+    "@babel/preset-typescript": "7.18.6",
+    "@es-pack/esbuild-sass-plugin": "2.0.1",
+    "@swc/core": "1.3.29",
+    "@testing-library/jest-dom": "5.16.5",
+    "@testing-library/react": "12.1.5",
+    "@testing-library/user-event": "14.4.3",
+    "@types/lodash": "^4.14.191",
+    "@types/node": "17.0.45",
+    "@types/react": "18.0.26",
+    "@types/react-dev-utils": "^9.0.11",
+    "@types/react-dom": "18.0.5",
+    "@types/react-router-dom": "5.3.3",
+    "@types/react-syntax-highlighter": "15.5.6",
+    "@types/react-transition-group": "4.4.5",
+    "@types/uuid": "8.3.4",
+    "@typescript-eslint/eslint-plugin": "5.48.1",
+    "@typescript-eslint/parser": "^5.48.1",
+    "babel-eslint": "7.2.3",
+    "babel-jest": "27.5.1",
+    "babel-loader": "9.1.2",
+    "babel-polyfill": "6.26.0",
+    "css-loader": "0.28.11",
+    "esbuild": "0.15.18",
+    "esbuild-plugin-babel": "0.2.3",
+    "esbuild-plugin-sass": "1.0.1",
+    "eslint": "8.31.0",
     "eslint-config-airbnb": "16.1.0",
     "eslint-config-airbnb-typescript": "^17.0.0",
-    "eslint-import-resolver-typescript": "^2.7.1",
+    "eslint-import-resolver-typescript": "2.7.1",
     "eslint-plugin-class-property": "1.1.0",
-    "eslint-plugin-import": "^2.26.0",
+    "eslint-plugin-import": "2.26.0",
     "eslint-plugin-jsx-a11y": "6.0.3",
     "eslint-plugin-react": "7.5.1",
-    "file-loader": "^1.1.6",
-    "html-webpack-plugin": "^5.5.0",
-    "husky": "^6.0.0",
-    "identity-obj-proxy": "^3.0.0",
-    "jest": "^27.0.5",
-    "react": "^16.14.0",
+    "file-loader": "1.1.11",
+    "html-webpack-plugin": "5.5.0",
+    "husky": "6.0.0",
+    "identity-obj-proxy": "3.0.0",
+    "jest": "27.5.1",
+    "react": "16.14.0",
     "react-dom": "^16.14.0",
-    "react-transition-group": "^4.3.0",
-    "style-loader": "^0.23.1",
-    "tsup": "^6.4.0",
-    "typescript": "^4.6.4"
+    "react-transition-group": "4.4.5",
+    "style-loader": "0.23.1",
+    "tsup": "6.5.0",
+    "typescript": "4.9.4",
+    "webpack-cli": "5.1.4"
   },
   "author": "Deivisson Bruno <deivisson.bruno@linearsistemas.com.br>",
   "homepage": "",
@@ -86,25 +89,25 @@
     "url": "git@gitlab.com:linear-front/linear-react-components-ui.git"
   },
   "dependencies": {
-    "@types/react-dom": "^18.0.5",
-    "attach-dom-events": "^1.0.0",
-    "browserslist": "^4.18.1",
-    "history": "^5.0.0",
-    "imask": "^6.4.3",
-    "init": "^0.1.2",
-    "lodash": "^4.17.21",
-    "moment": "^2.29.1",
-    "prop-types": "^15.7.2",
-    "react-dev-utils": "^12.0.0",
-    "react-router-dom": "^5.1.2",
-    "react-syntax-highlighter": "^15.5.0",
-    "sass": "^1.56.0",
-    "sass-loader": "^7.3.1",
-    "semver": "^7.3.5",
-    "uuid": "^3.3.3",
-    "webpack": "^5.64.4",
-    "webpack-dev-server": "^4.6.0",
-    "webpack-manifest-plugin": "^4.0.2"
+    "@types/react-dom": "18.0.5",
+    "attach-dom-events": "1.0.0",
+    "browserslist": "4.18.1",
+    "history": "5.0.0",
+    "imask": "6.4.3",
+    "init": "0.1.2",
+    "lodash": "4.17.21",
+    "moment": "2.29.1",
+    "prop-types": "15.7.2",
+    "react-dev-utils": "12.0.0",
+    "react-router-dom": "5.2.0",
+    "react-syntax-highlighter": "15.5.0",
+    "sass": "1.56.0",
+    "sass-loader": "7.3.1",
+    "semver": "7.3.5",
+    "uuid": "3.3.3",
+    "webpack": "5.64.4",
+    "webpack-dev-server": "4.6.0",
+    "webpack-manifest-plugin": "4.0.2"
   },
   "browserslist": {
     "production": [