diff --git a/.gitignore b/.gitignore
index 51569c5..5737c43 100644
--- a/.gitignore
+++ b/.gitignore
@@ -4,3 +4,4 @@ dist
 .DS_Store
 coverage/
 .vscode/
+index.js
diff --git a/index.js b/index.js
deleted file mode 100644
index 3702196..0000000
--- a/index.js
+++ /dev/null
@@ -1,80 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var Paginate = function Paginate(allData, itemsPerPage) {
-  return allData.map(function (item, index) {
-    return index % itemsPerPage === 0 && allData.slice(index, index + itemsPerPage);
-  }).filter(Boolean);
-};
-
-var _default = function _default(_ref) {
-  var data = _ref.data,
-      itemsPerPage = _ref.itemsPerPage,
-      onePage = _ref.onePage,
-      next = _ref.next,
-      prev = _ref.prev,
-      activePageStyle = _ref.activePageStyle,
-      pageName = _ref.pageName,
-      pageButtons = _ref.pageButtons;
-
-  var _useState = (0, _react.useState)(0),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      pageNo = _useState2[0],
-      setPageNo = _useState2[1];
-
-  var pages = data ? Paginate(data, itemsPerPage) : [];
-  var allPages = pages.map(function (item, index) {
-    return index;
-  });
-  var allPageNumbers = pageNo < Math.round(pageButtons / 2) ? allPages.slice(0, pageButtons) : allPages.slice(pageNo - Math.round(pageButtons / 2), pageNo + Math.round(pageButtons / 2));
-  return _react["default"].createElement("div", {
-    className: "pagination-container"
-  }, (pages[pageNo] || pages[0]).map(function (item, index) {
-    return onePage(item, index);
-  }), _react["default"].createElement("div", {
-    className: "pagination-buttons"
-  }, _react["default"].createElement("div", {
-    className: "arrows"
-  }, _react["default"].createElement("button", {
-    id: "prev",
-    type: "button",
-    onClick: function onClick() {
-      return setPageNo(pageNo === 0 ? pageNo : pageNo - 1);
-    }
-  }, prev)), _react["default"].createElement("div", {
-    className: "pages"
-  }, allPageNumbers.map(function (item, index) {
-    return _react["default"].createElement("div", {
-      id: index,
-      key: index
-    }, _react["default"].createElement("button", {
-      type: "button",
-      onClick: function onClick() {
-        return setPageNo(item);
-      },
-      style: item === pageNo ? activePageStyle : {}
-    }, pageName, " ", item + 1));
-  })), _react["default"].createElement("div", {
-    className: "arrows"
-  }, _react["default"].createElement("button", {
-    id: "next",
-    type: "button",
-    onClick: function onClick() {
-      return setPageNo(pageNo === pages.length - 1 ? pageNo : pageNo + 1);
-    }
-  }, next))));
-};
-
-exports["default"] = _default;
diff --git a/package.json b/package.json
index 9948910..c6212cd 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "custom_react_pages",
-  "version": "1.3.2",
+  "version": "1.3.3",
   "description": "This package makes pagination easier",
   "main": "index.js",
   "keywords": [
diff --git a/src/pagination.js b/src/pagination.js
index 3db1cb9..e5cbfbc 100644
--- a/src/pagination.js
+++ b/src/pagination.js
@@ -18,20 +18,22 @@ export default ({
 }) => {
   const [pageNo, setPageNo] = useState(0)
 
-  const pages = data ? Paginate(data, itemsPerPage) : []
+  const pages = data.length && Paginate(data, itemsPerPage)
 
-  const allPages = pages.map((item, index) => index)
+  const allPages = data.length && pages.map((item, index) => index)
 
   const allPageNumbers =
-    pageNo < Math.round(pageButtons / 2)
+    data.length &&
+    (pageNo < Math.round(pageButtons / 2)
       ? allPages.slice(0, pageButtons)
       : allPages.slice(
           pageNo - Math.round(pageButtons / 2),
           pageNo + Math.round(pageButtons / 2)
-        )
+        ))
   return (
     <div className="pagination-container">
-      {(pages[pageNo] || pages[0]).map((item, index) => onePage(item, index))}
+      {data.length &&
+        (pages[pageNo] || pages[0]).map((item, index) => onePage(item, index))}
       <div className="pagination-buttons">
         <div className="arrows">
           <button
@@ -43,18 +45,19 @@ export default ({
           </button>
         </div>
         <div className="pages">
-          {allPageNumbers.map((item, index) => (
-            <div id={index} key={index}>
-              <button
-              id='kill'
-                type="button"
-                onClick={() => setPageNo(item)}
-                style={item === pageNo ? activePageStyle : {}}
-              >
-                {pageName} {item + 1}
-              </button>
-            </div>
-          ))}
+          {data.length &&
+            allPageNumbers.map((item, index) => (
+              <div id={index} key={index}>
+                <button
+                  id="kill"
+                  type="button"
+                  onClick={() => setPageNo(item)}
+                  style={item === pageNo ? activePageStyle : {}}
+                >
+                  {pageName} {item + 1}
+                </button>
+              </div>
+            ))}
         </div>
         <div className="arrows">
           <button