From 4aa708a095cd2b9cde789920c83e3c9ed59fe684 Mon Sep 17 00:00:00 2001 From: Merlijn Vos Date: Mon, 4 Aug 2025 17:22:25 +0200 Subject: [PATCH] @uppy/svelte: fix prop passing and types (#5872) Closes #5869 --- .changeset/curvy-ravens-drum.md | 5 +++++ .../@uppy/svelte/src/lib/components/Dashboard.svelte | 12 ++++++------ .../svelte/src/lib/components/DashboardModal.svelte | 12 ++++++------ .../@uppy/svelte/src/lib/components/DragDrop.svelte | 11 +++++------ .../svelte/src/lib/components/ProgressBar.svelte | 11 +++++------ .../@uppy/svelte/src/lib/components/StatusBar.svelte | 11 +++++------ 6 files changed, 32 insertions(+), 30 deletions(-) create mode 100644 .changeset/curvy-ravens-drum.md diff --git a/.changeset/curvy-ravens-drum.md b/.changeset/curvy-ravens-drum.md new file mode 100644 index 000000000..ffe442877 --- /dev/null +++ b/.changeset/curvy-ravens-drum.md @@ -0,0 +1,5 @@ +--- +"@uppy/svelte": patch +--- + +Fix prop passing and types diff --git a/packages/@uppy/svelte/src/lib/components/Dashboard.svelte b/packages/@uppy/svelte/src/lib/components/Dashboard.svelte index 61f25dbf9..3c066ea07 100644 --- a/packages/@uppy/svelte/src/lib/components/Dashboard.svelte +++ b/packages/@uppy/svelte/src/lib/components/Dashboard.svelte @@ -3,15 +3,15 @@ generics="M extends import('@uppy/utils/lib/UppyFile').Meta, B extends import('@uppy/utils/lib/UppyFile').Body" > import type { Uppy } from "@uppy/core"; -import DashboardPlugin from "@uppy/dashboard"; +import DashboardPlugin, { type DashboardOptions } from "@uppy/dashboard"; import { onDestroy, onMount } from "svelte"; let container: HTMLElement; let plugin: DashboardPlugin; export let uppy: Uppy; -export const props: Object | undefined = {}; -export const plugins: string[] = []; +export let props: DashboardOptions | undefined = {}; +export let plugins: string[] = []; const installPlugin = () => { const options = { @@ -20,9 +20,9 @@ const installPlugin = () => { plugins, ...props, target: container, - }; + } satisfies DashboardOptions; - uppy.use(DashboardPlugin, options); + uppy.use(DashboardPlugin, options); plugin = uppy.getPlugin(options.id) as DashboardPlugin; }; const uninstallPlugin = (uppyInstance: Uppy = uppy) => { @@ -39,7 +39,7 @@ $: { plugins, ...props, target: container, - }; + } satisfies DashboardOptions; uppy.setOptions(options); } diff --git a/packages/@uppy/svelte/src/lib/components/DashboardModal.svelte b/packages/@uppy/svelte/src/lib/components/DashboardModal.svelte index 57e147002..d526d42be 100644 --- a/packages/@uppy/svelte/src/lib/components/DashboardModal.svelte +++ b/packages/@uppy/svelte/src/lib/components/DashboardModal.svelte @@ -3,18 +3,18 @@ generics="M extends import('@uppy/utils/lib/UppyFile').Meta, B extends import('@uppy/utils/lib/UppyFile').Body" > import type { Uppy } from "@uppy/core"; -import DashboardPlugin from "@uppy/dashboard"; +import DashboardPlugin, { type DashboardOptions } from "@uppy/dashboard"; import { onDestroy, onMount } from "svelte"; let container: HTMLElement; let plugin: DashboardPlugin; export let uppy: Uppy; -export const props: Object | undefined = {}; +export let props: DashboardOptions | undefined = {}; export let open: boolean; let lastOpen: boolean = open; -export const plugins: string[] = []; +export let plugins: string[] = []; const installPlugin = () => { const options = { @@ -22,9 +22,9 @@ const installPlugin = () => { plugins, ...props, target: container, - }; + } satisfies DashboardOptions; - uppy.use(DashboardPlugin, options); + uppy.use(DashboardPlugin, options); plugin = uppy.getPlugin(options.id) as DashboardPlugin; if (open) plugin.openModal(); }; @@ -41,7 +41,7 @@ $: { plugins, ...props, target: container, - }; + } satisfies DashboardOptions; uppy.setOptions(options); } $: { diff --git a/packages/@uppy/svelte/src/lib/components/DragDrop.svelte b/packages/@uppy/svelte/src/lib/components/DragDrop.svelte index 854ee5b08..6bf9a8fee 100644 --- a/packages/@uppy/svelte/src/lib/components/DragDrop.svelte +++ b/packages/@uppy/svelte/src/lib/components/DragDrop.svelte @@ -3,24 +3,23 @@ generics="M extends import('@uppy/utils/lib/UppyFile').Meta, B extends import('@uppy/utils/lib/UppyFile').Body" > import type { Uppy } from "@uppy/core"; -import DragDropPlugin from "@uppy/drag-drop"; +import DragDropPlugin, { type DragDropOptions } from "@uppy/drag-drop"; import { onDestroy, onMount } from "svelte"; let container: HTMLElement; let plugin: DragDropPlugin; export let uppy: Uppy; -export const props: Object | undefined = {}; +export let props: DragDropOptions | undefined = {}; const installPlugin = () => { const options = { id: "svelte:DragDrop", - inline: true, ...props, target: container, - }; + } satisfies DragDropOptions; - uppy.use(DragDropPlugin, options); + uppy.use(DragDropPlugin, options); plugin = uppy.getPlugin(options.id) as DragDropPlugin; }; const uninstallPlugin = (uppyInstance: Uppy = uppy) => { @@ -35,7 +34,7 @@ $: { id: "svelte:DragDrop", ...props, target: container, - }; + } satisfies DragDropOptions; uppy.setOptions(options); } diff --git a/packages/@uppy/svelte/src/lib/components/ProgressBar.svelte b/packages/@uppy/svelte/src/lib/components/ProgressBar.svelte index b43603198..12d52c5c2 100644 --- a/packages/@uppy/svelte/src/lib/components/ProgressBar.svelte +++ b/packages/@uppy/svelte/src/lib/components/ProgressBar.svelte @@ -3,24 +3,23 @@ generics="M extends import('@uppy/utils/lib/UppyFile').Meta, B extends import('@uppy/utils/lib/UppyFile').Body" > import type { Uppy } from "@uppy/core"; -import ProgressBarPlugin from "@uppy/progress-bar"; +import ProgressBarPlugin, { type ProgressBarOptions } from "@uppy/progress-bar"; import { onDestroy, onMount } from "svelte"; let container: HTMLElement; let plugin: ProgressBarPlugin; export let uppy: Uppy; -export const props: Object | undefined = {}; +export let props: ProgressBarOptions | undefined = {}; const installPlugin = () => { const options = { id: "svelte:ProgressBar", - inline: true, ...props, target: container, - }; + } satisfies ProgressBarOptions; - uppy.use(ProgressBarPlugin, options); + uppy.use(ProgressBarPlugin, options); plugin = uppy.getPlugin(options.id) as ProgressBarPlugin; }; const uninstallPlugin = (uppyInstance: Uppy = uppy) => { @@ -35,7 +34,7 @@ $: { id: "svelte:ProgressBar", ...props, target: container, - }; + } satisfies ProgressBarOptions; uppy.setOptions(options); } diff --git a/packages/@uppy/svelte/src/lib/components/StatusBar.svelte b/packages/@uppy/svelte/src/lib/components/StatusBar.svelte index e7ef9a758..662cc5a99 100644 --- a/packages/@uppy/svelte/src/lib/components/StatusBar.svelte +++ b/packages/@uppy/svelte/src/lib/components/StatusBar.svelte @@ -3,24 +3,23 @@ generics="M extends import('@uppy/utils/lib/UppyFile').Meta, B extends import('@uppy/utils/lib/UppyFile').Body" > import type { Uppy } from "@uppy/core"; -import StatusBarPlugin from "@uppy/status-bar"; +import StatusBarPlugin, { type StatusBarOptions } from "@uppy/status-bar"; import { onDestroy, onMount } from "svelte"; let container: HTMLElement; let plugin: StatusBarPlugin; export let uppy: Uppy; -export const props: Object | undefined = {}; +export let props: StatusBarOptions | undefined = {}; const installPlugin = () => { const options = { id: "svelte:StatusBar", - inline: true, ...props, target: container, - }; + } satisfies StatusBarOptions; - uppy.use(StatusBarPlugin, options); + uppy.use(StatusBarPlugin, options); plugin = uppy.getPlugin(options.id) as StatusBarPlugin; }; const uninstallPlugin = (uppyInstance: Uppy = uppy) => { @@ -35,7 +34,7 @@ $: { id: "svelte:StatusBar", ...props, target: container, - }; + } satisfies StatusBarOptions; uppy.setOptions(options); }