diff --git a/index.html b/index.html
new file mode 100644
index 0000000..54ef1b7
--- /dev/null
+++ b/index.html
@@ -0,0 +1,4 @@
+
+
+
DEMO
+
\ No newline at end of file
diff --git a/index.js b/index.js
new file mode 100644
index 0000000..10b399a
--- /dev/null
+++ b/index.js
@@ -0,0 +1,12 @@
+import { div, pre } from './main.js'
+
+const demo = div.w(128).h(64) //.onclick.stop('click')
+demo.textContent = 'Hello world'
+
+console.log('demo', demo)
+document.body.appendChild(demo)
+document.body.appendChild(div.w(128).h(64).text('Hello world'))
+
+fetch('./index.js').then(res => res.text()).then(text => {
+ document.body.appendChild(pre.text(text))
+})
diff --git a/main.js b/main.js
new file mode 100644
index 0000000..341326f
--- /dev/null
+++ b/main.js
@@ -0,0 +1,114 @@
+export function createElement({ innerText, innerHTML, textContent, readOnly, children = [], dataset, style, classList = [], ...attributes }, tagName = 'div') {
+ const element = document.createElement(tagName)
+ for (const key in attributes) {
+ if (key.startsWith('on')) element[key] = attributes[key] // 如果是事件则直接赋值
+ else element.setAttribute(key, attributes[key]) // 否则是属性则使用setAttribute
+ }
+ if (dataset) Object.assign(element.dataset, dataset)
+ if (style) Object.assign(element.style, style)
+ if (classList.length) element.classList.add(...classList)
+ if (textContent) element.textContent = textContent
+ if (innerText) element.innerText = innerText
+ if (innerHTML) element.innerHTML = innerHTML
+ if (readOnly) element.readOnly = readOnly
+ if (children) children.forEach(child => element.appendChild(child))
+ return element
+}
+
+export function List(options) {
+ return createElement(options, 'ul')
+}
+
+export function ListItem(options) {
+ return createElement(options, 'li')
+}
+
+export function Span(options) {
+ return createElement(options, 'span')
+}
+
+export function Button(options) {
+ return createElement({
+ ...options,
+ style: {
+ cursor: 'pointer',
+ ...options.style
+ }
+ }, 'button')
+}
+
+export function Img(options) {
+ return createElement(options, 'img')
+}
+
+export function Input(options) {
+ return createElement(options, 'input')
+}
+
+export function TextArea(options) {
+ return createElement(options, 'textarea')
+}
+
+export function Avatar(options) {
+ const element = createElement(options, 'img')
+ element.onerror = () => element.src = '/favicon.ico'
+ return element
+}
+
+export function Dialog(options) {
+ const element = createElement({
+ tabIndex: 0,
+ style: {
+ position: 'fixed',
+ top: 0,
+ left: 0,
+ zIndex: 1000,
+ width: '100%',
+ height: '100%',
+ backdropFilter: 'blur(5px)',
+ duration: '0.5s',
+ transition: 'all 0.5s'
+ },
+ onclick: async event => {
+ if (event.target !== event.currentTarget) return
+ await event.target.animate([{ opacity: 1 }, { opacity: 0 }], { duration: 100 }).finished
+ await event.target.remove()
+ },
+ onkeydown: async event => {
+ if (event.key !== 'Escape') return
+ await event.target.animate([{ opacity: 1 }, { opacity: 0 }], { duration: 100 }).finished
+ await event.target.remove()
+ },
+ children: [
+ createElement({
+ ...options,
+ style: {
+ position: 'fixed',
+ top: '50%',
+ left: '50%',
+ transform: 'translate(-50%, -50%)',
+ backgroundColor: '#fff',
+ borderRadius: '150px',
+ boxShadow: '0 0 1em #ccc',
+ overflow: 'hidden',
+ display: 'flex',
+ justifyContent: 'center',
+ ...options.style,
+ }
+ })
+ ]
+ })
+ const observer = new MutationObserver(mutationsList => {
+ for (const mutation of mutationsList) {
+ if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {
+ element.focus()
+ element.animate([{ opacity: 0 }, { opacity: 1 }], { duration: 100 }).finished
+ return observer.disconnect()
+ }
+ }
+ })
+ observer.observe(document.body, { childList: true, subtree: true })
+ return element
+}
+
+export default { createElement, List, ListItem, Span, Button, Img, Input, TextArea, Avatar, Dialog }
diff --git a/package.json b/package.json
index 8bd9848..df5e774 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,14 @@
{
"name": "weights",
+ "description": "A simple weight tracker",
"version": "1.0.0",
"type": "module",
+ "main": "main.js",
+ "author": {
+ "name": "Laniakea Supercluster",
+ "email": "huan0016@gmail.com"
+ },
+ "license": "MIT",
"scripts": {
"dev": "vite --open",
"build": "vite build",
@@ -9,5 +16,15 @@
},
"devDependencies": {
"vite": "^5.0.8"
- }
+ },
+ "repository": {
+ "type": "git",
+ "url": "https://git.satori.love/LaniakeaSupercluster/weights.git"
+ },
+ "keywords": [
+ "weight",
+ "tracker",
+ "health",
+ "fitness"
+ ]
}
\ No newline at end of file