diff --git a/example/package-lock.json b/example/package-lock.json index 8357606..2c7c554 100644 --- a/example/package-lock.json +++ b/example/package-lock.json @@ -162,7 +162,7 @@ "integrity": "sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA==" }, "@testing-library/jest-dom": { - "version": "file:https:/registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-4.2.4.tgz", + "version": "file:../node_modules/@testing-library/jest-dom", "integrity": "sha512-j31Bn0rQo12fhCWOUWy9fl7wtqkp7In/YP2p5ZFyRuiiB9Qs3g+hS4gAmDWONbAHcRmVooNJ5eOHQDCOmUFXHg==", "requires": { "@babel/runtime": "^7.5.1", @@ -177,11 +177,11 @@ }, "dependencies": { "@babel/runtime": { - "version": "7.18.3", - "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.18.3.tgz", - "integrity": "sha512-38Y8f7YUhce/K7RMwTp7m0uCumpv9hZkitCbBClqQIow1qSbCvGkcegKOXpEWCQLfWmevgRiWokZ1GkpfhbZug==", + "version": "7.21.0", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz", + "integrity": "sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==", "requires": { - "regenerator-runtime": "^0.13.4" + "regenerator-runtime": "^0.13.11" } }, "@jest/types": { @@ -287,9 +287,9 @@ "integrity": "sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==" }, "decode-uri-component": { - "version": "0.2.0", - "resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.2.0.tgz", - "integrity": "sha512-hjf+xovcEn31w/EUYdTXQh/8smFL/dzYjohQGEIgjyNavaJfBY2p5F527Bo1VPATxv0VYTUC2bOcXvqFwk78Og==" + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.2.2.tgz", + "integrity": "sha512-FqUYQ+8o158GyGTrMFJms9qh3CqTKvAqgqsTnkLI8sKu0028orqBhxNMFkFen0zGyg6epACD32pjVk58ngIErQ==" }, "diff-sequences": { "version": "24.9.0", @@ -379,14 +379,14 @@ } }, "regenerator-runtime": { - "version": "0.13.9", - "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz", - "integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA==" + "version": "0.13.11", + "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz", + "integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==" }, "resolve-url": { "version": "0.2.1", "resolved": "https://registry.npmjs.org/resolve-url/-/resolve-url-0.2.1.tgz", - "integrity": "sha1-LGN/53yJOv0qZj/iGqkIAGjiBSo=" + "integrity": "sha512-ZuF55hVUQaaczgOIwqWzkEcEidmlD/xl44x1UZnhOXcYuFN2S6+rcxpG+C1N3So0wvNI3DmJICUFfu2SxhBmvg==" }, "source-map": { "version": "0.6.1", @@ -429,12 +429,12 @@ "urix": { "version": "0.1.0", "resolved": "https://registry.npmjs.org/urix/-/urix-0.1.0.tgz", - "integrity": "sha1-2pN/emLiH+wf0Y1Js1wpNQZ6bHI=" + "integrity": "sha512-Am1ousAhSLBeB9cG/7k7r2R0zj50uDRlZHPGbazid5s9rlF1F/QKYObEKSIunSjIOkJZqwRRLpvewjEkM7pSqg==" } } }, "@testing-library/react": { - "version": "file:https:/registry.npmjs.org/@testing-library/react/-/react-9.5.0.tgz", + "version": "file:../node_modules/@testing-library/react", "integrity": "sha512-di1b+D0p+rfeboHO5W7gTVeZDIK5+maEgstrZbWZSSvxDyfDRkkyBE1AJR5Psd6doNldluXlCWqXriUfqu/9Qg==", "requires": { "@babel/runtime": "^7.8.4", @@ -443,20 +443,20 @@ }, "dependencies": { "@babel/runtime": { - "version": "7.18.3", - "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.18.3.tgz", - "integrity": "sha512-38Y8f7YUhce/K7RMwTp7m0uCumpv9hZkitCbBClqQIow1qSbCvGkcegKOXpEWCQLfWmevgRiWokZ1GkpfhbZug==", + "version": "7.21.0", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz", + "integrity": "sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==", "requires": { - "regenerator-runtime": "^0.13.4" + "regenerator-runtime": "^0.13.11" } }, "@babel/runtime-corejs3": { - "version": "7.18.3", - "resolved": "https://registry.npmjs.org/@babel/runtime-corejs3/-/runtime-corejs3-7.18.3.tgz", - "integrity": "sha512-l4ddFwrc9rnR+EJsHsh+TJ4A35YqQz/UqcjtlX2ov53hlJYG5CxtQmNZxyajwDVmCxwy++rtvGU5HazCK4W41Q==", + "version": "7.21.0", + "resolved": "https://registry.npmjs.org/@babel/runtime-corejs3/-/runtime-corejs3-7.21.0.tgz", + "integrity": "sha512-TDD4UJzos3JJtM+tHX+w2Uc+KWj7GV+VKKFdMVd2Rx8sdA19hcc3P3AHFYd5LVOw+pYuSd5lICC3gm52B6Rwxw==", "requires": { - "core-js-pure": "^3.20.2", - "regenerator-runtime": "^0.13.4" + "core-js-pure": "^3.25.1", + "regenerator-runtime": "^0.13.11" } }, "@jest/types": { @@ -516,9 +516,9 @@ "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==" }, "@types/react": { - "version": "18.0.10", - "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.10.tgz", - "integrity": "sha512-dIugadZuIPrRzvIEevIu7A1smqOAjkSMv8qOfwPt9Ve6i6JT/FQcCHyk2qIAxwsQNKZt5/oGR0T4z9h2dXRAkg==", + "version": "18.0.37", + "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.37.tgz", + "integrity": "sha512-4yaZZtkRN3ZIQD3KSEwkfcik8s0SWV+82dlJot1AbGYHCzJkWP3ENBY6wYeDRmKZ6HkrgoGAmR2HqdwYGp6OEw==", "requires": { "@types/prop-types": "*", "@types/scheduler": "*", @@ -526,17 +526,17 @@ } }, "@types/react-dom": { - "version": "18.0.5", - "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.5.tgz", - "integrity": "sha512-OWPWTUrY/NIrjsAPkAk1wW9LZeIjSvkXRhclsFO8CZcZGCOg2G0YZy4ft+rOyYxy8B7ui5iZzi9OkDebZ7/QSA==", + "version": "18.0.11", + "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.11.tgz", + "integrity": "sha512-O38bPbI2CWtgw/OoQoY+BRelw7uysmXbWvw3nLWO21H1HSh+GOlqPuXshJfjmpNlKiiSDG9cc1JZAaMmVdcTlw==", "requires": { "@types/react": "*" } }, "@types/scheduler": { - "version": "0.16.2", - "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz", - "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==" + "version": "0.16.3", + "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.3.tgz", + "integrity": "sha512-5cJ8CB4yAx7BH1oMvdU0Jh9lrEXyPkar6F9G/ERswkCuvP4KQZfZkSjcMbAICCpQTN4OuZn8tz0HiKv9TGZgrQ==" }, "@types/testing-library__dom": { "version": "6.14.0", @@ -650,14 +650,14 @@ "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==" }, "core-js-pure": { - "version": "3.22.8", - "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.22.8.tgz", - "integrity": "sha512-bOxbZIy9S5n4OVH63XaLVXZ49QKicjowDx/UELyJ68vxfCRpYsbyh/WNZNfEfAk+ekA8vSjt+gCDpvh672bc3w==" + "version": "3.30.1", + "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.30.1.tgz", + "integrity": "sha512-nXBEVpmUnNRhz83cHd9JRQC52cTMcuXAmR56+9dSMpRdpeA4I1PX6yjmhd71Eyc/wXNsdBdUDIj1QTIeZpU5Tg==" }, "csstype": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.0.tgz", - "integrity": "sha512-uX1KG+x9h5hIJsaKR9xHUeUraxf8IODOwq9JLNPq6BwB04a/xgpq3rcx47l5BZu5zBPlgD342tdke3Hom/nJRA==" + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz", + "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==" }, "dom-accessibility-api": { "version": "0.3.0", @@ -692,9 +692,9 @@ } }, "@types/yargs": { - "version": "15.0.14", - "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-15.0.14.tgz", - "integrity": "sha512-yEJzHoxf6SyQGhBhIYGXQDSCkJjB6HohDShto7m8vaKg9Yp0Yn8+71J9eakh2bnPg6BfsH9PRMhiRTZnd4eXGQ==", + "version": "15.0.15", + "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-15.0.15.tgz", + "integrity": "sha512-IziEYMU9XoVj8hWg7k+UJrXALkGFjWJhn5QFEv9q4p+v40oZhSuC135M38st8XPjICL7Ey4TV64ferBGUoJhBg==", "requires": { "@types/yargs-parser": "*" } @@ -733,9 +733,9 @@ "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" }, "regenerator-runtime": { - "version": "0.13.9", - "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz", - "integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA==" + "version": "0.13.11", + "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz", + "integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==" }, "supports-color": { "version": "7.2.0", @@ -753,11 +753,11 @@ } }, "@testing-library/user-event": { - "version": "file:https:/registry.npmjs.org/@testing-library/user-event/-/user-event-7.2.1.tgz", + "version": "file:../node_modules/@testing-library/user-event", "integrity": "sha512-oZ0Ib5I4Z2pUEcoo95cT1cr6slco9WY7yiPpG+RGNkj8YcYgJnM7pXmYmorNOReh8MIGcKSqXyeGjxnr8YiZbA==" }, "@types/jest": { - "version": "file:https:/registry.npmjs.org/@types/jest/-/jest-25.2.3.tgz", + "version": "file:../node_modules/@types/jest", "integrity": "sha512-JXc1nK/tXHiDhV55dvfzqtmP4S3sy3T3ouV2tkViZgxY/zeUkcpQcQPGRlgF4KmWzWW5oiWYSZwtCB+2RsE4Fw==", "requires": { "jest-diff": "^25.2.1", @@ -798,9 +798,9 @@ } }, "@types/yargs": { - "version": "15.0.14", - "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-15.0.14.tgz", - "integrity": "sha512-yEJzHoxf6SyQGhBhIYGXQDSCkJjB6HohDShto7m8vaKg9Yp0Yn8+71J9eakh2bnPg6BfsH9PRMhiRTZnd4eXGQ==", + "version": "15.0.15", + "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-15.0.15.tgz", + "integrity": "sha512-IziEYMU9XoVj8hWg7k+UJrXALkGFjWJhn5QFEv9q4p+v40oZhSuC135M38st8XPjICL7Ey4TV64ferBGUoJhBg==", "requires": { "@types/yargs-parser": "*" } @@ -898,7 +898,7 @@ } }, "@types/node": { - "version": "file:https:/registry.npmjs.org/@types/node/-/node-12.20.52.tgz", + "version": "file:../node_modules/@types/node", "integrity": "sha512-cfkwWw72849SNYp3Zx0IcIs25vABmFh73xicxhCkTcvtZQeIez15PpwQN8fY3RD7gv1Wrxlc9MEtfMORZDEsGw==" }, "@types/parse-json": { @@ -907,7 +907,7 @@ "integrity": "sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA==" }, "@types/react": { - "version": "file:https:/registry.npmjs.org/@types/react/-/react-16.14.26.tgz", + "version": "file:../node_modules/@types/react", "integrity": "sha512-c/5CYyciOO4XdFcNhZW1O2woVx86k4T+DO2RorHZL7EhitkNQgSD/SgpdZJAUJa/qjVgOmTM44gHkAdZSXeQuQ==", "requires": { "@types/prop-types": "*", @@ -921,19 +921,19 @@ "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==" }, "@types/scheduler": { - "version": "0.16.2", - "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz", - "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==" + "version": "0.16.3", + "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.3.tgz", + "integrity": "sha512-5cJ8CB4yAx7BH1oMvdU0Jh9lrEXyPkar6F9G/ERswkCuvP4KQZfZkSjcMbAICCpQTN4OuZn8tz0HiKv9TGZgrQ==" }, "csstype": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.0.tgz", - "integrity": "sha512-uX1KG+x9h5hIJsaKR9xHUeUraxf8IODOwq9JLNPq6BwB04a/xgpq3rcx47l5BZu5zBPlgD342tdke3Hom/nJRA==" + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz", + "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==" } } }, "@types/react-dom": { - "version": "file:https:/registry.npmjs.org/@types/react-dom/-/react-dom-16.9.16.tgz", + "version": "file:../node_modules/@types/react-dom", "integrity": "sha512-Oqc0RY4fggGA3ltEgyPLc3IV9T73IGoWjkONbsyJ3ZBn+UPPCYpU2ec0i3cEbJuEdZtkqcCF2l1zf2pBdgUGSg==", "requires": { "@types/react": "^16" @@ -945,9 +945,9 @@ "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==" }, "@types/react": { - "version": "16.14.26", - "resolved": "https://registry.npmjs.org/@types/react/-/react-16.14.26.tgz", - "integrity": "sha512-c/5CYyciOO4XdFcNhZW1O2woVx86k4T+DO2RorHZL7EhitkNQgSD/SgpdZJAUJa/qjVgOmTM44gHkAdZSXeQuQ==", + "version": "16.14.40", + "resolved": "https://registry.npmjs.org/@types/react/-/react-16.14.40.tgz", + "integrity": "sha512-elQj2VQHDuJ5xuEcn5Wxh/YQFNbEuPJFRKSdyG866awDm5dmtoqsMmuAJWb/l/qd2kDkZMfOTKygVfMIdBBPKg==", "requires": { "@types/prop-types": "*", "@types/scheduler": "*", @@ -955,14 +955,14 @@ } }, "@types/scheduler": { - "version": "0.16.2", - "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz", - "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==" + "version": "0.16.3", + "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.3.tgz", + "integrity": "sha512-5cJ8CB4yAx7BH1oMvdU0Jh9lrEXyPkar6F9G/ERswkCuvP4KQZfZkSjcMbAICCpQTN4OuZn8tz0HiKv9TGZgrQ==" }, "csstype": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.0.tgz", - "integrity": "sha512-uX1KG+x9h5hIJsaKR9xHUeUraxf8IODOwq9JLNPq6BwB04a/xgpq3rcx47l5BZu5zBPlgD342tdke3Hom/nJRA==" + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz", + "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==" } } }, @@ -1280,7 +1280,7 @@ } }, "react": { - "version": "file:https:/registry.npmjs.org/react/-/react-16.14.0.tgz", + "version": "file:../node_modules/react", "integrity": "sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g==", "requires": { "loose-envify": "^1.1.0", @@ -2774,7 +2774,7 @@ } }, "@testing-library/jest-dom": { - "version": "file:https:/registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-4.2.4.tgz", + "version": "file:../node_modules/@testing-library/jest-dom", "integrity": "sha512-j31Bn0rQo12fhCWOUWy9fl7wtqkp7In/YP2p5ZFyRuiiB9Qs3g+hS4gAmDWONbAHcRmVooNJ5eOHQDCOmUFXHg==", "requires": { "@babel/runtime": "^7.5.1", @@ -2790,7 +2790,7 @@ "dependencies": {} }, "@testing-library/react": { - "version": "file:https:/registry.npmjs.org/@testing-library/react/-/react-9.5.0.tgz", + "version": "file:../node_modules/@testing-library/react", "integrity": "sha512-di1b+D0p+rfeboHO5W7gTVeZDIK5+maEgstrZbWZSSvxDyfDRkkyBE1AJR5Psd6doNldluXlCWqXriUfqu/9Qg==", "requires": { "@babel/runtime": "^7.8.4", @@ -2800,7 +2800,7 @@ "dependencies": {} }, "@testing-library/user-event": { - "version": "file:https:/registry.npmjs.org/@testing-library/user-event/-/user-event-7.2.1.tgz", + "version": "file:../node_modules/@testing-library/user-event", "integrity": "sha512-oZ0Ib5I4Z2pUEcoo95cT1cr6slco9WY7yiPpG+RGNkj8YcYgJnM7pXmYmorNOReh8MIGcKSqXyeGjxnr8YiZbA==" }, "@types/aria-query": { @@ -2819,7 +2819,7 @@ "integrity": "sha512-EYNwp3bU+98cpU4lAWYYL7Zz+2gryWH1qbdDTidVd6hkiR6weksdbMadyXKXNPEkQFhXM+hVO9ZygomHXp+AIw==" }, "@types/jest": { - "version": "file:https:/registry.npmjs.org/@types/jest/-/jest-25.2.3.tgz", + "version": "file:../node_modules/@types/jest", "integrity": "sha512-JXc1nK/tXHiDhV55dvfzqtmP4S3sy3T3ouV2tkViZgxY/zeUkcpQcQPGRlgF4KmWzWW5oiWYSZwtCB+2RsE4Fw==", "requires": { "jest-diff": "^25.2.1", @@ -2843,7 +2843,7 @@ "integrity": "sha512-/THyiqyQAP9AfARo4pF+aCGcyiQ94tX/Is2I7HofNRqoYLgN1PBoOWu2/zTA5zMxzP5EFutMtWtGAFRKUe961Q==" }, "@types/node": { - "version": "file:https:/registry.npmjs.org/@types/node/-/node-12.20.52.tgz", + "version": "file:../node_modules/@types/node", "integrity": "sha512-cfkwWw72849SNYp3Zx0IcIs25vABmFh73xicxhCkTcvtZQeIez15PpwQN8fY3RD7gv1Wrxlc9MEtfMORZDEsGw==" }, "@types/parse-json": { @@ -2857,7 +2857,7 @@ "integrity": "sha512-L28j2FcJfSZOnL1WBjDYp2vUHCeIFlyYI/53EwD/rKUBQ7MtUUfbQWiyKJGpcnv4/WgrhWsFKrcPstcAt/J0tQ==" }, "@types/react": { - "version": "file:https:/registry.npmjs.org/@types/react/-/react-16.14.26.tgz", + "version": "file:../node_modules/@types/react", "integrity": "sha512-c/5CYyciOO4XdFcNhZW1O2woVx86k4T+DO2RorHZL7EhitkNQgSD/SgpdZJAUJa/qjVgOmTM44gHkAdZSXeQuQ==", "requires": { "@types/prop-types": "*", @@ -2867,7 +2867,7 @@ "dependencies": {} }, "@types/react-dom": { - "version": "file:https:/registry.npmjs.org/@types/react-dom/-/react-dom-16.9.16.tgz", + "version": "file:../node_modules/@types/react-dom", "integrity": "sha512-Oqc0RY4fggGA3ltEgyPLc3IV9T73IGoWjkONbsyJ3ZBn+UPPCYpU2ec0i3cEbJuEdZtkqcCF2l1zf2pBdgUGSg==", "requires": { "@types/react": "^16" @@ -7341,7 +7341,7 @@ } }, "react": { - "version": "file:https:/registry.npmjs.org/react/-/react-16.14.0.tgz", + "version": "file:../node_modules/react", "integrity": "sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g==", "requires": { "loose-envify": "^1.1.0", @@ -7351,7 +7351,7 @@ "dependencies": {} }, "react-dom": { - "version": "file:https:/registry.npmjs.org/react-dom/-/react-dom-16.14.0.tgz", + "version": "file:../node_modules/react-dom", "integrity": "sha512-1gCeQXDLoIqMgqD3IO2Ah9bnf0w9kzhwN5q4FGnHZ67hBm9yePzB5JJAIQCc8x3pFnNlwFq4RidZggNAAkzWWw==" }, "react-is": { @@ -7387,7 +7387,7 @@ } }, "react-scripts": { - "version": "file:https:/registry.npmjs.org/react-scripts/-/react-scripts-3.4.4.tgz", + "version": "file:../node_modules/react-scripts", "integrity": "sha512-7J7GZyF/QvZkKAZLneiOIhHozvOMHey7hO9cdO9u68jjhGZlI8hDdOm6UyuHofn6Ajc9Uji5I6Psm/nKNuWdyw==" }, "read-pkg": { @@ -8806,7 +8806,7 @@ "integrity": "sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==" }, "typescript": { - "version": "file:https:/registry.npmjs.org/typescript/-/typescript-3.9.10.tgz", + "version": "file:../node_modules/typescript", "integrity": "sha512-w6fIxVE/H1PkLKcCPsFqKE7Kv7QUwhU8qQY2MueZXWx5cPZdwFupLgKK3vntcK98BtNHZtAF4LA/yl2a7k8R6Q==" }, "unbox-primitive": { @@ -12019,15 +12019,6 @@ "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz", "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==" }, - "bindings": { - "version": "1.5.0", - "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz", - "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==", - "optional": true, - "requires": { - "file-uri-to-path": "1.0.0" - } - }, "bluebird": { "version": "3.7.2", "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.7.2.tgz", @@ -14667,12 +14658,6 @@ "schema-utils": "^2.5.0" } }, - "file-uri-to-path": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz", - "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==", - "optional": true - }, "filesize": { "version": "6.0.1", "resolved": "https://registry.npmjs.org/filesize/-/filesize-6.0.1.tgz", @@ -16270,11 +16255,7 @@ "version": "1.2.13", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz", "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==", - "optional": true, - "requires": { - "bindings": "^1.5.0", - "nan": "^2.12.1" - } + "optional": true } } }, @@ -17306,12 +17287,6 @@ "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.8.tgz", "integrity": "sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA==" }, - "nan": { - "version": "2.16.0", - "resolved": "https://registry.npmjs.org/nan/-/nan-2.16.0.tgz", - "integrity": "sha512-UdAqHyFngu7TfQKsCBgAA6pWDkT8MAO7d0jyOecVhN5354xbLqdn8mV9Tat9gepAupm0bt2DbeaSC8vS52MuFA==", - "optional": true - }, "nanomatch": { "version": "1.2.13", "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.13.tgz", @@ -21842,11 +21817,7 @@ "version": "1.2.13", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz", "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==", - "optional": true, - "requires": { - "bindings": "^1.5.0", - "nan": "^2.12.1" - } + "optional": true }, "glob-parent": { "version": "3.1.0", @@ -22115,11 +22086,7 @@ "version": "1.2.13", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz", "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==", - "optional": true, - "requires": { - "bindings": "^1.5.0", - "nan": "^2.12.1" - } + "optional": true }, "glob-parent": { "version": "3.1.0", diff --git a/example/src/components/AdvancedComponent.tsx b/example/src/components/AdvancedComponent.tsx index d844bce..828cb9d 100644 --- a/example/src/components/AdvancedComponent.tsx +++ b/example/src/components/AdvancedComponent.tsx @@ -8,10 +8,11 @@ const AdvancedComponent = () => { { userId: '01a', comId: '012', - fullName: 'Riya Negi', + fullName: 'Ri Negi', avatarUrl: 'https://ui-avatars.com/api/name=Riya&background=random', userProfile: 'https://www.linkedin.com/in/riya-negi-8879631a9/', - text: `

Hey loved your blog! Can you show me some other ways to fix solve this?๐Ÿค”
Here's my Linkedin Profile to reach out.

`, + text: `

Hey loved your blog! Cans you show me some other ways to fix solve this?๐Ÿค”
Here's my Linkedin Profile to reach out.

`, + datePosted:'2023-04-21 17:15:57.050735', replies: [ { userId: '02a', @@ -23,7 +24,8 @@ const AdvancedComponent = () => { 
event.preventDefault()

Best of luck with your project!

undefined -

` +

`, + datePosted:'2023-04-21 17:15:57.050735' }, { userId: '01a', @@ -31,7 +33,8 @@ const AdvancedComponent = () => { userProfile: 'https://www.linkedin.com/in/riya-negi-8879631a9/', fullName: 'Riya Negi', avatarUrl: 'https://ui-avatars.com/api/name=Riya&background=random', - text: '

OMG! it worked! DO NOT stop this blog series!!!! ๐Ÿ’ƒ

' + text: '

OMG! it worked! DO NOT stop this blog series!!!! ๐Ÿ’ƒ

', + datePosted:'2023-04-21 17:15:57.050735' } ] }, @@ -47,6 +50,7 @@ const AdvancedComponent = () => {
  • Repeat
  • Yoursef
    • `, + datePosted:'2023-04-21 17:15:57.050735', avatarUrl: 'https://ui-avatars.com/api/name=Lily&background=random', replies: [] } diff --git a/example/src/components/ClassComponent.tsx b/example/src/components/ClassComponent.tsx index 59710b4..d6bd2f3 100644 --- a/example/src/components/ClassComponent.tsx +++ b/example/src/components/ClassComponent.tsx @@ -12,6 +12,7 @@ class ClassComponent extends PureComponent { avatarUrl: 'https://ui-avatars.com/api/name=Riya&background=random', userProfile: 'https://www.linkedin.com/in/riya-negi-8879631a9/', text: 'Hey, Loved your blog! ', + datePosted:'2023-04-21 17:15:57.050735', replies: [ { userId: '02a', @@ -19,6 +20,7 @@ class ClassComponent extends PureComponent { userProfile: 'https://www.linkedin.com/in/riya-negi-8879631a9/', fullName: 'Adam Scott', avatarUrl: 'https://ui-avatars.com/api/name=Adam&background=random', + datePosted:'2023-04-21 17:15:57.050735', text: 'Thanks! It took me 1 month to finish this project but I am glad it helped out someone!๐Ÿฅฐ' }, { @@ -27,7 +29,8 @@ class ClassComponent extends PureComponent { userProfile: 'https://www.linkedin.com/in/riya-negi-8879631a9/', fullName: 'Riya Negi', avatarUrl: 'https://ui-avatars.com/api/name=Riya&background=random', - text: 'thanks!๐Ÿ˜Š' + text: 'thanks!๐Ÿ˜Š', + datePosted:'2023-04-21 17:15:57.050735' } ] }, @@ -38,6 +41,7 @@ class ClassComponent extends PureComponent { userProfile: 'https://www.linkedin.com/in/riya-negi-8879631a9/', text: 'I have a doubt about the 4th point๐Ÿค”', avatarUrl: 'https://ui-avatars.com/api/name=Lily&background=random', + datePosted:'2023-04-21 17:15:57.050735', replies: [] } ] diff --git a/example/src/components/CustomComponent.tsx b/example/src/components/CustomComponent.tsx index 5cfc321..f450d20 100644 --- a/example/src/components/CustomComponent.tsx +++ b/example/src/components/CustomComponent.tsx @@ -11,6 +11,7 @@ const CustomComponent = () => { fullName: 'Riya Negi', avatarUrl: 'https://ui-avatars.com/api/name=Riya&background=random', userProfile: 'https://www.linkedin.com/in/riya-negi-8879631a9/', + datePosted:'2023-04-21 17:15:57.050735', text: 'Hey, Loved your blog! ', replies: [ { @@ -19,6 +20,7 @@ const CustomComponent = () => { userProfile: 'https://www.linkedin.com/in/riya-negi-8879631a9/', fullName: 'Adam Scott', avatarUrl: 'https://ui-avatars.com/api/name=Adam&background=random', + datePosted:'2023-04-21 17:15:57.050735', text: 'Thanks! It took me 1 month to finish this project but I am glad it helped out someone!๐Ÿฅฐ' }, { @@ -27,6 +29,7 @@ const CustomComponent = () => { userProfile: 'https://www.linkedin.com/in/riya-negi-8879631a9/', fullName: 'Riya Negi', avatarUrl: 'https://ui-avatars.com/api/name=Riya&background=random', + datePosted:'2023-04-21 17:15:57.050735', text: 'thanks!๐Ÿ˜Š' } ] @@ -38,6 +41,7 @@ const CustomComponent = () => { userProfile: 'https://www.linkedin.com/in/riya-negi-8879631a9/', text: 'I have a doubt about the 4th point๐Ÿค”', avatarUrl: 'https://ui-avatars.com/api/name=Lily&background=random', + datePosted:'2023-04-21 17:15:57.050735', replies: [] } ]) diff --git a/example/src/components/DefaultComponent.tsx b/example/src/components/DefaultComponent.tsx index 0838700..46c1633 100644 --- a/example/src/components/DefaultComponent.tsx +++ b/example/src/components/DefaultComponent.tsx @@ -10,6 +10,7 @@ const DefaultComponent = () => { fullName: 'Riya Negi', avatarUrl: 'https://ui-avatars.com/api/name=Riya&background=random', userProfile: 'https://www.linkedin.com/in/riya-negi-8879631a9/', + datePosted:'2023-04-21 17:15:57.050735', text: 'Hey, Loved your blog! ', replies: [ { @@ -18,6 +19,7 @@ const DefaultComponent = () => { userProfile: 'https://www.linkedin.com/in/riya-negi-8879631a9/', fullName: 'Adam Scott', avatarUrl: 'https://ui-avatars.com/api/name=Adam&background=random', + datePosted:'2023-04-21 17:15:57.050735', text: 'Thanks! It took me 1 month to finish this project but I am glad it helped out someone!๐Ÿฅฐ' }, { @@ -26,6 +28,7 @@ const DefaultComponent = () => { userProfile: 'https://www.linkedin.com/in/riya-negi-8879631a9/', fullName: 'Riya Negi', avatarUrl: 'https://ui-avatars.com/api/name=Riya&background=random', + datePosted:'2023-04-21 17:15:57.050735', text: 'thanks!๐Ÿ˜Š' } ] @@ -37,6 +40,7 @@ const DefaultComponent = () => { userProfile: 'https://www.linkedin.com/in/riya-negi-8879631a9/', text: 'I have a doubt about the 4th point๐Ÿค”', avatarUrl: 'https://ui-avatars.com/api/name=Lily&background=random', + datePosted:'2023-04-21 17:15:57.050735', replies: [] } ] diff --git a/example/src/components/LogInComponent.tsx b/example/src/components/LogInComponent.tsx index 6db5b70..0b9b3e8 100644 --- a/example/src/components/LogInComponent.tsx +++ b/example/src/components/LogInComponent.tsx @@ -11,6 +11,7 @@ const LogInComponent = () => { avatarUrl: 'https://ui-avatars.com/api/name=Riya&background=random', userProfile: 'https://www.linkedin.com/in/riya-negi-8879631a9/', text: 'Hey, Loved your blog! ', + datePosted:'2023-04-21 17:15:57.050735', replies: [ { userId: '02a', @@ -18,6 +19,7 @@ const LogInComponent = () => { userProfile: 'https://www.linkedin.com/in/riya-negi-8879631a9/', fullName: 'Adam Scott', avatarUrl: 'https://ui-avatars.com/api/name=Adam&background=random', + datePosted:'2023-04-21 17:15:57.050735', text: 'Thanks! It took me 1 month to finish this project but I am glad it helped out someone!๐Ÿฅฐ' }, { @@ -26,6 +28,7 @@ const LogInComponent = () => { userProfile: 'https://www.linkedin.com/in/riya-negi-8879631a9/', fullName: 'Riya Negi', avatarUrl: 'https://ui-avatars.com/api/name=Riya&background=random', + datePosted:'2023-04-21 17:15:57.050735', text: 'thanks!๐Ÿ˜Š' } ] @@ -37,6 +40,7 @@ const LogInComponent = () => { userProfile: 'https://www.linkedin.com/in/riya-negi-8879631a9/', text: 'I have a doubt about the 4th point๐Ÿค”', avatarUrl: 'https://ui-avatars.com/api/name=Lily&background=random', + datePosted:'2023-04-21 17:15:57.050735', replies: [] } ] diff --git a/package-lock.json b/package-lock.json index d1f2ac8..6a8496f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "react-comments-section", - "version": "2.0.7", + "version": "2.0.10", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/src/components/CommentSectionComponent/Index.tsx b/src/components/CommentSectionComponent/Index.tsx index bbaa3dd..164a3a0 100644 --- a/src/components/CommentSectionComponent/Index.tsx +++ b/src/components/CommentSectionComponent/Index.tsx @@ -67,6 +67,7 @@ const CommentSection = ({ avatarUrl: string text: string userProfile?: string + datePosted:string replies: Array | undefined }) => { return ( diff --git a/src/components/CommentStructure.tsx/CommentStructure.scss b/src/components/CommentStructure.tsx/CommentStructure.scss index bdec75c..366e42f 100644 --- a/src/components/CommentStructure.tsx/CommentStructure.scss +++ b/src/components/CommentStructure.tsx/CommentStructure.scss @@ -12,7 +12,14 @@ margin-left: 10px; font-size: 16px; font-weight: 600; + + .commentDate{ + margin:2px 0 0 5px; + font-size: small; + color:#b0b0b0; + } } + } } .halfDiv { diff --git a/src/components/CommentStructure.tsx/Index.tsx b/src/components/CommentStructure.tsx/Index.tsx index e5441f1..5deeea7 100644 --- a/src/components/CommentStructure.tsx/Index.tsx +++ b/src/components/CommentStructure.tsx/Index.tsx @@ -15,6 +15,7 @@ interface CommentStructureProps { avatarUrl: string text: string userProfile?: string + datePosted:string replies?: Array | undefined } editMode: boolean @@ -35,6 +36,7 @@ const CommentStructure = ({ const globalStore: any = useContext(GlobalContext) const currentUser = globalStore.currentUserData + const optionsMenu = () => { return (
    @@ -61,6 +63,47 @@ const CommentStructure = ({ ) } + /* This function format the date string into a user friendly + text */ + const timeSince = (date:string):string => { + let actualDate:Date = new Date(date); + let dateNow:Date = new Date() + const seconds:number = Math.floor((dateNow.getTime() - actualDate.getTime()) / 1000); + + if (seconds < 60) { + return `${seconds} seconds ago`; + } + + const minutes:number = Math.floor(seconds / 60); + + if (minutes < 60) { + return `${minutes} minutes ago`; + } + + const hours:number = Math.floor(minutes / 60); + + if (hours < 24) { + return `${hours} hours ago`; + } + + const days:number = Math.floor(hours / 24); + + if (days < 30) { + return `${days} days ago`; + } + + const months:number = Math.floor(days / 30); + + if (months < 12) { + return `${months} months ago`; + } + + const years:number = Math.floor(months / 12); + + return `${years} years ago`; + } + + const userInfo = () => { return (
    @@ -77,9 +120,10 @@ const CommentStructure = ({ : null) } /> -
    -
    {info.fullName}
    - +
    +
    {info.fullName} + {timeSince(info.datePosted)}
    + ) } diff --git a/src/components/data.json b/src/components/data.json index 277e7fe..a690157 100644 --- a/src/components/data.json +++ b/src/components/data.json @@ -6,6 +6,7 @@ "userProfile": "https://www.linkedin.com/in/riya-negi-8879631a9/", "text": "I have a doubt about the 4th point๐Ÿค”", "avatarUrl": "https://ui-avatars.com/api/name=Lily&background=random", + "datePosted":"2023-04-21 17:15:57.050735", "replies": [] }, { @@ -15,6 +16,7 @@ "text": "Follow my page for more such interesting blogs!๐Ÿ˜‡", "avatarUrl": "https://ui-avatars.com/api/name=Adam&background=random", "userProfile": "https://www.linkedin.com/in/riya-negi-8879631a9/", + "datePosted":"2023-04-21 17:15:57.050735", "replies": [] }, { @@ -23,6 +25,7 @@ "fullName": "Robert Jae", "avatarUrl": "https://ui-avatars.com/api/name=Robert&background=random", "text": "Woah pretty helpful! how did you solve for x?", + "datePosted":"2023-04-21 17:15:57.050735", "replies": [ { "userId": "01b", @@ -41,6 +44,7 @@ "userProfile": "https://www.linkedin.com/in/riya-negi-8879631a9/", "text": "Aaaah! got it got it. Pretty cool", "avatarUrl": "https://ui-avatars.com/api/name=Robin&background=random", + "datePosted":"2023-04-21 17:15:57.050735", "replies": [] } ] diff --git a/src/context/Provider.tsx b/src/context/Provider.tsx index d9f8899..b48836d 100644 --- a/src/context/Provider.tsx +++ b/src/context/Provider.tsx @@ -49,6 +49,7 @@ export const GlobalProvider = ({ avatarUrl: string text: string userProfile?: string + datePosted: string replies?: | Array<{ userId: string @@ -57,6 +58,7 @@ export const GlobalProvider = ({ avatarUrl: string text: string userProfile?: string + datePosted:string }> | undefined }> @@ -76,6 +78,7 @@ export const GlobalProvider = ({ avatarUrl: string text: string userProfile?: string + datePosted:string replies?: | Array<{ userId: string @@ -84,6 +87,7 @@ export const GlobalProvider = ({ avatarUrl: string text: string userProfile?: string + datePosted:string|undefined }> | undefined }> @@ -127,7 +131,7 @@ export const GlobalProvider = ({ } } - const onSubmit = (text: string, uuid: string) => { + const onSubmit = (text: string, uuid: string,) => { let copyData = [...data] copyData.push({ userId: currentUserData!.currentUserId, @@ -137,7 +141,8 @@ export const GlobalProvider = ({ ? currentUserData!.currentUserProfile : undefined, fullName: currentUserData!.currentUserFullName, - text: text, + text: text, + datePosted:new Date().toLocaleString(), replies: [] }) setData(copyData) @@ -178,7 +183,9 @@ export const GlobalProvider = ({ ? currentUserData!.currentUserProfile : undefined, fullName: currentUserData!.currentUserFullName, - text: text + text: text, + datePosted:new Date().toLocaleString() + }) setData(copyData) handleAction(comId, false) @@ -194,7 +201,8 @@ export const GlobalProvider = ({ ? currentUserData!.currentUserProfile : undefined, fullName: currentUserData!.currentUserFullName, - text: text + text: text, + datePosted:new Date().toLocaleString() }) setData(copyData) handleAction(comId, false) diff --git a/src/index.tsx b/src/index.tsx index 5838dd1..37cf50f 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -4,7 +4,7 @@ import GlobalProvider from './context/Provider' import './Index.scss' interface CommentSectionProps { - currentUser: { + currentUser: { currentUserId: string currentUserImg: string currentUserProfile: string @@ -41,6 +41,7 @@ interface CommentSectionProps { avatarUrl: string text: string userProfile?: string + datePosted:string replies?: | Array<{ userId: string @@ -49,6 +50,7 @@ interface CommentSectionProps { avatarUrl: string text: string userProfile?: string + datePosted:string }> | undefined }>