Files
element-plus/packages/hooks/use-size/index.ts
Jeremy 4c27822ef0 fix(components): circular referencing issue (#11777)
* fix(components): circular referencing issue

* Move sizes related into hooks.
* Remove size definitions in forms only re-exports.

* chore: fix failing tests
2023-03-01 16:44:09 +08:00

31 lines
761 B
TypeScript

import { computed, inject, unref } from 'vue'
import { buildProp } from '@element-plus/utils'
import { componentSizes } from '@element-plus/constants'
import type { InjectionKey, Ref } from 'vue'
import type { ComponentSize } from '@element-plus/constants'
export const useSizeProp = buildProp({
type: String,
values: componentSizes,
required: false,
} as const)
export const useSizeProps = {
size: useSizeProp,
}
export interface SizeContext {
size: Ref<ComponentSize>
}
export const SIZE_INJECTION_KEY: InjectionKey<SizeContext> = Symbol('size')
export const useGlobalSize = () => {
const injectedSize = inject(SIZE_INJECTION_KEY, {} as SizeContext)
return computed<ComponentSize>(() => {
return unref(injectedSize.size) || ''
})
}