@minto-ai/mini-ui 1.0.1

package/dist/index.d.ts

@@ -0,0 +1,12 @@
+import { App } from 'vue';
+import { MtLoading } from './loading';
+declare const _default: {
+    install: (app: App) => void;
+};
+export default _default;
+export { MtLoading, };
+declare module 'vue' {
+    interface GlobalComponents {
+        MtLoading: typeof MtLoading;
+    }
+}

package/dist/index.es.js

@@ -0,0 +1,130 @@
+import { isNumber, isString, isArray, multiply, divide, beParsedAsNumber, checkEmpty } from "@minto-ai/tools";
+import { defineComponent, computed, createElementBlock, openBlock, createElementVNode, createCommentVNode, normalizeStyle, normalizeClass, renderSlot, createTextVNode, toDisplayString } from "vue";
+const VALID_CSS_KEYWORD_REGEX = /^(?:fit-content|min-content|max-content|auto|inherit|initial|unset)$/;
+const NUMERIC_STRING_REGEX = /^\d+(?:\.\d+)?$/;
+const PIXEL_UNIT_STRING_REGEX = /^\d+(?:\.\d+)?px$/;
+const PERCENTAGE_STRING_REGEX = /^\d+(?:\.\d+)?%$/;
+const VIEWPORT_UNIT_STRING_REGEX = /^\d+(?:\.\d+)?(?:vw|vh)$/;
+const DESIGN_VIEWPORT_WIDTH_PIXELS = 375;
+function convertValueToViewportWidth(value) {
+  if (isNumber(value)) {
+    return convertSingleValueToViewportWidth(value);
+  }
+  if (isString(value)) {
+    return value.split(/\s+/).map((item) => convertSingleValueToViewportWidth(item)).join(" ");
+  }
+  if (isArray(value)) {
+    return value.map((item) => convertSingleValueToViewportWidth(item)).join(" ");
+  }
+  throw new Error(`Invalid CSS value: ${value}`);
+}
+function convertSingleValueToViewportWidth(value) {
+  if (isNumber(value)) {
+    return `${multiply(divide(value, DESIGN_VIEWPORT_WIDTH_PIXELS), 100)}vw`;
+  }
+  if (isString(value)) {
+    if (NUMERIC_STRING_REGEX.test(value)) {
+      return `${multiply(divide(beParsedAsNumber(value), DESIGN_VIEWPORT_WIDTH_PIXELS), 100)}vw`;
+    }
+    if (PIXEL_UNIT_STRING_REGEX.test(value)) {
+      return `${multiply(divide(beParsedAsNumber(value), DESIGN_VIEWPORT_WIDTH_PIXELS), 100)}vw`;
+    }
+    if (VALID_CSS_KEYWORD_REGEX.test(value)) {
+      return value;
+    }
+    if (PERCENTAGE_STRING_REGEX.test(value)) {
+      return value;
+    }
+    if (VIEWPORT_UNIT_STRING_REGEX.test(value)) {
+      return value;
+    }
+  }
+  throw new Error(`Invalid CSS value: ${value}`);
+}
+function withInstall(component) {
+  component.install = (app) => {
+    const { name } = component;
+    app.component(name, component);
+  };
+  return component;
+}
+const loadingProps = {
+  /**
+   * 加载动画的类型
+   */
+  type: {
+    type: String,
+    validator: (value) => {
+      return ["spinner"].includes(value);
+    },
+    default: "spinner"
+  },
+  /**
+   * 加载动画的大小
+   */
+  size: {
+    type: Number,
+    default: 42
+  },
+  /**
+   * 加载时显示的文本
+   */
+  text: {
+    type: String,
+    default: ""
+  }
+};
+const _hoisted_1 = { class: "mt-loading" };
+const _hoisted_2 = {
+  key: 0,
+  class: "mt-loading__text"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "MtLoading"
+  },
+  __name: "loading",
+  props: loadingProps,
+  setup(__props) {
+    const props = __props;
+    const iconClass = computed(() => {
+      const classes = [];
+      classes.push(`mt-loading__icon`);
+      classes.push(`mt-loading__icon--${props.type}`);
+      return classes;
+    });
+    const iconStyles = computed(() => {
+      const styles = {};
+      if (!checkEmpty(props.size)) {
+        styles["--mt-loading-size"] = convertValueToViewportWidth(props.size);
+      }
+      return styles;
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", {
+          class: normalizeClass(iconClass.value),
+          style: normalizeStyle(iconStyles.value)
+        }, null, 6),
+        props.text || _ctx.$slots.default ? (openBlock(), createElementBlock("div", _hoisted_2, [
+          renderSlot(_ctx.$slots, "default", {}, () => [
+            createTextVNode(toDisplayString(props.text), 1)
+          ])
+        ])) : createCommentVNode("", true)
+      ]);
+    };
+  }
+});
+const MtLoading = withInstall(_sfc_main);
+const components = [
+  MtLoading
+];
+const index = {
+  install: (app) => {
+    components.forEach((component) => app.use(component));
+  }
+};
+export {
+  MtLoading,
+  index as default
+};

package/dist/loading/index.d.ts

@@ -0,0 +1,72 @@
+export declare const MtLoading: {
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+        readonly type: {
+            readonly type: import('vue').PropType<"spinner">;
+            readonly validator: (value: string) => boolean;
+            readonly default: "spinner";
+        };
+        readonly size: {
+            readonly type: NumberConstructor;
+            readonly default: 42;
+        };
+        readonly text: {
+            readonly type: StringConstructor;
+            readonly default: "";
+        };
+    }>> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
+        readonly type: "spinner";
+        readonly size: number;
+        readonly text: string;
+    }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, HTMLDivElement, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import('vue').ExtractPropTypes<{
+        readonly type: {
+            readonly type: import('vue').PropType<"spinner">;
+            readonly validator: (value: string) => boolean;
+            readonly default: "spinner";
+        };
+        readonly size: {
+            readonly type: NumberConstructor;
+            readonly default: 42;
+        };
+        readonly text: {
+            readonly type: StringConstructor;
+            readonly default: "";
+        };
+    }>> & Readonly<{}>, {}, {}, {}, {}, {
+        readonly type: "spinner";
+        readonly size: number;
+        readonly text: string;
+    }>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+    readonly type: {
+        readonly type: import('vue').PropType<"spinner">;
+        readonly validator: (value: string) => boolean;
+        readonly default: "spinner";
+    };
+    readonly size: {
+        readonly type: NumberConstructor;
+        readonly default: 42;
+    };
+    readonly text: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
+    readonly type: "spinner";
+    readonly size: number;
+    readonly text: string;
+}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+    $slots: {
+        default?(_: {}): any;
+    };
+}) & import('vue').Plugin;
+export default MtLoading;

package/dist/loading/src/loading.d.ts

@@ -0,0 +1,27 @@
+import { ExtractPropTypes, PropType } from 'vue';
+declare const loadingProps: {
+    /**
+     * 加载动画的类型
+     */
+    readonly type: {
+        readonly type: PropType<"spinner">;
+        readonly validator: (value: string) => boolean;
+        readonly default: "spinner";
+    };
+    /**
+     * 加载动画的大小
+     */
+    readonly size: {
+        readonly type: NumberConstructor;
+        readonly default: 42;
+    };
+    /**
+     * 加载时显示的文本
+     */
+    readonly text: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+};
+export type LoadingProps = ExtractPropTypes<typeof loadingProps>;
+export { loadingProps };

package/dist/loading/src/loading.vue.d.ts

@@ -0,0 +1,49 @@
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    readonly type: {
+        readonly type: import('vue').PropType<"spinner">;
+        readonly validator: (value: string) => boolean;
+        readonly default: "spinner";
+    };
+    readonly size: {
+        readonly type: NumberConstructor;
+        readonly default: 42;
+    };
+    readonly text: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    readonly type: {
+        readonly type: import('vue').PropType<"spinner">;
+        readonly validator: (value: string) => boolean;
+        readonly default: "spinner";
+    };
+    readonly size: {
+        readonly type: NumberConstructor;
+        readonly default: 42;
+    };
+    readonly text: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+}>> & Readonly<{}>, {
+    readonly type: "spinner";
+    readonly size: number;
+    readonly text: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+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/style.css

@@ -0,0 +1,34 @@
+.mt-loading {
+  position: relative;
+  display: inline-flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  font-size: inherit;
+}
+.mt-loading__icon--spinner {
+  box-sizing: border-box;
+  width: var(--mt-loading-size);
+  height: var(--mt-loading-size);
+  aspect-ratio: 1;
+  padding: 0.53vw;
+  line-height: var(--mt-loading-size);
+  background: #999;
+  border-radius: 50%;
+  mask: conic-gradient(rgba(0, 0, 0, 0) 10%, #000), linear-gradient(#000 0 0) content-box;
+  mask-composite: source-out;
+  mask-composite: subtract;
+  animation: mt-loading-spin 1s infinite linear;
+}
+.mt-loading__text {
+  display: inline-flex;
+  margin-top: 0.53vw;
+  font-size: 3.73vw;
+  color: #999;
+}
+
+@keyframes mt-loading-spin {
+  to {
+    transform: rotate(1turn);
+  }
+}

package/dist/utils/dom/index.d.ts

@@ -0,0 +1 @@
+export * from './unit';

package/dist/utils/dom/unit.d.ts

@@ -0,0 +1,5 @@
+/**
+ * 将数值转换为基于375px设计稿的vw单位
+ */
+declare function convertValueToViewportWidth(value: number | string | Array<number | string>): string;
+export { convertValueToViewportWidth, };

package/dist/utils/index.d.ts

@@ -0,0 +1,2 @@
+export * from './dom';
+export * from './vue';

package/dist/utils/vue/index.d.ts

@@ -0,0 +1 @@
+export * from './install';

package/dist/utils/vue/install.d.ts

@@ -0,0 +1,5 @@
+import { Plugin } from 'vue';
+type SFCWithInstall<T> = T & Plugin;
+declare function withInstall<T>(component: T): SFCWithInstall<T>;
+export declare function withInstallFunction<T>(fn: T, name: string): SFCWithInstall<T>;
+export { withInstall };

package/package.json

@@ -0,0 +1,27 @@
+{
+  "name": "@minto-ai/mini-ui",
+  "type": "module",
+  "version": "1.0.1",
+  "publishConfig": {
+    "access": "public"
+  },
+  "author": "",
+  "license": "ISC",
+  "keywords": [
+    "mini-ui",
+    "移动端UI组件库",
+    "vue3"
+  ],
+  "main": "./dist/index.umd.cjs",
+  "module": "./dist/index.es.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "vite build"
+  },
+  "peerDependencies": {
+    "vue": "^3.5.13"
+  }
+}