From 2c889f9e7d1a0964ef8cf8de435a16b8e3a0b34a Mon Sep 17 00:00:00 2001 From: Claude Date: Tue, 17 Mar 2026 08:57:55 +0000 Subject: [PATCH 1/3] feat(payload): update PayloadMediaProps and Media types for Payload compatibility - Make Media.alt nullable (string | null) to match Payload-generated types - Extend PayloadMediaProps with HTMLVideoAttributes, HTMLImgAttributes, and HTMLPictureAttributes so video props (autoplay, muted, loop, playsinline, controls, preload) and img/picture props (srcset, sizes, decoding) can be spread onto the rendered element https://claude.ai/code/session_01JsPYAtAnEtvcMbfWA1tEyz --- packages/sveltekit-helper/src/components/payload/types.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/sveltekit-helper/src/components/payload/types.ts b/packages/sveltekit-helper/src/components/payload/types.ts index 196ade47..ef63f6f6 100644 --- a/packages/sveltekit-helper/src/components/payload/types.ts +++ b/packages/sveltekit-helper/src/components/payload/types.ts @@ -1,4 +1,4 @@ -import type { HTMLAttributes } from 'svelte/elements'; +import type { HTMLAttributes, HTMLVideoAttributes, HTMLImgAttributes, HTMLPictureAttributes } from 'svelte/elements'; export type MediaSizes = Record< string, @@ -11,7 +11,7 @@ export type MediaSizes = Record< | undefined >; -export type PayloadMediaProps = HTMLAttributes & { +export type PayloadMediaProps = HTMLAttributes & HTMLVideoAttributes & HTMLImgAttributes & HTMLPictureAttributes & { data: Media; loading?: 'lazy' | 'eager' | undefined; className?: string; @@ -22,7 +22,7 @@ export type PayloadMediaProps = HTMLAttributes & { export type Media = { id: number; - alt?: string; + alt?: string | null; updatedAt: string; createdAt: string; deletedAt?: string | null; From b49991343e5fbc51e84c14fd09f876578a5cfbbe Mon Sep 17 00:00:00 2001 From: Claude Date: Tue, 17 Mar 2026 09:01:11 +0000 Subject: [PATCH 2/3] chore: add patch changeset for payload type updates https://claude.ai/code/session_01JsPYAtAnEtvcMbfWA1tEyz --- .changeset/update-payload-types.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/update-payload-types.md diff --git a/.changeset/update-payload-types.md b/.changeset/update-payload-types.md new file mode 100644 index 00000000..03f388cb --- /dev/null +++ b/.changeset/update-payload-types.md @@ -0,0 +1,5 @@ +--- +"@ainsleydev/sveltekit-helper": patch +--- + +Make `Media.alt` nullable and extend `PayloadMediaProps` with `HTMLVideoAttributes`, `HTMLImgAttributes`, and `HTMLPictureAttributes` to allow video, image, and picture props to be spread onto the rendered element. From 0e61aaec7c2f4b099e1daad83ce858d2752f336a Mon Sep 17 00:00:00 2001 From: Claude Date: Tue, 17 Mar 2026 09:04:22 +0000 Subject: [PATCH 3/3] fix: apply biome formatting to payload types import https://claude.ai/code/session_01JsPYAtAnEtvcMbfWA1tEyz --- .../src/components/payload/types.ts | 26 ++++++++++++------- 1 file changed, 17 insertions(+), 9 deletions(-) diff --git a/packages/sveltekit-helper/src/components/payload/types.ts b/packages/sveltekit-helper/src/components/payload/types.ts index ef63f6f6..7496e9ee 100644 --- a/packages/sveltekit-helper/src/components/payload/types.ts +++ b/packages/sveltekit-helper/src/components/payload/types.ts @@ -1,4 +1,9 @@ -import type { HTMLAttributes, HTMLVideoAttributes, HTMLImgAttributes, HTMLPictureAttributes } from 'svelte/elements'; +import type { + HTMLAttributes, + HTMLImgAttributes, + HTMLPictureAttributes, + HTMLVideoAttributes, +} from 'svelte/elements'; export type MediaSizes = Record< string, @@ -11,14 +16,17 @@ export type MediaSizes = Record< | undefined >; -export type PayloadMediaProps = HTMLAttributes & HTMLVideoAttributes & HTMLImgAttributes & HTMLPictureAttributes & { - data: Media; - loading?: 'lazy' | 'eager' | undefined; - className?: string; - breakpointBuffer?: number; - maxWidth?: number | undefined; - onload?: (event: Event) => void; -}; +export type PayloadMediaProps = HTMLAttributes & + HTMLVideoAttributes & + HTMLImgAttributes & + HTMLPictureAttributes & { + data: Media; + loading?: 'lazy' | 'eager' | undefined; + className?: string; + breakpointBuffer?: number; + maxWidth?: number | undefined; + onload?: (event: Event) => void; + }; export type Media = { id: number;