npm - @xunsworld/element - Versions diffs - 1.0.0 - Mend

@xunsworld/element 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (12) hide show

package/README.md +48 -0
package/dist/es/favicon.ico +0 -0
package/dist/es/v-element.js +57 -0
package/dist/index.css +1 -0
package/dist/types/components/Button/Button.vue.d.ts +16 -0
package/dist/types/components/Button/index.d.ts +3 -0
package/dist/types/components/Button/type.d.ts +18 -0
package/dist/types/index.d.ts +8 -0
package/dist/umd/favicon.ico +0 -0
package/dist/umd/v-element.css +1 -0
package/dist/umd/v-element.umd.cjs +1 -0
package/package.json +81 -0

package/README.md ADDED Viewed

@@ -0,0 +1,48 @@
+# v-element
+This template should help get you started developing with Vue 3 in Vite.
+## Recommended IDE Setup
+[VS Code](https://code.visualstudio.com/) + [Vue (Official)](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur).
+## Recommended Browser Setup
+- Chromium-based browsers (Chrome, Edge, Brave, etc.):
+  - [Vue.js devtools](https://chromewebstore.google.com/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd)
+  - [Turn on Custom Object Formatter in Chrome DevTools](http://bit.ly/object-formatters)
+- Firefox:
+  - [Vue.js devtools](https://addons.mozilla.org/en-US/firefox/addon/vue-js-devtools/)
+  - [Turn on Custom Object Formatter in Firefox DevTools](https://fxdx.dev/firefox-devtools-custom-object-formatters/)
+## Type Support for `.vue` Imports in TS
+TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) to make the TypeScript language service aware of `.vue` types.
+## Customize configuration
+See [Vite Configuration Reference](https://vite.dev/config/).
+## Project Setup
+```sh
+npm install
+```
+### Compile and Hot-Reload for Development
+```sh
+npm run dev
+```
+### Type-Check, Compile and Minify for Production
+```sh
+npm run build
+```
+### Lint with [ESLint](https://eslint.org/)
+```sh
+npm run lint
+```

package/dist/es/favicon.ico ADDED Viewed

Binary file

package/dist/es/v-element.js ADDED Viewed

@@ -0,0 +1,57 @@
+import { defineComponent as a, ref as i, createElementBlock as s, openBlock as c, normalizeClass as u, createElementVNode as d, renderSlot as f } from "vue";
+const r = ["type", "autofocus", "disabled"], y = a({
+  name: "VkButton"
+}), n = /* @__PURE__ */ a({
+  ...y,
+  props: {
+    type: {},
+    size: {},
+    plain: { type: Boolean },
+    round: { type: Boolean },
+    circle: { type: Boolean },
+    disabled: { type: Boolean },
+    nativeType: { default: "button" },
+    autofocus: { type: Boolean },
+    icon: {},
+    loading: { type: Boolean }
+  },
+  setup(e, { expose: t }) {
+    const o = i();
+    return t({
+      ref: o
+    }), (l, B) => (c(), s("button", {
+      ref_key: "_ref",
+      ref: o,
+      type: e.nativeType,
+      autofocus: e.autofocus,
+      class: u(["vk-button", {
+        [`vk-button--${e.type}`]: e.type,
+        [`vk-button--${e.size}`]: e.size,
+        "is-plain": e.plain,
+        "is-round": e.round,
+        "is-circle": e.circle,
+        "is-disabled": e.disabled
+      }]),
+      disabled: e.disabled
+    }, [
+      d("span", null, [
+        f(l.$slots, "default")
+      ])
+    ], 10, r));
+  }
+});
+n.install = (e) => {
+  e.component(n.name, n);
+};
+const m = [n], b = (e) => {
+  m.forEach((t) => {
+    e.component(t.name, t);
+  });
+}, p = {
+  install: b
+};
+export {
+  n as Button,
+  p as default,
+  b as install
+};

package/dist/index.css ADDED Viewed

@@ -0,0 +1 @@

+ :root{--vk-color-white: #ffffff;--vk-color-black: #000000;--colors: ( primary: #409eff, success: #67c23a, warning: #e6a23c, danger: #f56c6c, info: #909399 );--vk-bg-color: #ffffff;--vk-bg-color-page: #f2f3f5;--vk-bg-color-overlay: #ffffff;--vk-text-color-primary: #303133;--vk-text-color-regular: #606266;--vk-text-color-secondary: #909399;--vk-text-color-placeholder: #a8abb2;--vk-text-color-disabled: #c0c4cc;--vk-border-color: #dcdfe6;--vk-border-color-light: #e4e7ed;--vk-border-color-lighter: #ebeef5;--vk-border-color-extra-light: #f2f6fc;--vk-border-color-dark: #d4d7de;--vk-border-color-darker: #cdd0d6;--vk-fill-color: #f0f2f5;--vk-fill-color-light: #f5f7fa;--vk-fill-color-lighter: #fafafa;--vk-fill-color-extra-light: #fafcff;--vk-fill-color-dark: #ebedf0;--vk-fill-color-darker: #e6e8eb;--vk-fill-color-blank: #ffffff;--vk-border-width: 1px;--vk-border-style: solid;--vk-border-color-hover: var(--vk-text-color-disabled);--vk-border: var(--vk-border-width) var(--vk-border-style) var(--vk-border-color);--vk-border-radius-base: 4px;--vk-border-radius-small: 2px;--vk-border-radius-round: 20px;--vk-border-radius-circle: 100%;--vk-font-size-extra-large: 20px;--vk-font-size-large: 18px;--vk-font-size-medium: 16px;--vk-font-size-base: 14px;--vk-font-size-small: 13px;--vk-font-size-extra-small: 12px;--vk-font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;--vk-font-weight-primary: 500;--vk-disabled-bg-color: var(--vk-fill-color-light);--vk-disabled-text-color: var(--vk-text-color-placeholder);--vk-disabled-border-color: var(--vk-border-color-light);--vk-transition-duration: .3s;--vk-transition-duration-fast: .2s;--vk-color-primary: #409eff ;--vk-color-primary-light-3: #79BBFF;--vk-color-primary-light-5: #A0CFFF;--vk-color-primary-light-7: #C6E2FF;--vk-color-primary-light-9: #ECF5FF;--vk-color-primary-light-8: #D9ECFF;--vk-color-primary-dark-2: #337ECC;--vk-color-success: #67c23a ;--vk-color-success-light-3: #95D475;--vk-color-success-light-5: #B3E19D;--vk-color-success-light-7: #D1EDC4;--vk-color-success-light-9: #F0F9EB;--vk-color-success-light-8: #E1F3D8;--vk-color-success-dark-2: #529B2E;--vk-color-warning: #e6a23c ;--vk-color-warning-light-3: #EEBE77;--vk-color-warning-light-5: #F3D19E;--vk-color-warning-light-7: #F8E3C5;--vk-color-warning-light-9: #FDF6EC;--vk-color-warning-light-8: #FAECD8;--vk-color-warning-dark-2: #B88230;--vk-color-danger: #f56c6c ;--vk-color-danger-light-3: #F89898;--vk-color-danger-light-5: #FAB6B6;--vk-color-danger-light-7: #FCD3D3;--vk-color-danger-light-9: #FEF0F0;--vk-color-danger-light-8: #FDE2E2;--vk-color-danger-dark-2: #C45656;--vk-color-info: #909399 ;--vk-color-info-light-3: #B1B3B8;--vk-color-info-light-5: #C8C9CC;--vk-color-info-light-7: #DEDFE0;--vk-color-info-light-9: #F4F4F5;--vk-color-info-light-8: #E9E9EB;--vk-color-info-dark-2: #73767A }body{font-family:var(--vk-font-family);font-weight:400;font-size:var(--vk-font-size-base);color:var(--vk-text-color-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent}a{color:var(--vk-color-primary);text-decoration:none}a:hover,a:focus{color:var(--vk-color-primary-light-3)}a:active{color:var(--vk-color-primary-dark-2)}h1,h2,h3,h4,h5,h6{color:var(--vk-text-color-regular);font-weight:inherit}h1:first-child,h2:first-child,h3:first-child,h4:first-child,h5:first-child,h6:first-child{margin-top:0}h1:last-child,h2:last-child,h3:last-child,h4:last-child,h5:last-child,h6:last-child{margin-bottom:0}h1{font-size:calc(var(--vk-font-size-base) + 6px)}h2{font-size:calc(var(--vk-font-size-base) + 4px)}h3{font-size:calc(var(--vk-font-size-base) + 2px)}h4,h5,h6,p{font-size:inherit}p{line-height:1.8}p:first-child{margin-top:0}p:last-child{margin-bottom:0}sup,sub{font-size:calc(var(--vk-font-size-base) - 1px)}small{font-size:calc(var(--vk-font-size-base) - 2px)}hr{margin-top:20px;margin-bottom:20px;border:0;border-top:1px solid var(--vk-border-color-lighter)}.vk-button{--vk-button-font-weight: var(--vk-font-weight-primary);--vk-button-border-color: var(--vk-border-color);--vk-button-bg-color: var(--vk-fill-color-blank);--vk-button-text-color: var(--vk-text-color-regular);--vk-button-disabled-text-color: var(--vk-disabled-text-color);--vk-button-disabled-bg-color: var(--vk-fill-color-blank);--vk-button-disabled-border-color: var(--vk-border-color-light);--vk-button-hover-text-color: var(--vk-color-primary);--vk-button-hover-bg-color: var(--vk-color-primary-light-9);--vk-button-hover-border-color: var(--vk-color-primary-light-7);--vk-button-active-text-color: var(--vk-button-hover-text-color);--vk-button-active-border-color: var(--vk-color-primary);--vk-button-active-bg-color: var(--vk-button-hover-bg-color);--vk-button-outline-color: var(--vk-color-primary-light-5);--vk-button-active-color: var(--vk-text-color-primary)}.vk-button{display:inline-flex;justify-content:center;align-items:center;line-height:1;height:32px;white-space:nowrap;cursor:pointer;color:var(--vk-button-text-color);text-align:center;box-sizing:border-box;outline:none;transition:.1s;font-weight:var(--vk-button-font-weight);-webkit-user-select:none;user-select:none;vertical-align:middle;-webkit-appearance:none;background-color:var(--vk-button-bg-color);border:var(--vk-border);border-color:var(--vk-button-border-color);padding:8px 15px;font-size:var(--vk-font-size-base);border-radius:var(--vk-border-radius-base)}.vk-button+.vk-button{margin-left:12px}.vk-button:hover,.vk-button:focus{color:var(--vk-button-hover-text-color);border-color:var(--vk-button-hover-border-color);background-color:var(--vk-button-hover-bg-color);outline:none}.vk-button:active{color:var(--vk-button-active-text-color);border-color:var(--vk-button-active-border-color);background-color:var(--vk-button-active-bg-color);outline:none}.vk-button.is-plain{--vk-button-hover-text-color: var(--vk-color-primary);--vk-button-hover-bg-color: var(--vk-fill-color-blank);--vk-button-hover-border-color: var(--vk-color-primary)}.vk-button.is-round{border-radius:var(--vk-border-radius-round)}.vk-button.is-circle{border-radius:50%;padding:8px}.vk-button.is-disabled,.vk-button.is-disabled:hover,.vk-button.is-disabled:focus,.vk-button[disabled],.vk-button[disabled]:hover,.vk-button[disabled]:focus{color:var(--vk-button-disabled-text-color);cursor:not-allowed;background-image:none;background-color:var(--vk-button-disabled-bg-color);border-color:var(--vk-button-disabled-border-color)}.vk-button [class*=vk-icon]+span{margin-left:6px}.vk-button--primary{--vk-button-text-color: var(--vk-color-white);--vk-button-bg-color: var(--vk-color-primary);--vk-button-border-color: var(--vk-color-primary);--vk-button-outline-color: var(--vk-color-primary-light-5);--vk-button-active-color: var(--vk-color-primary-dark-2);--vk-button-hover-text-color: var(--vk-color-white);--vk-button-hover-bg-color: var(--vk-color-primary-light-3);--vk-button-hover-border-color: var(--vk-color-primary-light-3);--vk-button-active-bg-color: var(--vk-color-primary-dark-2);--vk-button-active-border-color: var(--vk-color-primary-dark-2);--vk-button-disabled-text-color: var(--vk-color-white);--vk-button-disabled-bg-color: var(--vk-color-primary-light-5);--vk-button-disabled-border-color: var(--vk-color-primary-light-5)}.vk-button--primary.is-plain{--vk-button-text-color: var(--vk-color-primary);--vk-button-bg-color: var(--vk-color-primary-light-9);--vk-button-border-color: var(--vk-color-primary-light-5);--vk-button-hover-text-color: var(--vk-color-white);--vk-button-hover-bg-color: var(--vk-color-primary);--vk-button-hover-border-color: var(--vk-color-primary);--vk-button-active-text-color: var(--vk-color-white)}.vk-button--success{--vk-button-text-color: var(--vk-color-white);--vk-button-bg-color: var(--vk-color-success);--vk-button-border-color: var(--vk-color-success);--vk-button-outline-color: var(--vk-color-success-light-5);--vk-button-active-color: var(--vk-color-success-dark-2);--vk-button-hover-text-color: var(--vk-color-white);--vk-button-hover-bg-color: var(--vk-color-success-light-3);--vk-button-hover-border-color: var(--vk-color-success-light-3);--vk-button-active-bg-color: var(--vk-color-success-dark-2);--vk-button-active-border-color: var(--vk-color-success-dark-2);--vk-button-disabled-text-color: var(--vk-color-white);--vk-button-disabled-bg-color: var(--vk-color-success-light-5);--vk-button-disabled-border-color: var(--vk-color-success-light-5)}.vk-button--success.is-plain{--vk-button-text-color: var(--vk-color-success);--vk-button-bg-color: var(--vk-color-success-light-9);--vk-button-border-color: var(--vk-color-success-light-5);--vk-button-hover-text-color: var(--vk-color-white);--vk-button-hover-bg-color: var(--vk-color-success);--vk-button-hover-border-color: var(--vk-color-success);--vk-button-active-text-color: var(--vk-color-white)}.vk-button--warning{--vk-button-text-color: var(--vk-color-white);--vk-button-bg-color: var(--vk-color-warning);--vk-button-border-color: var(--vk-color-warning);--vk-button-outline-color: var(--vk-color-warning-light-5);--vk-button-active-color: var(--vk-color-warning-dark-2);--vk-button-hover-text-color: var(--vk-color-white);--vk-button-hover-bg-color: var(--vk-color-warning-light-3);--vk-button-hover-border-color: var(--vk-color-warning-light-3);--vk-button-active-bg-color: var(--vk-color-warning-dark-2);--vk-button-active-border-color: var(--vk-color-warning-dark-2);--vk-button-disabled-text-color: var(--vk-color-white);--vk-button-disabled-bg-color: var(--vk-color-warning-light-5);--vk-button-disabled-border-color: var(--vk-color-warning-light-5)}.vk-button--warning.is-plain{--vk-button-text-color: var(--vk-color-warning);--vk-button-bg-color: var(--vk-color-warning-light-9);--vk-button-border-color: var(--vk-color-warning-light-5);--vk-button-hover-text-color: var(--vk-color-white);--vk-button-hover-bg-color: var(--vk-color-warning);--vk-button-hover-border-color: var(--vk-color-warning);--vk-button-active-text-color: var(--vk-color-white)}.vk-button--info{--vk-button-text-color: var(--vk-color-white);--vk-button-bg-color: var(--vk-color-info);--vk-button-border-color: var(--vk-color-info);--vk-button-outline-color: var(--vk-color-info-light-5);--vk-button-active-color: var(--vk-color-info-dark-2);--vk-button-hover-text-color: var(--vk-color-white);--vk-button-hover-bg-color: var(--vk-color-info-light-3);--vk-button-hover-border-color: var(--vk-color-info-light-3);--vk-button-active-bg-color: var(--vk-color-info-dark-2);--vk-button-active-border-color: var(--vk-color-info-dark-2);--vk-button-disabled-text-color: var(--vk-color-white);--vk-button-disabled-bg-color: var(--vk-color-info-light-5);--vk-button-disabled-border-color: var(--vk-color-info-light-5)}.vk-button--info.is-plain{--vk-button-text-color: var(--vk-color-info);--vk-button-bg-color: var(--vk-color-info-light-9);--vk-button-border-color: var(--vk-color-info-light-5);--vk-button-hover-text-color: var(--vk-color-white);--vk-button-hover-bg-color: var(--vk-color-info);--vk-button-hover-border-color: var(--vk-color-info);--vk-button-active-text-color: var(--vk-color-white)}.vk-button--danger{--vk-button-text-color: var(--vk-color-white);--vk-button-bg-color: var(--vk-color-danger);--vk-button-border-color: var(--vk-color-danger);--vk-button-outline-color: var(--vk-color-danger-light-5);--vk-button-active-color: var(--vk-color-danger-dark-2);--vk-button-hover-text-color: var(--vk-color-white);--vk-button-hover-bg-color: var(--vk-color-danger-light-3);--vk-button-hover-border-color: var(--vk-color-danger-light-3);--vk-button-active-bg-color: var(--vk-color-danger-dark-2);--vk-button-active-border-color: var(--vk-color-danger-dark-2);--vk-button-disabled-text-color: var(--vk-color-white);--vk-button-disabled-bg-color: var(--vk-color-danger-light-5);--vk-button-disabled-border-color: var(--vk-color-danger-light-5)}.vk-button--danger.is-plain{--vk-button-text-color: var(--vk-color-danger);--vk-button-bg-color: var(--vk-color-danger-light-9);--vk-button-border-color: var(--vk-color-danger-light-5);--vk-button-hover-text-color: var(--vk-color-white);--vk-button-hover-bg-color: var(--vk-color-danger);--vk-button-hover-border-color: var(--vk-color-danger);--vk-button-active-text-color: var(--vk-color-white)}.vk-button--large{--vk-button-size: 40px;height:var(--vk-button-size);padding:12px 19px;font-size:var(--vk-font-size-base);border-radius:var(--vk-border-radius-base)}.vk-button--small{--vk-button-size: 24px;height:var(--vk-button-size);padding:5px 11px;font-size:12px;border-radius:calc(var(--vk-border-radius-base) - 1px)}

package/dist/types/components/Button/Button.vue.d.ts ADDED Viewed

@@ -0,0 +1,16 @@
+import { ButtonProps } from './type';
+declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<ButtonProps, {
+    ref: import('vue').Ref<HTMLButtonElement | undefined, HTMLButtonElement | undefined>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<ButtonProps> & Readonly<{}>, {
+    nativeType: import('./type').NativeType;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    _ref: HTMLButtonElement;
+}, HTMLButtonElement>, {
+    default?(_: {}): any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/components/Button/index.d.ts ADDED Viewed

@@ -0,0 +1,3 @@
+import { default as Button } from './Button.vue';
+export default Button;
+export * from './type';

package/dist/types/components/Button/type.d.ts ADDED Viewed

@@ -0,0 +1,18 @@
+export type ButtonType = 'primary' | 'success' | 'warning' | 'danger' | 'info';
+export type ButtonSize = 'large' | 'small';
+export type NativeType = 'button' | 'submit' | 'reset';
+export interface ButtonProps {
+    type?: ButtonType;
+    size?: ButtonSize;
+    plain?: boolean;
+    round?: boolean;
+    circle?: boolean;
+    disabled?: boolean;
+    nativeType?: NativeType;
+    autofocus?: boolean;
+    icon?: string;
+    loading?: boolean;
+}
+export interface ButtonInstance {
+    ref: HTMLButtonElement;
+}

package/dist/types/index.d.ts ADDED Viewed

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

package/dist/umd/favicon.ico ADDED Viewed

Binary file

package/dist/umd/v-element.css ADDED Viewed

@@ -0,0 +1 @@

package/dist/umd/v-element.umd.cjs ADDED Viewed

@@ -0,0 +1 @@

package/package.json ADDED Viewed

@@ -0,0 +1,81 @@
+{
+  "name": "@xunsworld/element",
+  "version": "1.0.0",
+  "description": "Vue3 component library",
+  "type": "module",
+  "author": "xunsworld",
+  "license": "MIT",
+  "keywords": [
+    "Component",
+    "UI",
+    "Vue3"
+  ],
+  "files": [
+    "dist"
+  ],
+  "sideEffects": ["dist/index.css"],
+  "main": "./dist/umd/v-element.umd.cjs",
+  "module": "./dist/es/v-element.js",
+  "types": "./dist/types/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/es/v-element.js",
+      "require": "./dist/umd/v-element.umd.cjs",
+      "types": "./dist/types/index.d.ts"
+    },
+    "./dist/":{
+      "import":"./dist/",
+      "require":"./dist/"
+    }
+  },
+  "engines": {
+    "node": "^20.19.0 || >=22.12.0"
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "npm run build-only && npm run move-style",
+    "preview": "vite preview",
+    "build:only": "vite build",
+    "build-only": "run-p build-umd build-es",
+    "build-umd": "vite build --config vite.umd.config.ts",
+    "build-es": "vite build --config vite.es.config.ts",
+    "move-style":"move-file dist/es/index.css dist/index.css",
+    "type-check": "vue-tsc --build",
+    "lint": "eslint . --fix --cache",
+    "docs:dev": "vitepress dev docs",
+    "docs:build": "vitepress build docs",
+    "docs:preview": "vitepress preview docs",
+    "prepublishOnly": "npm run build"
+  },
+  "dependencies": {
+  },
+  "peerDependencies": {
+    "vue": "^3.5.25"
+  },
+  "devDependencies": {
+    "@tsconfig/node24": "^24.0.3",
+    "@types/node": "^24.10.1",
+    "@vitejs/plugin-vue": "^6.0.2",
+    "@vitejs/plugin-vue-jsx": "^5.1.2",
+    "@vue/eslint-config-typescript": "^14.6.0",
+    "@vue/tsconfig": "^0.8.1",
+    "eslint": "^9.39.1",
+    "eslint-plugin-vue": "~10.5.1",
+    "jiti": "^2.6.1",
+    "move-file-cli": "^3.0.0",
+    "npm-run-all2": "^8.0.4",
+    "postcss-color-mix": "^1.1.0",
+    "postcss-each": "^1.1.0",
+    "postcss-each-variables": "^0.3.0",
+    "postcss-for": "^2.1.1",
+    "postcss-nested": "^7.0.2",
+    "typescript": "~5.9.0",
+    "vite": "^7.2.4",
+    "vite-plugin-dts": "^4.5.4",
+    "vite-plugin-vue-devtools": "^8.0.5",
+    "vitepress": "^1.6.4",
+    "vue": "^3.5.25",
+    "vue-tsc": "^3.1.5"
+  }
+}