auto-component 1.0.0 → 1.0.2

package/README.md

@@ -2,6 +2,11 @@
 
 [![npm version](https://badge.fury.io/js/auto-component.svg)](https://www.npmjs.com/package/auto-component)
 
+[![github repo](https://img.shields.io/badge/Repo%20-%20GitHub?style=flat&logo=github&link=https%3A%2F%2Fgithub.com%2FTimHuitt%2Fclient-auto-component)](https://github.com/TimHuitt/client-auto-component)
+
+[![official website](https://img.shields.io/badge/demo-37c637?style=flat&logo=react&logoColor=white&label=docs
+)](https://auto-component.com)
+
 > A tool to streamline UI element creation in React projects through AI prompted generation
 
 ## Technologies Used

package/lib/index.js

@@ -24,7 +24,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } // AutoCom
 // Built By:
 //   https://github.com/SamPatt
 //   https://github.com/TimHuitt
-// Copyright (C) <year>  <name of author>
+// Copyright (C) 2023 Tim Huitt, Sam Patterson
 // 
 //   This program is free software: you can redistribute it and/or modify
 //   it under the terms of the GNU Affero General Public License as
@@ -49,54 +49,36 @@ var AutoComponent = function AutoComponent() {
     setHtml = _useState2[1];
   var _useState3 = (0, _react.useState)(''),
     _useState4 = _slicedToArray(_useState3, 2),
-    currentStyle = _useState4[0],
-    setStyles = _useState4[1];
+    currentRequest = _useState4[0],
+    setRequest = _useState4[1];
   var _useState5 = (0, _react.useState)(''),
     _useState6 = _slicedToArray(_useState5, 2),
-    currentRequest = _useState6[0],
-    setRequest = _useState6[1];
+    user = _useState6[0],
+    setUser = _useState6[1];
   var _useState7 = (0, _react.useState)(''),
     _useState8 = _slicedToArray(_useState7, 2),
-    user = _useState8[0],
-    setUser = _useState8[1];
-  var _useState9 = (0, _react.useState)(''),
+    responseData = _useState8[0],
+    setResponseData = _useState8[1];
+  var _useState9 = (0, _react.useState)(null),
     _useState10 = _slicedToArray(_useState9, 2),
-    userID = _useState10[0],
-    setUserID = _useState10[1];
+    requestData = _useState10[0],
+    setRequestData = _useState10[1];
   var _useState11 = (0, _react.useState)(''),
     _useState12 = _slicedToArray(_useState11, 2),
-    responseData = _useState12[0],
-    setResponseData = _useState12[1];
-  var _useState13 = (0, _react.useState)(null),
+    activeTab = _useState12[0],
+    setActiveTab = _useState12[1];
+  var _useState13 = (0, _react.useState)(["No History"]),
     _useState14 = _slicedToArray(_useState13, 2),
-    requestData = _useState14[0],
-    setRequestData = _useState14[1];
-  var _useState15 = (0, _react.useState)(''),
+    history = _useState14[0],
+    setHistory = _useState14[1];
+  var _useState15 = (0, _react.useState)(false),
     _useState16 = _slicedToArray(_useState15, 2),
-    activeTab = _useState16[0],
-    setActiveTab = _useState16[1];
-  var _useState17 = (0, _react.useState)(["No History"]),
-    _useState18 = _slicedToArray(_useState17, 2),
-    history = _useState18[0],
-    setHistory = _useState18[1];
-  var _useState19 = (0, _react.useState)(false),
-    _useState20 = _slicedToArray(_useState19, 2),
-    isRequesting = _useState20[0],
-    setIsRequesting = _useState20[1];
+    isRequesting = _useState16[0],
+    setIsRequesting = _useState16[1];
 
   //**-------------------------**/
   // ** HTML/CSS Formatting ** //
   //**-----------------------**/
-  // get the html/style for the current page and set state
-  var htmlContent = function htmlContent() {
-    var body = document.querySelector('body');
-    var htmlContent = body ? body.innerHTML : '';
-    var cssStyles = document.documentElement.innerHTML;
-    var cleanedHtml = cleanExclusions(htmlContent);
-    var cleanedStyles = cleanStyles(cssStyles);
-    setHtml(formatHtml(cleanedHtml));
-    setStyles(cleanedStyles);
-  };
 
   // format html for display (breaks/indentation)
   var formatHtml = function formatHtml(html) {
@@ -133,30 +115,6 @@ var AutoComponent = function AutoComponent() {
     return doc.documentElement.outerHTML;
   };
 
-  // full exclusion
-  var cleanExclusionsFull = function cleanExclusionsFull(html) {
-    var parser = new DOMParser();
-    var doc = parser.parseFromString(html, 'text/html');
-    var elementsToExclude = doc.querySelectorAll('.exclude');
-    elementsToExclude.forEach(function (element) {
-      element.parentNode.removeChild(element);
-    });
-    return doc.documentElement.outerHTML;
-  };
-
-  // exclude non <style> data and remove comments
-  var cleanStyles = function cleanStyles(css) {
-    var styleRegex = /<style\b[^>]*>([\s\S]*?)<\/style>/g;
-    var matches = css.match(styleRegex);
-    if (matches) {
-      var cleanedMatches = matches.map(function (match) {
-        return match.replace(/\/\*[\s\S]*?\*\//g, '');
-      });
-      return cleanedMatches;
-    }
-    return null;
-  };
-
   // generate a random 5 digit user id
   var randomUser = function randomUser() {
     setUser(Math.floor(Math.random() * 100000));
@@ -164,7 +122,6 @@ var AutoComponent = function AutoComponent() {
 
   // set initial load data
   (0, _react.useEffect)(function () {
-    htmlContent();
     randomUser();
   }, []);
 
@@ -261,90 +218,21 @@ var AutoComponent = function AutoComponent() {
       return _ref2.apply(this, arguments);
     };
   }();
-  var saveComponent = /*#__PURE__*/function () {
-    var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(data) {
-      var url, response, responseData;
-      return _regeneratorRuntime().wrap(function _callee3$(_context3) {
-        while (1) switch (_context3.prev = _context3.next) {
-          case 0:
-            url = "https://server-auto-component-46830ff262f8.herokuapp.com/user";
-            _context3.next = 3;
-            return fetch(url, {
-              method: 'POST',
-              headers: {
-                'Content-Type': 'application/json'
-              },
-              body: JSON.stringify(data)
-            });
-          case 3:
-            response = _context3.sent;
-            if (response.ok) {
-              _context3.next = 6;
-              break;
-            }
-            throw new Error('Failed to save component');
-          case 6:
-            _context3.next = 8;
-            return response.json();
-          case 8:
-            responseData = _context3.sent;
-            console.log('Save successful:', responseData);
-          case 10:
-          case "end":
-            return _context3.stop();
-        }
-      }, _callee3);
-    }));
-    return function saveComponent(_x) {
-      return _ref3.apply(this, arguments);
-    };
-  }();
 
   //**------------------------**/
   // ** UI/Button Handling ** //
   //**----------------------**/
 
-  var handleSave = /*#__PURE__*/function () {
-    var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4() {
-      var saveData;
-      return _regeneratorRuntime().wrap(function _callee4$(_context4) {
-        while (1) switch (_context4.prev = _context4.next) {
-          case 0:
-            saveData = {
-              userId: user,
-              content: responseData
-              // Add other relevant data you might want to save
-            };
-            _context4.prev = 1;
-            _context4.next = 4;
-            return saveComponent(saveData);
-          case 4:
-            _context4.next = 9;
-            break;
-          case 6:
-            _context4.prev = 6;
-            _context4.t0 = _context4["catch"](1);
-            console.error("Error saving component:", _context4.t0);
-          case 9:
-          case "end":
-            return _context4.stop();
-        }
-      }, _callee4, null, [[1, 6]]);
-    }));
-    return function handleSave() {
-      return _ref4.apply(this, arguments);
-    };
-  }();
   var handleChange = function handleChange(e) {
     e.preventDefault();
     setRequest(e.target.value);
   };
   var handleGenerate = /*#__PURE__*/function () {
-    var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee5(e) {
-      return _regeneratorRuntime().wrap(function _callee5$(_context5) {
-        while (1) switch (_context5.prev = _context5.next) {
+    var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(e) {
+      return _regeneratorRuntime().wrap(function _callee3$(_context3) {
+        while (1) switch (_context3.prev = _context3.next) {
           case 0:
-            _context5.next = 2;
+            _context3.next = 2;
             return setRequestData({
               "userId": user,
               "request": currentRequest
@@ -353,12 +241,12 @@ var AutoComponent = function AutoComponent() {
             setRequest('');
           case 3:
           case "end":
-            return _context5.stop();
+            return _context3.stop();
         }
-      }, _callee5);
+      }, _callee3);
     }));
-    return function handleGenerate(_x2) {
-      return _ref5.apply(this, arguments);
+    return function handleGenerate(_x) {
+      return _ref3.apply(this, arguments);
     };
   }();
   (0, _react.useEffect)(function () {
@@ -374,56 +262,56 @@ var AutoComponent = function AutoComponent() {
     setIsRequesting(false);
   };
   var handleRequestTab = /*#__PURE__*/function () {
-    var _ref6 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee6() {
-      return _regeneratorRuntime().wrap(function _callee6$(_context6) {
-        while (1) switch (_context6.prev = _context6.next) {
+    var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4() {
+      return _regeneratorRuntime().wrap(function _callee4$(_context4) {
+        while (1) switch (_context4.prev = _context4.next) {
           case 0:
-            _context6.next = 2;
+            _context4.next = 2;
             return setActiveTab(activeTab === 'response' || activeTab === '' ? 'request' : '');
           case 2:
           case "end":
-            return _context6.stop();
+            return _context4.stop();
         }
-      }, _callee6);
+      }, _callee4);
     }));
     return function handleRequestTab() {
-      return _ref6.apply(this, arguments);
+      return _ref4.apply(this, arguments);
     };
   }();
   var handleResponseTab = /*#__PURE__*/function () {
-    var _ref7 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee7() {
-      return _regeneratorRuntime().wrap(function _callee7$(_context7) {
-        while (1) switch (_context7.prev = _context7.next) {
+    var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee5() {
+      return _regeneratorRuntime().wrap(function _callee5$(_context5) {
+        while (1) switch (_context5.prev = _context5.next) {
           case 0:
-            _context7.next = 2;
+            _context5.next = 2;
             return setActiveTab(activeTab === 'request' || activeTab === '' ? 'response' : '');
           case 2:
           case "end":
-            return _context7.stop();
+            return _context5.stop();
         }
-      }, _callee7);
+      }, _callee5);
     }));
     return function handleResponseTab() {
-      return _ref7.apply(this, arguments);
+      return _ref5.apply(this, arguments);
     };
   }();
   var copyToClipboard = /*#__PURE__*/function () {
-    var _ref8 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee8() {
+    var _ref6 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee6() {
       var text;
-      return _regeneratorRuntime().wrap(function _callee8$(_context8) {
-        while (1) switch (_context8.prev = _context8.next) {
+      return _regeneratorRuntime().wrap(function _callee6$(_context6) {
+        while (1) switch (_context6.prev = _context6.next) {
           case 0:
             text = activeTab === 'response' ? responseData : requestData;
-            _context8.next = 3;
+            _context6.next = 3;
             return navigator.clipboard.writeText(text);
           case 3:
           case "end":
-            return _context8.stop();
+            return _context6.stop();
         }
-      }, _callee8);
+      }, _callee6);
     }));
     return function copyToClipboard() {
-      return _ref8.apply(this, arguments);
+      return _ref6.apply(this, arguments);
     };
   }();
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "auto-component",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "main": "lib/index.js",
   "peerDependencies": {
     "react": "^18.2.0",
@@ -43,5 +43,5 @@
   "bugs": {
     "url": "https://github.com/TimHuitt/auto-component/issues"
   },
-  "homepage": "https://auto-component.netlify.app/"
+  "homepage": "https://auto-component.com/"
 }