(fix) JS props any-type fallback (#698)

Fall back to any-type when a prop has no fallback value in JS #697
sveltejs · Dec 8, 2020 · 088406c · 088406c
1 parent bed66a1
commit 088406c
Show file tree

Hide file tree

Showing 17 changed files with 35 additions and 15 deletions.
diff --git a/packages/svelte2tsx/src/svelte2tsx/index.ts b/packages/svelte2tsx/src/svelte2tsx/index.ts
@@ -290,7 +290,9 @@ function addComponentExport({
             ? uses$$propsOr$$restProps
                 ? `__sveltets_with_any(${eventsDef})`
                 : eventsDef
-            : `__sveltets_partial${uses$$propsOr$$restProps ? '_with_any' : ''}(${eventsDef})`;
+            : `__sveltets_partial${isTsFile ? '_ts' : ''}${
+                  uses$$propsOr$$restProps ? '_with_any' : ''
+              }(${eventsDef})`;
 
     const doc = componentDocumentation.getFormatted();
     const className = fileName && classNameFromFilename(fileName);

diff --git a/packages/svelte2tsx/svelte-shims.d.ts b/packages/svelte2tsx/svelte-shims.d.ts
@@ -91,6 +91,7 @@ type SvelteAnimation<U extends any[]> = (node: Element, move: { from: DOMRect, t
 }
 
 type SvelteAllProps = { [index: string]: any }
+type SveltePropsAnyFallback<Props> = {[K in keyof Props]: Props[K] extends undefined ? any : Props[K]}
 type SvelteRestProps = { [index: string]: any }
 type SvelteSlots = { [index: string]: any }
 type SvelteStore<T> = { subscribe: (run: (value: T) => any, invalidate?: any) => any }
@@ -114,9 +115,15 @@ declare function __sveltets_restPropsType(): SvelteRestProps
 declare function __sveltets_slotsType<Slots, Key extends keyof Slots>(slots: Slots): Record<Key, boolean>;
 declare function __sveltets_partial<Props = {}, Events = {}, Slots = {}>(
     render: () => {props?: Props, events?: Events, slots?: Slots }
-): () => {props?: Partial<Props>, events?: Events, slots?: Slots }
+): () => {props?: Partial<SveltePropsAnyFallback<Props>>, events?: Events, slots?: Slots }
 declare function __sveltets_partial_with_any<Props = {}, Events = {}, Slots = {}>(
     render: () => {props?: Props, events?: Events, slots?: Slots }
+): () => {props?: Partial<SveltePropsAnyFallback<Props>> & SvelteAllProps, events?: Events, slots?: Slots }
+declare function __sveltets_partial_ts<Props = {}, Events = {}, Slots = {}>(
+    render: () => {props?: Props, events?: Events, slots?: Slots }
+): () => {props?: Partial<Props>, events?: Events, slots?: Slots }
+declare function __sveltets_partial_ts_with_any<Props = {}, Events = {}, Slots = {}>(
+    render: () => {props?: Props, events?: Events, slots?: Slots }
 ): () => {props?: Partial<Props> & SvelteAllProps, events?: Events, slots?: Slots }
 declare function __sveltets_with_any<Props = {}, Events = {}, Slots = {}>(
     render: () => {props?: Props, events?: Events, slots?: Slots }

diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-event-dispatcher-typed/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/ts-event-dispatcher-typed/expected.tsx
@@ -46,5 +46,5 @@ return { props: {}, slots: {}, getters: {}, events: __sveltets_toEventTypings<{
     // not this
     btn: string;}>() }}
 
-export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
+export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial_ts(__sveltets_with_any_event(render))) {
 }
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-export-arrow-function/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/ts-export-arrow-function/expected.tsx
@@ -9,5 +9,5 @@
 () => (<></>);
 return { props: {f: f} as {f?: typeof f}, slots: {}, getters: {}, events: {} }}
 
-export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
+export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial_ts(__sveltets_with_any_event(render))) {
 }
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-export-boolean/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/ts-export-boolean/expected.tsx
@@ -10,5 +10,5 @@
 () => (<></>);
 return { props: {bla: bla , blubb: blubb , bla1: bla1 , blubb1: blubb1 , a1: a1 , a2: a2 , b1: b1 , b2: b2} as {bla?: typeof bla, blubb?: typeof blubb, bla1?: boolean, blubb1?: boolean, a1?: typeof a1, a2?: typeof a2, b1?: boolean, b2?: boolean}, slots: {}, getters: {}, events: {} }}
 
-export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
+export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial_ts(__sveltets_with_any_event(render))) {
 }
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-export-const/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/ts-export-const/expected.tsx
@@ -7,7 +7,7 @@
 () => (<></>);
 return { props: {name: name , SOME: SOME , CONSTANT: CONSTANT} as {name?: string, SOME?: typeof SOME, CONSTANT?: typeof CONSTANT}, slots: {}, getters: {name: name, SOME: SOME, CONSTANT: CONSTANT}, events: {} }}
 
-export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
+export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial_ts(__sveltets_with_any_event(render))) {
     get name() { return render().getters.name }
     get SOME() { return render().getters.SOME }
     get CONSTANT() { return render().getters.CONSTANT }

diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-export-doc-typedef/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/ts-export-doc-typedef/expected.tsx
@@ -18,5 +18,5 @@ return { props: {
      * 
      */a: a}, slots: {}, getters: {}, events: {} }}
 
-export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
+export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial_ts(__sveltets_with_any_event(render))) {
 }
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-export-doc/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/ts-export-doc/expected.tsx
@@ -23,5 +23,5 @@ return { props: {a: a , b: b , c: c , d: d} as {
      * MORE DOCS!
      */b?: typeof b, c: typeof c, d: typeof d}, slots: {}, getters: {}, events: {} }}
 
-export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
+export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial_ts(__sveltets_with_any_event(render))) {
 }
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-export-has-initializer/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/ts-export-has-initializer/expected.tsx
@@ -6,5 +6,5 @@
 () => (<></>);
 return { props: {a: a} as {a?: typeof a}, slots: {}, getters: {}, events: {} }}
 
-export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
+export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial_ts(__sveltets_with_any_event(render))) {
 }
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-export-has-type/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/ts-export-has-type/expected.tsx
@@ -8,5 +8,5 @@
 () => (<></>);
 return { props: {a: a , b: b} as {a: A, b?: A}, slots: {}, getters: {}, events: {} }}
 
-export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
+export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial_ts(__sveltets_with_any_event(render))) {
 }
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-export-interface/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/ts-export-interface/expected.tsx
@@ -5,5 +5,5 @@
 <></>
 return { props: {}, slots: {}, getters: {}, events: {} }}
 
-export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
+export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial_ts(__sveltets_with_any_event(render))) {
 }
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-multiple-export/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/ts-multiple-export/expected.tsx
@@ -8,5 +8,5 @@
 <h1>{number1} + {number2} = {number1 + number2}</h1></>);
 return { props: {number1: number1 , number2: number2} as {number1: number, number2: number}, slots: {}, getters: {}, events: {} }}
 
-export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
+export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial_ts(__sveltets_with_any_event(render))) {
 }
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-style-and-script/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/ts-style-and-script/expected.tsx
@@ -7,5 +7,5 @@
 </>);
 return { props: {foo: foo} as {foo: string}, slots: {}, getters: {}, events: {} }}
 
-export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
+export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial_ts(__sveltets_with_any_event(render))) {
 }
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-type-assertion/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/ts-type-assertion/expected.tsx
@@ -6,5 +6,5 @@
 () => (<></>);
 return { props: {}, slots: {}, getters: {}, events: {} }}
 
-export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
+export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial_ts(__sveltets_with_any_event(render))) {
 }
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-typed-export-with-default/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/ts-typed-export-with-default/expected.tsx
@@ -6,5 +6,5 @@
 () => (<></>);
 return { props: {name: name} as {name?: string | number}, slots: {}, getters: {}, events: {} }}
 
-export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
+export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial_ts(__sveltets_with_any_event(render))) {
 }
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-uses-$$props/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/ts-uses-$$props/expected.tsx
@@ -0,0 +1,9 @@
+///<reference types="svelte" />
+<></>;function render() { let $$props = __sveltets_allPropsType();
+ ;
+() => (<>
+<h1>{$$props['name']}</h1></>);
+return { props: {}, slots: {}, getters: {}, events: {} }}
+
+export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial_ts_with_any(__sveltets_with_any_event(render))) {
+}
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/ts-uses-$$props/input.svelte b/packages/svelte2tsx/test/svelte2tsx/samples/ts-uses-$$props/input.svelte
@@ -0,0 +1,2 @@
+<script lang="ts"> </script>
+<h1>{$$props['name']}</h1>