@wlydfe/pro-ui 0.2.0

package/lib/components/check-card/src/index.vue.d.ts

@@ -0,0 +1,293 @@
+import type { VNode } from 'vue';
+import type { ComponentSize } from 'element-plus';
+import type { RecordType } from '@wlydfe/pro-ui-types';
+export interface PlusCheckCardProps {
+    modelValue?: boolean;
+    size?: ComponentSize;
+    avatar?: string | ((data: Pick<PlusCheckCardProps, 'avatar' | 'title' | 'description'>) => VNode | string);
+    avatarProps?: RecordType;
+    title?: string | ((data: Pick<PlusCheckCardProps, 'avatar' | 'title' | 'description'>) => VNode | string);
+    description?: string | ((data: Pick<PlusCheckCardProps, 'avatar' | 'title' | 'description'>) => VNode | string);
+    disabled?: boolean;
+    extra?: (data: Pick<PlusCheckCardProps, 'avatar' | 'title' | 'description'>) => VNode | string;
+}
+export interface PlusCheckCardEmits {
+    (e: 'update:modelValue', checked: boolean): void;
+    (e: 'change', checked: boolean): void;
+    (e: 'extra'): void;
+}
+export interface CheckCardState {
+    checked: boolean;
+}
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    modelValue: {
+        type: BooleanConstructor;
+        required: false;
+        default: boolean;
+    };
+    size: {
+        type: null;
+        required: false;
+        default: string;
+    };
+    avatar: {
+        type: (StringConstructor | FunctionConstructor)[];
+        required: false;
+        default: undefined;
+    };
+    avatarProps: {
+        type: null;
+        required: false;
+        default: () => {};
+    };
+    title: {
+        type: (StringConstructor | FunctionConstructor)[];
+        required: false;
+        default: undefined;
+    };
+    description: {
+        type: (StringConstructor | FunctionConstructor)[];
+        required: false;
+        default: undefined;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        required: false;
+        default: boolean;
+    };
+    extra: {
+        type: FunctionConstructor;
+        required: false;
+        default: undefined;
+    };
+}>, {
+    classDataEnum: Record<"default" | "small" | "large", string>;
+    props: any;
+    emit: (event: "update:modelValue" | "change" | "extra", ...args: any[]) => void;
+    state: CheckCardState;
+    getClass: () => any;
+    handleClick: () => void;
+    handelExtra: () => void;
+    readonly ElAvatar: {
+        new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("vue").ExtractPropTypes<{
+            readonly size: {
+                readonly type: import("vue").PropType<number | "" | "default" | "small" | "large">;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: "";
+            };
+            readonly shape: {
+                readonly type: import("vue").PropType<"circle" | "square">;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: "circle";
+            };
+            readonly icon: {
+                readonly type: import("vue").PropType<string | import("vue").Component>;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            };
+            readonly src: {
+                readonly type: import("vue").PropType<string>;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: "";
+            };
+            readonly alt: StringConstructor;
+            readonly srcSet: StringConstructor;
+            readonly fit: {
+                readonly type: import("vue").PropType<any>;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: "cover";
+            };
+        }>> & {
+            onError?: ((evt: Event) => any) | undefined;
+        }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+            error: (evt: Event) => void;
+        }, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, {
+            readonly size: number | "" | "default" | "small" | "large";
+            readonly shape: "circle" | "square";
+            readonly src: string;
+            readonly fit: any;
+        }, true, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<import("vue").ExtractPropTypes<{
+            readonly size: {
+                readonly type: import("vue").PropType<number | "" | "default" | "small" | "large">;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: "";
+            };
+            readonly shape: {
+                readonly type: import("vue").PropType<"circle" | "square">;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: "circle";
+            };
+            readonly icon: {
+                readonly type: import("vue").PropType<string | import("vue").Component>;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            };
+            readonly src: {
+                readonly type: import("vue").PropType<string>;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: "";
+            };
+            readonly alt: StringConstructor;
+            readonly srcSet: StringConstructor;
+            readonly fit: {
+                readonly type: import("vue").PropType<any>;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            } & {
+                readonly default: "cover";
+            };
+        }>> & {
+            onError?: ((evt: Event) => any) | undefined;
+        }, {}, {}, {}, {}, {
+            readonly size: number | "" | "default" | "small" | "large";
+            readonly shape: "circle" | "square";
+            readonly src: string;
+            readonly fit: any;
+        }>;
+        __isFragment?: undefined;
+        __isTeleport?: undefined;
+        __isSuspense?: undefined;
+    } & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+        readonly size: {
+            readonly type: import("vue").PropType<number | "" | "default" | "small" | "large">;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        } & {
+            readonly default: "";
+        };
+        readonly shape: {
+            readonly type: import("vue").PropType<"circle" | "square">;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        } & {
+            readonly default: "circle";
+        };
+        readonly icon: {
+            readonly type: import("vue").PropType<string | import("vue").Component>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        };
+        readonly src: {
+            readonly type: import("vue").PropType<string>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        } & {
+            readonly default: "";
+        };
+        readonly alt: StringConstructor;
+        readonly srcSet: StringConstructor;
+        readonly fit: {
+            readonly type: import("vue").PropType<any>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        } & {
+            readonly default: "cover";
+        };
+    }>> & {
+        onError?: ((evt: Event) => any) | undefined;
+    }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+        error: (evt: Event) => void;
+    }, string, {
+        readonly size: number | "" | "default" | "small" | "large";
+        readonly shape: "circle" | "square";
+        readonly src: string;
+        readonly fit: any;
+    }, {}, 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;
+    readonly isString: (val: any) => boolean;
+    readonly isFunction: (val: any) => boolean;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "change" | "extra")[], "update:modelValue" | "change" | "extra", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    modelValue: {
+        type: BooleanConstructor;
+        required: false;
+        default: boolean;
+    };
+    size: {
+        type: null;
+        required: false;
+        default: string;
+    };
+    avatar: {
+        type: (StringConstructor | FunctionConstructor)[];
+        required: false;
+        default: undefined;
+    };
+    avatarProps: {
+        type: null;
+        required: false;
+        default: () => {};
+    };
+    title: {
+        type: (StringConstructor | FunctionConstructor)[];
+        required: false;
+        default: undefined;
+    };
+    description: {
+        type: (StringConstructor | FunctionConstructor)[];
+        required: false;
+        default: undefined;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        required: false;
+        default: boolean;
+    };
+    extra: {
+        type: FunctionConstructor;
+        required: false;
+        default: undefined;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    onChange?: ((...args: any[]) => any) | undefined;
+    onExtra?: ((...args: any[]) => any) | undefined;
+}>, {
+    size: any;
+    disabled: boolean;
+    modelValue: boolean;
+    extra: Function;
+    avatar: string | Function;
+    avatarProps: any;
+    title: string | Function;
+    description: string | Function;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/lib/components/check-card/src/index.vue.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index_vue_vue_type_script_setup_true_lang = require('./index.vue2.js');
+const _pluginVue_exportHelper = require('../../../_virtual/_plugin-vue_export-helper.js');
+
+const CheckCard = /* @__PURE__ */ _pluginVue_exportHelper.default(index_vue_vue_type_script_setup_true_lang.default, [["__file", "index.vue"]]);
+
+exports.default = CheckCard;

package/lib/components/check-card/src/index.vue2.js

@@ -0,0 +1,170 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const vue = require('vue');
+const elementPlus = require('element-plus');
+require('../../utils/index.js');
+const is = require('../../utils/is.js');
+
+const _hoisted_1 = { class: "plus-check-card__avatar-wrapper" };
+const _hoisted_2 = { class: "plus-check-card__right-content" };
+const _hoisted_3 = {
+  key: 0,
+  class: "plus-check-card__title"
+};
+const _hoisted_4 = { class: "plus-check-card__title-left" };
+const _hoisted_5 = {
+  key: 1,
+  class: "plus-check-card__description"
+};
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...{
+    name: "PlusCheckCard"
+  },
+  __name: "index",
+  props: {
+    modelValue: { type: Boolean, default: false },
+    size: { default: "default" },
+    avatar: { type: [String, Function], default: void 0 },
+    avatarProps: { default: () => ({}) },
+    title: { type: [String, Function], default: void 0 },
+    description: { type: [String, Function], default: void 0 },
+    disabled: { type: Boolean, default: false },
+    extra: { type: Function, default: void 0 }
+  },
+  emits: ["update:modelValue", "change", "extra"],
+  setup(__props, { emit: __emit }) {
+    const classDataEnum = {
+      large: "plus-check-card--large",
+      default: "plus-check-card--default",
+      small: "plus-check-card--small"
+    };
+    const props = __props;
+    const emit = __emit;
+    const state = vue.reactive({
+      checked: false
+    });
+    vue.watchEffect(() => {
+      state.checked = props.modelValue;
+    });
+    const getClass = () => {
+      return props.size ? classDataEnum[props.size] : "plus-check-card--default";
+    };
+    const handleClick = () => {
+      if (props.disabled) return;
+      state.checked = !state.checked;
+      emit("update:modelValue", state.checked);
+      emit("change", state.checked);
+    };
+    const handelExtra = () => {
+      if (props.disabled) return;
+      emit("extra");
+    };
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock(
+        "div",
+        {
+          class: vue.normalizeClass(["plus-check-card", [
+            getClass(),
+            state.checked ? "plus-check-card--checked" : "",
+            _ctx.disabled ? "plus-check-card--disabled" : ""
+          ]]),
+          onClick: handleClick
+        },
+        [
+          vue.createElementVNode("div", _hoisted_1, [
+            vue.unref(is.isFunction)(_ctx.avatar) ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.avatar), {
+              key: 0,
+              avatar: _ctx.avatar,
+              title: _ctx.title,
+              description: _ctx.description
+            }, null, 8, ["avatar", "title", "description"])) : _ctx.$slots.avatar ? vue.renderSlot(_ctx.$slots, "avatar", {
+              key: 1,
+              avatar: _ctx.avatar,
+              title: _ctx.title,
+              description: _ctx.description
+            }) : vue.unref(is.isString)(_ctx.avatar) ? (vue.openBlock(), vue.createBlock(vue.unref(elementPlus.ElAvatar), vue.mergeProps({
+              key: 2,
+              src: _ctx.avatar
+            }, _ctx.avatarProps), null, 16, ["src"])) : vue.createCommentVNode("v-if", true)
+          ]),
+          vue.createElementVNode("div", _hoisted_2, [
+            _ctx.title || _ctx.$slots.title ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3, [
+              vue.createElementVNode("div", _hoisted_4, [
+                vue.unref(is.isFunction)(_ctx.title) ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.title), {
+                  key: 0,
+                  avatar: _ctx.avatar,
+                  title: _ctx.title,
+                  description: _ctx.description
+                }, null, 8, ["avatar", "title", "description"])) : _ctx.$slots.title ? vue.renderSlot(_ctx.$slots, "title", {
+                  key: 1,
+                  title: _ctx.title,
+                  avatar: _ctx.avatar,
+                  description: _ctx.description
+                }) : (vue.openBlock(), vue.createElementBlock(
+                  vue.Fragment,
+                  { key: 2 },
+                  [
+                    vue.createTextVNode(
+                      vue.toDisplayString(_ctx.title),
+                      1
+                      /* TEXT */
+                    )
+                  ],
+                  64
+                  /* STABLE_FRAGMENT */
+                ))
+              ]),
+              vue.createElementVNode("div", {
+                class: "plus-check-card__title-right",
+                onClick: vue.withModifiers(handelExtra, ["stop"])
+              }, [
+                vue.unref(is.isFunction)(_ctx.extra) ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.extra), {
+                  key: 0,
+                  avatar: _ctx.avatar,
+                  title: _ctx.title,
+                  description: _ctx.description
+                }, null, 8, ["avatar", "title", "description"])) : _ctx.$slots.extra ? vue.renderSlot(_ctx.$slots, "extra", {
+                  key: 1,
+                  title: _ctx.title,
+                  avatar: _ctx.avatar,
+                  description: _ctx.description
+                }) : vue.createCommentVNode("v-if", true)
+              ])
+            ])) : vue.createCommentVNode("v-if", true),
+            _ctx.description || _ctx.$slots.description ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5, [
+              vue.unref(is.isFunction)(_ctx.description) ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.description), {
+                key: 0,
+                title: _ctx.title,
+                avatar: _ctx.avatar,
+                description: _ctx.description
+              }, null, 8, ["title", "avatar", "description"])) : _ctx.$slots.description ? vue.renderSlot(_ctx.$slots, "description", {
+                key: 1,
+                title: _ctx.title,
+                description: _ctx.description,
+                avatar: _ctx.avatar
+              }) : (vue.openBlock(), vue.createElementBlock(
+                vue.Fragment,
+                { key: 2 },
+                [
+                  vue.createTextVNode(
+                    vue.toDisplayString(_ctx.description),
+                    1
+                    /* TEXT */
+                  )
+                ],
+                64
+                /* STABLE_FRAGMENT */
+              ))
+            ])) : vue.createCommentVNode("v-if", true)
+          ])
+        ],
+        2
+        /* CLASS */
+      );
+    };
+  }
+});
+
+exports.default = _sfc_main;

package/lib/components/check-card/style/css.d.ts

@@ -0,0 +1,2 @@
+import 'element-plus/es/components/avatar/style/css';
+import '@wlydfe/pro-ui-theme-chalk/plus-check-card.css';

package/lib/components/check-card/style/css.js

@@ -0,0 +1,5 @@
+'use strict';
+
+require('element-plus/lib/components/avatar/style/css.js');
+require('@wlydfe/pro-ui-theme-chalk/plus-check-card.css');
+

package/lib/components/check-card/style/index.d.ts

@@ -0,0 +1,2 @@
+import 'element-plus/es/components/avatar/style/index';
+import '@wlydfe/pro-ui-theme-chalk/src/check-card.scss';

package/lib/components/check-card/style/index.js

@@ -0,0 +1,5 @@
+'use strict';
+
+require('element-plus/lib/components/avatar/style/index.js');
+require('../../../theme-chalk/src/check-card.scss.js');
+