@vuesax-alpha/nightly
Version:
A Component Library for Vue 3
195 lines (192 loc) • 6.64 kB
JavaScript
import { defineComponent, useSlots, ref, computed, watch, onMounted, openBlock, createElementBlock, normalizeClass, normalizeStyle, unref, createElementVNode, createVNode, createCommentVNode, Fragment, createTextVNode, toDisplayString, renderSlot, withDirectives, vShow } from 'vue';
import '../../../hooks/index.mjs';
import '../../../utils/index.mjs';
import { IconLoading } from '../../icon/index.mjs';
import { avatarProps } from './avatar.mjs';
import './composables/index.mjs';
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
import { useAvatarStatus } from './composables/use-avatar-status.mjs';
import { useVuesaxBaseComponent } from '../../../hooks/use-base-component/index.mjs';
import { useColor } from '../../../hooks/use-common-props/index.mjs';
import { getVsColor, setCssVar } from '../../../utils/color.mjs';
const __default__ = defineComponent({
name: "VsAvatar"
});
const _sfc_main = defineComponent({
...__default__,
props: avatarProps,
setup(__props) {
const props = __props;
const slots = useSlots();
const ns = useNamespace("avatar");
const root$ = ref();
const { isHidden, isLastest, getText, showLastest, moreNumber } = useAvatarStatus(slots);
const vsBaseClasses = useVuesaxBaseComponent(useColor());
const avatarClassess = computed(() => [
ns.b("content"),
vsBaseClasses,
props.history && "history",
props.historyGradient && "history--gradient",
props.shape != "default" && `${ns.be("content", props.shape)}`,
isHidden.value && `${ns.be("content", "hidden")}`,
isLastest.value && `${ns.be("content", "latest")}`,
slots.icons && `${ns.be("content", "hasIcons")}`
]);
const avatarStyles = computed(
() => ({
width: `${props.size}px`,
height: `${props.size}px`,
cursor: props.pointer ? "pointer" : "",
...ns.cssVar({
color: getVsColor(props.color)
})
})
);
watch(
() => props.badgeColor,
() => {
var _a;
setCssVar("avatar-badge", getVsColor(props.badgeColor), root$.value);
(_a = root$.value) == null ? void 0 : _a.classList.add(ns.em("badge", "change-color"));
}
);
onMounted(() => {
var _a;
(_a = root$.value) == null ? void 0 : _a.classList.add(ns.em("badge", "change-color"));
setCssVar("avatar-badge", getVsColor(props.badgeColor), root$.value);
});
return (_ctx, _cache) => {
return openBlock(), createElementBlock(
"div",
{
ref_key: "root$",
ref: root$,
class: normalizeClass(avatarClassess.value),
style: normalizeStyle(avatarStyles.value)
},
[
_ctx.loading ? (openBlock(), createElementBlock(
"div",
{
key: 0,
class: normalizeClass(unref(ns).e("loading"))
},
[
createElementVNode(
"div",
{
class: normalizeClass(unref(ns).em("loading", "animate"))
},
[
createVNode(unref(IconLoading))
],
2
)
],
2
)) : createCommentVNode("v-if", true),
createElementVNode(
"div",
{
class: normalizeClass([
unref(ns).b(),
unref(getText).length > 2 && unref(ns).em("letter", `${unref(getText).length}`)
])
},
[
_ctx.$slots.text ? (openBlock(), createElementBlock(
Fragment,
{ key: 0 },
[
createTextVNode(
toDisplayString(unref(getText)),
1
)
],
64
)) : createCommentVNode("v-if", true),
renderSlot(_ctx.$slots, "default")
],
2
),
_ctx.$slots.badge || _ctx.badge ? (openBlock(), createElementBlock(
"div",
{
key: 1,
class: normalizeClass([
unref(ns).e("badge"),
unref(ns).is("slot", !!_ctx.$slots.badge),
unref(ns).is("writing", _ctx.writing),
_ctx.badgePosition
])
},
[
_ctx.writing ? (openBlock(), createElementBlock(
"div",
{
key: 0,
class: normalizeClass(unref(ns).e("points"))
},
[
createElementVNode(
"div",
{
class: normalizeClass(unref(ns).em("points", "item"))
},
null,
2
),
createElementVNode(
"div",
{
class: normalizeClass(unref(ns).em("points", "item"))
},
null,
2
),
createElementVNode(
"div",
{
class: normalizeClass(unref(ns).em("points", "item"))
},
null,
2
)
],
2
)) : renderSlot(_ctx.$slots, "badge", { key: 1 })
],
2
)) : createCommentVNode("v-if", true),
unref(isLastest) ? withDirectives((openBlock(), createElementBlock(
"div",
{
key: 2,
class: normalizeClass(unref(ns).e("lastest"))
},
toDisplayString(`+${unref(moreNumber)}`),
3
)), [
[vShow, unref(showLastest)]
]) : createCommentVNode("v-if", true),
_ctx.$slots.icons ? (openBlock(), createElementBlock(
"div",
{
key: 3,
class: normalizeClass(unref(ns).e("icons"))
},
[
renderSlot(_ctx.$slots, "icons")
],
2
)) : createCommentVNode("v-if", true)
],
6
);
};
}
});
var Avatar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/home/runner/work/vuesax-alpha/vuesax-alpha/packages/components/avatar/src/avatar.vue"]]);
export { Avatar as default };
//# sourceMappingURL=avatar2.mjs.map