auto-component 0.0.5 → 0.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/src/auto-component.jsx +14 -8
package/package.json
CHANGED
package/src/auto-component.jsx
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { useState, useEffect } from 'react'
|
|
2
2
|
import beautify from 'js-beautify'
|
|
3
|
-
import './
|
|
3
|
+
import './auto-component.css'
|
|
4
4
|
|
|
5
|
-
const
|
|
5
|
+
const AutoComponent = () => {
|
|
6
6
|
|
|
7
7
|
//**-----------**/
|
|
8
8
|
// ** State ** //
|
|
@@ -15,11 +15,12 @@ const Componenter = ({ exclusions }) => {
|
|
|
15
15
|
const [ requestData, setRequestData ] = useState(null)
|
|
16
16
|
|
|
17
17
|
const [ activeTab, setActiveTab ] = useState('request')
|
|
18
|
-
|
|
18
|
+
|
|
19
|
+
// test response
|
|
19
20
|
const response = {
|
|
20
21
|
html: `{projects.map((project, index) => (<div key={index} style={{ border: '1px solid #ccc', padding: '16px', marginBottom: '16px', display: 'flex', flexDirection: 'column', alignItems: 'center' }}><h3>{project.title}</h3><p>{project.description}</p><div style={{ display: 'flex', justifyContent: 'space-between', width: '100%' }}>{project.images.map((image, imgIndex) => (<img key={imgIndex} src={image} alt={\`Project Image \${imgIndex + 1}\`} style={{ width: '100%', maxWidth: '150px', marginBottom: '8px' }} />))}</div><div style={{ display: 'flex', justifyContent: 'space-between', width: '100%' }}><a href={project.gitLink} style={{ color: 'blue' }}>GitHub</a><a href={project.deployLink} style={{ color: 'green' }}>Deployed</a></div></div>))}`
|
|
21
22
|
}
|
|
22
|
-
|
|
23
|
+
|
|
23
24
|
//**-------------------------**/
|
|
24
25
|
// ** HTML/CSS Formatting ** //
|
|
25
26
|
//**-----------------------**/
|
|
@@ -109,9 +110,9 @@ const Componenter = ({ exclusions }) => {
|
|
|
109
110
|
setIsLoading(false)
|
|
110
111
|
}
|
|
111
112
|
|
|
112
|
-
|
|
113
|
-
// ** UI Handling ** //
|
|
114
|
-
|
|
113
|
+
//**------------------------**/
|
|
114
|
+
// ** UI/Button Handling ** //
|
|
115
|
+
//**----------------------**/
|
|
115
116
|
|
|
116
117
|
const handleChange = (e) => {
|
|
117
118
|
e.preventDefault()
|
|
@@ -137,6 +138,11 @@ const Componenter = ({ exclusions }) => {
|
|
|
137
138
|
const handleResponseTab = () => {
|
|
138
139
|
setActiveTab('response')
|
|
139
140
|
}
|
|
141
|
+
|
|
142
|
+
const copyToClipboard = async () => {
|
|
143
|
+
const text = activeTab
|
|
144
|
+
await navigator.clipboard.writeText(text)
|
|
145
|
+
}
|
|
140
146
|
|
|
141
147
|
//**---------------**/
|
|
142
148
|
// ** Rendering ** //
|
|
@@ -188,4 +194,4 @@ const Componenter = ({ exclusions }) => {
|
|
|
188
194
|
)
|
|
189
195
|
}
|
|
190
196
|
|
|
191
|
-
export default
|
|
197
|
+
export default AutoComponent
|