Complex Components

<z-code-editor language="markdown"></z-code-editor>
<z-markdown id="live"></z-markdown>
// 编辑器 z-input 事件实时驱动渲染：
editor.addEventListener("z-input", (e) => { live.content = e.detail.value; });

<z-markdown
  content="## Hello **World**

This is a paragraph with `inline code` and a [link](https://example.com).

> A blockquote with *emphasis*."
></z-markdown>

<z-markdown
  content="| Left | Center | Right |
|:-----|:------:|------:|
| A    | B      | C     |
| ... | ... | ... |"
></z-markdown>

<z-markdown content="```ts ... ```"></z-markdown>

<z-markdown
  content="- [x] Done task
- [ ] Pending task"
></z-markdown>

<z-login
  title="Welcome Back"
  username-label="Username"
  password-label="Password"
  submit-label="Sign In"
></z-login>
// 提交事件 z-login（detail: username/password/remember），loading 由 JS 控制