Avatar.js 1.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
  2. import _extends from "@babel/runtime/helpers/esm/extends";
  3. import { createVNode as _createVNode } from "vue";
  4. import { computed, defineComponent } from 'vue';
  5. import classNames from '../_util/classNames';
  6. import initDefaultProps from '../_util/props-util/initDefaultProps';
  7. import useConfigInject from '../config-provider/hooks/useConfigInject';
  8. import Element, { skeletonElementProps } from './Element';
  9. import useStyle from './style';
  10. export const avatarProps = () => {
  11. return _extends(_extends({}, skeletonElementProps()), {
  12. shape: String
  13. });
  14. };
  15. const SkeletonAvatar = defineComponent({
  16. compatConfig: {
  17. MODE: 3
  18. },
  19. name: 'ASkeletonAvatar',
  20. props: initDefaultProps(avatarProps(), {
  21. size: 'default',
  22. shape: 'circle'
  23. }),
  24. setup(props) {
  25. const {
  26. prefixCls
  27. } = useConfigInject('skeleton', props);
  28. const [wrapSSR, hashId] = useStyle(prefixCls);
  29. const cls = computed(() => classNames(prefixCls.value, `${prefixCls.value}-element`, {
  30. [`${prefixCls.value}-active`]: props.active
  31. }, hashId.value));
  32. return () => {
  33. return wrapSSR(_createVNode("div", {
  34. "class": cls.value
  35. }, [_createVNode(Element, _objectSpread(_objectSpread({}, props), {}, {
  36. "prefixCls": `${prefixCls.value}-avatar`
  37. }), null)]));
  38. };
  39. }
  40. });
  41. export default SkeletonAvatar;