linear-react-components-ui 0.4.77-beta.25 → 0.4.77-beta.26

package/lib/uitour/index.js

@@ -9,16 +9,12 @@ exports.default = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _buttons = _interopRequireWildcard(require("../buttons"));
 
 require("../assets/styles/uitour.scss");
 
 var _helpers = require("./helpers");
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -42,9 +38,12 @@ var UiTour = function UiTour(props) {
       nextButtonLabel = props.nextButtonLabel,
       backButtonLabel = props.backButtonLabel,
       finishButtonLabel = props.finishButtonLabel,
-      showCloseButton = props.showCloseButton,
-      showBackButton = props.showBackButton,
-      visible = props.visible,
+      _props$showCloseButto = props.showCloseButton,
+      showCloseButton = _props$showCloseButto === void 0 ? true : _props$showCloseButto,
+      _props$showBackButton = props.showBackButton,
+      showBackButton = _props$showBackButton === void 0 ? true : _props$showBackButton,
+      _props$visible = props.visible,
+      visible = _props$visible === void 0 ? true : _props$visible,
       onFinish = props.onFinish;
 
   var _useState = (0, _react.useState)(undefined),
@@ -82,13 +81,13 @@ var UiTour = function UiTour(props) {
       stepPosition = _useState14[0],
       setStepPosition = _useState14[1];
 
-  var stepRef = (0, _react.useRef)();
-  var descriptionRef = (0, _react.useRef)();
+  var stepRef = (0, _react.useRef)(null);
+  var descriptionRef = (0, _react.useRef)(null);
 
   var handleNextStep = function handleNextStep() {
     if (hasNextStep) {
       var currentStepIndex = data.findIndex(function (item) {
-        return item.id === currentStep.id;
+        return item.id === (currentStep === null || currentStep === void 0 ? void 0 : currentStep.id);
       });
       var nextStep = data[currentStepIndex + 1];
       var nextStepIndex = data.findIndex(function (item) {
@@ -107,7 +106,7 @@ var UiTour = function UiTour(props) {
   var handleBackStep = function handleBackStep() {
     if (hasBackStep) {
       var currentStepIndex = data.findIndex(function (item) {
-        return item.id === currentStep.id;
+        return item.id === (currentStep === null || currentStep === void 0 ? void 0 : currentStep.id);
       });
       var backStep = data[currentStepIndex - 1];
       var backStepIndex = data.findIndex(function (item) {
@@ -133,7 +132,7 @@ var UiTour = function UiTour(props) {
       var stepRect = stepRef.current.getBoundingClientRect();
       var windowWidth = window.innerWidth;
 
-      if (stepRect.right >= windowWidth || currentStep.position === _helpers.STEP_POSITIONS.right) {
+      if (stepRect.right >= windowWidth || (currentStep === null || currentStep === void 0 ? void 0 : currentStep.position) === _helpers.STEP_POSITIONS.right) {
         setStepPosition(_helpers.STEP_POSITIONS.right);
         setStepDimensions({
           top: target.top - _helpers.ARROW_HEIGHT,
@@ -251,21 +250,5 @@ var UiTour = function UiTour(props) {
   }))));
 };
 
-UiTour.propTypes = {
-  data: _propTypes.default.arrayOf(_propTypes.default.object).isRequired,
-  nextButtonLabel: _propTypes.default.string.isRequired,
-  backButtonLabel: _propTypes.default.string.isRequired,
-  finishButtonLabel: _propTypes.default.string.isRequired,
-  showCloseButton: _propTypes.default.bool,
-  showBackButton: _propTypes.default.bool,
-  visible: _propTypes.default.bool,
-  onFinish: _propTypes.default.func
-};
-UiTour.defaultProps = {
-  showCloseButton: true,
-  showBackButton: true,
-  visible: true,
-  onFinish: undefined
-};
 var _default = UiTour;
 exports.default = _default;

package/lib/uitour/types.d.ts

@@ -0,0 +1,30 @@
+import { STEP_POSITIONS } from './helpers.js';
+
+declare type UITourData = {
+    id: string | number;
+    targetId: string;
+    title: string;
+    description: string;
+    position?: keyof typeof STEP_POSITIONS;
+};
+interface CurrentStep extends UITourData {
+    number: number;
+}
+interface StepDimensions {
+    top?: number;
+    left?: number;
+    right?: number;
+    bottom?: number;
+}
+interface IUITourProps {
+    data: UITourData[];
+    nextButtonLabel: string;
+    backButtonLabel: string;
+    finishButtonLabel: string;
+    showCloseButton?: boolean;
+    showBackButton?: boolean;
+    visible?: boolean;
+    onFinish: (value: boolean) => void;
+}
+
+export { CurrentStep, IUITourProps, StepDimensions, UITourData };

package/lib/uitour/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/uitour/uitour.spec.js

@@ -1,21 +1,12 @@
 "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',
@@ -30,12 +21,14 @@ var data = [{
 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;
+    _ref$visible = _ref.visible,
+    visible = _ref$visible === void 0 ? true : _ref$visible,
+    _ref$showCloseButton = _ref.showCloseButton,
+    showCloseButton = _ref$showCloseButton === void 0 ? true : _ref$showCloseButton,
+    _ref$showBackButton = _ref.showBackButton,
+    showBackButton = _ref$showBackButton === void 0 ? true : _ref$showBackButton;
   return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("h1", {
     style: {
       width: 100
@@ -54,60 +47,42 @@ var UiTourMock = function UiTourMock(_ref) {
     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 _render = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, {
+        onFinish: function onFinish() {}
+      })),
+      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 _render2 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, {
+        onFinish: function onFinish() {}
+      })),
+      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;
-
+        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 _render4 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, {
+        onFinish: function onFinish() {}
+      })),
+      container = _render4.container;
     var targetRect = container.querySelector('#uitour-teste');
     var targetDimensions = targetRect.getBoundingClientRect();
     var stepDimensions = container.querySelector('.uitour-component .step');
@@ -115,62 +90,65 @@ describe('UiTour', function () {
     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;
-
+    var _render5 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, {
+        onFinish: function onFinish() {}
+      })),
+      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;
-
+    var _render6 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, {
+        onFinish: function onFinish() {}
+      })),
+      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 _render7 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, {
+        onFinish: function onFinish() {}
+      })),
+      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;
-
+    var _render8 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, {
+        onFinish: function onFinish() {}
+      })),
+      container = _render8.container;
     expect(container.querySelector('.closebutton')).toBeInTheDocument();
   });
   it('should not render close button', function () {
     var _render9 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, {
-      showCloseButton: false
-    })),
-        container = _render9.container;
-
+        onFinish: function onFinish() {},
+        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;
-
+    var _render10 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(UiTourMock, {
+        onFinish: function onFinish() {}
+      })),
+      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;
-
+        onFinish: function onFinish() {},
+        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;
-
+        onFinish: function onFinish() {},
+        visible: false
+      })),
+      container = _render12.container;
     expect(container.querySelector('.uitour-component')).not.toBeInTheDocument();
   });
 });

package/package.json

@@ -1,10 +1,12 @@
 {
   "name": "linear-react-components-ui",
-  "version": "0.4.77-beta.25",
+  "version": "0.4.77-beta.26",
   "description": "Linear Sistemas ReactJs Components",
   "main": "lib/index.js",
+  "module": "lib/index.cjs",
   "scripts": {
-    "lib": "babel src/lib/ -d lib/ --extensions \".js,.jsx,.ts,.tsx\" && babel src/lib/assets -d lib/assets --copy-files",
+    "lib": "babel src/lib/ -d lib/ --extensions \".js,.jsx,.ts,.tsx\" --ignore **/*.spec.tsx && babel src/lib/assets -d lib/assets --copy-files && npm run lib:types",
+    "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",
@@ -33,6 +35,8 @@
     "@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",
@@ -41,14 +45,19 @@
     "@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": "^8.0.0-beta.0",
+    "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",
     "eslint-config-airbnb": "16.1.0",
     "eslint-config-airbnb-typescript": "^17.0.0",
@@ -66,6 +75,7 @@
     "react-dom": "^16.14.0",
     "react-transition-group": "^4.3.0",
     "style-loader": "^0.23.1",
+    "tsup": "^6.4.0",
     "typescript": "^4.6.4"
   },
   "author": "Deivisson Bruno <deivisson.bruno@linearsistemas.com.br>",
@@ -83,11 +93,11 @@
     "init": "^0.1.2",
     "lodash": "^4.17.21",
     "moment": "^2.29.1",
-    "node-sass": "^4.13.0",
     "prop-types": "^15.7.2",
     "react-dev-utils": "^12.0.0",
     "react-router-dom": "^5.1.2",
-    "react-syntax-highlighter": "^6.1.1",
+    "react-syntax-highlighter": "^15.5.0",
+    "sass": "^1.56.0",
     "sass-loader": "^7.3.1",
     "semver": "^7.3.5",
     "uuid": "^3.3.3",

package/tsconfig.json

@@ -1,17 +1,32 @@
 {
   "compilerOptions": {
-    "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
-    "jsx": "react-jsx",
-    "noEmit": true,
-    "isolatedModules": true,
-    "resolveJsonModule": true,
-    "moduleResolution": "node",
     "allowSyntheticDefaultImports": true,
+    "baseUrl": ".",
+    "declaration": true,
     "esModuleInterop": true,
-    "strict": true,
-    "skipLibCheck": true,
     "forceConsistentCasingInFileNames": true,
+    "isolatedModules": true,
+    "jsx": "react",
+    "lib": [
+        "dom",
+        "dom.iterable",
+        "esnext"
+    ],
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "skipLibCheck": true,
+    "sourceMap": true,
+    "strict": true,
+    "target": "es2018"
   },
-  "include": ["src", "images.d.ts"]
+  "exclude": [
+    "!node_modules/@types",
+    "node_modules",
+    "src/**/*.spec.ts",
+    "src/**/*.test.ts"
+  ],
+  "include": ["src/**/*"],
+  "typeRoots": ["./node_modules/@types"],
+  "types": ["node"]
 }

package/tsup.config.ts

@@ -0,0 +1,10 @@
+/* eslint-disable no-param-reassign */
+/* eslint-disable import/no-extraneous-dependencies */
+import { defineConfig } from 'tsup';
+
+export default defineConfig({
+  entry: ['src/lib/**/!(*.d|*.spec).ts*'],
+  external: ['react', 'sass'],
+  clean: true,
+  outDir: 'lib',
+});

package/images.d.ts

@@ -1,3 +0,0 @@
-declare module '*.png'
-declare module '*.jpg'
-declare module '*.gif'