[add] GitHub repository settings & PR badges (#28)

.github/pr-badge.yml

@@ -0,0 +1,17 @@
+- icon: visualstudio
+  label: 'GitHub.dev'
+  message: 'PR-$prNumber'
+  color: 'blue'
+  url: 'https://github.dev/$owner/$repo/pull/$prNumber'
+
+- icon: github
+  label: 'GitHub codespaces'
+  message: 'PR-$prNumber'
+  color: 'black'
+  url: 'https://codespaces.new/$owner/$repo/pull/$prNumber'
+
+- icon: git
+  label: 'GitPod.io'
+  message: 'PR-$prNumber'
+  color: 'orange'
+  url: 'https://gitpod.io/?autostart=true#https://github.com/$owner/$repo/pull/$prNumber'

.github/settings.yml

@@ -0,0 +1,85 @@
+# These settings are synced to GitHub by https://probot.github.io/apps/settings/
+
+repository:
+    allow_merge_commit: false
+
+    delete_branch_on_merge: true
+
+    enable_vulnerability_alerts: true
+
+labels:
+    - name: bug
+      color: '#d73a4a'
+      description: Something isn't working
+
+    - name: documentation
+      color: '#0075ca'
+      description: Improvements or additions to documentation
+
+    - name: duplicate
+      color: '#cfd3d7'
+      description: This issue or pull request already exists
+
+    - name: enhancement
+      color: '#a2eeef'
+      description: Some improvements
+
+    - name: feature
+      color: '#16b33f'
+      description: New feature or request
+
+    - name: good first issue
+      color: '#7057ff'
+      description: Good for newcomers
+
+    - name: help wanted
+      color: '#008672'
+      description: Extra attention is needed
+
+    - name: invalid
+      color: '#e4e669'
+      description: This doesn't seem right
+
+    - name: question
+      color: '#d876e3'
+      description: Further information is requested
+
+    - name: wontfix
+      color: '#ffffff'
+      description: This will not be worked on
+
+branches:
+    - name: main
+      # https://docs.github.com/en/rest/reference/repos#update-branch-protection
+      protection:
+          # Required. Require at least one approving review on a pull request, before merging. Set to null to disable.
+          required_pull_request_reviews:
+              # The number of approvals required. (1-6)
+              required_approving_review_count: 1
+              # Dismiss approved reviews automatically when a new commit is pushed.
+              dismiss_stale_reviews: true
+              # Blocks merge until code owners have reviewed.
+              require_code_owner_reviews: true
+              # Specify which users and teams can dismiss pull request reviews.
+              # Pass an empty dismissal_restrictions object to disable.
+              # User and team dismissal_restrictions are only available for organization-owned repositories.
+              # Omit this parameter for personal repositories.
+              dismissal_restrictions:
+                  # users: []
+                  # teams: []
+          # Required. Require status checks to pass before merging. Set to null to disable
+          required_status_checks:
+              # Required. Require branches to be up to date before merging.
+              strict: true
+              # Required. The list of status checks to require in order to merge into this branch
+              contexts: []
+          # Required. Enforce all configured restrictions for administrators.
+          # Set to true to enforce required status checks for repository administrators.
+          # Set to null to disable.
+          enforce_admins: true
+          # Prevent merge commits from being pushed to matching branches
+          required_linear_history: true
+          # Required. Restrict who can push to this branch.
+          # Team and user restrictions are only available for organization-owned repositories.
+          # Set to null to disable.
+          restrictions: null

.gitpod.yml

@@ -0,0 +1,21 @@
+# This configuration file was automatically generated by Gitpod.
+# Please adjust to your needs (see https://www.gitpod.io/docs/introduction/learn-gitpod/gitpod-yaml)
+# and commit this file to your remote git repository to share the goodness with others.
+
+# Learn more from ready-to-use templates: https://www.gitpod.io/docs/introduction/getting-started/quickstart
+
+vscode:
+    extensions:
+        - yzhang.markdown-all-in-one
+        - redhat.vscode-yaml
+        - akamud.vscode-caniuse
+        - visualstudioexptteam.intellicode-api-usage-examples
+        - pflannery.vscode-versionlens
+        - christian-kohler.npm-intellisense
+        - esbenp.prettier-vscode
+        - eamodio.gitlens
+        - github.vscode-pull-request-github
+        - github.vscode-github-actions
+tasks:
+    - init: pnpm i
+      command: npm test

.vscode/extensions.json

@@ -0,0 +1,14 @@
+{
+    "recommendations": [
+        "yzhang.markdown-all-in-one",
+        "redhat.vscode-yaml",
+        "akamud.vscode-caniuse",
+        "visualstudioexptteam.intellicode-api-usage-examples",
+        "pflannery.vscode-versionlens",
+        "christian-kohler.npm-intellisense",
+        "esbenp.prettier-vscode",
+        "eamodio.gitlens",
+        "github.vscode-pull-request-github",
+        "github.vscode-github-actions"
+    ]
+}

ReadMe-zh.md

@@ -283,7 +283,7 @@ export class MyButton extends HTMLElement {
             <>
                 <link
                     rel="stylesheet"
-                    href="https://unpkg.com/bootstrap@5.3.2/dist/css/bootstrap.min.css"
+                    href="https://unpkg.com/bootstrap@5.3.3/dist/css/bootstrap.min.css"
                 />
                 <a className="btn">
                     <slot />
@@ -477,7 +477,7 @@ new DOMRenderer().render(
 ### 工具链
 
 ```shell
-npm install jsdom element-internals-polyfill
+npm install jsdom
 ```
 
 ### Polyfill
@@ -486,34 +486,40 @@ npm install jsdom element-internals-polyfill
 import 'web-cell/polyfill';
 ```
 
+### 服务端渲染
+
+https://github.com/EasyWebApp/DOM-Renderer?tab=readme-ov-file#nodejs--bun
+
 ## 基础知识
 
 -   [Web 组件][23]
 -   [自定义元素][24]
 -   [虚拟 DOM][25]
 -   [Element Internals][26]
 -   [CSS 变量][27]
--   [ECMAScript 6+][28]
+-   [视图渐变][28]
+-   [ECMAScript 6+][29]
 -   [TypeScript 5+][4]
 
 ## 生命周期钩子
 
-1. [`connectedCallback`][30]
-2. [`disconnectedCallback`][31]
-3. [`attributeChangedCallback`][32]
-4. [`adoptedCallback`][33]
-5. [`updatedCallback`][34]
-6. [`mountedCallback`][35]
-7. [`formAssociatedCallback`][36]
-8. [`formDisabledCallback`][37]
-9. [`formResetCallback`][38]
+1.  [`connectedCallback`][30]
+2.  [`disconnectedCallback`][31]
+3.  [`attributeChangedCallback`][32]
+4.  [`adoptedCallback`][33]
+5.  [`updatedCallback`][34]
+6.  [`mountedCallback`][35]
+7.  [`formAssociatedCallback`][36]
+8.  [`formDisabledCallback`][37]
+9.  [`formResetCallback`][38]
 10. [`formStateRestoreCallback`][39]
 
 ## 脚手架
 
-1. [基础][40]
-2. [仪表盘][41]
-3. [静态网站][42]
+1.  [基础][22]
+2.  [仪表盘][40]
+3.  [移动端][41]
+4.  [静态网站][42]
 
 ## 生态系统
 
@@ -524,12 +530,12 @@ import 'web-cell/polyfill';
 -   **UI 组件**
 
     -   [BootCell][44]（基于 **BootStrap v5**）
-    -   [Material Web][45]（基于 **Material Design**）
+    -   [MDUI][45]（基于 **Material Design v3**）
     -   [GitHub Web Widget][46]
 
--   **HTTP请求**：[KoAJAX][47]（基于 类**Koa** 中间件）
--   **实用程序**：[Web utility][48]（方法和类型）
--   **事件流**：[Iterable Observer][49]（**Observable** 提案）
+-   **HTTP 请求**：[KoAJAX][47]（基于类 **Koa** 中间件）
+-   **实用程序**：[Web utility][48] 方法和类型
+-   **事件流**：[Iterable Observer][49]（`Observable` 提案）
 -   **MarkDown 集成**：[Parcel MDX transformer][50]（**MDX** 编译器插件）
 
 ## 路线图
@@ -564,13 +570,14 @@ import 'web-cell/polyfill';
 [19]: https://mobx.js.org/enabling-decorators.html
 [20]: https://facebook.github.io/jsx/
 [21]: https://parceljs.org/
-[22]: https://web-cell.dev/scaffold/
+[22]: https://github.com/EasyWebApp/WebCell-scaffold
 [23]: https://developer.mozilla.org/zh-CN/docs/Web/API/Web_components
 [24]: https://web.dev/articles/custom-elements-v1?hl=zh-cn
 [25]: https://web.dev/articles/shadowdom-v1?hl=zh-cn
 [26]: https://web.dev/articles/more-capable-form-controls?hl=zh-cn
 [27]: https://developer.mozilla.org/zh-CN/docs/Web/CSS/Using_CSS_custom_properties
-[28]: http://es6-features.org/
+[28]: https://developer.chrome.com/docs/web-platform/view-transitions?hl=zh-cn
+[29]: https://rse.github.io/es6-features/
 [30]: https://web-cell.dev/web-utility/interfaces/CustomElement.html#connectedCallback
 [31]: https://web-cell.dev/web-utility/interfaces/CustomElement.html#disconnectedCallback
 [32]: https://web-cell.dev/web-utility/interfaces/CustomElement.html#attributeChangedCallback
@@ -581,12 +588,12 @@ import 'web-cell/polyfill';
 [37]: https://web-cell.dev/web-utility/interfaces/CustomFormElement.html#formDisabledCallback
 [38]: https://web-cell.dev/web-utility/interfaces/CustomFormElement.html#formResetCallback
 [39]: https://web-cell.dev/web-utility/interfaces/CustomFormElement.html#formStateRestoreCallback
-[40]: https://github.com/EasyWebApp/scaffold
-[41]: https://github.com/EasyWebApp/DashBoard
+[40]: https://github.com/EasyWebApp/WebCell-dashboard
+[41]: https://github.com/EasyWebApp/WebCell-mobile
 [42]: https://github.com/EasyWebApp/mark-wiki
 [43]: https://web-cell.dev/cell-router/
 [44]: https://bootstrap.web-cell.dev/
-[45]: https://material-web.dev/
+[45]: https://www.mdui.org/zh-cn/
 [46]: https://tech-query.me/GitHub-Web-Widget/
 [47]: https://web-cell.dev/KoAJAX/
 [48]: https://web-cell.dev/web-utility/

ReadMe.md

@@ -480,7 +480,7 @@ new DOMRenderer().render(
 ### Tool chain
 
 ```shell
-npm install jsdom element-internals-polyfill
+npm install jsdom
 ```
 
 ### Polyfill
@@ -489,6 +489,10 @@ npm install jsdom element-internals-polyfill
 import 'web-cell/polyfill';
 ```
 
+### Server Side Rendering
+
+https://github.com/EasyWebApp/DOM-Renderer?tab=readme-ov-file#nodejs--bun
+
 ## Basic knowledge
 
 -   [Web components][23]
@@ -515,9 +519,10 @@ import 'web-cell/polyfill';
 
 ## Scaffolds
 
-1.  [Basic][40]
-2.  [DashBoard][41]
-3.  [Static site][42]
+1.  [Basic][22]
+2.  [DashBoard][40]
+3.  [Mobile][41]
+4.  [Static site][42]
 
 ## Ecosystem
 
@@ -528,12 +533,12 @@ We recommend these libraries to use with WebCell:
 -   **UI components**
 
     -   [BootCell][44] (based on **BootStrap v5**)
-    -   [Material Web][45] (based on **Material Design**)
+    -   [MDUI][45] (based on **Material Design v3**)
     -   [GitHub Web Widget][46]
 
--   **HTTP request**: [KoAJAX][47] (based on **Koa**\-like middlewares)
--   **Utility**: [Web utility][48] (Methods & Types)
--   **Event stream**: [Iterable Observer][49] (**Observable** proposal)
+-   **HTTP request**: [KoAJAX][47] (based on **Koa**-like middlewares)
+-   **Utility**: [Web utility][48] methods & types
+-   **Event stream**: [Iterable Observer][49] (`Observable` proposal)
 -   **MarkDown integration**: [Parcel MDX transformer][50] (**MDX** Compiler plugin)
 
 ## Roadmap
@@ -568,14 +573,14 @@ We recommend these libraries to use with WebCell:
 [19]: https://mobx.js.org/enabling-decorators.html
 [20]: https://facebook.github.io/jsx/
 [21]: https://parceljs.org/
-[22]: https://web-cell.dev/scaffold/
+[22]: https://github.com/EasyWebApp/WebCell-scaffold
 [23]: https://developer.mozilla.org/en-US/docs/Web/API/Web_components
 [24]: https://web.dev/articles/custom-elements-v1
 [25]: https://web.dev/articles/shadowdom-v1
 [26]: https://web.dev/articles/more-capable-form-controls
 [27]: https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties
 [28]: https://developer.chrome.com/docs/web-platform/view-transitions/
-[29]: http://es6-features.org/
+[29]: https://rse.github.io/es6-features/
 [30]: https://web-cell.dev/web-utility/interfaces/CustomElement.html#connectedCallback
 [31]: https://web-cell.dev/web-utility/interfaces/CustomElement.html#disconnectedCallback
 [32]: https://web-cell.dev/web-utility/interfaces/CustomElement.html#attributeChangedCallback
@@ -586,12 +591,12 @@ We recommend these libraries to use with WebCell:
 [37]: https://web-cell.dev/web-utility/interfaces/CustomFormElement.html#formDisabledCallback
 [38]: https://web-cell.dev/web-utility/interfaces/CustomFormElement.html#formResetCallback
 [39]: https://web-cell.dev/web-utility/interfaces/CustomFormElement.html#formStateRestoreCallback
-[40]: https://github.com/EasyWebApp/scaffold
-[41]: https://github.com/EasyWebApp/DashBoard
+[40]: https://github.com/EasyWebApp/WebCell-dashboard
+[41]: https://github.com/EasyWebApp/WebCell-mobile
 [42]: https://github.com/EasyWebApp/mark-wiki
 [43]: https://web-cell.dev/cell-router/
 [44]: https://bootstrap.web-cell.dev/
-[45]: https://material-web.dev/
+[45]: https://www.mdui.org/
 [46]: https://tech-query.me/GitHub-Web-Widget/
 [47]: https://web-cell.dev/KoAJAX/
 [48]: https://web-cell.dev/web-utility/