@prismicio/svelte 2.2.4 → 3.0.0-canary.c9ff0a4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -106,17 +106,9 @@
106
106
  })
107
107
 
108
108
  function castInt(input: string | number | null | undefined): number | null | undefined {
109
- if (typeof input === "number" || typeof input === "undefined" || input === null) {
110
- return input
111
- } else {
112
- const parsed = Number.parseInt(input)
113
-
114
- if (Number.isNaN(parsed)) {
115
- return undefined
116
- } else {
117
- return parsed
118
- }
119
- }
109
+ if (typeof input !== "string") return input
110
+ const parsed = Number.parseInt(input)
111
+ return Number.isNaN(parsed) ? undefined : parsed
120
112
  }
121
113
  </script>
122
114
 
@@ -53,5 +53,5 @@
53
53
  -->
54
54
 
55
55
  <a {...linkAttrs} rel={resolvedRel} {href} {...restProps}>
56
- {#if children}{@render children?.()}{:else}{field?.text}{/if}
56
+ {#if children}{@render children()}{:else}{field?.text}{/if}
57
57
  </a>
@@ -16,7 +16,7 @@
16
16
  </script>
17
17
 
18
18
  {#if as}
19
- <svelte:element this={as} {...dirProp} {...attrs} {...attrs}>{@render children()}</svelte:element>
19
+ <svelte:element this={as} {...dirProp} {...attrs}>{@render children()}</svelte:element>
20
20
  {:else if node.type === "heading1"}
21
21
  <h1 {...dirProp} {...attrs}>{@render children()}</h1>
22
22
  {:else if node.type === "heading2"}
@@ -30,12 +30,7 @@
30
30
 
31
31
  const { field, components = {}, fallback: Fallback }: Props = $props()
32
32
 
33
- const Table = components.table
34
- const Thead = components.thead
35
- const Tbody = components.tbody
36
- const Tr = components.tr
37
- const Th = components.th
38
- const Td = components.td
33
+ const { table: Table, thead: Thead, tbody: Tbody, tr: Tr, th: Th, td: Td } = $derived(components)
39
34
  </script>
40
35
 
41
36
  {#snippet thead(head: TableFieldHead)}
@@ -79,9 +74,9 @@
79
74
  <!-- This formatting is intentional to prevent unwanted whitespace between elements. -->
80
75
  {#if isFilled.table(field)}
81
76
  {#if typeof Table === "function"}<Table table={field}
82
- >{#if field?.head}{@render thead(field.head)}{/if}{@render tbody(field.body)}</Table
77
+ >{#if field.head}{@render thead(field.head)}{/if}{@render tbody(field.body)}</Table
83
78
  >{:else}<table {...Table}>
84
- {#if field?.head}{@render thead(field.head)}{/if}{@render tbody(field.body)}
79
+ {#if field.head}{@render thead(field.head)}{/if}{@render tbody(field.body)}
85
80
  </table>{/if}
86
81
  {:else if Fallback}
87
82
  <Fallback />
@@ -10,19 +10,23 @@
10
10
  simulatorClass,
11
11
  simulatorRootClass,
12
12
  } from "@prismicio/simulator/kit"
13
+ import type { Snippet } from "svelte"
14
+ import type { ClassValue } from "svelte/elements"
13
15
 
14
16
  const defaultProps = getDefaultProps()
15
17
 
16
18
  type Props = {
17
19
  zIndex?: number
18
20
  background?: string
19
- class?: string
21
+ class?: ClassValue
22
+ children?: Snippet<[{ slices: ReturnType<typeof getDefaultSlices> }]>
20
23
  }
21
24
 
22
25
  const {
23
26
  zIndex = defaultProps.zIndex,
24
27
  background = defaultProps.background,
25
28
  class: className,
29
+ children,
26
30
  }: Props = $props()
27
31
 
28
32
  let slices = $state.raw(getDefaultSlices())
@@ -51,7 +55,7 @@
51
55
  </script>
52
56
 
53
57
  <div
54
- class="{simulatorClass} {className}"
58
+ class={[simulatorClass, className]}
55
59
  style="z-index: {zIndex}; position: fixed; top: 0; left: 0; width: 100%; height: 100vh; overflow: auto; background: {background}"
56
60
  >
57
61
  {#if message}
@@ -68,9 +72,7 @@
68
72
  onsubmit={disableEventHandler}
69
73
  onkeypress={disableEventHandler}
70
74
  >
71
- <!-- TODO: Use a snippet in the next major; it would break `let:slices`. -->
72
- <!-- svelte-ignore slot_element_deprecated -->
73
- <slot {slices} />
75
+ {@render children?.({ slices })}
74
76
  </div>
75
77
  {/if}
76
78
  </div>
@@ -1,36 +1,14 @@
1
+ import { getDefaultSlices } from "@prismicio/simulator/kit";
2
+ import type { Snippet } from "svelte";
3
+ import type { ClassValue } from "svelte/elements";
1
4
  type Props = {
2
5
  zIndex?: number;
3
6
  background?: string;
4
- class?: string;
7
+ class?: ClassValue;
8
+ children?: Snippet<[{
9
+ slices: ReturnType<typeof getDefaultSlices>;
10
+ }]>;
5
11
  };
6
- interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
7
- new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
8
- $$bindings?: Bindings;
9
- } & Exports;
10
- (internal: unknown, props: Props & {
11
- $$events?: Events;
12
- $$slots?: Slots;
13
- }): Exports & {
14
- $set?: any;
15
- $on?: any;
16
- };
17
- z_$$bindings?: Bindings;
18
- }
19
- type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
20
- default: any;
21
- } ? Props extends Record<string, never> ? any : {
22
- children?: any;
23
- } : {});
24
- declare const SliceSimulator: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<Props, {
25
- default: {
26
- slices: import("@prismicio/client").SliceZone;
27
- };
28
- }>, {
29
- [evt: string]: CustomEvent<any>;
30
- }, {
31
- default: {
32
- slices: import("@prismicio/client").SliceZone;
33
- };
34
- }, {}, "">;
35
- type SliceSimulator = InstanceType<typeof SliceSimulator>;
12
+ declare const SliceSimulator: import("svelte").Component<Props, {}, "">;
13
+ type SliceSimulator = ReturnType<typeof SliceSimulator>;
36
14
  export default SliceSimulator;
@@ -38,12 +38,7 @@
38
38
  defaultComponent?: Component<SliceComponentProps> | undefined
39
39
  }
40
40
 
41
- const {
42
- slices = [],
43
- components = {},
44
- context = {},
45
- defaultComponent = undefined,
46
- }: Props = $props()
41
+ const { slices = [], components = {}, context = {}, defaultComponent }: Props = $props()
47
42
  </script>
48
43
 
49
44
  <!--
package/dist/index.d.ts CHANGED
@@ -1,4 +1,3 @@
1
- import type { RichTextComponents } from "./types";
2
1
  export { default as PrismicEmbed } from "./PrismicEmbed.svelte";
3
2
  export { default as PrismicImage } from "./PrismicImage.svelte";
4
3
  export { default as PrismicLink } from "./PrismicLink.svelte";
@@ -7,7 +6,4 @@ export { default as PrismicTable } from "./PrismicTable.svelte";
7
6
  export { default as PrismicText } from "./PrismicText.svelte";
8
7
  export { default as SliceZone } from "./SliceZone/SliceZone.svelte";
9
8
  export { default as SliceSimulator } from "./SliceSimulator.svelte";
10
- /** @deprecated Replaced with `RichTextComponents` */
11
- export type SvelteRichTextSerializer = RichTextComponents;
12
- export type { RichTextComponents };
13
- export type { RichTextComponentProps, SliceComponentProps } from "./types";
9
+ export type { RichTextComponentProps, RichTextComponents, SliceComponentProps } from "./types";
@@ -1,5 +1,5 @@
1
1
  <script lang="ts">
2
- import { beforeNavigate, goto, invalidateAll } from "$app/navigation"
2
+ import { beforeNavigate, goto, refreshAll } from "$app/navigation"
3
3
  import { getToolbarSrc } from "@prismicio/client"
4
4
  import { onMount } from "svelte"
5
5
 
@@ -36,7 +36,7 @@
36
36
  "prismicPreviewUpdate",
37
37
  (event) => {
38
38
  event.preventDefault()
39
- invalidateAll()
39
+ refreshAll()
40
40
  },
41
41
  { signal: controller.signal },
42
42
  )
@@ -55,10 +55,7 @@
55
55
  ),
56
56
  window.location.origin,
57
57
  ),
58
- {
59
- invalidateAll: true,
60
- noScroll: true,
61
- },
58
+ { refreshAll: true, reset: false },
62
59
  )
63
60
  },
64
61
  { signal: controller.signal },
@@ -6,13 +6,13 @@ export type RedirectToPreviewURLConfig = {
6
6
  /**
7
7
  * The `request` object from a `+server` file.
8
8
  *
9
- * @see SvelteKit `+server` docs: \<https://kit.svelte.dev/docs/routing#server\>
9
+ * @see SvelteKit `+server` docs: \<https://svelte.dev/docs/kit/routing#server\>
10
10
  */
11
11
  request: Request;
12
12
  /**
13
13
  * The `cookies` object from a `+server` file.
14
14
  *
15
- * @see SvelteKit `+server` docs: \<https://kit.svelte.dev/docs/routing#server\>
15
+ * @see SvelteKit `+server` docs: \<https://svelte.dev/docs/kit/routing#server\>
16
16
  */
17
17
  cookies: Cookies;
18
18
  /** The default redirect URL if a URL cannot be determined for the previewed document. */
@@ -28,13 +28,13 @@ export type RedirectToPreviewURLConfig = {
28
28
  *
29
29
  * @example
30
30
  * ```typescript
31
- * import { createClient } from "$lib/prismicio.js"
31
+ * import { createClient } from "#lib/prismicio.ts"
32
32
  * import { redirectToPreviewURL } from "@prismicio/svelte/kit"
33
33
  *
34
- * export async function GET({ fetch, request }) {
34
+ * export async function GET({ fetch, request, cookies }) {
35
35
  * const client = createClient({ fetch })
36
36
  *
37
- * return await redirectToPreviewURL({ client, request })
37
+ * return await redirectToPreviewURL({ client, request, cookies })
38
38
  * }
39
39
  * ```
40
40
  */
@@ -7,13 +7,13 @@ import * as prismic from "@prismicio/client";
7
7
  *
8
8
  * @example
9
9
  * ```typescript
10
- * import { createClient } from "$lib/prismicio.js"
10
+ * import { createClient } from "#lib/prismicio.ts"
11
11
  * import { redirectToPreviewURL } from "@prismicio/svelte/kit"
12
12
  *
13
- * export async function GET({ fetch, request }) {
13
+ * export async function GET({ fetch, request, cookies }) {
14
14
  * const client = createClient({ fetch })
15
15
  *
16
- * return await redirectToPreviewURL({ client, request })
16
+ * return await redirectToPreviewURL({ client, request, cookies })
17
17
  * }
18
18
  * ```
19
19
  */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@prismicio/svelte",
3
- "version": "2.2.4",
3
+ "version": "3.0.0-canary.c9ff0a4",
4
4
  "description": "Svelte components to present Prismic content.",
5
5
  "keywords": [
6
6
  "prismic",
@@ -64,25 +64,25 @@
64
64
  "devDependencies": {
65
65
  "@prismicio/client": "^7.22.3",
66
66
  "@prismicio/mock": "^0.7.2",
67
- "@sveltejs/kit": "^2.70.3",
68
- "@sveltejs/package": "^3.0.0",
67
+ "@sveltejs/kit": "^3.0.1",
68
+ "@sveltejs/package": "^3.0.1",
69
69
  "@sveltejs/vite-plugin-svelte": "^7.3.1",
70
70
  "@testing-library/svelte": "^5.4.2",
71
71
  "@types/node": "^26.6.5",
72
- "@vitest/coverage-v8": "^5.0.3",
72
+ "@vitest/coverage-v8": "^5.0.5",
73
73
  "globals": "^17.13.0",
74
- "happy-dom": "^20.14.6",
75
- "oxfmt": "^0.72.0",
76
- "oxlint": "^1.87.0",
74
+ "happy-dom": "^21.0.4",
75
+ "oxfmt": "^0.74.0",
76
+ "oxlint": "^1.89.0",
77
77
  "standard-version": "^9.5.0",
78
78
  "svelte": "^5.57.2",
79
79
  "typescript": "^6.0.3",
80
- "vitest": "^5.0.3"
80
+ "vitest": "^5.0.5"
81
81
  },
82
82
  "peerDependencies": {
83
83
  "@prismicio/client": ">=7",
84
- "@sveltejs/kit": "^2",
85
- "svelte": "^5"
84
+ "@sveltejs/kit": "^3.0.0",
85
+ "svelte": "^5.16.0"
86
86
  },
87
87
  "peerDependenciesMeta": {
88
88
  "@sveltejs/kit": {
@@ -106,17 +106,9 @@
106
106
  })
107
107
 
108
108
  function castInt(input: string | number | null | undefined): number | null | undefined {
109
- if (typeof input === "number" || typeof input === "undefined" || input === null) {
110
- return input
111
- } else {
112
- const parsed = Number.parseInt(input)
113
-
114
- if (Number.isNaN(parsed)) {
115
- return undefined
116
- } else {
117
- return parsed
118
- }
119
- }
109
+ if (typeof input !== "string") return input
110
+ const parsed = Number.parseInt(input)
111
+ return Number.isNaN(parsed) ? undefined : parsed
120
112
  }
121
113
  </script>
122
114
 
@@ -53,5 +53,5 @@
53
53
  -->
54
54
 
55
55
  <a {...linkAttrs} rel={resolvedRel} {href} {...restProps}>
56
- {#if children}{@render children?.()}{:else}{field?.text}{/if}
56
+ {#if children}{@render children()}{:else}{field?.text}{/if}
57
57
  </a>
@@ -16,7 +16,7 @@
16
16
  </script>
17
17
 
18
18
  {#if as}
19
- <svelte:element this={as} {...dirProp} {...attrs} {...attrs}>{@render children()}</svelte:element>
19
+ <svelte:element this={as} {...dirProp} {...attrs}>{@render children()}</svelte:element>
20
20
  {:else if node.type === "heading1"}
21
21
  <h1 {...dirProp} {...attrs}>{@render children()}</h1>
22
22
  {:else if node.type === "heading2"}
@@ -30,12 +30,7 @@
30
30
 
31
31
  const { field, components = {}, fallback: Fallback }: Props = $props()
32
32
 
33
- const Table = components.table
34
- const Thead = components.thead
35
- const Tbody = components.tbody
36
- const Tr = components.tr
37
- const Th = components.th
38
- const Td = components.td
33
+ const { table: Table, thead: Thead, tbody: Tbody, tr: Tr, th: Th, td: Td } = $derived(components)
39
34
  </script>
40
35
 
41
36
  {#snippet thead(head: TableFieldHead)}
@@ -79,9 +74,9 @@
79
74
  <!-- This formatting is intentional to prevent unwanted whitespace between elements. -->
80
75
  {#if isFilled.table(field)}
81
76
  {#if typeof Table === "function"}<Table table={field}
82
- >{#if field?.head}{@render thead(field.head)}{/if}{@render tbody(field.body)}</Table
77
+ >{#if field.head}{@render thead(field.head)}{/if}{@render tbody(field.body)}</Table
83
78
  >{:else}<table {...Table}>
84
- {#if field?.head}{@render thead(field.head)}{/if}{@render tbody(field.body)}
79
+ {#if field.head}{@render thead(field.head)}{/if}{@render tbody(field.body)}
85
80
  </table>{/if}
86
81
  {:else if Fallback}
87
82
  <Fallback />
@@ -10,19 +10,23 @@
10
10
  simulatorClass,
11
11
  simulatorRootClass,
12
12
  } from "@prismicio/simulator/kit"
13
+ import type { Snippet } from "svelte"
14
+ import type { ClassValue } from "svelte/elements"
13
15
 
14
16
  const defaultProps = getDefaultProps()
15
17
 
16
18
  type Props = {
17
19
  zIndex?: number
18
20
  background?: string
19
- class?: string
21
+ class?: ClassValue
22
+ children?: Snippet<[{ slices: ReturnType<typeof getDefaultSlices> }]>
20
23
  }
21
24
 
22
25
  const {
23
26
  zIndex = defaultProps.zIndex,
24
27
  background = defaultProps.background,
25
28
  class: className,
29
+ children,
26
30
  }: Props = $props()
27
31
 
28
32
  let slices = $state.raw(getDefaultSlices())
@@ -51,7 +55,7 @@
51
55
  </script>
52
56
 
53
57
  <div
54
- class="{simulatorClass} {className}"
58
+ class={[simulatorClass, className]}
55
59
  style="z-index: {zIndex}; position: fixed; top: 0; left: 0; width: 100%; height: 100vh; overflow: auto; background: {background}"
56
60
  >
57
61
  {#if message}
@@ -68,9 +72,7 @@
68
72
  onsubmit={disableEventHandler}
69
73
  onkeypress={disableEventHandler}
70
74
  >
71
- <!-- TODO: Use a snippet in the next major; it would break `let:slices`. -->
72
- <!-- svelte-ignore slot_element_deprecated -->
73
- <slot {slices} />
75
+ {@render children?.({ slices })}
74
76
  </div>
75
77
  {/if}
76
78
  </div>
@@ -38,12 +38,7 @@
38
38
  defaultComponent?: Component<SliceComponentProps> | undefined
39
39
  }
40
40
 
41
- const {
42
- slices = [],
43
- components = {},
44
- context = {},
45
- defaultComponent = undefined,
46
- }: Props = $props()
41
+ const { slices = [], components = {}, context = {}, defaultComponent }: Props = $props()
47
42
  </script>
48
43
 
49
44
  <!--
package/src/index.ts CHANGED
@@ -1,5 +1,3 @@
1
- import type { RichTextComponents } from "./types"
2
-
3
1
  export { default as PrismicEmbed } from "./PrismicEmbed.svelte"
4
2
  export { default as PrismicImage } from "./PrismicImage.svelte"
5
3
  export { default as PrismicLink } from "./PrismicLink.svelte"
@@ -9,9 +7,4 @@ export { default as PrismicText } from "./PrismicText.svelte"
9
7
  export { default as SliceZone } from "./SliceZone/SliceZone.svelte"
10
8
  export { default as SliceSimulator } from "./SliceSimulator.svelte"
11
9
 
12
- /** @deprecated Replaced with `RichTextComponents` */
13
- // TODO: Remove in v3.
14
- export type SvelteRichTextSerializer = RichTextComponents
15
- export type { RichTextComponents }
16
-
17
- export type { RichTextComponentProps, SliceComponentProps } from "./types"
10
+ export type { RichTextComponentProps, RichTextComponents, SliceComponentProps } from "./types"
@@ -1,5 +1,5 @@
1
1
  <script lang="ts">
2
- import { beforeNavigate, goto, invalidateAll } from "$app/navigation"
2
+ import { beforeNavigate, goto, refreshAll } from "$app/navigation"
3
3
  import { getToolbarSrc } from "@prismicio/client"
4
4
  import { onMount } from "svelte"
5
5
 
@@ -36,7 +36,7 @@
36
36
  "prismicPreviewUpdate",
37
37
  (event) => {
38
38
  event.preventDefault()
39
- invalidateAll()
39
+ refreshAll()
40
40
  },
41
41
  { signal: controller.signal },
42
42
  )
@@ -55,10 +55,7 @@
55
55
  ),
56
56
  window.location.origin,
57
57
  ),
58
- {
59
- invalidateAll: true,
60
- noScroll: true,
61
- },
58
+ { refreshAll: true, reset: false },
62
59
  )
63
60
  },
64
61
  { signal: controller.signal },
@@ -11,14 +11,14 @@ export type RedirectToPreviewURLConfig = {
11
11
  /**
12
12
  * The `request` object from a `+server` file.
13
13
  *
14
- * @see SvelteKit `+server` docs: \<https://kit.svelte.dev/docs/routing#server\>
14
+ * @see SvelteKit `+server` docs: \<https://svelte.dev/docs/kit/routing#server\>
15
15
  */
16
16
  request: Request
17
17
 
18
18
  /**
19
19
  * The `cookies` object from a `+server` file.
20
20
  *
21
- * @see SvelteKit `+server` docs: \<https://kit.svelte.dev/docs/routing#server\>
21
+ * @see SvelteKit `+server` docs: \<https://svelte.dev/docs/kit/routing#server\>
22
22
  */
23
23
  cookies: Cookies
24
24
 
@@ -37,13 +37,13 @@ export type RedirectToPreviewURLConfig = {
37
37
  *
38
38
  * @example
39
39
  * ```typescript
40
- * import { createClient } from "$lib/prismicio.js"
40
+ * import { createClient } from "#lib/prismicio.ts"
41
41
  * import { redirectToPreviewURL } from "@prismicio/svelte/kit"
42
42
  *
43
- * export async function GET({ fetch, request }) {
43
+ * export async function GET({ fetch, request, cookies }) {
44
44
  * const client = createClient({ fetch })
45
45
  *
46
- * return await redirectToPreviewURL({ client, request })
46
+ * return await redirectToPreviewURL({ client, request, cookies })
47
47
  * }
48
48
  * ```
49
49
  */