@zhaoren118/youyu-button 0.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 youyu-button
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,172 @@
+# youyu-button
+
+一个基于 Vue 3 的自定义按钮组件插件，提供丰富的样式和交互功能。
+
+## 功能特性
+
+- 支持多种按钮类型：默认、主要、次要、成功、警告、危险、信息
+- 支持多种按钮尺寸：迷你（MINI）、小（S）、中（M）、大（L）、特大（XL）
+- 支持圆角样式
+- 支持激活和禁用状态
+- 内置消息提示功能
+- 内置确认对话框功能
+- 内置弹窗功能
+- 响应式设计
+
+## 安装
+
+```sh
+# 使用 npm
+npm install youyu-button
+
+# 使用 yarn
+yarn add youyu-button
+
+# 使用 pnpm
+pnpm add youyu-button
+```
+
+## 使用
+
+### 全局安装
+
+```js
+// main.ts
+import { createApp } from "vue";
+import YouyuButtonPlugin from "youyu-button";
+import "youyu-button/dist/style.css";
+
+const app = createApp(App);
+app.use(YouyuButtonPlugin);
+app.mount("#app");
+```
+
+### 局部使用
+
+```vue
+<script setup lang="ts">
+import { YouyuButton } from "youyu-button";
+import "youyu-button/dist/style.css";
+</script>
+
+<template>
+  <YouyuButton type="primary">主要按钮</YouyuButton>
+</template>
+```
+
+## 组件属性
+
+| 属性名               | 类型    | 默认值               | 说明                                                                  |
+| -------------------- | ------- | -------------------- | --------------------------------------------------------------------- |
+| type                 | string  | default              | 按钮类型：default, primary, secondary, success, warning, danger, info |
+| size                 | string  | M                    | 按钮尺寸：MINI, S, M, L, XL                                           |
+| rounded              | boolean | false                | 是否显示圆角                                                          |
+| active               | boolean | false                | 是否激活状态                                                          |
+| disabled             | boolean | false                | 是否禁用状态                                                          |
+| className            | string  |                      | 自定义类名                                                            |
+| data-toggle          | string  |                      | 交互类型：message, confirm, layer                                     |
+| data-message         | string  | 操作成功             | 提示消息内容                                                          |
+| data-type            | string  | success              | 消息类型：success, error, warning, info                               |
+| data-confirm-message | string  | 确定要执行此操作吗？ | 确认对话框消息                                                        |
+| data-layer-title     | string  | 弹窗                 | 弹窗标题                                                              |
+| data-layer-url       | string  | #                    | 弹窗内容 URL                                                          |
+
+## 事件
+
+| 事件名 | 说明     | 参数       |
+| ------ | -------- | ---------- |
+| click  | 点击事件 | MouseEvent |
+
+## 示例
+
+### 基础按钮
+
+```vue
+<YouyuButton type="default">默认按钮</YouyuButton>
+<YouyuButton type="primary">主要按钮</YouyuButton>
+<YouyuButton type="success">成功按钮</YouyuButton>
+<YouyuButton type="warning">警告按钮</YouyuButton>
+<YouyuButton type="danger">危险按钮</YouyuButton>
+```
+
+### 不同尺寸
+
+```vue
+<YouyuButton type="primary" size="MINI">迷你按钮</YouyuButton>
+<YouyuButton type="primary" size="S">小按钮</YouyuButton>
+<YouyuButton type="primary" size="M">中按钮</YouyuButton>
+<YouyuButton type="primary" size="L">大按钮</YouyuButton>
+<YouyuButton type="primary" size="XL">特大按钮</YouyuButton>
+```
+
+### 圆角按钮
+
+```vue
+<YouyuButton type="primary" rounded>圆角按钮</YouyuButton>
+```
+
+### 消息提示
+
+```vue
+<YouyuButton
+  type="primary"
+  rounded
+  data-toggle="message"
+  data-message="操作成功！"
+  data-type="success"
+>
+  显示成功提示
+</YouyuButton>
+```
+
+### 确认对话框
+
+```vue
+<YouyuButton
+  type="primary"
+  rounded
+  data-toggle="confirm"
+  data-confirm-message="确定要删除这个项目吗？"
+  data-message="删除成功！"
+>
+  确认删除
+</YouyuButton>
+```
+
+### 弹窗
+
+```vue
+<YouyuButton
+  type="primary"
+  rounded
+  data-toggle="layer"
+  data-layer-title="示例弹窗"
+  data-layer-url="#"
+>
+  打开弹窗
+</YouyuButton>
+```
+
+## 项目开发
+
+### 安装依赖
+
+```sh
+pnpm install
+```
+
+### 开发模式
+
+```sh
+pnpm dev
+```
+
+### 构建生产版本
+
+```sh
+pnpm build
+```
+
+## 许可证
+
+MIT

package/dist/App.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/HelloWorld.vue.d.ts

@@ -0,0 +1,6 @@
+type __VLS_Props = {
+    msg: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/TheWelcome.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/WelcomeItem.vue.d.ts

@@ -0,0 +1,17 @@
+declare var __VLS_1: {}, __VLS_3: {}, __VLS_5: {};
+type __VLS_Slots = {} & {
+    icon?: (props: typeof __VLS_1) => any;
+} & {
+    heading?: (props: typeof __VLS_3) => any;
+} & {
+    default?: (props: typeof __VLS_5) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/YouyuButton.vue.d.ts

@@ -0,0 +1,44 @@
+import "../youyu-button/css/button.css";
+import type { Props } from "../types";
+declare global {
+    interface Window {
+        MyUI?: {
+            Button?: {
+                showMessage: (message: string, type?: string) => void;
+                showConfirm: (message: string, onConfirm?: () => void, onCancel?: () => void) => void;
+                openLayer: (title: string, url: string, id?: string, width?: string) => void;
+                init: () => void;
+            };
+        };
+    }
+}
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    click: (event: MouseEvent) => any;
+}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    onClick?: ((event: MouseEvent) => any) | undefined;
+}>, {
+    type: import("../types").ButtonType;
+    size: import("../types").ButtonSize;
+    rounded: boolean;
+    active: boolean;
+    disabled: boolean;
+    className: string;
+    dataToggle: string;
+    dataMessage: string;
+    dataType: string;
+    dataConfirmMessage: string;
+    dataLayerTitle: string;
+    dataLayerUrl: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/icons/IconCommunity.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/icons/IconDocumentation.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/icons/IconEcosystem.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/icons/IconSupport.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/icons/IconTooling.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/main.css

@@ -0,0 +1 @@
+.container{max-width:1200px;margin:0 auto;padding:20px;font-family:Arial,Microsoft YaHei,sans-serif}.button-group{margin-bottom:30px;display:flex;gap:10px;flex-wrap:wrap}h1{color:#333;border-bottom:1px solid #eee;padding-bottom:10px;margin-bottom:30px}h2{color:#666;margin-top:40px;margin-bottom:20px;font-size:18px}.btn{display:inline-block;box-sizing:border-box;cursor:pointer;text-align:center;font-weight:400;white-space:nowrap;vertical-align:middle;border:solid 1px #ddd;background-color:#fff;width:auto;text-decoration:none;transition:background-color .1s linear,border-color .1s linear}.btn{font-size:14px;height:31px;line-height:1.42857;padding:4px 12px}a.btn{line-height:21px}.btn.size-MINI{font-size:12px;height:23px;padding:1px 4px;line-height:1.42857}a.btn.size-MINI{line-height:21px}.btn.size-S{font-size:12px;height:27px;padding:3px 8px;line-height:1.42857}a.btn.size-S{line-height:19px}.btn.size-L{font-size:16px;height:41px;padding:8px 16px;line-height:1.42857}a.btn.size-L{line-height:23px}.btn.size-XL{font-size:18px;height:48px;padding:10px 24px;line-height:1.42857}a.btn.size-XL{line-height:26px}.btn-default{background-color:#e6e6e6;border-color:#e6e6e6;color:#333}.btn-default:hover,.btn-default:focus,.btn-default:active,.btn-default.active{background-color:#c7c7c7;border-color:#c7c7c7;color:#333}.btn-primary{background-color:#5a98de;border-color:#5a98de;color:#fff}.btn-primary:hover,.btn-primary:focus,.btn-primary:active,.btn-primary.active{background-color:#0a6999;border-color:#0a6999;color:#fff}.btn-secondary{background-color:#3bb4f2;border-color:#3bb4f2;color:#fff}.btn-secondary:hover,.btn-secondary:focus,.btn-secondary:active,.btn-secondary.active{background-color:#0f9ae0;border-color:#0f9ae0;color:#fff}.btn-success{background-color:#5eb95e;border-color:#5eb95e;color:#fff}.btn-success:hover,.btn-success:focus,.btn-success:active,.btn-success.active{background-color:#429842;border-color:#429842;color:#fff}.btn-warning{background-color:#f37b1d;border-color:#f37b1d;color:#fff}.btn-warning:hover,.btn-warning:focus,.btn-warning:active,.btn-warning.active{background-color:#c85e0b;border-color:#c85e0b;color:#fff}.btn-danger{background-color:#dd514c;border-color:#dd514c;color:#fff}.btn-danger:hover,.btn-danger:focus,.btn-danger:active,.btn-danger.active{background-color:#c62b26;border-color:#c62b26;color:#fff}.btn-info{background-color:#4990e2;border-color:#4990e2;color:#fff}.btn-info:hover,.btn-info:focus,.btn-info:active,.btn-info.active{background-color:#2873cc;border-color:#2873cc;color:#fff}.btn.radius{border-radius:4px}.btn.size-MINI.radius{border-radius:3px}.btn.size-L.radius{border-radius:5px}.btn.size-XL.radius{border-radius:6px}.btn:active,.btn.active{background-color:#ccc}.btn.active,.btn:active{box-shadow:0 1px 8px #00000020 inset}.btn.disabled,.btn[disabled]{cursor:not-allowed;opacity:.65;filter:alpha(opacity=65);pointer-events:none}.my-iconfont{margin-right:5px;font-style:normal}@media(max-width:767px){.button-group{flex-direction:column;gap:8px}.btn{width:100%;text-align:center}}

package/dist/main.d.ts

@@ -0,0 +1,76 @@
+import "./youyu-button/css/button.css";
+import YouyuButton from "./components/YouyuButton.vue";
+import type { App } from "vue";
+import * as types from "./types";
+declare const plugin: {
+    install(app: App): void;
+    YouyuButton: {
+        new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<types.Props> & Readonly<{
+            onClick?: ((event: MouseEvent) => any) | undefined;
+        }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+            click: (event: MouseEvent) => any;
+        }, import("vue").PublicProps, {
+            type: types.ButtonType;
+            size: types.ButtonSize;
+            rounded: boolean;
+            active: boolean;
+            disabled: boolean;
+            className: string;
+            dataToggle: string;
+            dataMessage: string;
+            dataType: string;
+            dataConfirmMessage: string;
+            dataLayerTitle: string;
+            dataLayerUrl: string;
+        }, false, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<types.Props> & Readonly<{
+            onClick?: ((event: MouseEvent) => any) | undefined;
+        }>, {}, {}, {}, {}, {
+            type: types.ButtonType;
+            size: types.ButtonSize;
+            rounded: boolean;
+            active: boolean;
+            disabled: boolean;
+            className: string;
+            dataToggle: string;
+            dataMessage: string;
+            dataType: string;
+            dataConfirmMessage: string;
+            dataLayerTitle: string;
+            dataLayerUrl: string;
+        }>;
+        __isFragment?: never;
+        __isTeleport?: never;
+        __isSuspense?: never;
+    } & import("vue").ComponentOptionsBase<Readonly<types.Props> & Readonly<{
+        onClick?: ((event: MouseEvent) => any) | undefined;
+    }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+        click: (event: MouseEvent) => any;
+    }, string, {
+        type: types.ButtonType;
+        size: types.ButtonSize;
+        rounded: boolean;
+        active: boolean;
+        disabled: boolean;
+        className: string;
+        dataToggle: string;
+        dataMessage: string;
+        dataType: string;
+        dataConfirmMessage: string;
+        dataLayerTitle: string;
+        dataLayerUrl: string;
+    }, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+        $slots: {
+            default?: (props: {}) => any;
+        };
+    });
+};
+export default plugin;
+export { YouyuButton };
+export * from "./types";

package/dist/types.d.ts

@@ -0,0 +1,18 @@
+export declare const ButtonType: readonly ["default", "primary", "secondary", "success", "warning", "danger", "info"];
+export type ButtonType = (typeof ButtonType)[number];
+export declare const ButtonSize: readonly ["MINI", "S", "M", "L", "XL"];
+export type ButtonSize = (typeof ButtonSize)[number];
+export interface Props {
+    type?: ButtonType;
+    size?: ButtonSize;
+    rounded?: boolean;
+    active?: boolean;
+    disabled?: boolean;
+    className?: string;
+    dataToggle?: string;
+    dataMessage?: string;
+    dataType?: string;
+    dataConfirmMessage?: string;
+    dataLayerTitle?: string;
+    dataLayerUrl?: string;
+}

package/dist/youyu-button.es.js

@@ -0,0 +1,197 @@
+import { defineComponent as b, createElementBlock as h, openBlock as p, normalizeClass as x, renderSlot as v } from "vue";
+const w = ["disabled", "data-toggle", "data-message", "data-type", "data-confirm-message", "data-layer-title", "data-layer-url"], B = /* @__PURE__ */ b({
+  __name: "YouyuButton",
+  props: {
+    type: { default: "default" },
+    size: { default: "M" },
+    rounded: { type: Boolean, default: !1 },
+    active: { type: Boolean, default: !1 },
+    disabled: { type: Boolean, default: !1 },
+    className: { default: "" },
+    dataToggle: { default: "" },
+    dataMessage: { default: "" },
+    dataType: { default: "" },
+    dataConfirmMessage: { default: "" },
+    dataLayerTitle: { default: "" },
+    dataLayerUrl: { default: "" }
+  },
+  emits: ["click"],
+  setup(t, { emit: r }) {
+    const i = t, l = r, u = (o) => {
+      i.disabled || l("click", o);
+    }, n = window.MyUI || {};
+    return n.Button = n.Button || {
+      /**
+       * 弹出提示信息
+       * @param message - 提示消息内容
+       * @param type - 提示类型 (success, error, warning, info)
+       */
+      showMessage: function(o, d = "info") {
+        const e = document.createElement("div");
+        e.className = `my-message my-message-${d}`, e.textContent = o, e.style.cssText = `
+      position: fixed;
+      top: 20px;
+      right: 20px;
+      padding: 10px 20px;
+      border-radius: 4px;
+      color: white;
+      z-index: 9999;
+      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+      transition: all 0.3s ease;
+      max-width: 300px;
+      word-wrap: break-word;
+    `;
+        const a = {
+          success: "#5eb95e",
+          error: "#dd514c",
+          warning: "#f37b1d",
+          info: "#5a98de"
+        }, s = a[d] || a.info;
+        e.style.backgroundColor = s, document.body.appendChild(e), setTimeout(() => {
+          e.style.opacity = "0", e.style.transform = "translateX(100%)", setTimeout(() => {
+            document.body.contains(e) && document.body.removeChild(e);
+          }, 300);
+        }, 3e3);
+      },
+      /**
+       * 弹出确认对话框
+       * @param {string} message - 确认消息内容
+       * @param {function} onConfirm - 确认回调函数
+       * @param {function} onCancel - 取消回调函数
+       */
+      showConfirm: function(o, d, e) {
+        const a = document.createElement("div");
+        a.className = "my-confirm-overlay", a.style.cssText = `
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background-color: rgba(0, 0, 0, 0.5);
+      z-index: 9998;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+    `;
+        const s = document.createElement("div");
+        s.className = "my-confirm-box", s.style.cssText = `
+      background-color: white;
+      border-radius: 4px;
+      padding: 20px;
+      width: 400px;
+      max-width: 90%;
+      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+    `, s.innerHTML = `
+      <div class="my-confirm-content">${o}</div>
+      <div class="my-confirm-buttons" style="text-align: right; margin-top: 20px;">
+        <button class="btn btn-default radius" style="margin-right: 10px;">取消</button>
+        <button class="btn btn-primary radius">确认</button>
+      </div>
+    `, a.appendChild(s), document.body.appendChild(a);
+        const m = s.querySelector(
+          ".btn-default"
+        ), y = s.querySelector(
+          ".btn-primary"
+        );
+        m.addEventListener("click", () => {
+          document.body.removeChild(a), e && e();
+        }), y.addEventListener("click", () => {
+          document.body.removeChild(a), d && d();
+        }), a.addEventListener("click", (f) => {
+          f.target === a && (document.body.removeChild(a), e && e());
+        });
+        const c = (f) => {
+          f.key === "Escape" && (document.body.contains(a) && (document.body.removeChild(a), e && e()), document.removeEventListener("keydown", c));
+        };
+        document.addEventListener("keydown", c);
+      },
+      /**
+       * 模拟打开弹窗功能
+       * @param {string} title - 弹窗标题
+       * @param {string} url - 弹窗内容URL
+       * @param {string} id - 弹窗ID
+       * @param {string} width - 弹窗宽度
+       */
+      openLayer: function(o, d, e, a) {
+        this.showMessage("打开弹窗：" + o, "info"), console.log("打开弹窗参数：", { title: o, url: d, id: e, width: a });
+      },
+      /**
+       * 初始化按钮组件
+       */
+      init: function() {
+        document.querySelectorAll(
+          "button[data-toggle], a.btn[data-toggle]"
+        ).forEach((d) => {
+          d.addEventListener("click", function() {
+            const e = this.getAttribute("data-toggle"), a = this.getAttribute("data-message") || "操作成功", s = this.getAttribute("data-type") || "success";
+            if (n.Button)
+              switch (e) {
+                case "message":
+                  n.Button.showMessage(a, s);
+                  break;
+                case "confirm":
+                  const m = this.getAttribute("data-confirm-message") || "确定要执行此操作吗？";
+                  n.Button.showConfirm(m, () => {
+                    n.Button && n.Button.showMessage(a, s);
+                  });
+                  break;
+                case "layer":
+                  const y = this.getAttribute("data-layer-title") || "弹窗", c = this.getAttribute("data-layer-url") || "#";
+                  n.Button.openLayer(y, c);
+                  break;
+              }
+          });
+        });
+      }
+    }, window.MyUI = n, typeof window < "u" && n && n.Button && (document.readyState === "loading" ? document.addEventListener("DOMContentLoaded", () => {
+      n.Button.init();
+    }) : n.Button.init()), (o, d) => (p(), h("button", {
+      class: x([
+        "btn",
+        `btn-${t.type}`,
+        t.size ? `size-${t.size}` : "",
+        { radius: t.rounded },
+        { active: t.active },
+        { disabled: t.disabled },
+        t.className
+      ]),
+      disabled: t.disabled,
+      onClick: u,
+      "data-toggle": t.dataToggle,
+      "data-message": t.dataMessage,
+      "data-type": t.dataType,
+      "data-confirm-message": t.dataConfirmMessage,
+      "data-layer-title": t.dataLayerTitle,
+      "data-layer-url": t.dataLayerUrl
+    }, [
+      v(o.$slots, "default", {}, void 0, !0)
+    ], 10, w));
+  }
+}), k = (t, r) => {
+  const i = t.__vccOpts || t;
+  for (const [l, u] of r)
+    i[l] = u;
+  return i;
+}, g = /* @__PURE__ */ k(B, [["__scopeId", "data-v-fcc077ad"]]), M = [
+  "default",
+  "primary",
+  "secondary",
+  "success",
+  "warning",
+  "danger",
+  "info"
+], E = ["MINI", "S", "M", "L", "XL"], T = {
+  // 安装方法
+  install(t) {
+    t.component("YouyuButton", g);
+  },
+  // 导出组件
+  YouyuButton: g
+};
+export {
+  E as ButtonSize,
+  M as ButtonType,
+  g as YouyuButton,
+  T as default
+};
+//# sourceMappingURL=youyu-button.es.js.map

package/dist/youyu-button.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"youyu-button.es.js","sources":["../src/components/YouyuButton.vue","../src/types.ts","../src/main.ts"],"sourcesContent":["<template>\n  <button\n    :class=\"[\n      'btn',\n      `btn-${type}`,\n      size ? `size-${size}` : '',\n      { radius: rounded },\n      { active },\n      { disabled },\n      className,\n    ]\"\n    :disabled=\"disabled\"\n    @click=\"handleClick\"\n    :data-toggle=\"dataToggle\"\n    :data-message=\"dataMessage\"\n    :data-type=\"dataType\"\n    :data-confirm-message=\"dataConfirmMessage\"\n    :data-layer-title=\"dataLayerTitle\"\n    :data-layer-url=\"dataLayerUrl\"\n  >\n    <slot></slot>\n  </button>\n</template>\n\n<script setup lang=\"ts\">\nimport \"../youyu-button/css/button.css\";\nimport type { Props } from \"../types\";\n\n// 定义组件属性\nconst props = withDefaults(defineProps<Props>(), {\n  type: \"default\",\n  size: \"M\",\n  rounded: false,\n  active: false,\n  disabled: false,\n  className: \"\",\n  dataToggle: \"\",\n  dataMessage: \"\",\n  dataType: \"\",\n  dataConfirmMessage: \"\",\n  dataLayerTitle: \"\",\n  dataLayerUrl: \"\",\n});\n\n// 定义组件事件\nconst emit = defineEmits<{\n  (e: \"click\", event: MouseEvent): void;\n}>();\n\n// 处理点击事件\nconst handleClick = (event: MouseEvent) => {\n  if (props.disabled) return;\n  emit(\"click\", event);\n};\n\n// 扩展Window接口\ndeclare global {\n  interface Window {\n    MyUI?: {\n      Button?: {\n        showMessage: (message: string, type?: string) => void;\n        showConfirm: (\n          message: string,\n          onConfirm?: () => void,\n          onCancel?: () => void\n        ) => void;\n        openLayer: (\n          title: string,\n          url: string,\n          id?: string,\n          width?: string\n        ) => void;\n        init: () => void;\n      };\n    };\n  }\n}\n\n// 按钮命名空间\nconst MyUI = window.MyUI || {};\n\n// 确保MyUI.Button存在\nMyUI.Button = MyUI.Button || {\n  /**\n   * 弹出提示信息\n   * @param message - 提示消息内容\n   * @param type - 提示类型 (success, error, warning, info)\n   */\n  showMessage: function (message: string, type: string = \"info\") {\n    // 创建提示元素\n    const messageElement = document.createElement(\"div\");\n    messageElement.className = `my-message my-message-${type}`;\n    messageElement.textContent = message;\n    messageElement.style.cssText = `\n      position: fixed;\n      top: 20px;\n      right: 20px;\n      padding: 10px 20px;\n      border-radius: 4px;\n      color: white;\n      z-index: 9999;\n      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n      transition: all 0.3s ease;\n      max-width: 300px;\n      word-wrap: break-word;\n    `;\n\n    // 根据类型设置背景色\n    const colors: Record<string, string> = {\n      success: \"#5eb95e\",\n      error: \"#dd514c\",\n      warning: \"#f37b1d\",\n      info: \"#5a98de\",\n    };\n    const bgColor = colors[type] || colors.info;\n    messageElement.style.backgroundColor = bgColor as string;\n\n    // 添加到页面\n    document.body.appendChild(messageElement);\n\n    // 3秒后自动移除\n    setTimeout(() => {\n      messageElement.style.opacity = \"0\";\n      messageElement.style.transform = \"translateX(100%)\";\n      setTimeout(() => {\n        if (document.body.contains(messageElement)) {\n          document.body.removeChild(messageElement);\n        }\n      }, 300);\n    }, 3000);\n  },\n\n  /**\n   * 弹出确认对话框\n   * @param {string} message - 确认消息内容\n   * @param {function} onConfirm - 确认回调函数\n   * @param {function} onCancel - 取消回调函数\n   */\n  showConfirm: function (\n    message: string,\n    onConfirm?: () => void,\n    onCancel?: () => void\n  ) {\n    // 创建遮罩层\n    const overlay = document.createElement(\"div\");\n    overlay.className = \"my-confirm-overlay\";\n    overlay.style.cssText = `\n      position: fixed;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      background-color: rgba(0, 0, 0, 0.5);\n      z-index: 9998;\n      display: flex;\n      justify-content: center;\n      align-items: center;\n    `;\n\n    // 创建确认框\n    const confirmBox = document.createElement(\"div\");\n    confirmBox.className = \"my-confirm-box\";\n    confirmBox.style.cssText = `\n      background-color: white;\n      border-radius: 4px;\n      padding: 20px;\n      width: 400px;\n      max-width: 90%;\n      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n    `;\n\n    // 确认框内容\n    confirmBox.innerHTML = `\n      <div class=\"my-confirm-content\">${message}</div>\n      <div class=\"my-confirm-buttons\" style=\"text-align: right; margin-top: 20px;\">\n        <button class=\"btn btn-default radius\" style=\"margin-right: 10px;\">取消</button>\n        <button class=\"btn btn-primary radius\">确认</button>\n      </div>\n    `;\n\n    // 添加到页面\n    overlay.appendChild(confirmBox);\n    document.body.appendChild(overlay);\n\n    // 绑定事件\n    const cancelBtn = confirmBox.querySelector(\n      \".btn-default\"\n    ) as HTMLButtonElement;\n    const confirmBtn = confirmBox.querySelector(\n      \".btn-primary\"\n    ) as HTMLButtonElement;\n\n    // 取消按钮事件\n    cancelBtn.addEventListener(\"click\", () => {\n      document.body.removeChild(overlay);\n      if (onCancel) {\n        onCancel();\n      }\n    });\n\n    // 确认按钮事件\n    confirmBtn.addEventListener(\"click\", () => {\n      document.body.removeChild(overlay);\n      if (onConfirm) {\n        onConfirm();\n      }\n    });\n\n    // 点击遮罩层关闭\n    overlay.addEventListener(\"click\", (e) => {\n      if (e.target === overlay) {\n        document.body.removeChild(overlay);\n        if (onCancel) {\n          onCancel();\n        }\n      }\n    });\n\n    // ESC键关闭\n    const handleEscKey = (e: KeyboardEvent) => {\n      if (e.key === \"Escape\") {\n        if (document.body.contains(overlay)) {\n          document.body.removeChild(overlay);\n          if (onCancel) {\n            onCancel();\n          }\n        }\n        document.removeEventListener(\"keydown\", handleEscKey);\n      }\n    };\n    document.addEventListener(\"keydown\", handleEscKey);\n  },\n\n  /**\n   * 模拟打开弹窗功能\n   * @param {string} title - 弹窗标题\n   * @param {string} url - 弹窗内容URL\n   * @param {string} id - 弹窗ID\n   * @param {string} width - 弹窗宽度\n   */\n  openLayer: function (\n    title: string,\n    url: string,\n    id?: string,\n    width?: string\n  ) {\n    // 这里只是简单的模拟，实际项目中可能需要更复杂的实现\n    this.showMessage(\"打开弹窗：\" + title, \"info\");\n    console.log(\"打开弹窗参数：\", { title, url, id, width });\n  },\n\n  /**\n   * 初始化按钮组件\n   */\n  init: function () {\n    // 为所有带有data-toggle属性的按钮添加事件监听\n    const buttons = document.querySelectorAll(\n      \"button[data-toggle], a.btn[data-toggle]\"\n    );\n\n    buttons.forEach((button) => {\n      button.addEventListener(\"click\", function (this: any) {\n        const toggleType = this.getAttribute(\"data-toggle\");\n        const message = this.getAttribute(\"data-message\") || \"操作成功\";\n        const type = this.getAttribute(\"data-type\") || \"success\";\n\n        if (!MyUI.Button) return;\n\n        switch (toggleType) {\n          case \"message\":\n            MyUI.Button.showMessage(message, type);\n            break;\n          case \"confirm\":\n            const confirmMessage =\n              this.getAttribute(\"data-confirm-message\") ||\n              \"确定要执行此操作吗？\";\n            MyUI.Button.showConfirm(confirmMessage, () => {\n              if (MyUI.Button) {\n                MyUI.Button.showMessage(message, type);\n              }\n            });\n            break;\n          case \"layer\":\n            const layerTitle = this.getAttribute(\"data-layer-title\") || \"弹窗\";\n            const layerUrl = this.getAttribute(\"data-layer-url\") || \"#\";\n            MyUI.Button.openLayer(layerTitle, layerUrl);\n            break;\n        }\n      });\n    });\n  },\n};\n\n// 挂载到全局\nwindow.MyUI = MyUI;\n\n// 页面加载完成后初始化按钮组件\nif (typeof window !== \"undefined\" && MyUI && MyUI.Button) {\n  if (document.readyState === \"loading\") {\n    document.addEventListener(\"DOMContentLoaded\", () => {\n      MyUI.Button!.init();\n    });\n  } else {\n    MyUI.Button.init();\n  }\n}\n</script>\n\n<style scoped>\n/* 组件特定样式可以在这里添加 */\n</style>\n","// 按钮类型\nexport const ButtonType = [\n  \"default\",\n  \"primary\",\n  \"secondary\",\n  \"success\",\n  \"warning\",\n  \"danger\",\n  \"info\",\n] as const;\nexport type ButtonType = (typeof ButtonType)[number];\n\n// 按钮尺寸\nexport const ButtonSize = [\"MINI\", \"S\", \"M\", \"L\", \"XL\"] as const;\nexport type ButtonSize = (typeof ButtonSize)[number];\n\n// 按钮属性定义\nexport interface Props {\n  type?: ButtonType;\n  size?: ButtonSize;\n  rounded?: boolean;\n  active?: boolean;\n  disabled?: boolean;\n  className?: string;\n  dataToggle?: string;\n  dataMessage?: string;\n  dataType?: string;\n  dataConfirmMessage?: string;\n  dataLayerTitle?: string;\n  dataLayerUrl?: string;\n}","import \"./youyu-button/css/button.css\";\nimport YouyuButton from \"./components/YouyuButton.vue\";\nimport type { App } from \"vue\";\nimport * as types from \"./types\";\n\n// 定义插件类型\nconst plugin = {\n  // 安装方法\n  install(app: App) {\n    // 全局注册组件\n    app.component(\"YouyuButton\", YouyuButton);\n  },\n  // 导出组件\n  YouyuButton,\n};\n\n// 导出插件、组件和类型\nexport default plugin;\nexport { YouyuButton };\nexport * from \"./types\";\n\n// 开发环境下自动挂载（保持原有功能）\nif (import.meta.env.DEV) {\n  import(\"./assets/main.css\").then(() => {\n    import(\"vue\").then(({ createApp }) => {\n      import(\"./App.vue\").then(({ default: App }) => {\n        createApp(App).mount(\"#app\");\n      });\n    });\n  });\n}\n"],"names":["props","__props","emit","__emit","handleClick","event","MyUI","message","type","messageElement","colors","bgColor","onConfirm","onCancel","overlay","confirmBox","cancelBtn","confirmBtn","e","handleEscKey","title","url","id","width","button","toggleType","confirmMessage","layerTitle","layerUrl","_createElementBlock","_normalizeClass","_renderSlot","_ctx","ButtonType","ButtonSize","plugin","app","YouyuButton"],"mappings":"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"}

package/dist/youyu-button.umd.js

@@ -0,0 +1,39 @@
+(function(r,c){typeof exports=="object"&&typeof module<"u"?c(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],c):(r=typeof globalThis<"u"?globalThis:r||self,c(r.YouyuButton={},r.Vue))})(this,(function(r,c){"use strict";var h=document.createElement("style");h.textContent=`.container{max-width:1200px;margin:0 auto;padding:20px;font-family:Arial,Microsoft YaHei,sans-serif}.button-group{margin-bottom:30px;display:flex;gap:10px;flex-wrap:wrap}h1{color:#333;border-bottom:1px solid #eee;padding-bottom:10px;margin-bottom:30px}h2{color:#666;margin-top:40px;margin-bottom:20px;font-size:18px}.btn{display:inline-block;box-sizing:border-box;cursor:pointer;text-align:center;font-weight:400;white-space:nowrap;vertical-align:middle;border:solid 1px #ddd;background-color:#fff;width:auto;text-decoration:none;transition:background-color .1s linear,border-color .1s linear}.btn{font-size:14px;height:31px;line-height:1.42857;padding:4px 12px}a.btn{line-height:21px}.btn.size-MINI{font-size:12px;height:23px;padding:1px 4px;line-height:1.42857}a.btn.size-MINI{line-height:21px}.btn.size-S{font-size:12px;height:27px;padding:3px 8px;line-height:1.42857}a.btn.size-S{line-height:19px}.btn.size-L{font-size:16px;height:41px;padding:8px 16px;line-height:1.42857}a.btn.size-L{line-height:23px}.btn.size-XL{font-size:18px;height:48px;padding:10px 24px;line-height:1.42857}a.btn.size-XL{line-height:26px}.btn-default{background-color:#e6e6e6;border-color:#e6e6e6;color:#333}.btn-default:hover,.btn-default:focus,.btn-default:active,.btn-default.active{background-color:#c7c7c7;border-color:#c7c7c7;color:#333}.btn-primary{background-color:#5a98de;border-color:#5a98de;color:#fff}.btn-primary:hover,.btn-primary:focus,.btn-primary:active,.btn-primary.active{background-color:#0a6999;border-color:#0a6999;color:#fff}.btn-secondary{background-color:#3bb4f2;border-color:#3bb4f2;color:#fff}.btn-secondary:hover,.btn-secondary:focus,.btn-secondary:active,.btn-secondary.active{background-color:#0f9ae0;border-color:#0f9ae0;color:#fff}.btn-success{background-color:#5eb95e;border-color:#5eb95e;color:#fff}.btn-success:hover,.btn-success:focus,.btn-success:active,.btn-success.active{background-color:#429842;border-color:#429842;color:#fff}.btn-warning{background-color:#f37b1d;border-color:#f37b1d;color:#fff}.btn-warning:hover,.btn-warning:focus,.btn-warning:active,.btn-warning.active{background-color:#c85e0b;border-color:#c85e0b;color:#fff}.btn-danger{background-color:#dd514c;border-color:#dd514c;color:#fff}.btn-danger:hover,.btn-danger:focus,.btn-danger:active,.btn-danger.active{background-color:#c62b26;border-color:#c62b26;color:#fff}.btn-info{background-color:#4990e2;border-color:#4990e2;color:#fff}.btn-info:hover,.btn-info:focus,.btn-info:active,.btn-info.active{background-color:#2873cc;border-color:#2873cc;color:#fff}.btn.radius{border-radius:4px}.btn.size-MINI.radius{border-radius:3px}.btn.size-L.radius{border-radius:5px}.btn.size-XL.radius{border-radius:6px}.btn:active,.btn.active{background-color:#ccc}.btn.active,.btn:active{box-shadow:0 1px 8px #00000020 inset}.btn.disabled,.btn[disabled]{cursor:not-allowed;opacity:.65;filter:alpha(opacity=65);pointer-events:none}.my-iconfont{margin-right:5px;font-style:normal}@media(max-width:767px){.button-group{flex-direction:column;gap:8px}.btn{width:100%;text-align:center}}
+/*$vite$:1*/`,document.head.appendChild(h);const x=["disabled","data-toggle","data-message","data-type","data-confirm-message","data-layer-title","data-layer-url"],b=((e,u)=>{const s=e.__vccOpts||e;for(const[f,g]of u)s[f]=g;return s})(c.defineComponent({__name:"YouyuButton",props:{type:{default:"default"},size:{default:"M"},rounded:{type:Boolean,default:!1},active:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},className:{default:""},dataToggle:{default:""},dataMessage:{default:""},dataType:{default:""},dataConfirmMessage:{default:""},dataLayerTitle:{default:""},dataLayerUrl:{default:""}},emits:["click"],setup(e,{emit:u}){const s=e,f=u,g=a=>{s.disabled||f("click",a)},n=window.MyUI||{};return n.Button=n.Button||{showMessage:function(a,d="info"){const t=document.createElement("div");t.className=`my-message my-message-${d}`,t.textContent=a,t.style.cssText=`
+      position: fixed;
+      top: 20px;
+      right: 20px;
+      padding: 10px 20px;
+      border-radius: 4px;
+      color: white;
+      z-index: 9999;
+      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+      transition: all 0.3s ease;
+      max-width: 300px;
+      word-wrap: break-word;
+    `;const o={success:"#5eb95e",error:"#dd514c",warning:"#f37b1d",info:"#5a98de"},i=o[d]||o.info;t.style.backgroundColor=i,document.body.appendChild(t),setTimeout(()=>{t.style.opacity="0",t.style.transform="translateX(100%)",setTimeout(()=>{document.body.contains(t)&&document.body.removeChild(t)},300)},3e3)},showConfirm:function(a,d,t){const o=document.createElement("div");o.className="my-confirm-overlay",o.style.cssText=`
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background-color: rgba(0, 0, 0, 0.5);
+      z-index: 9998;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+    `;const i=document.createElement("div");i.className="my-confirm-box",i.style.cssText=`
+      background-color: white;
+      border-radius: 4px;
+      padding: 20px;
+      width: 400px;
+      max-width: 90%;
+      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+    `,i.innerHTML=`
+      <div class="my-confirm-content">${a}</div>
+      <div class="my-confirm-buttons" style="text-align: right; margin-top: 20px;">
+        <button class="btn btn-default radius" style="margin-right: 10px;">取消</button>
+        <button class="btn btn-primary radius">确认</button>
+      </div>
+    `,o.appendChild(i),document.body.appendChild(o);const p=i.querySelector(".btn-default"),m=i.querySelector(".btn-primary");p.addEventListener("click",()=>{document.body.removeChild(o),t&&t()}),m.addEventListener("click",()=>{document.body.removeChild(o),d&&d()}),o.addEventListener("click",y=>{y.target===o&&(document.body.removeChild(o),t&&t())});const l=y=>{y.key==="Escape"&&(document.body.contains(o)&&(document.body.removeChild(o),t&&t()),document.removeEventListener("keydown",l))};document.addEventListener("keydown",l)},openLayer:function(a,d,t,o){this.showMessage("打开弹窗："+a,"info"),console.log("打开弹窗参数：",{title:a,url:d,id:t,width:o})},init:function(){document.querySelectorAll("button[data-toggle], a.btn[data-toggle]").forEach(d=>{d.addEventListener("click",function(){const t=this.getAttribute("data-toggle"),o=this.getAttribute("data-message")||"操作成功",i=this.getAttribute("data-type")||"success";if(n.Button)switch(t){case"message":n.Button.showMessage(o,i);break;case"confirm":const p=this.getAttribute("data-confirm-message")||"确定要执行此操作吗？";n.Button.showConfirm(p,()=>{n.Button&&n.Button.showMessage(o,i)});break;case"layer":const m=this.getAttribute("data-layer-title")||"弹窗",l=this.getAttribute("data-layer-url")||"#";n.Button.openLayer(m,l);break}})})}},window.MyUI=n,typeof window<"u"&&n&&n.Button&&(document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>{n.Button.init()}):n.Button.init()),(a,d)=>(c.openBlock(),c.createElementBlock("button",{class:c.normalizeClass(["btn",`btn-${e.type}`,e.size?`size-${e.size}`:"",{radius:e.rounded},{active:e.active},{disabled:e.disabled},e.className]),disabled:e.disabled,onClick:g,"data-toggle":e.dataToggle,"data-message":e.dataMessage,"data-type":e.dataType,"data-confirm-message":e.dataConfirmMessage,"data-layer-title":e.dataLayerTitle,"data-layer-url":e.dataLayerUrl},[c.renderSlot(a.$slots,"default",{},void 0,!0)],10,x))}}),[["__scopeId","data-v-fcc077ad"]]),v=["default","primary","secondary","success","warning","danger","info"],w=["MINI","S","M","L","XL"],k={install(e){e.component("YouyuButton",b)},YouyuButton:b};r.ButtonSize=w,r.ButtonType=v,r.YouyuButton=b,r.default=k,Object.defineProperties(r,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));
+//# sourceMappingURL=youyu-button.umd.js.map

package/dist/youyu-button.umd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"youyu-button.umd.js","sources":["../src/components/YouyuButton.vue","../src/types.ts","../src/main.ts"],"sourcesContent":["<template>\n  <button\n    :class=\"[\n      'btn',\n      `btn-${type}`,\n      size ? `size-${size}` : '',\n      { radius: rounded },\n      { active },\n      { disabled },\n      className,\n    ]\"\n    :disabled=\"disabled\"\n    @click=\"handleClick\"\n    :data-toggle=\"dataToggle\"\n    :data-message=\"dataMessage\"\n    :data-type=\"dataType\"\n    :data-confirm-message=\"dataConfirmMessage\"\n    :data-layer-title=\"dataLayerTitle\"\n    :data-layer-url=\"dataLayerUrl\"\n  >\n    <slot></slot>\n  </button>\n</template>\n\n<script setup lang=\"ts\">\nimport \"../youyu-button/css/button.css\";\nimport type { Props } from \"../types\";\n\n// 定义组件属性\nconst props = withDefaults(defineProps<Props>(), {\n  type: \"default\",\n  size: \"M\",\n  rounded: false,\n  active: false,\n  disabled: false,\n  className: \"\",\n  dataToggle: \"\",\n  dataMessage: \"\",\n  dataType: \"\",\n  dataConfirmMessage: \"\",\n  dataLayerTitle: \"\",\n  dataLayerUrl: \"\",\n});\n\n// 定义组件事件\nconst emit = defineEmits<{\n  (e: \"click\", event: MouseEvent): void;\n}>();\n\n// 处理点击事件\nconst handleClick = (event: MouseEvent) => {\n  if (props.disabled) return;\n  emit(\"click\", event);\n};\n\n// 扩展Window接口\ndeclare global {\n  interface Window {\n    MyUI?: {\n      Button?: {\n        showMessage: (message: string, type?: string) => void;\n        showConfirm: (\n          message: string,\n          onConfirm?: () => void,\n          onCancel?: () => void\n        ) => void;\n        openLayer: (\n          title: string,\n          url: string,\n          id?: string,\n          width?: string\n        ) => void;\n        init: () => void;\n      };\n    };\n  }\n}\n\n// 按钮命名空间\nconst MyUI = window.MyUI || {};\n\n// 确保MyUI.Button存在\nMyUI.Button = MyUI.Button || {\n  /**\n   * 弹出提示信息\n   * @param message - 提示消息内容\n   * @param type - 提示类型 (success, error, warning, info)\n   */\n  showMessage: function (message: string, type: string = \"info\") {\n    // 创建提示元素\n    const messageElement = document.createElement(\"div\");\n    messageElement.className = `my-message my-message-${type}`;\n    messageElement.textContent = message;\n    messageElement.style.cssText = `\n      position: fixed;\n      top: 20px;\n      right: 20px;\n      padding: 10px 20px;\n      border-radius: 4px;\n      color: white;\n      z-index: 9999;\n      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n      transition: all 0.3s ease;\n      max-width: 300px;\n      word-wrap: break-word;\n    `;\n\n    // 根据类型设置背景色\n    const colors: Record<string, string> = {\n      success: \"#5eb95e\",\n      error: \"#dd514c\",\n      warning: \"#f37b1d\",\n      info: \"#5a98de\",\n    };\n    const bgColor = colors[type] || colors.info;\n    messageElement.style.backgroundColor = bgColor as string;\n\n    // 添加到页面\n    document.body.appendChild(messageElement);\n\n    // 3秒后自动移除\n    setTimeout(() => {\n      messageElement.style.opacity = \"0\";\n      messageElement.style.transform = \"translateX(100%)\";\n      setTimeout(() => {\n        if (document.body.contains(messageElement)) {\n          document.body.removeChild(messageElement);\n        }\n      }, 300);\n    }, 3000);\n  },\n\n  /**\n   * 弹出确认对话框\n   * @param {string} message - 确认消息内容\n   * @param {function} onConfirm - 确认回调函数\n   * @param {function} onCancel - 取消回调函数\n   */\n  showConfirm: function (\n    message: string,\n    onConfirm?: () => void,\n    onCancel?: () => void\n  ) {\n    // 创建遮罩层\n    const overlay = document.createElement(\"div\");\n    overlay.className = \"my-confirm-overlay\";\n    overlay.style.cssText = `\n      position: fixed;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      background-color: rgba(0, 0, 0, 0.5);\n      z-index: 9998;\n      display: flex;\n      justify-content: center;\n      align-items: center;\n    `;\n\n    // 创建确认框\n    const confirmBox = document.createElement(\"div\");\n    confirmBox.className = \"my-confirm-box\";\n    confirmBox.style.cssText = `\n      background-color: white;\n      border-radius: 4px;\n      padding: 20px;\n      width: 400px;\n      max-width: 90%;\n      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n    `;\n\n    // 确认框内容\n    confirmBox.innerHTML = `\n      <div class=\"my-confirm-content\">${message}</div>\n      <div class=\"my-confirm-buttons\" style=\"text-align: right; margin-top: 20px;\">\n        <button class=\"btn btn-default radius\" style=\"margin-right: 10px;\">取消</button>\n        <button class=\"btn btn-primary radius\">确认</button>\n      </div>\n    `;\n\n    // 添加到页面\n    overlay.appendChild(confirmBox);\n    document.body.appendChild(overlay);\n\n    // 绑定事件\n    const cancelBtn = confirmBox.querySelector(\n      \".btn-default\"\n    ) as HTMLButtonElement;\n    const confirmBtn = confirmBox.querySelector(\n      \".btn-primary\"\n    ) as HTMLButtonElement;\n\n    // 取消按钮事件\n    cancelBtn.addEventListener(\"click\", () => {\n      document.body.removeChild(overlay);\n      if (onCancel) {\n        onCancel();\n      }\n    });\n\n    // 确认按钮事件\n    confirmBtn.addEventListener(\"click\", () => {\n      document.body.removeChild(overlay);\n      if (onConfirm) {\n        onConfirm();\n      }\n    });\n\n    // 点击遮罩层关闭\n    overlay.addEventListener(\"click\", (e) => {\n      if (e.target === overlay) {\n        document.body.removeChild(overlay);\n        if (onCancel) {\n          onCancel();\n        }\n      }\n    });\n\n    // ESC键关闭\n    const handleEscKey = (e: KeyboardEvent) => {\n      if (e.key === \"Escape\") {\n        if (document.body.contains(overlay)) {\n          document.body.removeChild(overlay);\n          if (onCancel) {\n            onCancel();\n          }\n        }\n        document.removeEventListener(\"keydown\", handleEscKey);\n      }\n    };\n    document.addEventListener(\"keydown\", handleEscKey);\n  },\n\n  /**\n   * 模拟打开弹窗功能\n   * @param {string} title - 弹窗标题\n   * @param {string} url - 弹窗内容URL\n   * @param {string} id - 弹窗ID\n   * @param {string} width - 弹窗宽度\n   */\n  openLayer: function (\n    title: string,\n    url: string,\n    id?: string,\n    width?: string\n  ) {\n    // 这里只是简单的模拟，实际项目中可能需要更复杂的实现\n    this.showMessage(\"打开弹窗：\" + title, \"info\");\n    console.log(\"打开弹窗参数：\", { title, url, id, width });\n  },\n\n  /**\n   * 初始化按钮组件\n   */\n  init: function () {\n    // 为所有带有data-toggle属性的按钮添加事件监听\n    const buttons = document.querySelectorAll(\n      \"button[data-toggle], a.btn[data-toggle]\"\n    );\n\n    buttons.forEach((button) => {\n      button.addEventListener(\"click\", function (this: any) {\n        const toggleType = this.getAttribute(\"data-toggle\");\n        const message = this.getAttribute(\"data-message\") || \"操作成功\";\n        const type = this.getAttribute(\"data-type\") || \"success\";\n\n        if (!MyUI.Button) return;\n\n        switch (toggleType) {\n          case \"message\":\n            MyUI.Button.showMessage(message, type);\n            break;\n          case \"confirm\":\n            const confirmMessage =\n              this.getAttribute(\"data-confirm-message\") ||\n              \"确定要执行此操作吗？\";\n            MyUI.Button.showConfirm(confirmMessage, () => {\n              if (MyUI.Button) {\n                MyUI.Button.showMessage(message, type);\n              }\n            });\n            break;\n          case \"layer\":\n            const layerTitle = this.getAttribute(\"data-layer-title\") || \"弹窗\";\n            const layerUrl = this.getAttribute(\"data-layer-url\") || \"#\";\n            MyUI.Button.openLayer(layerTitle, layerUrl);\n            break;\n        }\n      });\n    });\n  },\n};\n\n// 挂载到全局\nwindow.MyUI = MyUI;\n\n// 页面加载完成后初始化按钮组件\nif (typeof window !== \"undefined\" && MyUI && MyUI.Button) {\n  if (document.readyState === \"loading\") {\n    document.addEventListener(\"DOMContentLoaded\", () => {\n      MyUI.Button!.init();\n    });\n  } else {\n    MyUI.Button.init();\n  }\n}\n</script>\n\n<style scoped>\n/* 组件特定样式可以在这里添加 */\n</style>\n","// 按钮类型\nexport const ButtonType = [\n  \"default\",\n  \"primary\",\n  \"secondary\",\n  \"success\",\n  \"warning\",\n  \"danger\",\n  \"info\",\n] as const;\nexport type ButtonType = (typeof ButtonType)[number];\n\n// 按钮尺寸\nexport const ButtonSize = [\"MINI\", \"S\", \"M\", \"L\", \"XL\"] as const;\nexport type ButtonSize = (typeof ButtonSize)[number];\n\n// 按钮属性定义\nexport interface Props {\n  type?: ButtonType;\n  size?: ButtonSize;\n  rounded?: boolean;\n  active?: boolean;\n  disabled?: boolean;\n  className?: string;\n  dataToggle?: string;\n  dataMessage?: string;\n  dataType?: string;\n  dataConfirmMessage?: string;\n  dataLayerTitle?: string;\n  dataLayerUrl?: string;\n}","import \"./youyu-button/css/button.css\";\nimport YouyuButton from \"./components/YouyuButton.vue\";\nimport type { App } from \"vue\";\nimport * as types from \"./types\";\n\n// 定义插件类型\nconst plugin = {\n  // 安装方法\n  install(app: App) {\n    // 全局注册组件\n    app.component(\"YouyuButton\", YouyuButton);\n  },\n  // 导出组件\n  YouyuButton,\n};\n\n// 导出插件、组件和类型\nexport default plugin;\nexport { YouyuButton };\nexport * from \"./types\";\n\n// 开发环境下自动挂载（保持原有功能）\nif (import.meta.env.DEV) {\n  import(\"./assets/main.css\").then(() => {\n    import(\"vue\").then(({ createApp }) => {\n      import(\"./App.vue\").then(({ default: App }) => {\n        createApp(App).mount(\"#app\");\n      });\n    });\n  });\n}\n"],"names":["props","__props","emit","__emit","handleClick","event","MyUI","message","type","messageElement","colors","bgColor","onConfirm","onCancel","overlay","confirmBox","cancelBtn","confirmBtn","e","handleEscKey","title","url","id","width","button","toggleType","confirmMessage","layerTitle","layerUrl","_createElementBlock","_normalizeClass","_renderSlot","_ctx","ButtonType","ButtonSize","plugin","app","YouyuButton"],"mappings":"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"}

package/package.json

@@ -0,0 +1,44 @@
+{
+  "name": "@zhaoren118/youyu-button",
+  "version": "0.0.1",
+  "private": false,
+  "type": "module",
+  "description": "A custom button component for Vue 3",
+  "license": "MIT",
+  "main": "dist/youyu-button.umd.js",
+  "module": "dist/youyu-button.es.js",
+  "exports": {
+    ".": {
+      "import": "./dist/youyu-button.es.js",
+      "require": "./dist/youyu-button.umd.js"
+    },
+    "./dist/main.css": "./dist/main.css"
+  },
+  "files": [
+    "dist"
+  ],
+  "engines": {
+    "node": "^20.19.0 || >=22.12.0"
+  },
+  "dependencies": {
+    "vue": "^3.5.26"
+  },
+  "devDependencies": {
+    "@tsconfig/node24": "^24.0.3",
+    "@types/node": "^24.10.4",
+    "@vitejs/plugin-vue": "^6.0.3",
+    "@vue/tsconfig": "^0.8.1",
+    "npm-run-all2": "^8.0.4",
+    "typescript": "~5.9.3",
+    "vite": "^7.3.0",
+    "vite-plugin-vue-devtools": "^8.0.5",
+    "vue-tsc": "^3.2.1"
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "run-p type-check \"build-only {@}\" --",
+    "preview": "vite preview",
+    "build-only": "vite build",
+    "type-check": "vue-tsc --build"
+  }
+}