feat: initial commit - Phase 1 & 2 core features

This commit is contained in:
hiderfong
2026-04-22 17:07:33 +08:00
commit 1773bda06b
25005 changed files with 6252106 additions and 0 deletions
+16
View File
@@ -0,0 +1,16 @@
import { SFCWithInstall } from "../../utils/vue/typescript.js";
import "../../utils/index.js";
import { AvatarEmits, AvatarProps, AvatarPropsPublic, avatarEmits, avatarProps } from "./src/avatar.js";
import { _default } from "./src/avatar.vue.js";
import { _default as _default$1 } from "./src/avatar-group.js";
import { AvatarGroupContext, avatarGroupContextKey } from "./src/constants.js";
import { AvatarGroupProps, AvatarGroupPropsPublic, avatarGroupProps } from "./src/avatar-group-props.js";
import { AvatarGroupInstance, AvatarInstance } from "./src/instance.js";
//#region ../../packages/components/avatar/index.d.ts
declare const ElAvatar: SFCWithInstall<typeof _default> & {
AvatarGroup: typeof _default$1;
};
declare const ElAvatarGroup: SFCWithInstall<typeof _default$1>;
//#endregion
export { AvatarEmits, AvatarGroupContext, type AvatarGroupInstance, AvatarGroupProps, AvatarGroupPropsPublic, type AvatarInstance, AvatarProps, AvatarPropsPublic, ElAvatar, ElAvatar as default, ElAvatarGroup, avatarEmits, avatarGroupContextKey, avatarGroupProps, avatarProps };
+14
View File
@@ -0,0 +1,14 @@
import { withInstall, withNoopInstall } from "../../utils/vue/install.mjs";
import { avatarEmits, avatarProps } from "./src/avatar.mjs";
import { avatarGroupContextKey } from "./src/constants.mjs";
import avatar_default from "./src/avatar2.mjs";
import { avatarGroupProps } from "./src/avatar-group-props.mjs";
import avatar_group_default from "./src/avatar-group.mjs";
//#region ../../packages/components/avatar/index.ts
const ElAvatar = withInstall(avatar_default, { AvatarGroup: avatar_group_default });
const ElAvatarGroup = withNoopInstall(avatar_group_default);
//#endregion
export { ElAvatar, ElAvatar as default, ElAvatarGroup, avatarEmits, avatarGroupContextKey, avatarGroupProps, avatarProps };
//# sourceMappingURL=index.mjs.map
@@ -0,0 +1 @@
{"version":3,"file":"index.mjs","names":["Avatar","AvatarGroup"],"sources":["../../../../../packages/components/avatar/index.ts"],"sourcesContent":["import { withInstall, withNoopInstall } from '@element-plus/utils'\nimport Avatar from './src/avatar.vue'\nimport AvatarGroup from './src/avatar-group'\n\nimport type { SFCWithInstall } from '@element-plus/utils'\n\nexport const ElAvatar: SFCWithInstall<typeof Avatar> & {\n AvatarGroup: typeof AvatarGroup\n} = withInstall(Avatar, {\n AvatarGroup,\n})\nexport const ElAvatarGroup: SFCWithInstall<typeof AvatarGroup> =\n withNoopInstall(AvatarGroup)\nexport default ElAvatar\n\nexport * from './src/avatar'\nexport * from './src/constants'\nexport * from './src/avatar-group-props'\nexport type { AvatarInstance, AvatarGroupInstance } from './src/instance'\n"],"mappings":";;;;;;;;AAMA,MAAa,WAET,YAAYA,gBAAQ,EACtB,mCACD,CAAC;AACF,MAAa,gBACX,gBAAgBC,qBAAY"}
@@ -0,0 +1,183 @@
import { EpPropMergeType } from "../../../utils/vue/props/types.js";
import "../../../utils/index.js";
import { PopperEffect } from "../../popper/src/popper.js";
import { Placement } from "../../popper/index.js";
import * as vue from "vue";
import { ExtractPropTypes, ExtractPublicPropTypes, StyleValue } from "vue";
//#region ../../packages/components/avatar/src/avatar-group-props.d.ts
declare const avatarGroupProps: {
/**
* @description control the size of avatars in this avatar-group
*/
readonly size: {
readonly type: vue.PropType<number | "" | "default" | "small" | "large" | undefined>;
readonly values: readonly ["", "default", "small", "large"];
readonly validator: (val: unknown) => val is number;
};
/**
* @description control the shape of avatars in this avatar-group
*/
readonly shape: {
readonly type: vue.PropType<"square" | "circle" | undefined>;
readonly values: readonly ["circle", "square"];
};
/**
* @description whether to collapse avatars
*/
readonly collapseAvatars: BooleanConstructor;
/**
* @description whether show all collapsed avatars when mouse hover text of the collapse-avatar. To use this, `collapse-avatars` must be true
*/
readonly collapseAvatarsTooltip: BooleanConstructor;
/**
* @description the max avatars number to be shown. To use this, `collapse-avatars` must be true
*/
readonly maxCollapseAvatars: {
readonly type: NumberConstructor;
readonly default: 1;
};
/**
* @description tooltip theme, built-in theme: `dark` / `light`
*/
readonly effect: {
readonly type: vue.PropType<PopperEffect>;
readonly default: "light";
};
/**
* @description placement of tooltip
*/
readonly placement: {
readonly type: vue.PropType<Placement>;
readonly values: Placement[];
readonly default: "top";
};
/**
* @description custom class name for tooltip
*/
readonly popperClass: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (((new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[])) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
/**
* @description custom style for tooltip
*/
readonly popperStyle: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | false | vue.CSSProperties | StyleValue[]) | (() => StyleValue) | (((new (...args: any[]) => string | false | vue.CSSProperties | StyleValue[]) | (() => StyleValue)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
/**
* @description custom class name for the collapse-avatar
*/
readonly collapseClass: StringConstructor;
/**
* @description custom style for the collapse-avatar
*/
readonly collapseStyle: {
readonly type: vue.PropType<StyleValue>;
};
};
type AvatarGroupProps = ExtractPropTypes<typeof avatarGroupProps>;
type AvatarGroupPropsPublic = ExtractPublicPropTypes<typeof avatarGroupProps>;
//#endregion
export { AvatarGroupProps, AvatarGroupPropsPublic, avatarGroupProps };
@@ -0,0 +1,45 @@
import { componentSizes } from "../../../constants/size.mjs";
import { isNumber } from "../../../utils/types.mjs";
import { definePropType } from "../../../utils/vue/props/runtime.mjs";
import { useTooltipContentProps } from "../../tooltip/src/content.mjs";
import { placements } from "@popperjs/core";
//#region ../../packages/components/avatar/src/avatar-group-props.ts
const avatarGroupProps = {
size: {
type: definePropType([Number, String]),
values: componentSizes,
validator: (val) => isNumber(val)
},
shape: {
type: definePropType(String),
values: ["circle", "square"]
},
collapseAvatars: Boolean,
collapseAvatarsTooltip: Boolean,
maxCollapseAvatars: {
type: Number,
default: 1
},
effect: {
type: definePropType(String),
default: "light"
},
placement: {
type: definePropType(String),
values: placements,
default: "top"
},
popperClass: useTooltipContentProps.popperClass,
popperStyle: useTooltipContentProps.popperStyle,
collapseClass: String,
collapseStyle: { type: definePropType([
String,
Array,
Object
]) }
};
//#endregion
export { avatarGroupProps };
//# sourceMappingURL=avatar-group-props.mjs.map
@@ -0,0 +1 @@
{"version":3,"file":"avatar-group-props.mjs","names":[],"sources":["../../../../../../packages/components/avatar/src/avatar-group-props.ts"],"sourcesContent":["import { placements } from '@popperjs/core'\nimport { useTooltipContentProps } from '@element-plus/components/tooltip'\nimport { definePropType, isNumber } from '@element-plus/utils'\nimport { componentSizes } from '@element-plus/constants'\n\nimport type { AvatarProps } from './avatar'\nimport type { ExtractPropTypes, ExtractPublicPropTypes, StyleValue } from 'vue'\nimport type { Placement, PopperEffect } from '@element-plus/components/popper'\n\nexport const avatarGroupProps = {\n /**\n * @description control the size of avatars in this avatar-group\n */\n size: {\n type: definePropType<AvatarProps['size']>([Number, String]),\n values: componentSizes,\n validator: (val: unknown): val is number => isNumber(val),\n },\n /**\n * @description control the shape of avatars in this avatar-group\n */\n shape: {\n type: definePropType<AvatarProps['shape']>(String),\n values: ['circle', 'square'] as const,\n },\n /**\n * @description whether to collapse avatars\n */\n collapseAvatars: Boolean,\n /**\n * @description whether show all collapsed avatars when mouse hover text of the collapse-avatar. To use this, `collapse-avatars` must be true\n */\n collapseAvatarsTooltip: Boolean,\n /**\n * @description the max avatars number to be shown. To use this, `collapse-avatars` must be true\n */\n maxCollapseAvatars: {\n type: Number,\n default: 1,\n },\n /**\n * @description tooltip theme, built-in theme: `dark` / `light`\n */\n effect: {\n type: definePropType<PopperEffect>(String),\n default: 'light',\n },\n /**\n * @description placement of tooltip\n */\n placement: {\n type: definePropType<Placement>(String),\n values: placements,\n default: 'top',\n },\n /**\n * @description custom class name for tooltip\n */\n popperClass: useTooltipContentProps.popperClass,\n /**\n * @description custom style for tooltip\n */\n popperStyle: useTooltipContentProps.popperStyle,\n /**\n * @description custom class name for the collapse-avatar\n */\n collapseClass: String,\n /**\n * @description custom style for the collapse-avatar\n */\n collapseStyle: {\n type: definePropType<StyleValue>([String, Array, Object]),\n },\n} as const\nexport type AvatarGroupProps = ExtractPropTypes<typeof avatarGroupProps>\nexport type AvatarGroupPropsPublic = ExtractPublicPropTypes<\n typeof avatarGroupProps\n>\n"],"mappings":";;;;;;;AASA,MAAa,mBAAmB;CAI9B,MAAM;EACJ,MAAM,eAAoC,CAAC,QAAQ,OAAO,CAAC;EAC3D,QAAQ;EACR,YAAY,QAAgC,SAAS,IAAI;EAC1D;CAID,OAAO;EACL,MAAM,eAAqC,OAAO;EAClD,QAAQ,CAAC,UAAU,SAAS;EAC7B;CAID,iBAAiB;CAIjB,wBAAwB;CAIxB,oBAAoB;EAClB,MAAM;EACN,SAAS;EACV;CAID,QAAQ;EACN,MAAM,eAA6B,OAAO;EAC1C,SAAS;EACV;CAID,WAAW;EACT,MAAM,eAA0B,OAAO;EACvC,QAAQ;EACR,SAAS;EACV;CAID,aAAa,uBAAuB;CAIpC,aAAa,uBAAuB;CAIpC,eAAe;CAIf,eAAe,EACb,MAAM,eAA2B;EAAC;EAAQ;EAAO;EAAO,CAAC,EAC1D;CACF"}
@@ -0,0 +1,292 @@
import { EpPropMergeType } from "../../../utils/vue/props/types.js";
import "../../../utils/index.js";
import { PopperEffect } from "../../popper/src/popper.js";
import "../../../index.js";
import { Placement } from "../../popper/index.js";
import * as vue from "vue";
import * as vue_jsx_runtime0 from "vue/jsx-runtime";
//#region ../../packages/components/avatar/src/avatar-group.d.ts
declare const _default: vue.DefineComponent<vue.ExtractPropTypes<{
readonly size: {
readonly type: vue.PropType<number | "" | "default" | "small" | "large" | undefined>;
readonly values: readonly ["", "default", "small", "large"];
readonly validator: (val: unknown) => val is number;
};
readonly shape: {
readonly type: vue.PropType<"square" | "circle" | undefined>;
readonly values: readonly ["circle", "square"];
};
readonly collapseAvatars: BooleanConstructor;
readonly collapseAvatarsTooltip: BooleanConstructor;
readonly maxCollapseAvatars: {
readonly type: NumberConstructor;
readonly default: 1;
};
readonly effect: {
readonly type: vue.PropType<PopperEffect>;
readonly default: "light";
};
readonly placement: {
readonly type: vue.PropType<Placement>;
readonly values: Placement[];
readonly default: "top";
};
readonly popperClass: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (((new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[])) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly popperStyle: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | false | vue.CSSProperties | vue.StyleValue[]) | (() => vue.StyleValue) | (((new (...args: any[]) => string | false | vue.CSSProperties | vue.StyleValue[]) | (() => vue.StyleValue)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly collapseClass: StringConstructor;
readonly collapseStyle: {
readonly type: vue.PropType<vue.StyleValue>;
};
}>, () => vue_jsx_runtime0.JSX.Element, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
readonly size: {
readonly type: vue.PropType<number | "" | "default" | "small" | "large" | undefined>;
readonly values: readonly ["", "default", "small", "large"];
readonly validator: (val: unknown) => val is number;
};
readonly shape: {
readonly type: vue.PropType<"square" | "circle" | undefined>;
readonly values: readonly ["circle", "square"];
};
readonly collapseAvatars: BooleanConstructor;
readonly collapseAvatarsTooltip: BooleanConstructor;
readonly maxCollapseAvatars: {
readonly type: NumberConstructor;
readonly default: 1;
};
readonly effect: {
readonly type: vue.PropType<PopperEffect>;
readonly default: "light";
};
readonly placement: {
readonly type: vue.PropType<Placement>;
readonly values: Placement[];
readonly default: "top";
};
readonly popperClass: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (((new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[])) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly popperStyle: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | false | vue.CSSProperties | vue.StyleValue[]) | (() => vue.StyleValue) | (((new (...args: any[]) => string | false | vue.CSSProperties | vue.StyleValue[]) | (() => vue.StyleValue)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly collapseClass: StringConstructor;
readonly collapseStyle: {
readonly type: vue.PropType<vue.StyleValue>;
};
}>> & Readonly<{}>, {
readonly effect: PopperEffect;
readonly placement: Placement;
readonly collapseAvatars: boolean;
readonly collapseAvatarsTooltip: boolean;
readonly maxCollapseAvatars: number;
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
//#endregion
export { _default };
@@ -0,0 +1,48 @@
import { flattedChildren } from "../../../utils/vue/vnode.mjs";
import { useNamespace } from "../../../hooks/use-namespace/index.mjs";
import { ElTooltip } from "../../tooltip/index.mjs";
import { avatarGroupContextKey } from "./constants.mjs";
import avatar_default from "./avatar2.mjs";
import { avatarGroupProps } from "./avatar-group-props.mjs";
import { cloneVNode, createTextVNode, createVNode, defineComponent, isVNode, provide, reactive, toRef } from "vue";
//#region ../../packages/components/avatar/src/avatar-group.tsx
var avatar_group_default = /* @__PURE__ */ defineComponent({
name: "ElAvatarGroup",
props: avatarGroupProps,
setup(props, { slots }) {
const ns = useNamespace("avatar-group");
provide(avatarGroupContextKey, reactive({
size: toRef(props, "size"),
shape: toRef(props, "shape")
}));
return () => {
const avatars = flattedChildren(slots.default?.() ?? []);
let visibleAvatars = avatars;
if (props.collapseAvatars && avatars.length > props.maxCollapseAvatars) {
visibleAvatars = avatars.slice(0, props.maxCollapseAvatars);
const hiddenAvatars = avatars.slice(props.maxCollapseAvatars);
visibleAvatars.push(createVNode(ElTooltip, {
"popperClass": props.popperClass,
"popperStyle": props.popperStyle,
"placement": props.placement,
"effect": props.effect,
"disabled": !props.collapseAvatarsTooltip
}, {
default: () => createVNode(avatar_default, {
"size": props.size,
"shape": props.shape,
"class": props.collapseClass,
"style": props.collapseStyle
}, { default: () => [createTextVNode("+ "), hiddenAvatars.length] }),
content: () => createVNode("div", { "class": ns.e("collapse-avatars") }, [hiddenAvatars.map((node, idx) => isVNode(node) ? cloneVNode(node, { key: node.key ?? idx }) : node)])
}));
}
return createVNode("div", { "class": ns.b() }, [visibleAvatars]);
};
}
});
//#endregion
export { avatar_group_default as default };
//# sourceMappingURL=avatar-group.mjs.map
@@ -0,0 +1 @@
{"version":3,"file":"avatar-group.mjs","names":["cloneVNode","defineComponent","isVNode","provide","reactive","toRef","createTextVNode","_createTextVNode","createVNode","_createVNode","flattedChildren","ElTooltip","useNamespace","ElAvatar","avatarGroupContextKey","avatarGroupProps","name","props","setup","slots","ns","size","shape","avatars","default","visibleAvatars","showCollapseAvatar","collapseAvatars","length","maxCollapseAvatars","slice","hiddenAvatars","push","popperClass","popperStyle","placement","effect","collapseAvatarsTooltip","collapseClass","collapseStyle","content","e","map","node","idx","key","b"],"sources":["../../../../../../packages/components/avatar/src/avatar-group.tsx"],"sourcesContent":["import {\n cloneVNode,\n defineComponent,\n isVNode,\n provide,\n reactive,\n toRef,\n} from 'vue'\nimport { flattedChildren } from '@element-plus/utils'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { useNamespace } from '@element-plus/hooks'\nimport ElAvatar from './avatar.vue'\nimport { avatarGroupContextKey } from './constants'\nimport { avatarGroupProps } from './avatar-group-props'\n\nexport default defineComponent({\n name: 'ElAvatarGroup',\n props: avatarGroupProps,\n setup(props, { slots }) {\n const ns = useNamespace('avatar-group')\n\n provide(\n avatarGroupContextKey,\n reactive({\n size: toRef(props, 'size'),\n shape: toRef(props, 'shape'),\n })\n )\n\n return () => {\n const avatars = flattedChildren(slots.default?.() ?? [])\n let visibleAvatars = avatars\n\n const showCollapseAvatar =\n props.collapseAvatars && avatars.length > props.maxCollapseAvatars\n\n if (showCollapseAvatar) {\n visibleAvatars = avatars.slice(0, props.maxCollapseAvatars)\n const hiddenAvatars = avatars.slice(props.maxCollapseAvatars)\n\n visibleAvatars.push(\n <ElTooltip\n popperClass={props.popperClass}\n popperStyle={props.popperStyle}\n placement={props.placement}\n effect={props.effect}\n disabled={!props.collapseAvatarsTooltip}\n >\n {{\n default: () => (\n <ElAvatar\n size={props.size}\n shape={props.shape}\n class={props.collapseClass}\n style={props.collapseStyle}\n >\n + {hiddenAvatars.length}\n </ElAvatar>\n ),\n content: () => (\n <div class={ns.e('collapse-avatars')}>\n {hiddenAvatars.map((node, idx) =>\n isVNode(node)\n ? cloneVNode(node, { key: node.key ?? idx })\n : node\n )}\n </div>\n ),\n }}\n </ElTooltip>\n )\n }\n\n return <div class={ns.b()}>{visibleAvatars}</div>\n }\n },\n})\n"],"mappings":";;;;;;;;;AAeA,2BAAeC,gCAAgB;CAC7Be,MAAM;CACNC,OAAOF;CACPG,MAAMD,OAAO,EAAEE,SAAS;EACtB,MAAMC,KAAKR,aAAa,eAAe;AAEvCT,UACEW,uBACAV,SAAS;GACPiB,MAAMhB,MAAMY,OAAO,OAAO;GAC1BK,OAAOjB,MAAMY,OAAO,QAAO;GAC5B,CACH,CAAC;AAED,eAAa;GACX,MAAMM,UAAUb,gBAAgBS,MAAMK,WAAW,IAAI,EAAE,CAAC;GACxD,IAAIC,iBAAiBF;AAKrB,OAFEN,MAAMU,mBAAmBJ,QAAQK,SAASX,MAAMY,oBAE1B;AACtBJ,qBAAiBF,QAAQO,MAAM,GAAGb,MAAMY,mBAAmB;IAC3D,MAAME,gBAAgBR,QAAQO,MAAMb,MAAMY,mBAAmB;AAE7DJ,mBAAeO,KAAIvB,YAAAE,WAAA;KAAA,eAEFM,MAAMgB;KAAW,eACjBhB,MAAMiB;KAAW,aACnBjB,MAAMkB;KAAS,UAClBlB,MAAMmB;KAAM,YACV,CAACnB,MAAMoB;KAAsB,EAAA;KAGrCb,eAASf,YAAAI,gBAAA;MAAA,QAECI,MAAMI;MAAI,SACTJ,MAAMK;MAAK,SACXL,MAAMqB;MAAa,SACnBrB,MAAMsB;MAAa,EAAA,EAAAf,eAAA,CAAAjB,gBAAA,KAAA,EAEvBwB,cAAcH,OAAM,EAAA,CAE1B;KACDY,eAAS/B,YAAA,OAAA,EAAA,SACKW,GAAGqB,EAAE,mBAAkB,EAAC,EAAA,CACjCV,cAAcW,KAAKC,MAAMC,QACxB1C,QAAQyC,KAAK,GACT3C,WAAW2C,MAAM,EAAEE,KAAKF,KAAKE,OAAOD,KAAK,CAAC,GAC1CD,KACL,CAAA,CAAA;KAEJ,CAGP,CAAC;;AAGH,UAAAlC,YAAA,OAAA,EAAA,SAAmBW,GAAG0B,GAAE,EAAC,EAAA,CAAGrB,eAAc,CAAA;;;CAG/C,CAAC"}
@@ -0,0 +1,77 @@
import { IconPropType } from "../../../utils/vue/icon.js";
import { EpPropFinalized, EpPropMergeType } from "../../../utils/vue/props/types.js";
import { ComponentSize } from "../../../constants/size.js";
import { ObjectFit } from "../../../utils/typescript.js";
import "../../../utils/index.js";
import * as vue from "vue";
import { ExtractPublicPropTypes } from "vue";
import * as csstype from "csstype";
//#region ../../packages/components/avatar/src/avatar.d.ts
interface AvatarProps {
/**
* @description avatar size.
*/
size?: number | ComponentSize;
/**
* @description avatar shape.
*/
shape?: 'circle' | 'square';
/**
* @description representation type to icon, more info on icon component.
*/
icon?: IconPropType;
/**
* @description the source of the image for an image avatar.
*/
src?: string;
/**
* @description native attribute `alt` of image avatar.
*/
alt?: string;
/**
* @description native attribute srcset of image avatar.
*/
srcSet?: string;
/**
* @description set how the image fit its container for an image avatar.
*/
fit?: ObjectFit;
}
/**
* @deprecated Removed after 3.0.0, Use `AvatarProps` instead.
*/
declare const avatarProps: {
readonly size: {
readonly type: vue.PropType<EpPropMergeType<readonly [NumberConstructor, StringConstructor], "" | "default" | "small" | "large", number>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly shape: {
readonly type: vue.PropType<EpPropMergeType<StringConstructor, "square" | "circle", unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly icon: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => (string | vue.Component) & {}) | (() => string | vue.Component) | (((new (...args: any[]) => (string | vue.Component) & {}) | (() => string | vue.Component)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly src: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly alt: StringConstructor;
readonly srcSet: StringConstructor;
readonly fit: EpPropFinalized<(new (...args: any[]) => "fill" | "-moz-initial" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "none" | "contain" | "cover" | "scale-down") | (() => csstype.Property.ObjectFit | undefined) | (((new (...args: any[]) => "fill" | "-moz-initial" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "none" | "contain" | "cover" | "scale-down") | (() => csstype.Property.ObjectFit | undefined)) | null)[], unknown, unknown, "cover", boolean>;
};
/**
* @deprecated Removed after 3.0.0, Use `AvatarProps` instead.
*/
type AvatarPropsPublic = ExtractPublicPropTypes<typeof avatarProps>;
declare const avatarEmits: {
error: (evt: Event) => boolean;
};
type AvatarEmits = typeof avatarEmits;
//#endregion
export { AvatarEmits, AvatarProps, AvatarPropsPublic, avatarEmits, avatarProps };
+36
View File
@@ -0,0 +1,36 @@
import { componentSizes } from "../../../constants/size.mjs";
import { isNumber } from "../../../utils/types.mjs";
import { buildProps, definePropType } from "../../../utils/vue/props/runtime.mjs";
import { iconPropType } from "../../../utils/vue/icon.mjs";
//#region ../../packages/components/avatar/src/avatar.ts
/**
* @deprecated Removed after 3.0.0, Use `AvatarProps` instead.
*/
const avatarProps = buildProps({
size: {
type: [Number, String],
values: componentSizes,
validator: (val) => isNumber(val)
},
shape: {
type: String,
values: ["circle", "square"]
},
icon: { type: iconPropType },
src: {
type: String,
default: ""
},
alt: String,
srcSet: String,
fit: {
type: definePropType(String),
default: "cover"
}
});
const avatarEmits = { error: (evt) => evt instanceof Event };
//#endregion
export { avatarEmits, avatarProps };
//# sourceMappingURL=avatar.mjs.map
@@ -0,0 +1 @@
{"version":3,"file":"avatar.mjs","names":[],"sources":["../../../../../../packages/components/avatar/src/avatar.ts"],"sourcesContent":["import {\n buildProps,\n definePropType,\n iconPropType,\n isNumber,\n} from '@element-plus/utils'\nimport { componentSizes } from '@element-plus/constants'\n\nimport type { ExtractPublicPropTypes } from 'vue'\nimport type { ComponentSize } from '@element-plus/constants'\nimport type { IconPropType, ObjectFit } from '@element-plus/utils'\n\nexport interface AvatarProps {\n /**\n * @description avatar size.\n */\n size?: number | ComponentSize\n /**\n * @description avatar shape.\n */\n shape?: 'circle' | 'square'\n /**\n * @description representation type to icon, more info on icon component.\n */\n icon?: IconPropType\n /**\n * @description the source of the image for an image avatar.\n */\n src?: string\n /**\n * @description native attribute `alt` of image avatar.\n */\n alt?: string\n /**\n * @description native attribute srcset of image avatar.\n */\n srcSet?: string\n /**\n * @description set how the image fit its container for an image avatar.\n */\n fit?: ObjectFit\n}\n\n/**\n * @deprecated Removed after 3.0.0, Use `AvatarProps` instead.\n */\nexport const avatarProps = buildProps({\n /**\n * @description avatar size.\n */\n size: {\n type: [Number, String],\n values: componentSizes,\n validator: (val: unknown): val is number => isNumber(val),\n },\n /**\n * @description avatar shape.\n */\n shape: {\n type: String,\n values: ['circle', 'square'],\n },\n /**\n * @description representation type to icon, more info on icon component.\n */\n icon: {\n type: iconPropType,\n },\n /**\n * @description the source of the image for an image avatar.\n */\n src: {\n type: String,\n default: '',\n },\n /**\n * @description native attribute `alt` of image avatar.\n */\n alt: String,\n /**\n * @description native attribute srcset of image avatar.\n */\n srcSet: String,\n /**\n * @description set how the image fit its container for an image avatar.\n */\n fit: {\n type: definePropType<ObjectFit>(String),\n default: 'cover',\n },\n} as const)\n\n/**\n * @deprecated Removed after 3.0.0, Use `AvatarProps` instead.\n */\nexport type AvatarPropsPublic = ExtractPublicPropTypes<typeof avatarProps>\n\nexport const avatarEmits = {\n error: (evt: Event) => evt instanceof Event,\n}\nexport type AvatarEmits = typeof avatarEmits\n"],"mappings":";;;;;;;;;AA8CA,MAAa,cAAc,WAAW;CAIpC,MAAM;EACJ,MAAM,CAAC,QAAQ,OAAO;EACtB,QAAQ;EACR,YAAY,QAAgC,SAAS,IAAI;EAC1D;CAID,OAAO;EACL,MAAM;EACN,QAAQ,CAAC,UAAU,SAAS;EAC7B;CAID,MAAM,EACJ,MAAM,cACP;CAID,KAAK;EACH,MAAM;EACN,SAAS;EACV;CAID,KAAK;CAIL,QAAQ;CAIR,KAAK;EACH,MAAM,eAA0B,OAAO;EACvC,SAAS;EACV;CACF,CAAU;AAOX,MAAa,cAAc,EACzB,QAAQ,QAAe,eAAe,OACvC"}
@@ -0,0 +1,26 @@
import { AvatarProps } from "./avatar.js";
import * as vue from "vue";
import * as csstype from "csstype";
//#region ../../packages/components/avatar/src/avatar.vue.d.ts
declare var __VLS_12: {};
type __VLS_Slots = {} & {
default?: (props: typeof __VLS_12) => any;
};
declare const __VLS_base: vue.DefineComponent<AvatarProps, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
error: (evt: Event) => void;
}, string, vue.PublicProps, Readonly<AvatarProps> & Readonly<{
onError?: ((evt: Event) => any) | undefined;
}>, {
src: string;
fit: csstype.Property.ObjectFit;
}, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
declare const _default: typeof __VLS_export;
type __VLS_WithSlots<T, S> = T & {
new (): {
$slots: S;
};
};
//#endregion
export { _default };
@@ -0,0 +1,66 @@
import { isNumber, isString } from "../../../utils/types.mjs";
import { addUnit } from "../../../utils/dom/style.mjs";
import { useNamespace } from "../../../hooks/use-namespace/index.mjs";
import { ElIcon } from "../../icon/index.mjs";
import { avatarEmits, avatarProps } from "./avatar.mjs";
import { avatarGroupContextKey } from "./constants.mjs";
import { computed, createBlock, createElementBlock, defineComponent, inject, normalizeClass, normalizeStyle, openBlock, ref, renderSlot, resolveDynamicComponent, unref, watch, withCtx } from "vue";
//#region ../../packages/components/avatar/src/avatar.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1 = [
"src",
"alt",
"srcset"
];
var avatar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
name: "ElAvatar",
__name: "avatar",
props: avatarProps,
emits: avatarEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const avatarGroupContext = inject(avatarGroupContextKey, void 0);
const ns = useNamespace("avatar");
const hasLoadError = ref(false);
const size = computed(() => props.size ?? avatarGroupContext?.size);
const shape = computed(() => props.shape ?? avatarGroupContext?.shape ?? "circle");
const avatarClass = computed(() => {
const { icon } = props;
const classList = [ns.b()];
if (isString(size.value)) classList.push(ns.m(size.value));
if (icon) classList.push(ns.m("icon"));
if (shape.value) classList.push(ns.m(shape.value));
return classList;
});
const sizeStyle = computed(() => {
return isNumber(size.value) ? ns.cssVarBlock({ size: addUnit(size.value) }) : void 0;
});
const fitStyle = computed(() => ({ objectFit: props.fit }));
watch(() => [props.src, props.srcSet], () => hasLoadError.value = false);
function handleError(e) {
hasLoadError.value = true;
emit("error", e);
}
return (_ctx, _cache) => {
return openBlock(), createElementBlock("span", {
class: normalizeClass(avatarClass.value),
style: normalizeStyle(sizeStyle.value)
}, [(__props.src || __props.srcSet) && !hasLoadError.value ? (openBlock(), createElementBlock("img", {
key: 0,
src: __props.src,
alt: __props.alt,
srcset: __props.srcSet,
style: normalizeStyle(fitStyle.value),
onError: handleError
}, null, 44, _hoisted_1)) : __props.icon ? (openBlock(), createBlock(unref(ElIcon), { key: 1 }, {
default: withCtx(() => [(openBlock(), createBlock(resolveDynamicComponent(__props.icon)))]),
_: 1
})) : renderSlot(_ctx.$slots, "default", { key: 2 })], 6);
};
}
});
//#endregion
export { avatar_vue_vue_type_script_setup_true_lang_default as default };
//# sourceMappingURL=avatar.vue_vue_type_script_setup_true_lang.mjs.map
@@ -0,0 +1 @@
{"version":3,"file":"avatar.vue_vue_type_script_setup_true_lang.mjs","names":[],"sources":["../../../../../../packages/components/avatar/src/avatar.vue"],"sourcesContent":["<template>\n <span :class=\"avatarClass\" :style=\"sizeStyle\">\n <img\n v-if=\"(src || srcSet) && !hasLoadError\"\n :src=\"src\"\n :alt=\"alt\"\n :srcset=\"srcSet\"\n :style=\"fitStyle\"\n @error=\"handleError\"\n />\n <el-icon v-else-if=\"icon\">\n <component :is=\"icon\" />\n </el-icon>\n <slot v-else />\n </span>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, ref, watch } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { useNamespace } from '@element-plus/hooks'\nimport { addUnit, isNumber, isString } from '@element-plus/utils'\nimport { avatarEmits } from './avatar'\nimport { avatarGroupContextKey } from './constants'\n\nimport type { AvatarProps } from './avatar'\nimport type { CSSProperties } from 'vue'\n\ndefineOptions({\n name: 'ElAvatar',\n})\n\nconst props = withDefaults(defineProps<AvatarProps>(), {\n src: '',\n fit: 'cover',\n})\n\nconst emit = defineEmits(avatarEmits)\n\nconst avatarGroupContext = inject(avatarGroupContextKey, undefined)\n\nconst ns = useNamespace('avatar')\n\nconst hasLoadError = ref(false)\n\nconst size = computed(() => props.size ?? avatarGroupContext?.size)\nconst shape = computed(\n () => props.shape ?? avatarGroupContext?.shape ?? 'circle'\n)\n\nconst avatarClass = computed(() => {\n const { icon } = props\n const classList = [ns.b()]\n if (isString(size.value)) classList.push(ns.m(size.value))\n if (icon) classList.push(ns.m('icon'))\n if (shape.value) classList.push(ns.m(shape.value))\n return classList\n})\n\nconst sizeStyle = computed(() => {\n return isNumber(size.value)\n ? (ns.cssVarBlock({\n size: addUnit(size.value)!,\n }) as CSSProperties)\n : undefined\n})\n\nconst fitStyle = computed<CSSProperties>(() => ({\n objectFit: props.fit,\n}))\n\n// need reset hasLoadError to false if src changed\nwatch(\n () => [props.src, props.srcSet],\n () => (hasLoadError.value = false)\n)\n\nfunction handleError(e: Event) {\n hasLoadError.value = true\n emit('error', e)\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;EAgCA,MAAM,QAAQ;EAKd,MAAM,OAAO;EAEb,MAAM,qBAAqB,OAAO,uBAAuB,OAAS;EAElE,MAAM,KAAK,aAAa,SAAQ;EAEhC,MAAM,eAAe,IAAI,MAAK;EAE9B,MAAM,OAAO,eAAe,MAAM,QAAQ,oBAAoB,KAAI;EAClE,MAAM,QAAQ,eACN,MAAM,SAAS,oBAAoB,SAAS,SACpD;EAEA,MAAM,cAAc,eAAe;GACjC,MAAM,EAAE,SAAS;GACjB,MAAM,YAAY,CAAC,GAAG,GAAG,CAAA;AACzB,OAAI,SAAS,KAAK,MAAM,CAAE,WAAU,KAAK,GAAG,EAAE,KAAK,MAAM,CAAA;AACzD,OAAI,KAAM,WAAU,KAAK,GAAG,EAAE,OAAO,CAAA;AACrC,OAAI,MAAM,MAAO,WAAU,KAAK,GAAG,EAAE,MAAM,MAAM,CAAA;AACjD,UAAO;IACR;EAED,MAAM,YAAY,eAAe;AAC/B,UAAO,SAAS,KAAK,MAAK,GACrB,GAAG,YAAY,EACd,MAAM,QAAQ,KAAK,MAAM,EAC1B,CAAC,GACF;IACL;EAED,MAAM,WAAW,gBAA+B,EAC9C,WAAW,MAAM,KAClB,EAAC;AAGF,cACQ,CAAC,MAAM,KAAK,MAAM,OAAO,QACxB,aAAa,QAAQ,MAC9B;EAEA,SAAS,YAAY,GAAU;AAC7B,gBAAa,QAAQ;AACrB,QAAK,SAAS,EAAC;;;uBA9Ef,mBAaO,QAAA;IAbA,OAAK,eAAE,YAAA,MAAW;IAAG,OAAK,eAAE,UAAA,MAAS;QAEjC,QAAA,OAAO,QAAA,WAAM,CAAM,aAAA,sBAD5B,mBAOE,OAAA;;IALC,KAAK,QAAA;IACL,KAAK,QAAA;IACL,QAAQ,QAAA;IACR,OAAK,eAAE,SAAA,MAAQ;IACf,SAAO;+BAEU,QAAA,qBAApB,YAEU,MAAA,OAAA,EAAA,EAAA,KAAA,GAAA,EAAA;2BADgB,eAAxB,YAAwB,wBAAR,QAAA,KAAI,CAAA;;SAEtB,WAAe,KAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA"}
@@ -0,0 +1,8 @@
import avatar_vue_vue_type_script_setup_true_lang_default from "./avatar.vue_vue_type_script_setup_true_lang.mjs";
//#region ../../packages/components/avatar/src/avatar.vue
var avatar_default = avatar_vue_vue_type_script_setup_true_lang_default;
//#endregion
export { avatar_default as default };
//# sourceMappingURL=avatar2.mjs.map
@@ -0,0 +1 @@
{"version":3,"file":"avatar2.mjs","names":[],"sources":["../../../../../../packages/components/avatar/src/avatar.vue"],"sourcesContent":["<template>\n <span :class=\"avatarClass\" :style=\"sizeStyle\">\n <img\n v-if=\"(src || srcSet) && !hasLoadError\"\n :src=\"src\"\n :alt=\"alt\"\n :srcset=\"srcSet\"\n :style=\"fitStyle\"\n @error=\"handleError\"\n />\n <el-icon v-else-if=\"icon\">\n <component :is=\"icon\" />\n </el-icon>\n <slot v-else />\n </span>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, ref, watch } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { useNamespace } from '@element-plus/hooks'\nimport { addUnit, isNumber, isString } from '@element-plus/utils'\nimport { avatarEmits } from './avatar'\nimport { avatarGroupContextKey } from './constants'\n\nimport type { AvatarProps } from './avatar'\nimport type { CSSProperties } from 'vue'\n\ndefineOptions({\n name: 'ElAvatar',\n})\n\nconst props = withDefaults(defineProps<AvatarProps>(), {\n src: '',\n fit: 'cover',\n})\n\nconst emit = defineEmits(avatarEmits)\n\nconst avatarGroupContext = inject(avatarGroupContextKey, undefined)\n\nconst ns = useNamespace('avatar')\n\nconst hasLoadError = ref(false)\n\nconst size = computed(() => props.size ?? avatarGroupContext?.size)\nconst shape = computed(\n () => props.shape ?? avatarGroupContext?.shape ?? 'circle'\n)\n\nconst avatarClass = computed(() => {\n const { icon } = props\n const classList = [ns.b()]\n if (isString(size.value)) classList.push(ns.m(size.value))\n if (icon) classList.push(ns.m('icon'))\n if (shape.value) classList.push(ns.m(shape.value))\n return classList\n})\n\nconst sizeStyle = computed(() => {\n return isNumber(size.value)\n ? (ns.cssVarBlock({\n size: addUnit(size.value)!,\n }) as CSSProperties)\n : undefined\n})\n\nconst fitStyle = computed<CSSProperties>(() => ({\n objectFit: props.fit,\n}))\n\n// need reset hasLoadError to false if src changed\nwatch(\n () => [props.src, props.srcSet],\n () => (hasLoadError.value = false)\n)\n\nfunction handleError(e: Event) {\n hasLoadError.value = true\n emit('error', e)\n}\n</script>\n"],"mappings":""}
@@ -0,0 +1,11 @@
import { AvatarProps } from "./avatar.js";
import { InjectionKey } from "vue";
//#region ../../packages/components/avatar/src/constants.d.ts
interface AvatarGroupContext {
size?: AvatarProps['size'];
shape?: AvatarProps['shape'];
}
declare const avatarGroupContextKey: InjectionKey<AvatarGroupContext>;
//#endregion
export { AvatarGroupContext, avatarGroupContextKey };
@@ -0,0 +1,6 @@
//#region ../../packages/components/avatar/src/constants.ts
const avatarGroupContextKey = Symbol("avatarGroupContextKey");
//#endregion
export { avatarGroupContextKey };
//# sourceMappingURL=constants.mjs.map
@@ -0,0 +1 @@
{"version":3,"file":"constants.mjs","names":[],"sources":["../../../../../../packages/components/avatar/src/constants.ts"],"sourcesContent":["import type { InjectionKey } from 'vue'\nimport type { AvatarProps } from './avatar'\n\nexport interface AvatarGroupContext {\n size?: AvatarProps['size']\n shape?: AvatarProps['shape']\n}\n\nexport const avatarGroupContextKey: InjectionKey<AvatarGroupContext> = Symbol(\n 'avatarGroupContextKey'\n)\n"],"mappings":";AAQA,MAAa,wBAA0D,OACrE,wBACD"}
@@ -0,0 +1,8 @@
import { _default } from "./avatar.vue.js";
import { _default as _default$1 } from "./avatar-group.js";
//#region ../../packages/components/avatar/src/instance.d.ts
type AvatarInstance = InstanceType<typeof _default> & unknown;
type AvatarGroupInstance = InstanceType<typeof _default$1> & unknown;
//#endregion
export { AvatarGroupInstance, AvatarInstance };
@@ -0,0 +1,2 @@
import "../../base/style/css.mjs";
import "element-plus/theme-chalk/el-avatar.css";
@@ -0,0 +1,2 @@
import "../../base/style/index.mjs";
import "element-plus/theme-chalk/src/avatar.scss";