@greypan/web-ui 1.0.0

package/.turbo/turbo-build.log

@@ -0,0 +1,26 @@
+
+> @greypan/web-ui@1.0.0 build /Users/bopan/VibeCoding/mono/packages/web-ui
+> vp build
+
+vite v8.1.2 building client environment for production...
+
+rendering chunks...
+
+[unplugin:dts] Start generate declaration files...
+[unplugin:dts] Declaration files built in 775ms.
+
+computing gzip size...
+dist/packages/browser-kit/dist/dom/index.js                                                 0.22 kB │ gzip: 0.18 kB │ map:  0.55 kB
+dist/components/svg-draw-lines/style.js                                                     0.35 kB │ gzip: 0.26 kB │ map:  0.44 kB
+dist/index.js                                                                               0.36 kB │ gzip: 0.17 kB
+dist/_virtual/_@oxc-project_runtime@0.138.0/helpers/esm/decorate.js                         0.51 kB │ gzip: 0.33 kB
+dist/components/back-top/style.js                                                           0.55 kB │ gzip: 0.31 kB │ map:  0.66 kB
+dist/components/layout/style.js                                                             0.72 kB │ gzip: 0.41 kB │ map:  0.97 kB
+dist/components/layout/index.js                                                             0.75 kB │ gzip: 0.41 kB │ map:  0.86 kB
+dist/components/button/style.js                                                             0.99 kB │ gzip: 0.43 kB │ map:  1.28 kB
+dist/components/button/index.js                                                             1.09 kB │ gzip: 0.51 kB │ map:  1.42 kB
+dist/components/back-top/index.js                                                           2.95 kB │ gzip: 1.26 kB │ map:  5.14 kB
+dist/components/svg-draw-lines/index.js                                                     3.06 kB │ gzip: 1.38 kB │ map:  6.66 kB
+dist/node_modules/.pnpm/iconify-icon@3.0.2/node_modules/iconify-icon/dist/iconify-icon.js  29.01 kB │ gzip: 9.28 kB │ map: 97.11 kB
+
+✓ built in 819ms

package/.turbo/turbo-test.log

@@ -0,0 +1,34 @@
+
+> @mono/web-ui@1.0.0 test /Users/bopan/VibeCoding/mono/packages/web-ui
+> vp test run
+
+[?25l
+ RUN  v4.1.9 /Users/bopan/VibeCoding/mono/packages/web-ui
+
+[?2026h
+ Test Files 0 passed (1)
+      Tests 0 passed (0)
+   Start at 22:41:27
+   Duration 949ms
+[?2026l[?2026h
+ Test Files 0 passed (1)
+      Tests 0 passed (0)
+   Start at 22:41:27
+   Duration 1.96s
+[?2026l[?2026h
+ ❯ src/components/layout/__tests__/layout.spec.ts 0/1
+
+ Test Files 0 passed (1)
+      Tests 0 passed (1)
+   Start at 22:41:27
+   Duration 2.06s
+[?2026l ✓ src/components/layout/__tests__/layout.spec.ts (1 test) 3ms
+   ✓ test (1)
+     ✓ 1 + 1 = 2 2ms
+
+ Test Files  1 passed (1)
+      Tests  1 passed (1)
+   Start at  22:41:27
+   Duration  2.14s (transform 32ms, setup 0ms, import 47ms, tests 3ms, environment 1.73s)
+
+[?25h

package/dist/_virtual/_@oxc-project_runtime@0.138.0/helpers/esm/decorate.js

@@ -0,0 +1,9 @@
+//#region \0@oxc-project+runtime@0.138.0/helpers/esm/decorate.js
+function e(e, t, n, r) {
+	var i = arguments.length, a = i < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, n) : r, o;
+	if (typeof Reflect == "object" && typeof Reflect.decorate == "function") a = Reflect.decorate(e, t, n, r);
+	else for (var s = e.length - 1; s >= 0; s--) (o = e[s]) && (a = (i < 3 ? o(a) : i > 3 ? o(t, n, a) : o(t, n)) || a);
+	return i > 3 && a && Object.defineProperty(t, n, a), a;
+}
+//#endregion
+export { e as default };

package/dist/components/back-top/index.d.ts

@@ -0,0 +1,25 @@
+import { LitElement, PropertyValues } from 'lit';
+export declare class WebUiBackTop extends LitElement {
+    static styles: import('lit').CSSResult;
+    smooth: boolean;
+    threshold: number;
+    visible: boolean;
+    scrollTarget: HTMLElement | Window;
+    private eventController?;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected willUpdate(props: PropertyValues): void;
+    private get target();
+    private onScrollTarget;
+    private computeVisible;
+    toTop(): void;
+    private onEnter;
+    render(): import('lit').TemplateResult<1>;
+}
+export interface WebUiBackTop {
+    readonly $events: {
+        'visible-change': CustomEvent<{
+            visible: boolean;
+        }>;
+    };
+}

package/dist/components/back-top/index.js

@@ -0,0 +1,84 @@
+import "../../node_modules/.pnpm/iconify-icon@3.0.2/node_modules/iconify-icon/dist/iconify-icon.js";
+import e from "../../_virtual/_@oxc-project_runtime@0.138.0/helpers/esm/decorate.js";
+import { getRootScrollTop as t } from "../../packages/browser-kit/dist/dom/index.js";
+import n from "./style.js";
+import { LitElement as r, html as i, unsafeCSS as a } from "lit";
+import { customElement as o, property as s, state as c } from "lit/decorators.js";
+//#region src/components/back-top/index.ts
+var l = class extends r {
+	constructor(...e) {
+		super(...e), this.smooth = !0, this.threshold = 200, this.visible = !1, this.scrollTarget = window;
+	}
+	static {
+		this.styles = a(n);
+	}
+	connectedCallback() {
+		super.connectedCallback(), this.computeVisible(), this.onScrollTarget();
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback(), this.eventController?.abort();
+	}
+	willUpdate(e) {
+		super.willUpdate(e), (e.has("threshold") || e.has("scrollTarget")) && this.computeVisible(), e.has("scrollTarget") && this.hasUpdated && this.onScrollTarget();
+	}
+	get target() {
+		return this.scrollTarget ? this.scrollTarget === window || this.scrollTarget === document.documentElement || this.scrollTarget === document.body ? window : this.scrollTarget : window;
+	}
+	onScrollTarget() {
+		this.eventController?.abort(), this.eventController = new AbortController(), this.target.addEventListener("scroll", () => {
+			this.computeVisible();
+		}, {
+			signal: this.eventController.signal,
+			passive: !0
+		});
+	}
+	computeVisible() {
+		let { target: e } = this, n;
+		if (e === window) n = t() >= this.threshold;
+		else if (e instanceof HTMLElement) n = e.scrollTop >= this.threshold;
+		else throw Error("Prop scrollTarget must be HTMLElement or Window.");
+		n !== this.visible && (this.visible = n, this.dispatchEvent(new CustomEvent("visible-change", {
+			detail: { visible: n },
+			bubbles: !0,
+			composed: !0
+		})));
+	}
+	toTop() {
+		this.target.scrollTo({
+			top: 0,
+			behavior: this.smooth ? "smooth" : "auto"
+		});
+	}
+	onEnter(e) {
+		e.key == "Enter" && (e.preventDefault(), this.toTop());
+	}
+	render() {
+		return i`
+      <div role="button" tabindex="0" @click=${this.toTop} @keydown=${this.onEnter}>
+        <slot>
+          <!-- 默认 slot 加上 tabindex="-1"，防止双重 focus -->
+          <web-ui-button tabindex="-1" icon>
+            <iconify-icon icon="octicon:move-to-top-16" width="16" height="16"></iconify-icon>
+          </web-ui-button>
+        </slot>
+      </div>
+    `;
+	}
+};
+e([s({
+	type: Boolean,
+	reflect: !0
+})], l.prototype, "smooth", void 0), e([s({
+	type: Number,
+	reflect: !0
+})], l.prototype, "threshold", void 0), e([s({
+	type: Boolean,
+	reflect: !0
+})], l.prototype, "visible", void 0), e([s({
+	type: Object,
+	attribute: !1
+})], l.prototype, "scrollTarget", void 0), e([c()], l.prototype, "eventController", void 0), l = e([o("web-ui-back-top")], l);
+//#endregion
+export { l as WebUiBackTop };
+
+//# sourceMappingURL=index.js.map

package/dist/components/back-top/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/back-top/index.ts"],"sourcesContent":["import 'iconify-icon'\nimport '@/components/button'\nimport { getRootScrollTop } from '@greypan/browser-kit'\nimport { html, LitElement, type PropertyValues, unsafeCSS } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-back-top')\nexport class WebUiBackTop extends LitElement {\n  static styles = unsafeCSS(style)\n\n  @property({ type: Boolean, reflect: true }) smooth = true\n  @property({ type: Number, reflect: true }) threshold: number = 200\n  @property({ type: Boolean, reflect: true }) visible = false\n  @property({ type: Object, attribute: false }) scrollTarget: HTMLElement | Window = window\n\n  @state() private eventController?: AbortController\n\n  override connectedCallback() {\n    super.connectedCallback()\n    this.computeVisible()\n    this.onScrollTarget()\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback()\n    this.eventController?.abort()\n  }\n\n  protected override willUpdate(props: PropertyValues) {\n    super.willUpdate(props)\n\n    if (props.has('threshold') || props.has('scrollTarget')) {\n      this.computeVisible()\n    }\n    //避免首次与 connectedCallback 重复触发\n    if (props.has('scrollTarget') && this.hasUpdated) {\n      this.onScrollTarget()\n    }\n  }\n\n  private get target() {\n    if (!this.scrollTarget) {\n      return window\n    }\n    const isRoot =\n      this.scrollTarget === window ||\n      this.scrollTarget === document.documentElement ||\n      this.scrollTarget === document.body\n    return isRoot ? window : this.scrollTarget\n  }\n\n  private onScrollTarget() {\n    this.eventController?.abort()\n    this.eventController = new AbortController()\n\n    this.target.addEventListener(\n      'scroll',\n      () => {\n        this.computeVisible()\n      },\n      {\n        signal: this.eventController.signal,\n        passive: true\n      }\n    )\n  }\n\n  private computeVisible() {\n    const { target } = this\n    let nextVisible: boolean\n    if (target === window) {\n      nextVisible = getRootScrollTop() >= this.threshold\n    } else if (target instanceof HTMLElement) {\n      nextVisible = target.scrollTop >= this.threshold\n    } else {\n      throw new Error('Prop scrollTarget must be HTMLElement or Window.')\n    }\n    if (nextVisible !== this.visible) {\n      this.visible = nextVisible\n      this.dispatchEvent(\n        new CustomEvent('visible-change', {\n          detail: { visible: nextVisible },\n          bubbles: true,\n          composed: true\n        })\n      )\n    }\n  }\n\n  toTop() {\n    this.target.scrollTo({\n      top: 0,\n      behavior: this.smooth ? 'smooth' : 'auto'\n    })\n  }\n\n  private onEnter(e: KeyboardEvent) {\n    if ((e as KeyboardEvent).key == 'Enter') {\n      e.preventDefault()\n      this.toTop()\n    }\n  }\n\n  render() {\n    return html`\n      <div role=\"button\" tabindex=\"0\" @click=${this.toTop} @keydown=${this.onEnter}>\n        <slot>\n          <!-- 默认 slot 加上 tabindex=\"-1\"，防止双重 focus -->\n          <web-ui-button tabindex=\"-1\" icon>\n            <iconify-icon icon=\"octicon:move-to-top-16\" width=\"16\" height=\"16\"></iconify-icon>\n          </web-ui-button>\n        </slot>\n      </div>\n    `\n  }\n}\n\nexport interface WebUiBackTop {\n  readonly $events: {\n    'visible-change': CustomEvent<{ visible: boolean }>\n  }\n}\n"],"mappings":";;;;;;;AASO,IAAA,IAAA,cAA2B,EAAW;;6BAGU,qBACU,oBACT,wBAC6B;;;gBALnE,EAAU,CAAK;;CAS/B,oBAA6B;EAG3B,AAFA,MAAM,kBAAkB,GACxB,KAAK,eAAe,GACpB,KAAK,eAAe;CACtB;CAEA,uBAAgC;EAE9B,AADA,MAAM,qBAAqB,GAC3B,KAAK,iBAAiB,MAAM;CAC9B;CAEA,WAA8B,GAAuB;EAOnD,AANA,MAAM,WAAW,CAAK,IAElB,EAAM,IAAI,WAAW,KAAK,EAAM,IAAI,cAAc,MACpD,KAAK,eAAe,GAGlB,EAAM,IAAI,cAAc,KAAK,KAAK,cACpC,KAAK,eAAe;CAExB;CAEA,IAAY,SAAS;EAQnB,OAPK,KAAK,eAIR,KAAK,iBAAiB,UACtB,KAAK,iBAAiB,SAAS,mBAC/B,KAAK,iBAAiB,SAAS,OACjB,SAAS,KAAK,eANrB;CAOX;CAEA,iBAAyB;EAIvB,AAHA,KAAK,iBAAiB,MAAM,GAC5B,KAAK,kBAAkB,IAAI,gBAAgB,GAE3C,KAAK,OAAO,iBACV,gBACM;GACJ,KAAK,eAAe;EACtB,GACA;GACE,QAAQ,KAAK,gBAAgB;GAC7B,SAAS;EACX,CACF;CACF;CAEA,iBAAyB;EACvB,IAAM,EAAE,cAAW,MACf;EACJ,IAAI,MAAW,QACb,IAAc,EAAiB,KAAK,KAAK;OACpC,IAAI,aAAkB,aAC3B,IAAc,EAAO,aAAa,KAAK;OAEvC,MAAU,MAAM,kDAAkD;EAEpE,AAAI,MAAgB,KAAK,YACvB,KAAK,UAAU,GACf,KAAK,cACH,IAAI,YAAY,kBAAkB;GAChC,QAAQ,EAAE,SAAS,EAAY;GAC/B,SAAS;GACT,UAAU;EACZ,CAAC,CACH;CAEJ;CAEA,QAAQ;EACN,KAAK,OAAO,SAAS;GACnB,KAAK;GACL,UAAU,KAAK,SAAS,WAAW;EACrC,CAAC;CACH;CAEA,QAAgB,GAAkB;EAChC,AAAK,EAAoB,OAAO,YAC9B,EAAE,eAAe,GACjB,KAAK,MAAM;CAEf;CAEA,SAAS;EACP,OAAO,CAAI;+CACgC,KAAK,MAAM,YAAY,KAAK,QAAQ;;;;;;;;;CASjF;AACF;GAzGG,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA,MACzC,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,aAAA,KAAA,CAAA,MACxC,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,WAAA,KAAA,CAAA,MACzC,EAAS;CAAE,MAAM;CAAQ,WAAW;AAAM,CAAC,CAAA,GAAA,EAAA,WAAA,gBAAA,KAAA,CAAA,MAE3C,EAAM,CAAA,GAAA,EAAA,WAAA,mBAAA,KAAA,CAAA,UATR,EAAc,iBAAiB,CAAA,GAAA,CAAA"}

package/dist/components/back-top/style.js

@@ -0,0 +1,6 @@
+//#region src/components/back-top/style.css?inline
+var e = ":host{pointer-events:none;z-index:var(--web-ui-back-top-z-index,auto);top:var(--web-ui-back-top-top,auto);right:var(--web-ui-back-top-right,20px);bottom:var(--web-ui-back-top-bottom,20px);left:var(--web-ui-back-top-left,auto);visibility:hidden;opacity:0;transition:all .3s ease-out;display:inline-block;position:fixed;transform:scale(0)}:host([visible]){pointer-events:auto;visibility:visible;opacity:1;transform:scale(1)}";
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=style.js.map

package/dist/components/back-top/style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.js","names":[],"sources":["../../../src/components/back-top/style.css?inline"],"sourcesContent":[":host {\n  pointer-events: none;\n  position: fixed;\n  z-index: var(--web-ui-back-top-z-index, auto);\n  top: var(--web-ui-back-top-top, auto);\n  right: var(--web-ui-back-top-right, 20px);\n  bottom: var(--web-ui-back-top-bottom, 20px);\n  left: var(--web-ui-back-top-left, auto);\n  transform: scale(0);\n  display: inline-block;\n  visibility: hidden;\n  opacity: 0;\n  transition: all 0.3s ease-out;\n}\n\n:host([visible]) {\n  pointer-events: auto;\n  transform: scale(1);\n  visibility: visible;\n  opacity: 1;\n}\n"],"mappings":""}

package/dist/components/button/index.d.ts

@@ -0,0 +1,9 @@
+import { LitElement } from 'lit';
+export declare class WebUiButton extends LitElement {
+    static styles: import('lit').CSSResult;
+    full: boolean;
+    primary: boolean;
+    text: boolean;
+    icon: boolean;
+    render(): import('lit').TemplateResult<1>;
+}

package/dist/components/button/index.js

@@ -0,0 +1,41 @@
+import e from "./style.js";
+import t from "../../_virtual/_@oxc-project_runtime@0.138.0/helpers/esm/decorate.js";
+import { LitElement as n, html as r, unsafeCSS as i } from "lit";
+import { customElement as a, property as o } from "lit/decorators.js";
+//#region src/components/button/index.ts
+var s = class extends n {
+	constructor(...e) {
+		super(...e), this.full = !1, this.primary = !1, this.text = !1, this.icon = !1;
+	}
+	static {
+		this.styles = i(e);
+	}
+	render() {
+		return r`
+      <button>
+        ${this.icon ? r`<slot></slot>` : r`
+              <slot name="prefix"></slot>
+              <slot></slot>
+              <slot name="suffix"></slot>
+            `}
+      </button>
+    `;
+	}
+};
+t([o({
+	type: Boolean,
+	reflect: !0
+})], s.prototype, "full", void 0), t([o({
+	type: Boolean,
+	reflect: !0
+})], s.prototype, "primary", void 0), t([o({
+	type: Boolean,
+	reflect: !0
+})], s.prototype, "text", void 0), t([o({
+	type: Boolean,
+	reflect: !0
+})], s.prototype, "icon", void 0), s = t([a("web-ui-button")], s);
+//#endregion
+export { s as WebUiButton };
+
+//# sourceMappingURL=index.js.map

package/dist/components/button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/button/index.ts"],"sourcesContent":["import { html, LitElement, unsafeCSS } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-button')\nexport class WebUiButton extends LitElement {\n  static styles = unsafeCSS(style)\n\n  @property({ type: Boolean, reflect: true }) full = false\n  @property({ type: Boolean, reflect: true }) primary = false\n  @property({ type: Boolean, reflect: true }) text = false\n  @property({ type: Boolean, reflect: true }) icon = false\n\n  render() {\n    return html`\n      <button>\n        ${this.icon\n          ? html`<slot></slot>`\n          : html`\n              <slot name=\"prefix\"></slot>\n              <slot></slot>\n              <slot name=\"suffix\"></slot>\n            `}\n      </button>\n    `\n  }\n}\n"],"mappings":";;;;;AAMO,IAAA,IAAA,cAA0B,EAAW;;2BAGS,mBACG,gBACH,gBACA;;;gBALnC,EAAU,CAAK;;CAO/B,SAAS;EACP,OAAO,CAAI;;UAEL,KAAK,OACH,CAAI,kBACJ,CAAI;;;;cAIF;;;CAGZ;AACF;GAlBG,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,MACzC,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,WAAA,KAAA,CAAA,MACzC,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,MACzC,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,UAP3C,EAAc,eAAe,CAAA,GAAA,CAAA"}

package/dist/components/button/style.js

@@ -0,0 +1,6 @@
+//#region src/components/button/style.css?inline
+var e = ":host button{cursor:pointer;gap:var(--web-ui-button-gap,8px);width:max-content;min-height:var(--web-ui-button-h,32px);padding:var(--web-ui-button-p-y,4px) var(--web-ui-button-p-x,16px);font-size:var(--web-ui-button-font-size,14px);font-weight:var(--web-ui-button-bold,500);color:var(--web-ui-button-color,#006cf9);background:0 0;background-color:var(--web-ui-button-bg,#f0f0f6);border:none;border-radius:999vmax;justify-content:center;align-items:center;display:inline-flex}:host([full]) button{width:100%;display:flex}:host([primary]) button{color:var(--web-ui-button-primary-color,#fff);background-color:var(--web-ui-button-primary-bg,#006cf9)}:host([text]) button{color:var(--web-ui-button-primary-color,#006cf9);background-color:#0000}:host([icon]) button{width:var(--web-ui-button-h,32px);height:var(--web-ui-button-h,32px);padding:var(--web-ui-button-p-y,4px)}";
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=style.js.map

package/dist/components/button/style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.js","names":[],"sources":["../../../src/components/button/style.css?inline"],"sourcesContent":[":host {\n  button {\n    cursor: pointer;\n    display: inline-flex;\n    gap: var(--web-ui-button-gap, 8px);\n    align-items: center;\n    justify-content: center;\n    width: max-content;\n    min-height: var(--web-ui-button-h, 32px);\n    padding: var(--web-ui-button-p-y, 4px) var(--web-ui-button-p-x, 16px);\n    border: none;\n    border-radius: 999vmax;\n    font-size: var(--web-ui-button-font-size, 14px);\n    font-weight: var(--web-ui-button-bold, 500);\n    color: var(--web-ui-button-color, #006cf9);\n    background: none;\n    background-color: var(--web-ui-button-bg, #f0f0f6);\n  }\n}\n\n:host([full]) {\n  button {\n    display: flex;\n    width: 100%;\n  }\n}\n\n:host([primary]) {\n  button {\n    color: var(--web-ui-button-primary-color, #fff);\n    background-color: var(--web-ui-button-primary-bg, #006cf9);\n  }\n}\n\n:host([text]) {\n  button {\n    color: var(--web-ui-button-primary-color, #006cf9);\n    background-color: transparent;\n  }\n}\n\n:host([icon]) {\n  button {\n    width: var(--web-ui-button-h, 32px);\n    height: var(--web-ui-button-h, 32px);\n    padding: var(--web-ui-button-p-y, 4px);\n  }\n}\n"],"mappings":""}

package/dist/components/layout/index.d.ts

@@ -0,0 +1,5 @@
+import { LitElement } from 'lit';
+export declare class WebUiLayout extends LitElement {
+    static styles: import('lit').CSSResult;
+    render(): import('lit').TemplateResult<1>;
+}

package/dist/components/layout/index.js

@@ -0,0 +1,31 @@
+import e from "../../_virtual/_@oxc-project_runtime@0.138.0/helpers/esm/decorate.js";
+import t from "./style.js";
+import { LitElement as n, html as r, unsafeCSS as i } from "lit";
+import { customElement as a } from "lit/decorators.js";
+//#region src/components/layout/index.ts
+var o = class extends n {
+	static {
+		this.styles = i(t);
+	}
+	render() {
+		return r`
+      <header>
+        <slot name="header"></slot>
+      </header>
+      <main>
+        <slot></slot>
+      </main>
+      <aside>
+        <div class="menu"><slot name="sidebar"></slot></div>
+      </aside>
+      <footer>
+        <slot name="tabbar"></slot>
+      </footer>
+    `;
+	}
+};
+o = e([a("web-ui-layout")], o);
+//#endregion
+export { o as WebUiLayout };
+
+//# sourceMappingURL=index.js.map

package/dist/components/layout/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/layout/index.ts"],"sourcesContent":["import { html, LitElement, unsafeCSS } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-layout')\nexport class WebUiLayout extends LitElement {\n  static styles = unsafeCSS(style)\n\n  render() {\n    return html`\n      <header>\n        <slot name=\"header\"></slot>\n      </header>\n      <main>\n        <slot></slot>\n      </main>\n      <aside>\n        <div class=\"menu\"><slot name=\"sidebar\"></slot></div>\n      </aside>\n      <footer>\n        <slot name=\"tabbar\"></slot>\n      </footer>\n    `\n  }\n}\n"],"mappings":";;;;;AAMO,IAAA,IAAA,cAA0B,EAAW;;gBAC1B,EAAU,CAAK;;CAE/B,SAAS;EACP,OAAO,CAAI;;;;;;;;;;;;;;CAcb;AACF;OApBC,EAAc,eAAe,CAAA,GAAA,CAAA"}

package/dist/components/layout/style.js

@@ -0,0 +1,6 @@
+//#region src/components/layout/style.css?inline
+var e = ":host{grid-template-areas:\"sidebar header\"\"sidebar content\";grid-template-columns:var(--web-ui-base-layout-sidebar-width,240px) 1fr;grid-template-rows:var(--web-ui-base-layout-header-height,64px) 1fr;box-sizing:border-box;min-height:100vh;display:grid}:host *{box-sizing:inherit}header{grid-area:header;position:sticky;top:0;right:0}main{grid-area:content}aside{grid-area:sidebar;height:100vh;padding:8px;position:sticky;top:0;left:0}aside .menu{background-color:var(--web-ui-base-layout-bg,#f5f5f5);border-radius:16px;height:100%;box-shadow:2px 4px 32px #0003}footer{grid-area:footer}";
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=style.js.map

package/dist/components/layout/style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.js","names":[],"sources":["../../../src/components/layout/style.css?inline"],"sourcesContent":[":host {\n  display: grid;\n  grid-template-areas:\n    \"sidebar header\"\n    \"sidebar content\";\n  grid-template-columns: var(--web-ui-base-layout-sidebar-width, 240px) 1fr;\n  grid-template-rows: var(--web-ui-base-layout-header-height, 64px) 1fr;\n  box-sizing: border-box;\n  min-height: 100dvh;\n  min-height: 100vh;\n\n  * {\n    box-sizing: inherit;\n  }\n}\n\nheader {\n  position: sticky;\n  top: 0;\n  right: 0;\n  grid-area: header;\n}\n\nmain {\n  grid-area: content;\n}\n\naside {\n  position: sticky;\n  top: 0;\n  left: 0;\n  grid-area: sidebar;\n  height: 100dvh;\n  height: 100vh;\n  padding: 8px;\n\n  .menu {\n    height: 100%;\n    border-radius: 16px;\n    background-color: var(--web-ui-base-layout-bg, #f5f5f5);\n    box-shadow: 2px 4px 32px rgb(0 0 0 / 0.2);\n  }\n}\n\nfooter {\n  grid-area: footer;\n}\n"],"mappings":""}

package/dist/components/svg-draw-lines/index.d.ts

@@ -0,0 +1,16 @@
+import { LitElement } from 'lit';
+export declare class WebUiSvgDrawLines extends LitElement {
+    static styles: import('lit').CSSResult;
+    duration: number;
+    easing: string;
+    private isAnimating;
+    private svgClone;
+    private slotEl;
+    private handleSlotChange;
+    private cloneOriginalSvg;
+    private startAnimation;
+    private fixPathGap;
+    private drawLine;
+    private stopAnimation;
+    render(): import('lit').TemplateResult<1>;
+}

package/dist/components/svg-draw-lines/index.js

@@ -0,0 +1,86 @@
+import e from "../../_virtual/_@oxc-project_runtime@0.138.0/helpers/esm/decorate.js";
+import t from "./style.js";
+import { LitElement as n, html as r, unsafeCSS as i } from "lit";
+import { customElement as a, property as o, query as s, state as c } from "lit/decorators.js";
+//#region src/components/svg-draw-lines/index.ts
+var l = class extends n {
+	constructor(...e) {
+		super(...e), this.duration = 1e3, this.easing = "linear", this.isAnimating = !1, this.svgClone = null;
+	}
+	static {
+		this.styles = i(t);
+	}
+	handleSlotChange() {
+		this.isAnimating || (this.cloneOriginalSvg(), this.isAnimating = !0, this.startAnimation());
+	}
+	cloneOriginalSvg() {
+		let e = this.slotEl.assignedElements({ flatten: !0 })[0];
+		if (!(e instanceof SVGSVGElement)) return;
+		let t = e.cloneNode(!0);
+		t.classList.add("svg-clone"), this.svgClone = t;
+	}
+	async startAnimation() {
+		if (!this.svgClone) return;
+		await this.updateComplete;
+		let e = Array.from(this.svgClone.querySelectorAll("path, rect, circle, line, polyline, polygon, ellipse")), t = [], n = {
+			x: 0,
+			y: 0
+		};
+		if (e.forEach((e) => {
+			if (e instanceof SVGPathElement) {
+				let r = (e.getAttribute("d") || "").split(/(?=[Mm])/).filter((e) => e.trim());
+				r.forEach((i) => {
+					let a = r.length > 1 ? e.cloneNode() : e, o = i.startsWith("m") ? `M${n.x} ${n.y}${i}` : i;
+					o = this.fixPathGap(a, o), a.setAttribute("d", o), r.length > 1 && e.parentNode?.insertBefore(a, e), t.push(a);
+					let s = a.getPointAtLength(a.getTotalLength());
+					n = {
+						x: s.x,
+						y: s.y
+					};
+				}), r.length > 1 && e.remove();
+			} else t.push(e);
+		}), t.length === 0) return this.stopAnimation();
+		let r = t.map((e, t) => new Promise((n) => {
+			this.drawLine(e, t, n);
+		}));
+		await Promise.all(r), this.stopAnimation();
+	}
+	fixPathGap(e, t) {
+		if (/[Zz]\s*$/.test(t)) {
+			e.setAttribute("d", t);
+			let n = e.getPointAtLength(0), r = e.getPointAtLength(.1);
+			return t.replace(/[Zz]\s*$/, `L${n.x.toFixed(3)} ${n.y.toFixed(3)} L${r.x.toFixed(3)} ${r.y.toFixed(3)}`);
+		}
+		return t;
+	}
+	drawLine(e, t, n) {
+		let r = parseFloat(getComputedStyle(e).strokeWidth) || 0, i = e.getTotalLength() + r;
+		e.style.strokeDasharray = `${i}`, e.style.strokeDashoffset = `${i}`;
+		let a = e.animate([{ strokeDashoffset: `${i}` }, { strokeDashoffset: "0" }], {
+			duration: this.duration,
+			easing: this.easing,
+			fill: "forwards"
+		});
+		a.onfinish = n;
+	}
+	stopAnimation() {
+		this.isAnimating = !1, this.svgClone = null;
+	}
+	render() {
+		return r`
+      <slot ?hidden="${this.isAnimating}" @slotchange="${this.handleSlotChange}"></slot>
+      ${this.isAnimating ? this.svgClone : ""}
+    `;
+	}
+};
+e([o({
+	type: Boolean,
+	reflect: !0
+})], l.prototype, "duration", void 0), e([o({
+	type: String,
+	reflect: !0
+})], l.prototype, "easing", void 0), e([c()], l.prototype, "isAnimating", void 0), e([c()], l.prototype, "svgClone", void 0), e([s("slot")], l.prototype, "slotEl", void 0), l = e([a("web-ui-svg-draw-lines")], l);
+//#endregion
+export { l as WebUiSvgDrawLines };
+
+//# sourceMappingURL=index.js.map

package/dist/components/svg-draw-lines/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/svg-draw-lines/index.ts"],"sourcesContent":["import { html, LitElement, unsafeCSS } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-svg-draw-lines')\nexport class WebUiSvgDrawLines extends LitElement {\n  static styles = unsafeCSS(style)\n\n  @property({ type: Boolean, reflect: true }) duration = 1000\n  @property({ type: String, reflect: true }) easing = 'linear'\n\n  @state() private isAnimating = false\n  @state() private svgClone: SVGSVGElement | null = null\n  @query('slot') private slotEl!: HTMLSlotElement\n\n  private handleSlotChange() {\n    if (this.isAnimating) return\n\n    this.cloneOriginalSvg()\n\n    this.isAnimating = true\n    void this.startAnimation()\n  }\n\n  private cloneOriginalSvg() {\n    const original = this.slotEl.assignedElements({ flatten: true })[0]\n    if (!(original instanceof SVGSVGElement)) return\n\n    const svgClone = original.cloneNode(true) as SVGSVGElement\n    svgClone.classList.add('svg-clone')\n    this.svgClone = svgClone\n  }\n\n  private async startAnimation() {\n    if (!this.svgClone) return\n    await this.updateComplete\n\n    const selectors = 'path, rect, circle, line, polyline, polygon, ellipse'\n    const elements = Array.from(this.svgClone.querySelectorAll(selectors)) as SVGGeometryElement[]\n\n    const animTasks: SVGGeometryElement[] = []\n    let cursor = { x: 0, y: 0 }\n\n    // 除 path 外其余几何图形无需额外处理\n    // 将绘制多段路径的单 path 先拆分为多 path 并重新插入 dom\n    // 再分别计算每个 path 的 total length\n    elements.forEach(el => {\n      if (el instanceof SVGPathElement) {\n        const d = el.getAttribute('d') || ''\n        const segments = d.split(/(?=[Mm])/).filter(s => s.trim())\n\n        // 无论是一段还是多段，统一处理\n        segments.forEach(seg => {\n          const pathPart = segments.length > 1 ? (el.cloneNode() as SVGPathElement) : el\n          let finalD = seg.startsWith('m') ? `M${cursor.x} ${cursor.y}${seg}` : seg\n\n          finalD = this.fixPathGap(pathPart, finalD)\n          pathPart.setAttribute('d', finalD)\n\n          if (segments.length > 1) el.parentNode?.insertBefore(pathPart, el)\n\n          animTasks.push(pathPart)\n\n          const end = pathPart.getPointAtLength(pathPart.getTotalLength())\n          cursor = { x: end.x, y: end.y }\n        })\n\n        if (segments.length > 1) el.remove()\n      } else {\n        animTasks.push(el)\n      }\n    })\n\n    if (animTasks.length === 0) return this.stopAnimation()\n\n    const promises = animTasks.map((el, i) => {\n      return new Promise<void>(resolve => {\n        this.drawLine(el, i, resolve)\n      })\n    })\n\n    await Promise.all(promises)\n    this.stopAnimation()\n  }\n\n  // 缺口修复逻辑\n  // 多走 0.1px 触发渲染闭合和确定起始矢量方向\n  private fixPathGap(pathEl: SVGPathElement, d: string): string {\n    if (/[Zz]\\s*$/.test(d)) {\n      pathEl.setAttribute('d', d)\n      const p0 = pathEl.getPointAtLength(0)\n      const p1 = pathEl.getPointAtLength(0.1)\n\n      // 将 Z 替换为回到起点并多走 0.1px 的路径\n      return d.replace(/[Zz]\\s*$/, `L${p0.x.toFixed(3)} ${p0.y.toFixed(3)} L${p1.x.toFixed(3)} ${p1.y.toFixed(3)}`)\n    }\n    return d\n  }\n\n  private drawLine(el: SVGGeometryElement, index: number, onFinish: () => void) {\n    const strokeWidth = parseFloat(getComputedStyle(el).strokeWidth) || 0\n    const len = el.getTotalLength() + strokeWidth\n\n    el.style.strokeDasharray = `${len}`\n    el.style.strokeDashoffset = `${len}`\n\n    const anim = el.animate([{ strokeDashoffset: `${len}` }, { strokeDashoffset: '0' }], {\n      duration: this.duration,\n      easing: this.easing,\n      fill: 'forwards'\n    })\n    anim.onfinish = onFinish\n  }\n\n  private stopAnimation() {\n    this.isAnimating = false\n    this.svgClone = null\n  }\n\n  render() {\n    return html`\n      <slot ?hidden=\"${this.isAnimating}\" @slotchange=\"${this.handleSlotChange}\"></slot>\n      ${this.isAnimating ? this.svgClone : ''}\n    `\n  }\n}\n"],"mappings":"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"}

package/dist/components/svg-draw-lines/style.js

@@ -0,0 +1,6 @@
+//#region src/components/svg-draw-lines/style.css?inline
+var e = ":host{vertical-align:middle;display:inline-block;position:relative}:host .svg-clone{pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0}:host slot[hidden]{visibility:hidden;display:contents}";
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=style.js.map

package/dist/components/svg-draw-lines/style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.js","names":[],"sources":["../../../src/components/svg-draw-lines/style.css?inline"],"sourcesContent":[":host {\n  position: relative;\n  display: inline-block;\n  vertical-align: middle;\n\n  .svg-clone {\n    pointer-events: none;\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n  }\n\n  slot[hidden] {\n    display: contents;\n    visibility: hidden;\n  }\n}\n"],"mappings":""}

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+export * from './components/back-top';
+export * from './components/button';
+export * from './components/layout';
+export * from './components/svg-draw-lines';

package/dist/index.js

@@ -0,0 +1,5 @@
+import { WebUiButton as e } from "./components/button/index.js";
+import { WebUiBackTop as t } from "./components/back-top/index.js";
+import { WebUiLayout as n } from "./components/layout/index.js";
+import { WebUiSvgDrawLines as r } from "./components/svg-draw-lines/index.js";
+export { t as WebUiBackTop, e as WebUiButton, n as WebUiLayout, r as WebUiSvgDrawLines };