@sveltejs/package component props

[jakubsrnka]

Describe the bug

When importing custom property type or interface into a component created via @sveltejs/package, where the component name is Name and the imported type's name is NameProps, it collides with the auto generated props of the component later on when generating TS types for the component, as the type is automatically called NameProps. Since types can not be modified, it passes the original imported type into the SvelteComponentTyped and thus breaking the component.

Reproduction

import { SvelteComponentTyped } from "svelte";
import type { GridProps } from '../types/grid.js';
import type { Gap } from '../types/index.js';
declare const __propDef: {
    props: {
        justifyItems?: string | undefined;
        alignItems?: string | undefined;
        gap?: string | Gap | undefined;
        templateColumns?: string | undefined;
        templateRows?: string | undefined;
        margin?: string | import("../types/index.js").Directions | undefined;
        height?: string | undefined;
        width?: string | undefined;
        autoFlow?: string | undefined;
        breakpoints?: {
            [key: number]: GridProps;
        } | undefined;
    };
    events: {
        [evt: string]: CustomEvent<any>;
    };
    slots: {
        default: {};
    };
};
export type GridProps = typeof __propDef.props;
export type GridEvents = typeof __propDef.events;
export type GridSlots = typeof __propDef.slots;
export default class Grid extends SvelteComponentTyped<GridProps, GridEvents, GridSlots> {
}
export {};

This is the code of a Grid.svelte.d.ts component from the @greenpanda/svelte-layout@0.1.0 package. Type GridProps is imported on line 2, used then inside __propDef in breakpoints as the object's type.

Svelte package then tries to create GridProps on line 26 but cannot mutate the original GridProps type, thus passing the imported type into the class on line 29.

Expected behaviour

Svelte package should name the auto-generated type using I would expect a random string or somehow prevent the usage of the same already used type name.

System Info

• OS: [any]

Which package is the issue about?

No response

Additional Information, eg. Screenshots

Originally opened as issue #10264 on sveltejs/kit

[dummdidumm]

This is fixed in the latest version of svelte2tsx (you probably need to bump it yourself manually since it's a dependency on @sveltejs/package).