yanzhi-ui 0.1.0 → 0.1.2

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

package/dist/yanzhi-ui.mjs

@@ -0,0 +1,60 @@
+var c = Object.defineProperty;
+var d = (o, t, s) => t in o ? c(o, t, { enumerable: !0, configurable: !0, writable: !0, value: s }) : o[t] = s;
+var l = (o, t, s) => d(o, typeof t != "symbol" ? t + "" : t, 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(o) {
+    class t {
+      constructor(e) {
+        l(this, "type");
+        l(this, "size");
+        l(this, "color");
+        l(this, "textColor");
+        l(this, "disabled");
+        l(this, "loading");
+        this.type = e.type || "default", this.size = e.size || "medium", this.color = e.color, this.textColor = e.textColor, this.disabled = e.disabled ?? !1, this.loading = e.loading ?? !1;
+      }
+      get classes() {
+        const e = ["i-button", this.type, this.size];
+        return this.disabled && e.push("disabled"), this.loading && e.push("loading"), e.join(" ");
+      }
+      get styles() {
+        return {
+          backgroundColor: this.color || "",
+          color: this.textColor || ""
+        };
+      }
+    }
+    const s = o, n = u(new t(s));
+    return (i, e) => (b(), h("button", {
+      class: m(n.classes),
+      style: f(n.styles),
+      disabled: n.disabled,
+      onClick: e[0] || (e[0] = (a) => i.$emit("click", a))
+    }, [
+      p(i.$slots, "default", {}, void 0, !0)
+    ], 14, y));
+  }
+}), _ = (o, t) => {
+  const s = o.__vccOpts || o;
+  for (const [n, i] of t)
+    s[n] = i;
+  return s;
+}, C = /* @__PURE__ */ _(g, [["__scopeId", "data-v-63e0e36c"]]), x = [C], z = (o) => {
+  x.forEach((t) => {
+    o.component(t.name || "", t);
+  });
+}, v = { install: z };
+export {
+  C as IButton,
+  v as default
+};

package/dist/yanzhi-ui.umd.js

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

package/package.json

@@ -1,11 +1,14 @@
 {
   "name": "yanzhi-ui",
   "private": false,
-  "version": "0.1.0",
+  "version": "0.1.2",
+  "types": "dist/yanzhi-ui.d.ts",
   "main": "dist/yanzhi-ui.umd.cjs",
   "module": "dist/yanzhi-ui.es.js",
-  "types": "dist/index.d.ts",
-  "files": ["dist", "src/packages"],
+  "files": [
+    "dist",
+    "src/packages"
+  ],
   "scripts": {
     "dev": "vite",
     "build": "vite build"
@@ -14,9 +17,10 @@
     "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"
   }
 }

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,15 @@
-export { default as IButton } from './button/Button.vue'
+import type { App } from 'vue'
+import IButton from './button/Button.vue'
+
+const components = [IButton]
+
+const install = (app: App) => {
+  components.forEach(component => {
+    app.component(component.name || '', component)
+  })
+}
+
+// 支持按需导入
+export { IButton }
+
+export default { install }