[fix] Function Component observer & Vercel production

[optimize] default JSX props of Class Component
[optimize] update Upstream packages

Author: TechQuery

.github/workflows/main.yml

@@ -31,3 +31,12 @@ jobs:
                   publish_dir: ./docs
                   personal_token: ${{ secrets.GITHUB_TOKEN }}
                   force_orphan: true
+
+            - uses: amondnet/vercel-action@v25
+              with:
+                  vercel-token: ${{ secrets.VERCEL_TOKEN }}
+                  github-token: ${{ secrets.GITHUB_TOKEN }}
+                  vercel-org-id: ${{ secrets.VERCEL_ORG_ID }}
+                  vercel-project-id: ${{ secrets.VERCEL_PROJECT_ID }}
+                  working-directory: ./docs
+                  vercel-args: --prod

ReadMe.md

@@ -150,17 +150,17 @@ new DOMRenderer().render(
 ```tsx
 import { DOMRenderer } from 'dom-renderer';
 import { observable } from 'mobx';
-import { component, attribute, observer } from 'web-cell';
+import { WebCell, component, attribute, observer } from 'web-cell';
 
 interface HelloProps {
     name?: string;
 }
 
+interface Hello extends WebCell<HelloProps> {}
+
 @component({ tagName: 'hello-world' })
 @observer
-class Hello extends HTMLElement {
-    declare props: HelloProps;
-
+class Hello extends HTMLElement implements WebCell<HelloProps> {
     @attribute
     @observable
     accessor name = '';
@@ -306,7 +306,7 @@ export class MyButton extends HTMLElement {
 ##### `MyButton.tsx`
 
 ```tsx
-import { component, WebCell } from 'web-cell';
+import { WebCell, component } from 'web-cell';
 
 import styles from './scoped.css' assert { type: 'css' };
 
@@ -316,7 +316,7 @@ interface MyButton extends WebCell {}
     tagName: 'my-button',
     mode: 'open'
 })
-export class MyButton extends HTMLElement {
+export class MyButton extends HTMLElement implements WebCell {
     connectedCallback() {
         this.root.adoptedStyleSheets = [styles];
     }
@@ -402,7 +402,6 @@ export class Counter extends HTMLElement {
 
 ```tsx
 import { DOMRenderer } from 'dom-renderer';
-import { HTMLFieldProps } from 'web-utility';
 import { WebField, component, formField, observer } from 'web-cell';
 
 interface MyField extends WebField {}
@@ -413,9 +412,7 @@ interface MyField extends WebField {}
 })
 @formField
 @observer
-class MyField extends HTMLElement {
-    declare props: HTMLFieldProps;
-
+class MyField extends HTMLElement implements WebField {
     render() {
         const { name } = this;
 

package.json

@@ -1,6 +1,6 @@
 {
     "name": "web-cell",
-    "version": "3.0.0-rc.7",
+    "version": "3.0.0-rc.8",
     "description": "Web Components engine based on VDOM, JSX, MobX & TypeScript",
     "keywords": [
         "web",
@@ -27,7 +27,7 @@
     "types": "dist/index.d.ts",
     "dependencies": {
         "@swc/helpers": "^0.5.3",
-        "dom-renderer": "^2.0.5",
+        "dom-renderer": "^2.0.6",
         "mobx": ">=6.11",
         "regenerator-runtime": "^0.14.1",
         "web-utility": "^4.1.3"
@@ -45,8 +45,8 @@
         "@parcel/transformer-typescript-tsc": "~2.11.0",
         "@parcel/transformer-typescript-types": "~2.11.0",
         "@types/jest": "^29.5.11",
-        "@typescript-eslint/eslint-plugin": "^6.18.1",
-        "@typescript-eslint/parser": "^6.18.1",
+        "@typescript-eslint/eslint-plugin": "^6.19.0",
+        "@typescript-eslint/parser": "^6.19.0",
         "core-js": "^3.35.0",
         "element-internals-polyfill": "^1.3.10",
         "eslint": "^8.56.0",
@@ -58,22 +58,23 @@
         "lint-staged": "^15.2.0",
         "open-cli": "^8.0.0",
         "parcel": "~2.11.0",
-        "prettier": "^3.2.0",
+        "prettier": "^3.2.4",
         "rimraf": "^5.0.5",
         "ts-jest": "^29.1.1",
         "ts-node": "^10.9.2",
         "typedoc": "^0.25.7",
-        "typedoc-plugin-mdn-links": "^3.1.11",
+        "typedoc-plugin-mdn-links": "^3.1.12",
         "typescript": "~5.3.3"
     },
     "scripts": {
         "prepare": "husky install",
         "test": "lint-staged",
-        "preview": "cd preview/  &&  rimraf ../.parcel-cache dist/  &&  parcel --open",
-        "pack-preview": "cd preview/  &&  rimraf ../.parcel-cache dist/  &&  parcel build --public-url=. --dist-dir=../docs/preview/",
+        "clean": "rimraf .parcel-cache/ dist/ docs/",
+        "preview": "npm run clean  &&  cd preview/  &&  parcel --dist-dir=../docs/preview/ --open",
+        "pack-preview": "rimraf .parcel-cache/ docs/preview/  &&  cd preview/  &&  parcel build --public-url=. --dist-dir=../docs/preview/",
         "pack-dist": "parcel build source/index.ts",
-        "pack-docs": "rimraf docs/  &&  typedoc source/",
-        "build": "rimraf dist/  &&  npm run pack-dist  &&  npm run pack-docs  &&  npm run pack-preview",
+        "pack-docs": "typedoc source/",
+        "build": "npm run clean  &&  npm run pack-dist  &&  npm run pack-docs  &&  npm run pack-preview",
         "start": "npm run pack-docs  &&  open-cli docs/index.html",
         "prepublishOnly": "npm test  &&  npm run build"
     },