@antsoo-lib/components 0.1.9 → 0.1.12

package/src/auto-complete/index.en-US.md

@@ -1,95 +0,0 @@
----
-category: Components
-type: Data Entry
-cols: 2
-title: AutoComplete
-cover: https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*g8THS4NpV6sAAAAAAAAAAAAADrJ8AQ/original
-coverDark: https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*WERTQ6qvgEYAAAAAAAAAAAAADrJ8AQ/original
----
-
-Autocomplete function of input field.
-
-## When To Use
-
-- When you need an input box instead of a selector.
-- When you need input suggestions or helping text.
-
-The differences with Select are:
-
-- AutoComplete is an input box with text hints, and users can type freely. The keyword is aiding **input**.
-- Select is selecting among given choices. The keyword is **select**.
-
-## API
-
-```html
-<a-auto-complete v-model:value="value" :options="options" />
-```
-
-| Property                              | Description                                                                                                                                                                                                                                                    | Type                                                                                                                                                        | Default                 | Version |
-| ------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------- | ------- |
-| allowClear                            | Show clear button, effective in multiple mode only.                                                                                                                                                                                                            | boolean                                                                                                                                                     | false                   |         |
-| autofocus                             | get focus when component mounted                                                                                                                                                                                                                               | boolean                                                                                                                                                     | false                   |         |
-| backfill                              | backfill selected item the input when using keyboard                                                                                                                                                                                                           | boolean                                                                                                                                                     | false                   |         |
-| bordered                              | Whether has border style                                                                                                                                                                                                                                       | boolean                                                                                                                                                     | true                    | 4.0     |
-| clearIcon                             | Use slot custom clear icon                                                                                                                                                                                                                                     | slot                                                                                                                                                        | `<CloseCircleFilled />` | 4.0     |
-| default (for customize input element) | customize input element                                                                                                                                                                                                                                        | slot                                                                                                                                                        | `<Input />`             |         |
-| defaultActiveFirstOption              | Whether active first option by default                                                                                                                                                                                                                         | boolean                                                                                                                                                     | true                    |         |
-| defaultOpen                           | Initial open state of dropdown                                                                                                                                                                                                                                 | boolean                                                                                                                                                     | -                       |         |
-| disabled                              | Whether disabled select                                                                                                                                                                                                                                        | boolean                                                                                                                                                     | false                   |         |
-| popupClassName                        | The className of dropdown menu                                                                                                                                                                                                                                 | string                                                                                                                                                      | -                       | 4.0     |
-| dropdownMatchSelectWidth              | Determine whether the dropdown menu and the select input are the same width. Default set `min-width` same as input. Will ignore when value less than select width. `false` will disable virtual scroll                                                         | boolean \| number                                                                                                                                           | true                    |         |
-| dropdownMenuStyle                     | additional style applied to dropdown menu                                                                                                                                                                                                                      | object                                                                                                                                                      |                         | 1.5.0   |
-| filterOption                          | If true, filter options by input, if function, filter options against it. The function will receive two arguments, `inputValue` and `option`, if the function returns `true`, the option will be included in the filtered set; Otherwise, it will be excluded. | boolean or function(inputValue, option)                                                                                                                     | true                    |         |
-| open                                  | Controlled open state of dropdown                                                                                                                                                                                                                              | boolean                                                                                                                                                     | -                       |         |
-| option                                | custom render option by slot                                                                                                                                                                                                                                   | v-slot:option="{value, label, [disabled, key, title]}"                                                                                                      | -                       | 3.0     |
-| options                               | Data source for autocomplete                                                                                                                                                                                                                                   | [DataSourceItemType](https://github.com/vueComponent/ant-design-vue/blob/724d53b907e577cf5880c1e6742d4c3f924f8f49/components/auto-complete/index.vue#L9)\[] |                         |         |
-| placeholder                           | placeholder of input                                                                                                                                                                                                                                           | string                                                                                                                                                      | -                       |         |
-| status                                | Set validation status                                                                                                                                                                                                                                          | 'error' \| 'warning'                                                                                                                                        | -                       | 3.3.0   |
-| v-model:value                         | selected option                                                                                                                                                                                                                                                | string\|string\[]\|{ key: string, label: string\|vNodes }\|Array&lt;{ key: string, label: string\|vNodes }>                                                 | -                       |         |
-
-### events
-
-| Events Name           | Description                                                                      | Arguments               | Version |       |
-| --------------------- | -------------------------------------------------------------------------------- | ----------------------- | ------- | ----- |
-| blur                  | Called when leaving the component.                                               | function()              |         |       |
-| change                | Called when select an option or input value change, or value of input is changed | function(value)         |         |       |
-| dropdownVisibleChange | Call when dropdown open                                                          | function(open)          |         |       |
-| focus                 | Called when entering the component                                               | function()              |         |       |
-| search                | Called when searching items.                                                     | function(value)         | -       |       |
-| select                | Called when a option is selected. param is option's value and option instance.   | function(value, option) |         |       |
-| clear                 | Called when clear                                                                | function                | -       | 3.3.0 |
-
-## Methods
-
-| Name    | Description  | Version |
-| ------- | ------------ | ------- |
-| blur()  | remove focus |         |
-| focus() | get focus    |         |
-
-## FAQ
-
-### Part of the api in v2 are not available in v3?
-
-AutoComplete is an Input component that supports auto complete tips. As such, it should not support props like `labelInValue` that affect value display. In v3, the AutoComplete implementation can not handle the case where the `value` and `label` are identical. v4 not longer support `label` as the value input.
-
-Besides, to unify the API, `dataSource` is replaced with `options`. You can migrate with the following change:
-
-#### v2
-
-```ts
-dataSource = ['light', 'bamboo']
-// or
-dataSource = [
-  { value: 'light', text: 'Light' },
-  { value: 'bamboo', text: 'Bamboo' },
-]
-```
-
-#### v3
-
-```ts
-options = [
-  { value: 'light', label: 'Light' },
-  { value: 'bamboo', label: 'Bamboo' },
-]
-```

package/src/auto-complete/index.tsx

@@ -1,174 +0,0 @@
-import type { App, CSSProperties, ExtractPropTypes, PropType, VNode } from 'vue'
-import { defineComponent, ref } from 'vue'
-
-import omit from '../_util/omit'
-import { flattenChildren, isValidElement } from '../_util/props-util'
-import type { InputStatus } from '../_util/statusUtils'
-import type { CustomSlotsType } from '../_util/type'
-import warning from '../_util/warning'
-import useConfigInject from '../config-provider/hooks/useConfigInject'
-import Select, { selectProps } from '../select'
-import OptGroup from './OptGroup'
-import Option from './Option'
-
-function isSelectOptionOrSelectOptGroup(child: any): boolean {
-  return child?.type?.isSelectOption || child?.type?.isSelectOptGroup
-}
-
-export const autoCompleteProps = () => ({
-  ...omit(selectProps(), ['loading', 'mode', 'optionLabelProp', 'labelInValue']),
-  dataSource: Array as PropType<{ value: any; text: any }[] | string[]>,
-  dropdownMenuStyle: {
-    type: Object as PropType<CSSProperties>,
-    default: undefined as CSSProperties,
-  },
-  // optionLabelProp: String,
-  dropdownMatchSelectWidth: { type: [Number, Boolean], default: true },
-  prefixCls: String,
-  showSearch: { type: Boolean, default: undefined },
-  transitionName: String,
-  choiceTransitionName: { type: String, default: 'zoom' },
-  autofocus: { type: Boolean, default: undefined },
-  backfill: { type: Boolean, default: undefined },
-  // optionLabelProp: PropTypes.string.def('children'),
-  filterOption: { type: [Boolean, Function], default: false },
-  defaultActiveFirstOption: { type: Boolean, default: true },
-  status: String as PropType<InputStatus>,
-})
-
-export type AutoCompleteProps = Partial<ExtractPropTypes<ReturnType<typeof autoCompleteProps>>>
-
-export const AutoCompleteOption = Option
-
-export const AutoCompleteOptGroup = OptGroup
-
-const AutoComplete = defineComponent({
-  compatConfig: { MODE: 3 },
-  name: 'AAutoComplete',
-  inheritAttrs: false,
-  props: autoCompleteProps(),
-  // emits: ['change', 'select', 'focus', 'blur'],
-  slots: Object as CustomSlotsType<{
-    option: any
-    // deprecated, should use props `options` instead, not slot
-    options: any
-    default: any
-    notFoundContent: any
-    dataSource: any
-    clearIcon: any
-  }>,
-  setup(props, { slots, attrs, expose }) {
-    warning(
-      !('dataSource' in slots),
-      'AutoComplete',
-      '`dataSource` slot is deprecated, please use props `options` instead.',
-    )
-    warning(
-      !('options' in slots),
-      'AutoComplete',
-      '`options` slot is deprecated, please use props `options` instead.',
-    )
-    warning(
-      !props.dropdownClassName,
-      'AutoComplete',
-      '`dropdownClassName` is deprecated, please use `popupClassName` instead.',
-    )
-    const selectRef = ref()
-    const getInputElement = () => {
-      const children = flattenChildren(slots.default?.())
-      const element = children.length ? children[0] : undefined
-      return element
-    }
-
-    const focus = () => {
-      selectRef.value?.focus()
-    }
-
-    const blur = () => {
-      selectRef.value?.blur()
-    }
-
-    expose({
-      focus,
-      blur,
-    })
-    const { prefixCls } = useConfigInject('select', props)
-    return () => {
-      const { size, dataSource, notFoundContent = slots.notFoundContent?.() } = props
-      let optionChildren: VNode[]
-      const { class: className } = attrs
-      const cls = {
-        [className as string]: !!className,
-        [`${prefixCls.value}-lg`]: size === 'large',
-        [`${prefixCls.value}-sm`]: size === 'small',
-        [`${prefixCls.value}-show-search`]: true,
-        [`${prefixCls.value}-auto-complete`]: true,
-      }
-      if (props.options === undefined) {
-        const childArray = slots.dataSource?.() || slots.options?.() || []
-        if (childArray.length && isSelectOptionOrSelectOptGroup(childArray[0])) {
-          optionChildren = childArray
-        } else {
-          optionChildren = dataSource
-            ? dataSource.map((item: any) => {
-                if (isValidElement(item)) {
-                  return item
-                }
-                switch (typeof item) {
-                  case 'string':
-                    return (
-                      <Option key={item} value={item}>
-                        {item}
-                      </Option>
-                    )
-                  case 'object':
-                    return (
-                      <Option key={item.value} value={item.value}>
-                        {item.text}
-                      </Option>
-                    )
-                  default:
-                    throw new Error(
-                      'AutoComplete[dataSource] only supports type `string[] | Object[]`.',
-                    )
-                }
-              })
-            : []
-        }
-      }
-
-      const selectProps = omit(
-        {
-          ...props,
-          ...(attrs as any),
-          mode: Select.SECRET_COMBOBOX_MODE_DO_NOT_USE,
-          // optionLabelProp,
-          getInputElement,
-          notFoundContent,
-          // placeholder: '',
-          class: cls,
-          popupClassName: props.popupClassName || props.dropdownClassName,
-          ref: selectRef,
-        },
-        ['dataSource', 'loading'],
-      )
-      return (
-        <Select {...selectProps} v-slots={omit(slots, ['default', 'dataSource', 'options'])}>
-          {optionChildren}
-        </Select>
-      )
-    }
-  },
-})
-
-/* istanbul ignore next */
-export default Object.assign(AutoComplete, {
-  Option,
-  OptGroup,
-  install(app: App) {
-    app.component(AutoComplete.name, AutoComplete)
-    app.component(Option.displayName, Option)
-    app.component(OptGroup.displayName, OptGroup)
-    return app
-  },
-})

package/src/auto-complete/index.zh-CN.md

@@ -1,96 +0,0 @@
----
-category: Components
-subtitle: 自动完成
-type: 数据录入
-cols: 2
-title: AutoComplete
-cover: https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*g8THS4NpV6sAAAAAAAAAAAAADrJ8AQ/original
-coverDark: https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*WERTQ6qvgEYAAAAAAAAAAAAADrJ8AQ/original
----
-
-输入框自动完成功能。
-
-## 何时使用
-
-- 需要一个输入框而不是选择器。
-- 需要输入建议/辅助提示。
-
-和 Select 的区别是：
-
-- AutoComplete 是一个带提示的文本输入框，用户可以自由输入，关键词是辅助**输入**。
-- Select 是在限定的可选项中进行选择，关键词是**选择**。
-
-## API
-
-```html
-<a-auto-complete v-model:value="value" :options="options" />
-```
-
-| 参数                     | 说明                                                                                                                                             | 类型                                                                                                                                                        | 默认值                  | 版本  |
-| ------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------- | ----- |
-| allowClear               | 支持清除, 单选模式有效                                                                                                                           | boolean                                                                                                                                                     | false                   |       |
-| autofocus                | 自动获取焦点                                                                                                                                     | boolean                                                                                                                                                     | false                   |       |
-| backfill                 | 使用键盘选择选项的时候把选中项回填到输入框中                                                                                                     | boolean                                                                                                                                                     | false                   |       |
-| bordered                 | 是否有边框                                                                                                                                       | boolean                                                                                                                                                     | true                    | 4.0   |
-| clearIcon                | 使用插槽自定义清除按钮                                                                                                                           | slot                                                                                                                                                        | `<CloseCircleFilled />` | 4.0   |
-| default (自定义输入框)   | 自定义输入框                                                                                                                                     | slot                                                                                                                                                        | `<Input />`             |       |
-| defaultActiveFirstOption | 是否默认高亮第一个选项。                                                                                                                         | boolean                                                                                                                                                     | true                    |       |
-| defaultOpen              | 是否默认展开下拉菜单                                                                                                                             | boolean                                                                                                                                                     | -                       |       |
-| disabled                 | 是否禁用                                                                                                                                         | boolean                                                                                                                                                     | false                   |       |
-| popupClassName           | 下拉菜单的 className 属性                                                                                                                        | string                                                                                                                                                      | -                       | 4.0   |
-| dropdownMatchSelectWidth | 下拉菜单和选择器同宽。默认将设置 `min-width`，当值小于选择框宽度时会被忽略。false 时会关闭虚拟滚动                                               | boolean \| number                                                                                                                                           | true                    |       |
-| dropdownMenuStyle        | dropdown 菜单自定义样式                                                                                                                          | object                                                                                                                                                      |                         | 1.5.0 |
-| filterOption             | 是否根据输入项进行筛选。当其为一个函数时，会接收 `inputValue` `option` 两个参数，当 `option` 符合筛选条件时，应返回 `true`，反之则返回 `false`。 | boolean or function(inputValue, option)                                                                                                                     | true                    |       |
-| open                     | 是否展开下拉菜单                                                                                                                                 | boolean                                                                                                                                                     | -                       |       |
-| option                   | 通过 option 插槽，自定义节点                                                                                                                     | v-slot:option="{value, label, [disabled, key, title]}"                                                                                                      | -                       | 3.0   |
-| options                  | 自动完成的数据源                                                                                                                                 | [DataSourceItemType](https://github.com/vueComponent/ant-design-vue/blob/724d53b907e577cf5880c1e6742d4c3f924f8f49/components/auto-complete/index.vue#L9)\[] |                         |       |
-| placeholder              | 输入框提示                                                                                                                                       | string \| slot                                                                                                                                              | -                       |       |
-| status                   | 设置校验状态                                                                                                                                     | 'error' \| 'warning'                                                                                                                                        | -                       | 3.3.0 |
-| v-model:value            | 指定当前选中的条目                                                                                                                               | string\|string\[]\|{ key: string, label: string\|vNodes }\|Array&lt;{ key: string, label: string\|vNodes }>                                                 | 无                      |       |
-
-### 事件
-
-| 事件名称              | 说明                                              | 回调参数                | 版本 |
-| --------------------- | ------------------------------------------------- | ----------------------- | ---- | ----- |
-| blur                  | 失去焦点时的回调                                  | function()              |      |
-| change                | 选中 option，或 input 的 value 变化时，调用此函数 | function(value)         |      |
-| dropdownVisibleChange | 展开下拉菜单的回调                                | function(open)          |      |
-| focus                 | 获得焦点时的回调                                  | function()              |      |
-| search                | 搜索补全项的时候调用                              | function(value)         |      |
-| select                | 被选中时调用，参数为选中项的 value 值             | function(value, option) |      |
-| clear                 | 清除内容时回调                                    | function                | -    | 3.3.0 |
-
-## 方法
-
-| 名称    | 描述     | 版本 |
-| ------- | -------- | ---- |
-| blur()  | 移除焦点 |      |
-| focus() | 获取焦点 |      |
-
-## FAQ
-
-### v2 的部分属性为何在 v3 中没有了？
-
-AutoComplete 组件是一个支持自动提示的 Input 组件，因而其不具有 `labelInValue` 等影响 value 展示的属性。在 v2 版本，AutoComplete 实现存在输入值如果遇到 `value` 与 `label` 相同时无法映射的问题。 v3 中不再支持 `label` 为值的输入形态。
-
-此外为了统一 API，`dataSource` 改为 `options` 你可以如下转换：
-
-#### v2
-
-```ts
-dataSource = ['light', 'bamboo']
-// or
-dataSource = [
-  { value: 'light', text: 'Light' },
-  { value: 'bamboo', text: 'Bamboo' },
-]
-```
-
-#### v3
-
-```ts
-options = [
-  { value: 'light', label: 'Light' },
-  { value: 'bamboo', label: 'Bamboo' },
-]
-```

package/src/avatar/Avatar.tsx

@@ -1,222 +0,0 @@
-import type { CSSProperties, ExtractPropTypes, PropType } from 'vue'
-import { computed, defineComponent, nextTick, onMounted, shallowRef, watch } from 'vue'
-
-import eagerComputed from '../_util/eagerComputed'
-import useBreakpoint from '../_util/hooks/useBreakpoint'
-import { getPropsSlot } from '../_util/props-util'
-import type { Breakpoint, ScreenSizeMap } from '../_util/responsiveObserve'
-import { responsiveArray } from '../_util/responsiveObserve'
-import type { CustomSlotsType, VueNode } from '../_util/type'
-import PropTypes from '../_util/vue-types'
-import useConfigInject from '../config-provider/hooks/useConfigInject'
-import ResizeObserver from '../vc-resize-observer'
-import { useAvatarInjectContext } from './AvatarContext'
-import useStyle from './style'
-
-export type AvatarSize = 'large' | 'small' | 'default' | number | ScreenSizeMap
-
-export const avatarProps = () => ({
-  prefixCls: String,
-  shape: { type: String as PropType<'circle' | 'square'>, default: 'circle' },
-  size: {
-    type: [Number, String, Object] as PropType<AvatarSize>,
-    default: (): AvatarSize => 'default',
-  },
-  src: String,
-  /** Srcset of image avatar */
-  srcset: String,
-  icon: PropTypes.any,
-  alt: String,
-  gap: Number,
-  draggable: { type: Boolean, default: undefined },
-  crossOrigin: String as PropType<'' | 'anonymous' | 'use-credentials'>,
-  loadError: {
-    type: Function as PropType<() => boolean>,
-  },
-})
-
-export type AvatarProps = Partial<ExtractPropTypes<ReturnType<typeof avatarProps>>>
-
-const Avatar = defineComponent({
-  compatConfig: { MODE: 3 },
-  name: 'AAvatar',
-  inheritAttrs: false,
-  props: avatarProps(),
-  slots: Object as CustomSlotsType<{
-    icon: any
-    default: any
-  }>,
-  setup(props, { slots, attrs }) {
-    const isImgExist = shallowRef(true)
-    const isMounted = shallowRef(false)
-    const scale = shallowRef(1)
-
-    const avatarChildrenRef = shallowRef<HTMLElement>(null)
-    const avatarNodeRef = shallowRef<HTMLElement>(null)
-
-    const { prefixCls } = useConfigInject('avatar', props)
-    const [wrapSSR, hashId] = useStyle(prefixCls)
-    const avatarCtx = useAvatarInjectContext()
-    const size = computed(() => {
-      return props.size === 'default' ? avatarCtx.size : props.size
-    })
-    const screens = useBreakpoint()
-    const responsiveSize = eagerComputed(() => {
-      if (typeof props.size !== 'object') {
-        return undefined
-      }
-      const currentBreakpoint: Breakpoint = responsiveArray.find((screen) => screens.value[screen])!
-      const currentSize = props.size[currentBreakpoint]
-
-      return currentSize
-    })
-
-    const responsiveSizeStyle = (hasIcon: boolean) => {
-      if (responsiveSize.value) {
-        return {
-          width: `${responsiveSize.value}px`,
-          height: `${responsiveSize.value}px`,
-          lineHeight: `${responsiveSize.value}px`,
-          fontSize: `${hasIcon ? responsiveSize.value / 2 : 18}px`,
-        }
-      }
-      return {}
-    }
-
-    const setScaleParam = () => {
-      if (!avatarChildrenRef.value || !avatarNodeRef.value) {
-        return
-      }
-      const childrenWidth = avatarChildrenRef.value.offsetWidth // offsetWidth avoid affecting be transform scale
-      const nodeWidth = avatarNodeRef.value.offsetWidth
-      // denominator is 0 is no meaning
-      if (childrenWidth !== 0 && nodeWidth !== 0) {
-        const { gap = 4 } = props
-        if (gap * 2 < nodeWidth) {
-          scale.value =
-            nodeWidth - gap * 2 < childrenWidth ? (nodeWidth - gap * 2) / childrenWidth : 1
-        }
-      }
-    }
-
-    const handleImgLoadError = () => {
-      const { loadError } = props
-      const errorFlag = loadError?.()
-      if (errorFlag !== false) {
-        isImgExist.value = false
-      }
-    }
-
-    watch(
-      () => props.src,
-      () => {
-        nextTick(() => {
-          isImgExist.value = true
-          scale.value = 1
-        })
-      },
-    )
-
-    watch(
-      () => props.gap,
-      () => {
-        nextTick(() => {
-          setScaleParam()
-        })
-      },
-    )
-
-    onMounted(() => {
-      nextTick(() => {
-        setScaleParam()
-        isMounted.value = true
-      })
-    })
-
-    return () => {
-      const { shape, src, alt, srcset, draggable, crossOrigin } = props
-      const mergeShape = avatarCtx.shape ?? shape
-      const icon = getPropsSlot(slots, props, 'icon')
-      const pre = prefixCls.value
-      const classString = {
-        [`${attrs.class}`]: !!attrs.class,
-        [pre]: true,
-        [`${pre}-lg`]: size.value === 'large',
-        [`${pre}-sm`]: size.value === 'small',
-        [`${pre}-${mergeShape}`]: true,
-        [`${pre}-image`]: src && isImgExist.value,
-        [`${pre}-icon`]: icon,
-        [hashId.value]: true,
-      }
-
-      const sizeStyle: CSSProperties =
-        typeof size.value === 'number'
-          ? {
-              width: `${size.value}px`,
-              height: `${size.value}px`,
-              lineHeight: `${size.value}px`,
-              fontSize: icon ? `${size.value / 2}px` : '18px',
-            }
-          : {}
-
-      const children: VueNode = slots.default?.()
-      let childrenToRender
-      if (src && isImgExist.value) {
-        childrenToRender = (
-          <img
-            draggable={draggable}
-            src={src}
-            srcset={srcset}
-            onError={handleImgLoadError}
-            alt={alt}
-            crossorigin={crossOrigin}
-          />
-        )
-      } else if (icon) {
-        childrenToRender = icon
-      } else if (isMounted.value || scale.value !== 1) {
-        const transformString = `scale(${scale.value}) translateX(-50%)`
-        const childrenStyle: CSSProperties = {
-          msTransform: transformString,
-          WebkitTransform: transformString,
-          transform: transformString,
-        }
-        const sizeChildrenStyle =
-          typeof size.value === 'number'
-            ? {
-                lineHeight: `${size.value}px`,
-              }
-            : {}
-        childrenToRender = (
-          <ResizeObserver onResize={setScaleParam}>
-            <span
-              class={`${pre}-string`}
-              ref={avatarChildrenRef}
-              style={{ ...sizeChildrenStyle, ...childrenStyle }}
-            >
-              {children}
-            </span>
-          </ResizeObserver>
-        )
-      } else {
-        childrenToRender = (
-          <span class={`${pre}-string`} ref={avatarChildrenRef} style={{ opacity: 0 }}>
-            {children}
-          </span>
-        )
-      }
-      return wrapSSR(
-        <span
-          {...attrs}
-          ref={avatarNodeRef}
-          class={classString}
-          style={[sizeStyle, responsiveSizeStyle(!!icon), attrs.style as CSSProperties]}
-        >
-          {childrenToRender}
-        </span>,
-      )
-    }
-  },
-})
-
-export default Avatar

package/src/avatar/AvatarContext.ts

@@ -1,18 +0,0 @@
-import type { InjectionKey } from 'vue'
-import { inject, provide } from 'vue'
-
-import type { ScreenSizeMap } from '../_util/responsiveObserve'
-
-export type AvatarSize = 'large' | 'small' | 'default' | number | ScreenSizeMap
-export interface AvatarContextType {
-  size?: AvatarSize
-  shape?: 'circle' | 'square'
-}
-const AvatarContextKey: InjectionKey<AvatarContextType> = Symbol('AvatarContextKey')
-
-export const useAvatarInjectContext = () => {
-  return inject(AvatarContextKey, {})
-}
-export const useAvatarProviderContext = (context: AvatarContextType) => {
-  return provide(AvatarContextKey, context)
-}