Fix prop typing
This commit is contained in:
@@ -205,8 +205,15 @@ describe("origin-relative scene graph", () => {
|
|||||||
let xMounts = 0;
|
let xMounts = 0;
|
||||||
let xUnmounts = 0;
|
let xUnmounts = 0;
|
||||||
let yUnmounts = 0;
|
let yUnmounts = 0;
|
||||||
|
|
||||||
const X = defineComponent({
|
const X = defineComponent({
|
||||||
name: "X",
|
name: "X",
|
||||||
|
props: {
|
||||||
|
message: {
|
||||||
|
type: String,
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
setup() {
|
setup() {
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
xMounts += 1;
|
xMounts += 1;
|
||||||
@@ -214,6 +221,9 @@ describe("origin-relative scene graph", () => {
|
|||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
xUnmounts += 1;
|
xUnmounts += 1;
|
||||||
});
|
});
|
||||||
|
defineProps<{
|
||||||
|
message: string;
|
||||||
|
}>();
|
||||||
return () =>
|
return () =>
|
||||||
h(
|
h(
|
||||||
"div",
|
"div",
|
||||||
|
|||||||
@@ -24,6 +24,7 @@ import type {
|
|||||||
OriginSceneNode,
|
OriginSceneNode,
|
||||||
OriginSceneNodeState,
|
OriginSceneNodeState,
|
||||||
OriginView,
|
OriginView,
|
||||||
|
PropsOf,
|
||||||
} from "./types";
|
} from "./types";
|
||||||
|
|
||||||
interface SceneNodeState {
|
interface SceneNodeState {
|
||||||
@@ -79,12 +80,12 @@ let viewSequence = 0;
|
|||||||
* ```
|
* ```
|
||||||
*/
|
*/
|
||||||
export function originView<
|
export function originView<
|
||||||
Props extends Record<string, unknown> = Record<string, unknown>,
|
T extends Component = Component,
|
||||||
>(
|
>(
|
||||||
component: Component,
|
component: T,
|
||||||
props?: Props,
|
props?: PropsOf<T>,
|
||||||
options: OriginViewOptions = {},
|
options: OriginViewOptions = {},
|
||||||
): OriginView<Props> {
|
): OriginView<T> {
|
||||||
const inferredName =
|
const inferredName =
|
||||||
options.name ??
|
options.name ??
|
||||||
(typeof component === "object" && "name" in component
|
(typeof component === "object" && "name" in component
|
||||||
|
|||||||
@@ -1,5 +1,12 @@
|
|||||||
import type { Component, ComputedRef, CSSProperties, ShallowRef } from "vue";
|
import type { Component, ComputedRef, CSSProperties, ShallowRef } from "vue";
|
||||||
|
|
||||||
|
export type PropsOf<T> =
|
||||||
|
T extends abstract new (...args: any[]) => { $props: infer P }
|
||||||
|
? P
|
||||||
|
: T extends (props: infer P, ...args: any[]) => any
|
||||||
|
? P
|
||||||
|
: never;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* A view is a recipe for creating a Vue component, not a mounted instance.
|
* A view is a recipe for creating a Vue component, not a mounted instance.
|
||||||
*
|
*
|
||||||
@@ -9,12 +16,13 @@ import type { Component, ComputedRef, CSSProperties, ShallowRef } from "vue";
|
|||||||
* @typeParam Props - The props accepted by the component recipe.
|
* @typeParam Props - The props accepted by the component recipe.
|
||||||
*/
|
*/
|
||||||
export interface OriginView<
|
export interface OriginView<
|
||||||
Props extends Record<string, unknown> = Record<string, unknown>,
|
T extends Component = Component,
|
||||||
|
// Props extends Record<string, unknown> = Record<string, unknown>,
|
||||||
> {
|
> {
|
||||||
/** The Vue component definition that will be mounted for this recipe. */
|
/** The Vue component definition that will be mounted for this recipe. */
|
||||||
readonly component: Component;
|
readonly component: T;
|
||||||
/** Props passed to the component when the recipe is mounted. */
|
/** Props passed to the component when the recipe is mounted. */
|
||||||
readonly props?: Readonly<Props>;
|
readonly props?: Readonly<PropsOf<T>>;
|
||||||
/**
|
/**
|
||||||
* A developer-facing recipe identity used in diagnostics and as the prefix
|
* A developer-facing recipe identity used in diagnostics and as the prefix
|
||||||
* of generated scene-node keys. It does not make Vue reuse an instance.
|
* of generated scene-node keys. It does not make Vue reuse an instance.
|
||||||
|
|||||||
Reference in New Issue
Block a user