@wlydfe/pro-ui 0.2.0

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

@@ -0,0 +1,369 @@
+import type { PlusCheckCardProps } from '@wlydfe/pro-ui-components/check-card';
+import type { ComponentSize } from 'element-plus';
+export type ArrayValueType = (string | number)[];
+export type SingleValueType = string | number;
+export type ValueType = ArrayValueType | SingleValueType;
+export interface PlusCheckCardGroupProps {
+    modelValue?: ValueType;
+    options?: (PlusCheckCardProps & {
+        value: string | number;
+    })[];
+    size?: ComponentSize;
+    disabled?: boolean;
+    multiple?: boolean;
+}
+export interface PlusCheckCardGroupEmits {
+    (e: 'update:modelValue', checked: ValueType): void;
+    (e: 'change', checked: ValueType): void;
+    (e: 'extra', item: PlusCheckCardProps & {
+        value: string | number;
+    }): void;
+}
+export interface CheckCardState {
+    checkList: ArrayValueType;
+    checked: SingleValueType;
+}
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    modelValue: {
+        type: (ArrayConstructor | StringConstructor | NumberConstructor)[];
+        required: false;
+        default: () => never[];
+    };
+    options: {
+        type: ArrayConstructor;
+        required: false;
+        default: () => never[];
+    };
+    size: {
+        type: null;
+        required: false;
+        default: undefined;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        required: false;
+        default: boolean;
+    };
+    multiple: {
+        type: BooleanConstructor;
+        required: false;
+        default: boolean;
+    };
+}>, {
+    props: any;
+    emit: (event: "update:modelValue" | "change" | "extra", ...args: any[]) => void;
+    state: CheckCardState;
+    getChecked: (value: SingleValueType) => boolean;
+    handleChange: (model: boolean, value: SingleValueType) => void;
+    handleExtra: (item: PlusCheckCardProps & {
+        value: string | number;
+    }) => void;
+    readonly PlusCheckCard: 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: import("../../check-card/src/index.vue").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>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "change" | "extra")[], "update:modelValue" | "change" | "extra", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    modelValue: {
+        type: (ArrayConstructor | StringConstructor | NumberConstructor)[];
+        required: false;
+        default: () => never[];
+    };
+    options: {
+        type: ArrayConstructor;
+        required: false;
+        default: () => never[];
+    };
+    size: {
+        type: null;
+        required: false;
+        default: undefined;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        required: false;
+        default: boolean;
+    };
+    multiple: {
+        type: BooleanConstructor;
+        required: false;
+        default: boolean;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    onChange?: ((...args: any[]) => any) | undefined;
+    onExtra?: ((...args: any[]) => any) | undefined;
+}>, {
+    size: any;
+    disabled: boolean;
+    modelValue: string | number | unknown[];
+    options: unknown[];
+    multiple: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/es/components/check-card-group/src/index.vue.mjs

@@ -0,0 +1,6 @@
+import _sfc_main from './index.vue2.mjs';
+import _export_sfc from '../../../_virtual/_plugin-vue_export-helper.mjs';
+
+const CheckCardGroup = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "index.vue"]]);
+
+export { CheckCardGroup as default };

package/es/components/check-card-group/src/index.vue2.mjs

@@ -0,0 +1,142 @@
+import { defineComponent, reactive, watchEffect, openBlock, createElementBlock, Fragment, renderList, createBlock, unref, mergeProps, createSlots, withCtx, renderSlot, createCommentVNode } from 'vue';
+import { PlusCheckCard } from '../../check-card/index.mjs';
+
+const _hoisted_1 = { class: "plus-check-card-group" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "PlusCheckCardGroup"
+  },
+  __name: "index",
+  props: {
+    modelValue: { default: () => [] },
+    options: { default: () => [] },
+    size: { default: void 0 },
+    disabled: { type: Boolean, default: false },
+    multiple: { type: Boolean, default: false }
+  },
+  emits: ["update:modelValue", "change", "extra"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const state = reactive({
+      checkList: [],
+      checked: ""
+    });
+    watchEffect(() => {
+      if (props.multiple) {
+        state.checkList = props.modelValue;
+      } else {
+        state.checked = props.modelValue;
+      }
+    });
+    const getChecked = (value) => {
+      if (props.multiple) {
+        return state.checkList.includes(value);
+      } else {
+        return state.checked === value;
+      }
+    };
+    const handleChange = (model, value) => {
+      if (props.multiple) {
+        if (model) {
+          state.checkList.push(value);
+        } else {
+          state.checkList = state.checkList.filter((item) => item !== value);
+        }
+        emit("update:modelValue", state.checkList);
+        emit("change", state.checkList);
+      } else {
+        const val = model ? value : "";
+        emit("update:modelValue", val);
+        emit("change", val);
+      }
+    };
+    const handleExtra = (item) => {
+      if (props.disabled) return;
+      emit("extra", item);
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        (openBlock(true), createElementBlock(
+          Fragment,
+          null,
+          renderList(_ctx.options, (item, index) => {
+            return openBlock(), createBlock(unref(PlusCheckCard), mergeProps({
+              key: item.value || index,
+              size: _ctx.size,
+              disabled: _ctx.disabled
+            }, { ref_for: true }, item, {
+              "model-value": getChecked(item.value),
+              onChange: ($event) => handleChange($event, item.value),
+              onExtra: ($event) => handleExtra(item)
+            }), createSlots({
+              _: 2
+              /* DYNAMIC */
+            }, [
+              _ctx.$slots["avatar-" + item.value] || _ctx.$slots.avatar ? {
+                name: "avatar",
+                fn: withCtx((data) => [
+                  _ctx.$slots["avatar-" + item.value] ? renderSlot(_ctx.$slots, "avatar-" + item.value, mergeProps({
+                    key: 0,
+                    ref_for: true
+                  }, data)) : createCommentVNode("v-if", true),
+                  _ctx.$slots.avatar ? renderSlot(_ctx.$slots, "avatar", mergeProps({
+                    key: 1,
+                    ref_for: true
+                  }, data)) : createCommentVNode("v-if", true)
+                ]),
+                key: "0"
+              } : void 0,
+              _ctx.$slots["title-" + item.value] || _ctx.$slots.title ? {
+                name: "title",
+                fn: withCtx((data) => [
+                  _ctx.$slots["title-" + item.value] ? renderSlot(_ctx.$slots, "title-" + item.value, mergeProps({
+                    key: 0,
+                    ref_for: true
+                  }, data)) : createCommentVNode("v-if", true),
+                  _ctx.$slots.title ? renderSlot(_ctx.$slots, "title", mergeProps({
+                    key: 1,
+                    ref_for: true
+                  }, data)) : createCommentVNode("v-if", true)
+                ]),
+                key: "1"
+              } : void 0,
+              _ctx.$slots["description-" + item.value] || _ctx.$slots.description ? {
+                name: "description",
+                fn: withCtx((data) => [
+                  _ctx.$slots["description-" + item.value] ? renderSlot(_ctx.$slots, "description-" + item.value, mergeProps({
+                    key: 0,
+                    ref_for: true
+                  }, data)) : createCommentVNode("v-if", true),
+                  _ctx.$slots.description ? renderSlot(_ctx.$slots, "description", mergeProps({
+                    key: 1,
+                    ref_for: true
+                  }, data)) : createCommentVNode("v-if", true)
+                ]),
+                key: "2"
+              } : void 0,
+              _ctx.$slots["extra-" + item.value] || _ctx.$slots.extra ? {
+                name: "extra",
+                fn: withCtx((data) => [
+                  _ctx.$slots["extra-" + item.value] ? renderSlot(_ctx.$slots, "extra-" + item.value, mergeProps({
+                    key: 0,
+                    ref_for: true
+                  }, data)) : createCommentVNode("v-if", true),
+                  _ctx.$slots.extra ? renderSlot(_ctx.$slots, "extra", mergeProps({
+                    key: 1,
+                    ref_for: true
+                  }, data)) : createCommentVNode("v-if", true)
+                ]),
+                key: "3"
+              } : void 0
+            ]), 1040, ["size", "disabled", "model-value", "onChange", "onExtra"]);
+          }),
+          128
+          /* KEYED_FRAGMENT */
+        ))
+      ]);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/es/components/check-card-group/style/css.d.ts

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

package/es/components/check-card-group/style/css.mjs

@@ -0,0 +1,2 @@
+import '../../check-card/style/css.mjs';
+import '@wlydfe/pro-ui-theme-chalk/plus-check-card-group.css';

package/es/components/check-card-group/style/index.d.ts

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

package/es/components/check-card-group/style/index.mjs

@@ -0,0 +1,2 @@
+import '../../check-card/style/index.mjs';
+import '../../../theme-chalk/src/check-card-group.scss.mjs';