2021-07-02 20:06:22 +08:00
|
|
|
import { isPromise } from '../../shared/src'
|
2020-11-26 22:25:35 +08:00
|
|
|
import {
|
|
|
|
getCurrentInstance,
|
2021-07-07 02:31:53 +08:00
|
|
|
setCurrentInstance,
|
2020-11-26 22:25:35 +08:00
|
|
|
SetupContext,
|
2021-07-07 21:07:19 +08:00
|
|
|
createSetupContext,
|
|
|
|
unsetCurrentInstance
|
2020-11-26 22:25:35 +08:00
|
|
|
} from './component'
|
2020-11-25 04:12:59 +08:00
|
|
|
import { EmitFn, EmitsOptions } from './componentEmits'
|
2021-06-27 09:11:57 +08:00
|
|
|
import {
|
|
|
|
ComponentObjectPropsOptions,
|
|
|
|
PropOptions,
|
|
|
|
ExtractPropTypes
|
|
|
|
} from './componentProps'
|
2020-11-25 04:12:59 +08:00
|
|
|
import { warn } from './warning'
|
|
|
|
|
2021-06-27 09:11:57 +08:00
|
|
|
// dev only
|
|
|
|
const warnRuntimeUsage = (method: string) =>
|
|
|
|
warn(
|
|
|
|
`${method}() is a compiler-hint helper that is only usable inside ` +
|
|
|
|
`<script setup> of a single file component. Its arguments should be ` +
|
|
|
|
`compiled away and passing it at runtime has no effect.`
|
|
|
|
)
|
2021-06-26 07:31:47 +08:00
|
|
|
|
2020-11-25 04:12:59 +08:00
|
|
|
/**
|
2021-06-27 09:11:57 +08:00
|
|
|
* Vue `<script setup>` compiler macro for declaring component props. The
|
|
|
|
* expected argument is the same as the component `props` option.
|
|
|
|
*
|
|
|
|
* Example runtime declaration:
|
|
|
|
* ```js
|
|
|
|
* // using Array syntax
|
|
|
|
* const props = defineProps(['foo', 'bar'])
|
|
|
|
* // using Object syntax
|
|
|
|
* const props = defineProps({
|
|
|
|
* foo: String,
|
|
|
|
* bar: {
|
|
|
|
* type: Number,
|
|
|
|
* required: true
|
|
|
|
* }
|
|
|
|
* })
|
|
|
|
* ```
|
|
|
|
*
|
|
|
|
* Equivalent type-based decalration:
|
|
|
|
* ```ts
|
|
|
|
* // will be compiled into equivalent runtime declarations
|
|
|
|
* const props = defineProps<{
|
|
|
|
* foo?: string
|
|
|
|
* bar: number
|
|
|
|
* }>()
|
|
|
|
* ```
|
|
|
|
*
|
|
|
|
* This is only usable inside `<script setup>`, is compiled away in the
|
|
|
|
* output and should **not** be actually called at runtime.
|
2020-11-25 04:12:59 +08:00
|
|
|
*/
|
2021-06-27 09:11:57 +08:00
|
|
|
// overload 1: runtime props w/ array
|
|
|
|
export function defineProps<PropNames extends string = string>(
|
|
|
|
props: PropNames[]
|
|
|
|
): Readonly<{ [key in PropNames]?: any }>
|
|
|
|
// overload 2: runtime props w/ object
|
2020-11-25 04:12:59 +08:00
|
|
|
export function defineProps<
|
2021-06-27 09:11:57 +08:00
|
|
|
PP extends ComponentObjectPropsOptions = ComponentObjectPropsOptions
|
|
|
|
>(props: PP): Readonly<ExtractPropTypes<PP>>
|
|
|
|
// overload 3: typed-based declaration
|
|
|
|
export function defineProps<TypeProps>(): Readonly<TypeProps>
|
2020-11-25 04:12:59 +08:00
|
|
|
// implementation
|
2020-11-26 23:01:36 +08:00
|
|
|
export function defineProps() {
|
|
|
|
if (__DEV__) {
|
2021-06-27 09:11:57 +08:00
|
|
|
warnRuntimeUsage(`defineProps`)
|
2020-11-25 04:12:59 +08:00
|
|
|
}
|
2020-11-25 05:55:43 +08:00
|
|
|
return null as any
|
2020-11-25 04:12:59 +08:00
|
|
|
}
|
|
|
|
|
2021-06-27 09:11:57 +08:00
|
|
|
/**
|
|
|
|
* Vue `<script setup>` compiler macro for declaring a component's emitted
|
|
|
|
* events. The expected argument is the same as the component `emits` option.
|
|
|
|
*
|
|
|
|
* Example runtime declaration:
|
|
|
|
* ```js
|
|
|
|
* const emit = defineEmits(['change', 'update'])
|
|
|
|
* ```
|
|
|
|
*
|
|
|
|
* Example type-based decalration:
|
|
|
|
* ```ts
|
|
|
|
* const emit = defineEmits<{
|
|
|
|
* (event: 'change'): void
|
|
|
|
* (event: 'update', id: number): void
|
|
|
|
* }>()
|
|
|
|
*
|
|
|
|
* emit('change')
|
|
|
|
* emit('update', 1)
|
|
|
|
* ```
|
|
|
|
*
|
|
|
|
* This is only usable inside `<script setup>`, is compiled away in the
|
|
|
|
* output and should **not** be actually called at runtime.
|
|
|
|
*/
|
|
|
|
// overload 1: runtime emits w/ array
|
|
|
|
export function defineEmits<EE extends string = string>(
|
|
|
|
emitOptions: EE[]
|
|
|
|
): EmitFn<EE[]>
|
|
|
|
export function defineEmits<E extends EmitsOptions = EmitsOptions>(
|
|
|
|
emitOptions: E
|
|
|
|
): EmitFn<E>
|
|
|
|
export function defineEmits<TypeEmit>(): TypeEmit
|
2020-11-25 04:12:59 +08:00
|
|
|
// implementation
|
2021-06-23 03:02:56 +08:00
|
|
|
export function defineEmits() {
|
2020-11-26 23:01:36 +08:00
|
|
|
if (__DEV__) {
|
2021-06-27 09:11:57 +08:00
|
|
|
warnRuntimeUsage(`defineEmits`)
|
2020-11-25 04:12:59 +08:00
|
|
|
}
|
2020-11-25 05:55:43 +08:00
|
|
|
return null as any
|
2020-11-25 04:12:59 +08:00
|
|
|
}
|
|
|
|
|
2021-06-27 09:11:57 +08:00
|
|
|
/**
|
|
|
|
* Vue `<script setup>` compiler macro for declaring a component's exposed
|
|
|
|
* instance properties when it is accessed by a parent component via template
|
|
|
|
* refs.
|
|
|
|
*
|
|
|
|
* `<script setup>` components are closed by default - i.e. varaibles inside
|
|
|
|
* the `<script setup>` scope is not exposed to parent unless explicitly exposed
|
|
|
|
* via `defineExpose`.
|
|
|
|
*
|
|
|
|
* This is only usable inside `<script setup>`, is compiled away in the
|
|
|
|
* output and should **not** be actually called at runtime.
|
|
|
|
*/
|
2021-06-26 04:18:21 +08:00
|
|
|
export function defineExpose(exposed?: Record<string, any>) {
|
|
|
|
if (__DEV__) {
|
2021-06-27 09:11:57 +08:00
|
|
|
warnRuntimeUsage(`defineExpose`)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
type NotUndefined<T> = T extends undefined ? never : T
|
|
|
|
|
|
|
|
type InferDefaults<T> = {
|
2021-07-20 06:24:18 +08:00
|
|
|
[K in keyof T]?: NotUndefined<T[K]> extends
|
2021-06-27 09:11:57 +08:00
|
|
|
| number
|
|
|
|
| string
|
|
|
|
| boolean
|
|
|
|
| symbol
|
2021-07-20 06:24:18 +08:00
|
|
|
| Function
|
2021-06-27 09:11:57 +08:00
|
|
|
? NotUndefined<T[K]>
|
|
|
|
: (props: T) => NotUndefined<T[K]>
|
|
|
|
}
|
|
|
|
|
|
|
|
type PropsWithDefaults<Base, Defaults> = Base &
|
|
|
|
{
|
|
|
|
[K in keyof Defaults]: K extends keyof Base ? NotUndefined<Base[K]> : never
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Vue `<script setup>` compiler macro for providing props default values when
|
|
|
|
* using type-based `defineProps` decalration.
|
|
|
|
*
|
|
|
|
* Example usage:
|
|
|
|
* ```ts
|
|
|
|
* withDefaults(defineProps<{
|
|
|
|
* size?: number
|
|
|
|
* labels?: string[]
|
|
|
|
* }>(), {
|
|
|
|
* size: 3,
|
|
|
|
* labels: () => ['default label']
|
|
|
|
* })
|
|
|
|
* ```
|
|
|
|
*
|
|
|
|
* This is only usable inside `<script setup>`, is compiled away in the output
|
|
|
|
* and should **not** be actually called at runtime.
|
|
|
|
*/
|
|
|
|
export function withDefaults<Props, Defaults extends InferDefaults<Props>>(
|
|
|
|
props: Props,
|
|
|
|
defaults: Defaults
|
|
|
|
): PropsWithDefaults<Props, Defaults> {
|
|
|
|
if (__DEV__) {
|
|
|
|
warnRuntimeUsage(`withDefaults`)
|
2021-06-26 04:18:21 +08:00
|
|
|
}
|
2021-06-27 09:11:57 +08:00
|
|
|
return null as any
|
2021-06-26 04:18:21 +08:00
|
|
|
}
|
|
|
|
|
2021-06-27 09:11:57 +08:00
|
|
|
export function useSlots(): SetupContext['slots'] {
|
|
|
|
return getContext().slots
|
|
|
|
}
|
|
|
|
|
|
|
|
export function useAttrs(): SetupContext['attrs'] {
|
|
|
|
return getContext().attrs
|
|
|
|
}
|
|
|
|
|
2021-06-23 22:31:32 +08:00
|
|
|
function getContext(): SetupContext {
|
2020-11-26 22:25:35 +08:00
|
|
|
const i = getCurrentInstance()!
|
|
|
|
if (__DEV__ && !i) {
|
|
|
|
warn(`useContext() called without active instance.`)
|
|
|
|
}
|
|
|
|
return i.setupContext || (i.setupContext = createSetupContext(i))
|
2020-11-25 04:12:59 +08:00
|
|
|
}
|
2021-06-23 09:00:26 +08:00
|
|
|
|
2021-06-27 09:11:57 +08:00
|
|
|
/**
|
|
|
|
* Runtime helper for merging default declarations. Imported by compiled code
|
|
|
|
* only.
|
|
|
|
* @internal
|
|
|
|
*/
|
|
|
|
export function mergeDefaults(
|
|
|
|
// the base props is compiler-generated and guaranteed to be in this shape.
|
|
|
|
props: Record<string, PropOptions | null>,
|
|
|
|
defaults: Record<string, any>
|
|
|
|
) {
|
|
|
|
for (const key in defaults) {
|
|
|
|
const val = props[key]
|
|
|
|
if (val) {
|
|
|
|
val.default = defaults[key]
|
|
|
|
} else if (val === null) {
|
|
|
|
props[key] = { default: defaults[key] }
|
|
|
|
} else if (__DEV__) {
|
|
|
|
warn(`props default key "${key}" has no corresponding declaration.`)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
return props
|
2021-06-23 09:00:26 +08:00
|
|
|
}
|
2021-06-29 21:24:12 +08:00
|
|
|
|
|
|
|
/**
|
2021-07-07 02:31:53 +08:00
|
|
|
* `<script setup>` helper for persisting the current instance context over
|
|
|
|
* async/await flows.
|
|
|
|
*
|
|
|
|
* `@vue/compiler-sfc` converts the following:
|
|
|
|
*
|
|
|
|
* ```ts
|
|
|
|
* const x = await foo()
|
|
|
|
* ```
|
|
|
|
*
|
|
|
|
* into:
|
|
|
|
*
|
|
|
|
* ```ts
|
|
|
|
* let __temp, __restore
|
|
|
|
* const x = (([__temp, __restore] = withAsyncContext(() => foo())),__temp=await __temp,__restore(),__temp)
|
|
|
|
* ```
|
|
|
|
* @internal
|
2021-06-29 21:24:12 +08:00
|
|
|
*/
|
2021-07-07 02:31:53 +08:00
|
|
|
export function withAsyncContext(getAwaitable: () => any) {
|
2021-07-07 21:07:19 +08:00
|
|
|
const ctx = getCurrentInstance()!
|
|
|
|
if (__DEV__ && !ctx) {
|
|
|
|
warn(
|
|
|
|
`withAsyncContext called without active current instance. ` +
|
|
|
|
`This is likely a bug.`
|
|
|
|
)
|
|
|
|
}
|
2021-07-07 02:31:53 +08:00
|
|
|
let awaitable = getAwaitable()
|
2021-07-07 21:07:19 +08:00
|
|
|
unsetCurrentInstance()
|
2021-07-07 02:31:53 +08:00
|
|
|
if (isPromise(awaitable)) {
|
|
|
|
awaitable = awaitable.catch(e => {
|
|
|
|
setCurrentInstance(ctx)
|
|
|
|
throw e
|
|
|
|
})
|
2021-06-30 02:21:31 +08:00
|
|
|
}
|
2021-07-07 02:31:53 +08:00
|
|
|
return [awaitable, () => setCurrentInstance(ctx)]
|
2021-06-29 21:24:12 +08:00
|
|
|
}
|