feat: support link text

package.json

@@ -65,8 +65,8 @@
 		"esm-env": "^1.0.0"
 	},
 	"devDependencies": {
-		"@prismicio/client": "^7.4.0",
-		"@prismicio/mock": "^0.3.1",
+		"@prismicio/client": "7.9.0-alpha.2",
+		"@prismicio/mock": "0.3.8-alpha.0",
 		"@size-limit/preset-small-lib": "^11.0.1",
 		"@sveltejs/kit": "^2.0.0",
 		"@sveltejs/package": "^2.2.3",
@@ -106,5 +106,9 @@
 	},
 	"publishConfig": {
 		"access": "public"
+	},
+	"overrides": {
+		"@prismicio/client": "7.9.0-alpha.2",
+		"@prismicio/mock": "0.3.8-alpha.0"
 	}
 }

src/PrismicLink.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
 	import {
 		asLinkAttrs,
+		isFilled,
 		type AsLinkAttrsConfig,
 		type LinkField,
 		type PrismicDocument,
@@ -41,6 +42,7 @@
 	});
 
 	$: resolvedRel = typeof rel === "string" ? rel : linkAttrs.rel;
+	$: resolvedText = isFilled.link(field) ? field.text : undefined;
 </script>
 
 <!--
@@ -49,9 +51,7 @@
 
   @example Rendering a Link field:
 	```svelte
-		<PrismicLink field={document.data.example_link}>
-			Example anchor text.
-		</PrismicLink>
+		<PrismicLink field={document.data.example_link} />
 	```
 -->
 
@@ -62,5 +62,5 @@
 	on:click
 	{...$$restProps}
 >
-	<slot />
+	<slot>{resolvedText}</slot>
 </a>

test/PrismicLink.test.ts

@@ -0,0 +1,27 @@
+// @vitest-environment happy-dom
+import { expect, it } from "vitest";
+
+import { render } from "@testing-library/svelte";
+
+import PrismicLinkTestWrapper from "./PrismicLinkTestWrapper.svelte";
+
+it("renders the link's text if no children are provided", (ctx) => {
+	const model = ctx.mock.model.link({ text: true, allowTargetBlank: false });
+	const field = ctx.mock.value.link({ type: "Web", model });
+	const { container } = render(PrismicLinkTestWrapper, { field });
+
+	expect(container.innerHTML).toBe(
+		`<div><a href="${field.url}" rel="noreferrer">${field.text}</a></div>`,
+	);
+});
+
+it("renders the given children, overriding the link's text", (ctx) => {
+	const model = ctx.mock.model.link({ text: true, allowTargetBlank: false });
+	const field = ctx.mock.value.link({ type: "Web", model });
+	const children = ctx.mock.value.keyText();
+	const { container } = render(PrismicLinkTestWrapper, { field, children });
+
+	expect(container.innerHTML).toBe(
+		`<div><a href="${field.url}" rel="noreferrer">${children}</a></div>`,
+	);
+});

test/PrismicLinkTestWrapper.svelte

@@ -0,0 +1,18 @@
+<!--
+This file is a wrapper for the PrismicLink component to be used in tests as
+passing slot content to the PrismicLink component is not easy in tests.
+-->
+
+<script lang="ts">
+	import { FilledLinkToWebField } from "@prismicio/client";
+	import { PrismicLink } from "../src";
+
+	export let field: FilledLinkToWebField;
+	export let children: string | undefined = undefined;
+</script>
+
+{#if children}
+	<PrismicLink {field}>{children}</PrismicLink>
+{:else}
+	<PrismicLink {field} />
+{/if}