yanzhi-ui 0.1.0 → 0.1.3

package/dist/button/Button.vue.d.ts

@@ -0,0 +1,25 @@
+interface ButtonProps {
+    type?: 'default' | 'primary' | 'success' | 'warning' | 'error';
+    size?: 'small' | 'medium' | 'large';
+    color?: string;
+    textColor?: string;
+    disabled?: boolean;
+    loading?: boolean;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLButtonElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<ButtonProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<ButtonProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLButtonElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/index.d.ts

@@ -0,0 +1,7 @@
+import { App } from 'vue';
+import { default as IButton } from './button/Button.vue';
+export { IButton };
+declare const _default: {
+    install: (app: App) => void;
+};
+export default _default;

package/dist/yanzhi-ui.css

@@ -0,0 +1 @@
+.i-button[data-v-63e0e36c]{border-radius:4px;padding:0 12px;height:32px;border:none;cursor:pointer;transition:all .2s}.i-button.small[data-v-63e0e36c]{height:24px}.i-button.medium[data-v-63e0e36c]{height:32px}.i-button.large[data-v-63e0e36c]{height:40px}.i-button.disabled[data-v-63e0e36c]{cursor:not-allowed;opacity:.6}.i-button.loading[data-v-63e0e36c]{opacity:.8}

package/dist/yanzhi-ui.d.ts

@@ -0,0 +1,6 @@
+export * from './index'
+export {}
+import YanzhiUI from './index'
+export default YanzhiUI
+export * from './index'
+export {}

package/dist/yanzhi-ui.js

@@ -0,0 +1 @@
+"use strict";var c=Object.defineProperty;var u=(e,o,s)=>o in e?c(e,o,{enumerable:!0,configurable:!0,writable:!0,value:s}):e[o]=s;var l=(e,o,s)=>u(e,typeof o!="symbol"?o+"":o,s);Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("vue"),b=["disabled"],h=i.defineComponent({__name:"Button",props:{type:{},size:{},color:{},textColor:{},disabled:{type:Boolean},loading:{type:Boolean}},setup(e){class o{constructor(t){l(this,"type");l(this,"size");l(this,"color");l(this,"textColor");l(this,"disabled");l(this,"loading");this.type=t.type||"default",this.size=t.size||"medium",this.color=t.color,this.textColor=t.textColor,this.disabled=t.disabled??!1,this.loading=t.loading??!1}get classes(){const t=["i-button",this.type,this.size];return this.disabled&&t.push("disabled"),this.loading&&t.push("loading"),t.join(" ")}get styles(){return{backgroundColor:this.color||"",color:this.textColor||""}}}const s=e,n=i.reactive(new o(s));return(a,t)=>(i.openBlock(),i.createElementBlock("button",{class:i.normalizeClass(n.classes),style:i.normalizeStyle(n.styles),disabled:n.disabled,onClick:t[0]||(t[0]=r=>a.$emit("click",r))},[i.renderSlot(a.$slots,"default",{},void 0,!0)],14,b))}}),y=(e,o)=>{const s=e.__vccOpts||e;for(const[n,a]of o)s[n]=a;return s},d=y(h,[["__scopeId","data-v-63e0e36c"]]),f=e=>{e.component("IButton",d)},g={install:f};exports.IButton=d;exports.default=g;

package/dist/yanzhi-ui.mjs

@@ -0,0 +1,58 @@
+var d = Object.defineProperty;
+var c = (e, o, s) => o in e ? d(e, o, { enumerable: !0, configurable: !0, writable: !0, value: s }) : e[o] = s;
+var l = (e, o, s) => c(e, typeof o != "symbol" ? o + "" : o, s);
+import { defineComponent as r, reactive as u, createElementBlock as h, openBlock as b, normalizeStyle as f, normalizeClass as m, renderSlot as p } from "vue";
+const y = ["disabled"], g = /* @__PURE__ */ r({
+  __name: "Button",
+  props: {
+    type: {},
+    size: {},
+    color: {},
+    textColor: {},
+    disabled: { type: Boolean },
+    loading: { type: Boolean }
+  },
+  setup(e) {
+    class o {
+      constructor(t) {
+        l(this, "type");
+        l(this, "size");
+        l(this, "color");
+        l(this, "textColor");
+        l(this, "disabled");
+        l(this, "loading");
+        this.type = t.type || "default", this.size = t.size || "medium", this.color = t.color, this.textColor = t.textColor, this.disabled = t.disabled ?? !1, this.loading = t.loading ?? !1;
+      }
+      get classes() {
+        const t = ["i-button", this.type, this.size];
+        return this.disabled && t.push("disabled"), this.loading && t.push("loading"), t.join(" ");
+      }
+      get styles() {
+        return {
+          backgroundColor: this.color || "",
+          color: this.textColor || ""
+        };
+      }
+    }
+    const s = e, i = u(new o(s));
+    return (n, t) => (b(), h("button", {
+      class: m(i.classes),
+      style: f(i.styles),
+      disabled: i.disabled,
+      onClick: t[0] || (t[0] = (a) => n.$emit("click", a))
+    }, [
+      p(n.$slots, "default", {}, void 0, !0)
+    ], 14, y));
+  }
+}), _ = (e, o) => {
+  const s = e.__vccOpts || e;
+  for (const [i, n] of o)
+    s[i] = n;
+  return s;
+}, C = /* @__PURE__ */ _(g, [["__scopeId", "data-v-63e0e36c"]]), B = (e) => {
+  e.component("IButton", C);
+}, k = { install: B };
+export {
+  C as IButton,
+  k as default
+};

package/dist/yanzhi-ui.umd.js

@@ -0,0 +1 @@
+(function(e,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(e=typeof globalThis<"u"?globalThis:e||self,t(e.YanzhiUI={},e.Vue))})(this,(function(e,t){"use strict";var h=Object.defineProperty;var p=(e,t,n)=>t in e?h(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n;var s=(e,t,n)=>p(e,typeof t!="symbol"?t+"":t,n);const n=["disabled"],r=((i,c)=>{const a=i.__vccOpts||i;for(const[l,d]of c)a[l]=d;return a})(t.defineComponent({__name:"Button",props:{type:{},size:{},color:{},textColor:{},disabled:{type:Boolean},loading:{type:Boolean}},setup(i){class c{constructor(o){s(this,"type");s(this,"size");s(this,"color");s(this,"textColor");s(this,"disabled");s(this,"loading");this.type=o.type||"default",this.size=o.size||"medium",this.color=o.color,this.textColor=o.textColor,this.disabled=o.disabled??!1,this.loading=o.loading??!1}get classes(){const o=["i-button",this.type,this.size];return this.disabled&&o.push("disabled"),this.loading&&o.push("loading"),o.join(" ")}get styles(){return{backgroundColor:this.color||"",color:this.textColor||""}}}const a=i,l=t.reactive(new c(a));return(d,o)=>(t.openBlock(),t.createElementBlock("button",{class:t.normalizeClass(l.classes),style:t.normalizeStyle(l.styles),disabled:l.disabled,onClick:o[0]||(o[0]=f=>d.$emit("click",f))},[t.renderSlot(d.$slots,"default",{},void 0,!0)],14,n))}}),[["__scopeId","data-v-63e0e36c"]]),u={install:i=>{i.component("IButton",r)}};e.IButton=r,e.default=u,Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));

package/package.json

@@ -1,11 +1,14 @@
 {
   "name": "yanzhi-ui",
   "private": false,
-  "version": "0.1.0",
-  "main": "dist/yanzhi-ui.umd.cjs",
-  "module": "dist/yanzhi-ui.es.js",
-  "types": "dist/index.d.ts",
-  "files": ["dist", "src/packages"],
+  "version": "0.1.3",
+  "types": "dist/yanzhi-ui.d.ts",
+  "main": "dist/yanzhi-ui.umd.js",
+  "module": "dist/yanzhi-ui.mjs",
+  "files": [
+    "dist",
+    "src/packages"
+  ],
   "scripts": {
     "dev": "vite",
     "build": "vite build"
@@ -14,9 +17,16 @@
     "vue": "^3.2.0"
   },
   "devDependencies": {
-    "vite": "^6.0.0",
     "@vitejs/plugin-vue": "^5.2.0",
-    "vue": "^3.2.0",
-    "typescript": "^5.1.0"
+    "typescript": "^5.1.0",
+    "vite": "^6.0.0",
+    "vite-plugin-dts": "^4.5.4",
+    "vue": "^3.2.0"
+  },
+  "exports": {
+    ".": {
+      "import": "./dist/yanzhi-ui.mjs",
+      "require": "./dist/yanzhi-ui.umd.js"
+    }
   }
 }

package/src/packages/button/Button.vue

@@ -1,8 +1,8 @@
 <template>
   <button
-    :class="buttonClass"
-    :style="{ backgroundColor: color, color: textColor }"
-    :disabled="disabled || loading"
+    :class="button.classes"
+    :style="button.styles"
+    :disabled="button.disabled"
     @click="$emit('click', $event)"
   >
     <slot />
@@ -10,7 +10,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue'
+import { reactive, computed, toRefs } from 'vue'
 
 interface ButtonProps {
   type?: 'default' | 'primary' | 'success' | 'warning' | 'error'
@@ -21,22 +21,41 @@ interface ButtonProps {
   loading?: boolean
 }
 
-const props = withDefaults(defineProps<ButtonProps>(), {
-  type: 'default',
-  size: 'medium',
-  disabled: false,
-  loading: false
-})
-
-const buttonClass = computed(() => {
-  const classes = ['i-button', props.type, props.size]
-  if (props.disabled) classes.push('disabled')
-  if (props.loading) classes.push('loading')
-  return classes.join(' ')
-})
-
-const color = computed(() => props.color || '')
-const textColor = computed(() => props.textColor || '')
+class Button {
+  type: ButtonProps['type']
+  size: ButtonProps['size']
+  color?: string
+  textColor?: string
+  disabled: boolean
+  loading: boolean
+
+  constructor(props: ButtonProps) {
+    this.type = props.type || 'default'
+    this.size = props.size || 'medium'
+    this.color = props.color
+    this.textColor = props.textColor
+    this.disabled = props.disabled ?? false
+    this.loading = props.loading ?? false
+  }
+
+  get classes() {
+    const cls = ['i-button', this.type, this.size]
+    if (this.disabled) cls.push('disabled')
+    if (this.loading) cls.push('loading')
+    return cls.join(' ')
+  }
+
+  get styles() {
+    return {
+      backgroundColor: this.color || '',
+      color: this.textColor || ''
+    }
+  }
+}
+
+const props = withDefaults(defineProps<ButtonProps>(), {})
+
+const button = reactive(new Button(props))
 </script>
 
 <style scoped>
@@ -46,6 +65,7 @@ const textColor = computed(() => props.textColor || '')
   height: 32px;
   border: none;
   cursor: pointer;
+  transition: all 0.2s;
 }
 .i-button.small { height: 24px; }
 .i-button.medium { height: 32px; }

package/src/packages/index.ts

@@ -1 +1,10 @@
-export { default as IButton } from './button/Button.vue'
+// packages/index.ts
+import type { App } from 'vue'
+import IButton from './button/Button.vue'
+
+const install = (app: App) => {
+  app.component('IButton', IButton)
+}
+
+export { IButton }
+export default { install }