@prismicio/vue 5.2.1 → 5.3.0-canary.aa89de6

package/dist/{SliceZone → src/SliceZone}/types.d.ts

@@ -1,5 +1,8 @@
-import type { Slice } from "@prismicio/client";
-import type { DefineComponent, FunctionalComponent, defineAsyncComponent } from "vue";
+import { DefineComponent, FunctionalComponent, defineAsyncComponent } from "vue";
+import { Slice } from "@prismicio/client";
+
+//#region src/SliceZone/types.d.ts
+
 /**
  * Returns the type of a `SliceLike` type.
  *
@@ -12,15 +15,15 @@ type ExtractSliceType<TSlice extends SliceLike> = TSlice extends SliceLikeRestV2
  *
  * @typeParam SliceType - Type name of the Slice.
  */
-export type SliceLikeRestV2<TSliceType extends string = string> = Pick<Slice<TSliceType>, "id" | "slice_type">;
+type SliceLikeRestV2<TSliceType extends string = string> = Pick<Slice<TSliceType>, "id" | "slice_type">;
 /**
  * The minimum required properties to represent a Prismic Slice from the Prismic
  * GraphQL API for the `unstable_mapSliceZone()` helper.
  *
  * @typeParam SliceType - Type name of the Slice.
  */
-export type SliceLikeGraphQL<TSliceType extends string = string> = {
-    type: Slice<TSliceType>["slice_type"];
+type SliceLikeGraphQL<TSliceType extends string = string> = {
+  type: Slice<TSliceType>["slice_type"];
 };
 /**
  * The minimum required properties to represent a Prismic Slice for the
@@ -31,14 +34,14 @@ export type SliceLikeGraphQL<TSliceType extends string = string> = {
  *
  * @typeParam TSliceType - Type name of the Slice
  */
-export type SliceLike<TSliceType extends string = string> = (SliceLikeRestV2<TSliceType> | SliceLikeGraphQL<TSliceType>) & {
-    /**
-     * If `true`, this Slice has been modified from its original value using a
-     * mapper and `@prismicio/client`'s `mapSliceZone()`.
-     *
-     * @internal
-     */
-    __mapped?: true;
+type SliceLike<TSliceType extends string = string> = (SliceLikeRestV2<TSliceType> | SliceLikeGraphQL<TSliceType>) & {
+  /**
+   * If `true`, this Slice has been modified from its original value using a
+   * mapper and `@prismicio/client`'s `mapSliceZone()`.
+   *
+   * @internal
+   */
+  __mapped?: true;
 };
 /**
  * A looser version of the `SliceZone` type from `@prismicio/client` using
@@ -49,7 +52,7 @@ export type SliceLike<TSliceType extends string = string> = (SliceLikeRestV2<TSl
  *
  * @typeParam TSlice - The type(s) of slices in the Slice Zone
  */
-export type SliceZoneLike<TSlice extends SliceLike = SliceLike> = readonly TSlice[];
+type SliceZoneLike<TSlice extends SliceLike = SliceLike> = readonly TSlice[];
 /**
  * Vue props for a component rendering content from a Prismic Slice using the
  * `<SliceZone />` component.
@@ -58,24 +61,24 @@ export type SliceZoneLike<TSlice extends SliceLike = SliceLike> = readonly TSlic
  * @typeParam TContext - Arbitrary data passed to `<SliceZone />` and made
  *   available to all Slice components
  */
-export type SliceComponentProps<TSlice extends SliceLike = SliceLike, TContext = unknown> = {
-    /**
-     * Slice data for this component.
-     */
-    slice: TSlice;
-    /**
-     * The index of the Slice in the Slice Zone.
-     */
-    index: number;
-    /**
-     * All Slices from the Slice Zone to which the Slice belongs.
-     */
-    slices: SliceZoneLike<TSlice extends SliceLikeGraphQL ? SliceLikeGraphQL : SliceLikeRestV2>;
-    /**
-     * Arbitrary data passed to `<SliceZone />` and made available to all Slice
-     * components.
-     */
-    context: TContext;
+type SliceComponentProps<TSlice extends SliceLike = SliceLike, TContext = unknown> = {
+  /**
+   * Slice data for this component.
+   */
+  slice: TSlice;
+  /**
+   * The index of the Slice in the Slice Zone.
+   */
+  index: number;
+  /**
+   * All Slices from the Slice Zone to which the Slice belongs.
+   */
+  slices: SliceZoneLike<TSlice extends SliceLikeGraphQL ? SliceLikeGraphQL : SliceLikeRestV2>;
+  /**
+   * Arbitrary data passed to `<SliceZone />` and made available to all Slice
+   * components.
+   */
+  context: TContext;
 };
 /**
  * A Vue component to be rendered for each instance of its Slice.
@@ -83,7 +86,7 @@ export type SliceComponentProps<TSlice extends SliceLike = SliceLike, TContext =
  * @typeParam TSlice - The type(s) of slices in the Slice Zone
  * @typeParam TContext - Arbitrary data made available to all Slice components
  */
-export type SliceComponentType<TSlice extends SliceLike = any, TContext = unknown> = DefineComponent<{}, {}, any> | ReturnType<typeof defineAsyncComponent> | DefineComponent<SliceComponentProps<TSlice, TContext>> | FunctionalComponent;
+type SliceComponentType<TSlice extends SliceLike = any, TContext = unknown> = DefineComponent<{}, {}, any> | ReturnType<typeof defineAsyncComponent> | DefineComponent<SliceComponentProps<TSlice, TContext>> | FunctionalComponent;
 /**
  * A record of Slice types mapped to Vue components. Each components will be
  * rendered for each instance of their Slice type.
@@ -91,7 +94,7 @@ export type SliceComponentType<TSlice extends SliceLike = any, TContext = unknow
  * @typeParam TSlice - The type(s) of slices in the Slice Zone
  * @typeParam TContext - Arbitrary data made available to all Slice components
  */
-export type SliceZoneComponents<TSlice extends SliceLike = SliceLike, TContext = unknown> = {
-    [SliceType in ExtractSliceType<TSlice>]: SliceComponentType<Extract<TSlice, SliceLike<SliceType>> extends never ? SliceLike : Extract<TSlice, SliceLike<SliceType>>, TContext> | string;
-};
-export {};
+type SliceZoneComponents<TSlice extends SliceLike = SliceLike, TContext = unknown> = { [SliceType in ExtractSliceType<TSlice>]: SliceComponentType<Extract<TSlice, SliceLike<SliceType>> extends never ? SliceLike : Extract<TSlice, SliceLike<SliceType>>, TContext> | string };
+//#endregion
+export { SliceComponentProps, SliceComponentType, SliceLike, SliceLikeGraphQL, SliceLikeRestV2, SliceZoneComponents, SliceZoneLike };
+//# sourceMappingURL=types.d.ts.map

package/dist/src/SliceZone/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","names":[],"sources":["../../../src/SliceZone/types.ts"],"sourcesContent":[],"mappings":";;;;;;;AAKY;;;KAOP,gBAA4D,CAAA,eAA5B,SAA4B,CAAA,GAAf,MAAe,SAAA,eAAA,GAC9D,MAD8D,CAAA,YAAA,CAAA,GAE9D,MAF8D,SAE/C,gBAF+C,GAG7D,MAH6D,CAAA,MAAA,CAAA,GAAA,KAAA;;;;;;AAYjE;AACO,KADK,eACL,CAAA,mBAAA,MAAA,GAAA,MAAA,CAAA,GAD2D,IAC3D,CAAN,KAAM,CAAA,UAAA,CAAA,EAAA,IAAA,GAAA,YAAA,CAAA;;;;AAUP;AAaA;;AACG,KAdS,gBAcT,CAAA,mBAAA,MAAA,GAAA,MAAA,CAAA,GAAA;EACiB,IAAA,EAdb,KAca,CAdP,UAcO,CAAA,CAAA,YAAA,CAAA;CAAjB;;AAoBH;;;;;AAWA;;;AAOQ,KAxCI,SAwCJ,CAAA,mBAAA,MAAA,GAAA,MAAA,CAAA,GAAA,CAvCL,eAuCK,CAvCW,UAuCX,CAAA,GAtCL,gBAsCK,CAtCY,UAsCZ,CAAA,CAAA,GAAA;EAeN;;;;;;EAOgB,QAAA,CAAA,EAAA,IAAA;AASlB,CAAA;;;;;;;;;;AAWsB,KA5DV,aA4DU,CAAA,eA5DmB,SA4DnB,GA5D+B,SA4D/B,CAAA,GAAA,SA3DZ,MA2DY,EAAA;AAStB;;;;;;;;AAgBK,KA1EO,mBA0EP,CAAA,eAzEW,SAyEX,GAzEuB,SAyEvB,EAAA,WAAA,OAAA,CAAA,GAAA;EACG;;;EACgB,KAAA,EArEhB,MAqEgB;EAAhB;;;EAHe,KAAA,EAAA,MAAA;;;;UApDd,cACP,eAAe,mBAAmB,mBAAmB;;;;;WAO7C;;;;;;;;KASE,kCAEI,uCAKb,+BAEA,kBAAkB,wBAClB,gBAAgB,oBAAoB,QAAQ,aAC5C;;;;;;;;KASS,mCACI,YAAY,iDAaZ,iBAAiB,UAC5B,mBACA,QAAQ,QAAQ,UAAU,4BACvB,YACA,QAAQ,QAAQ,UAAU,aAC7B"}

package/dist/src/lib/devMsg.cjs

@@ -0,0 +1,25 @@
+const require_package = require('../../package.cjs');
+
+//#region src/lib/devMsg.ts
+/**
+* Returns a `prismic.dev/msg` URL for a given message slug.
+*
+* @example
+*
+* ```ts
+* devMsg("missing-param")
+* // => "https://prismic.dev/msg/svelte/v1.2.3/missing-param.md"
+* ```
+*
+* @param slug - Slug for the message. This corresponds to a Markdown file in
+*   the Git repository's `/messages` directory.
+*
+* @returns The `prismic.dev/msg` URL for the given slug.
+*/
+const devMsg = (slug) => {
+	return `https://prismic.dev/msg/vue/v${require_package.version}/${slug}`;
+};
+
+//#endregion
+exports.devMsg = devMsg;
+//# sourceMappingURL=devMsg.cjs.map

package/dist/src/lib/devMsg.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"devMsg.cjs","names":["version"],"sources":["../../../src/lib/devMsg.ts"],"sourcesContent":["import { version } from \"../../package.json\"\n\n/**\n * Returns a `prismic.dev/msg` URL for a given message slug.\n *\n * @example\n *\n * ```ts\n * devMsg(\"missing-param\")\n * // => \"https://prismic.dev/msg/svelte/v1.2.3/missing-param.md\"\n * ```\n *\n * @param slug - Slug for the message. This corresponds to a Markdown file in\n *   the Git repository's `/messages` directory.\n *\n * @returns The `prismic.dev/msg` URL for the given slug.\n */\nexport const devMsg = (slug: string): string => {\n\treturn `https://prismic.dev/msg/vue/v${version}/${slug}`\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAiBA,MAAa,UAAU,SAAyB;AAC/C,QAAO,gCAAgCA,wBAAQ,GAAG"}

package/dist/src/lib/devMsg.js

@@ -0,0 +1,25 @@
+import { version } from "../../package.js";
+
+//#region src/lib/devMsg.ts
+/**
+* Returns a `prismic.dev/msg` URL for a given message slug.
+*
+* @example
+*
+* ```ts
+* devMsg("missing-param")
+* // => "https://prismic.dev/msg/svelte/v1.2.3/missing-param.md"
+* ```
+*
+* @param slug - Slug for the message. This corresponds to a Markdown file in
+*   the Git repository's `/messages` directory.
+*
+* @returns The `prismic.dev/msg` URL for the given slug.
+*/
+const devMsg = (slug) => {
+	return `https://prismic.dev/msg/vue/v${version}/${slug}`;
+};
+
+//#endregion
+export { devMsg };
+//# sourceMappingURL=devMsg.js.map

package/dist/src/lib/devMsg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"devMsg.js","names":[],"sources":["../../../src/lib/devMsg.ts"],"sourcesContent":["import { version } from \"../../package.json\"\n\n/**\n * Returns a `prismic.dev/msg` URL for a given message slug.\n *\n * @example\n *\n * ```ts\n * devMsg(\"missing-param\")\n * // => \"https://prismic.dev/msg/svelte/v1.2.3/missing-param.md\"\n * ```\n *\n * @param slug - Slug for the message. This corresponds to a Markdown file in\n *   the Git repository's `/messages` directory.\n *\n * @returns The `prismic.dev/msg` URL for the given slug.\n */\nexport const devMsg = (slug: string): string => {\n\treturn `https://prismic.dev/msg/vue/v${version}/${slug}`\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAiBA,MAAa,UAAU,SAAyB;AAC/C,QAAO,gCAAgC,QAAQ,GAAG"}

package/dist/src/lib/isInternalURL.cjs

@@ -0,0 +1,24 @@
+
+//#region src/lib/isInternalURL.ts
+/**
+* Determines if a URL is internal or external.
+*
+* @param url - The URL to check if internal or external
+*
+* @returns `true` if `url` is internal, `false` otherwise
+*/
+const isInternalURL = (url) => {
+	/**
+	* @see Regex101 expression: {@link https://regex101.com/r/1y7iod/1}
+	*/
+	const isInternal = /^\/(?!\/)/.test(url);
+	/**
+	* @see Regex101 expression: {@link https://regex101.com/r/RnUseS/1}
+	*/
+	const isSpecialLink = !isInternal && !/^https?:\/\//i.test(url);
+	return isInternal && !isSpecialLink;
+};
+
+//#endregion
+exports.isInternalURL = isInternalURL;
+//# sourceMappingURL=isInternalURL.cjs.map

package/dist/src/lib/isInternalURL.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"isInternalURL.cjs","names":[],"sources":["../../../src/lib/isInternalURL.ts"],"sourcesContent":["/**\n * Determines if a URL is internal or external.\n *\n * @param url - The URL to check if internal or external\n *\n * @returns `true` if `url` is internal, `false` otherwise\n */\n// TODO: This does not detect all relative URLs as internal, such as `about` or `./about`. This function assumes relative URLs start with a \"/\"`.\nexport const isInternalURL = (url: string): boolean => {\n\t/**\n\t * @see Regex101 expression: {@link https://regex101.com/r/1y7iod/1}\n\t */\n\tconst isInternal = /^\\/(?!\\/)/.test(url)\n\t/**\n\t * @see Regex101 expression: {@link https://regex101.com/r/RnUseS/1}\n\t */\n\tconst isSpecialLink = !isInternal && !/^https?:\\/\\//i.test(url)\n\n\treturn isInternal && !isSpecialLink\n}\n"],"mappings":";;;;;;;;;AAQA,MAAa,iBAAiB,QAAyB;;;;CAItD,MAAM,aAAa,YAAY,KAAK,IAAI;;;;CAIxC,MAAM,gBAAgB,CAAC,cAAc,CAAC,gBAAgB,KAAK,IAAI;AAE/D,QAAO,cAAc,CAAC"}

package/dist/src/lib/isInternalURL.js

@@ -0,0 +1,23 @@
+//#region src/lib/isInternalURL.ts
+/**
+* Determines if a URL is internal or external.
+*
+* @param url - The URL to check if internal or external
+*
+* @returns `true` if `url` is internal, `false` otherwise
+*/
+const isInternalURL = (url) => {
+	/**
+	* @see Regex101 expression: {@link https://regex101.com/r/1y7iod/1}
+	*/
+	const isInternal = /^\/(?!\/)/.test(url);
+	/**
+	* @see Regex101 expression: {@link https://regex101.com/r/RnUseS/1}
+	*/
+	const isSpecialLink = !isInternal && !/^https?:\/\//i.test(url);
+	return isInternal && !isSpecialLink;
+};
+
+//#endregion
+export { isInternalURL };
+//# sourceMappingURL=isInternalURL.js.map

package/dist/src/lib/isInternalURL.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"isInternalURL.js","names":[],"sources":["../../../src/lib/isInternalURL.ts"],"sourcesContent":["/**\n * Determines if a URL is internal or external.\n *\n * @param url - The URL to check if internal or external\n *\n * @returns `true` if `url` is internal, `false` otherwise\n */\n// TODO: This does not detect all relative URLs as internal, such as `about` or `./about`. This function assumes relative URLs start with a \"/\"`.\nexport const isInternalURL = (url: string): boolean => {\n\t/**\n\t * @see Regex101 expression: {@link https://regex101.com/r/1y7iod/1}\n\t */\n\tconst isInternal = /^\\/(?!\\/)/.test(url)\n\t/**\n\t * @see Regex101 expression: {@link https://regex101.com/r/RnUseS/1}\n\t */\n\tconst isSpecialLink = !isInternal && !/^https?:\\/\\//i.test(url)\n\n\treturn isInternal && !isSpecialLink\n}\n"],"mappings":";;;;;;;;AAQA,MAAa,iBAAiB,QAAyB;;;;CAItD,MAAM,aAAa,YAAY,KAAK,IAAI;;;;CAIxC,MAAM,gBAAgB,CAAC,cAAc,CAAC,gBAAgB,KAAK,IAAI;AAE/D,QAAO,cAAc,CAAC"}

package/dist/src/types.d.ts

@@ -0,0 +1,7 @@
+import { ConcreteComponent, DefineComponent, Raw } from "vue";
+
+//#region src/types.d.ts
+type ComponentOrTagName = string | ConcreteComponent | Raw<DefineComponent>;
+//#endregion
+export { ComponentOrTagName };
+//# sourceMappingURL=types.d.ts.map

package/dist/src/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","names":[],"sources":["../../src/types.ts"],"sourcesContent":[],"mappings":";;;KAEY,kBAAA,YAET,oBACA,IAAI"}

package/dist/types.d.cts

@@ -0,0 +1,7 @@
+import { ConcreteComponent, DefineComponent, Raw } from "vue";
+
+//#region src/types.d.ts
+type ComponentOrTagName = string | ConcreteComponent | Raw<DefineComponent>;
+//#endregion
+export { ComponentOrTagName };
+//# sourceMappingURL=types.d.cts.map

package/dist/types.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.cts","names":[],"sources":["../src/types.ts"],"sourcesContent":[],"mappings":";;;KAEY,kBAAA,YAET,oBACA,IAAI"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@prismicio/vue",
-	"version": "5.2.1",
+	"version": "5.3.0-canary.aa89de6",
 	"description": "Vue plugin, components, and composables to fetch and present Prismic content",
 	"keywords": [
 		"typescript",
@@ -18,84 +18,61 @@
 	"type": "module",
 	"exports": {
 		".": {
-			"require": {
-				"types": "./dist/index.d.ts",
-				"default": "./dist/index.cjs"
-			},
-			"import": {
-				"types": "./dist/index.d.ts",
-				"default": "./dist/index.js"
-			}
+			"require": "./dist/index.cjs",
+			"import": "./dist/index.js"
 		},
 		"./package.json": "./package.json"
 	},
-	"main": "dist/index.cjs",
-	"module": "dist/index.js",
-	"types": "dist/index.d.ts",
+	"main": "./dist/index.cjs",
+	"module": "./dist/index.js",
+	"types": "./dist/index.d.cts",
 	"files": [
-		"dist",
-		"src",
-		"vetur"
+		"./dist",
+		"./src"
 	],
 	"scripts": {
-		"build": "vite build",
-		"dev": "vite build --watch",
+		"build": "tsdown",
+		"dev": "tsdown --watch",
 		"format": "prettier --write .",
 		"playground:build": "vite build playground",
 		"playground:dev": "vite playground",
 		"prepare": "npm run build",
-		"release": "npm run test && standard-version && git push --follow-tags && npm run build && npm publish",
-		"release:dry": "standard-version --dry-run",
-		"release:alpha": "npm run test && standard-version --release-as major --prerelease alpha && git push --follow-tags && npm run build && npm publish --tag alpha",
-		"release:alpha:dry": "standard-version --release-as major --prerelease alpha --dry-run",
-		"lint": "eslint",
-		"types": "vitest --typecheck.only --run && vue-tsc --noEmit",
-		"types:watch": "vitest --typecheck.only",
+		"lint": "oxlint --deny-warnings",
+		"types": "vue-tsc --noEmit",
 		"unit": "vitest run --coverage",
 		"unit:watch": "vitest watch",
-		"size": "size-limit",
-		"test": "npm run lint && npm run types && npm run unit && npm run build && npm run size"
+		"test": "npm run lint && npm run types && npm run unit && npm run build"
 	},
 	"dependencies": {
-		"@prismicio/client": "^7.17.1",
-		"esm-env": "^1.2.2",
-		"vue-router": "^4.5.0"
+		"esm-env": "^1.2.2"
 	},
 	"devDependencies": {
-		"@eslint/js": "^9.23.0",
+		"@prismicio/client": "^7.21.0",
 		"@prismicio/mock": "^0.7.1",
-		"@size-limit/preset-small-lib": "^11.2.0",
-		"@trivago/prettier-plugin-sort-imports": "^5.2.2",
+		"@trivago/prettier-plugin-sort-imports": "^6.0.0",
 		"@types/jsdom-global": "^3.0.7",
-		"@vitejs/plugin-vue": "^5.2.3",
-		"@vitest/coverage-v8": "^3.0.9",
-		"@vue/eslint-config-typescript": "^14.5.0",
+		"@vitejs/plugin-vue": "^6.0.2",
+		"@vitest/coverage-v8": "^4.0.15",
 		"@vue/test-utils": "^2.4.6",
-		"eslint": "^9.23.0",
-		"eslint-config-prettier": "^10.1.1",
-		"eslint-plugin-prettier": "^5.2.5",
-		"eslint-plugin-tsdoc": "^0.4.0",
-		"eslint-plugin-vue": "^10.0.0",
-		"jsdom": "^26.0.0",
+		"jsdom": "^27.3.0",
 		"jsdom-global": "^3.0.2",
-		"prettier": "^3.5.3",
-		"prettier-plugin-jsdoc": "^1.3.2",
-		"size-limit": "^11.2.0",
-		"standard-version": "^9.5.0",
-		"typescript": "^5.8.2",
-		"typescript-eslint": "^8.28.0",
-		"vite": "^6.2.3",
-		"vite-plugin-dts": "^4.5.3",
-		"vite-plugin-sdk": "^0.1.3",
-		"vitest": "^3.0.9",
-		"vue": "^3.5.13",
-		"vue-tsc": "^2.2.8"
+		"oxlint": "1.32.0",
+		"prettier": "^3.7.4",
+		"prettier-plugin-jsdoc": "^1.8.0",
+		"tsdown": "0.17.2",
+		"typescript": "^5.9.3",
+		"vite": "^7.2.7",
+		"vitest": "^4.0.15",
+		"vue": "^3.5.25",
+		"vue-router": "^4.6.3",
+		"vue-tsc": "^3.1.8"
 	},
 	"peerDependencies": {
-		"vue": "^3.0.0"
+		"@prismicio/client": "^7",
+		"vue": "^3"
 	},
 	"engines": {
-		"node": ">=16.10.0"
+		"node": ">=20"
 	},
 	"publishConfig": {
 		"access": "public"

package/src/PrismicImage.vue

@@ -10,8 +10,6 @@ import { computed, watchEffect } from "vue"
 
 import { devMsg } from "./lib/devMsg"
 
-import { usePrismic } from "./usePrismic"
-
 /**
  * Props for `<PrismicImage />`.
  */
@@ -44,6 +42,22 @@ export type PrismicImageProps = {
 	 * https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/alt#decorative_images
 	 */
 	fallbackAlt?: ""
+
+	/**
+	 * The width attribute of the image element.
+	 *
+	 * See:
+	 * https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/width
+	 */
+	width?: number | string
+
+	/**
+	 * The height attribute of the image element.
+	 *
+	 * See:
+	 * https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/height
+	 */
+	height?: number | string
 } & (
 	| {
 			/**
@@ -88,8 +102,6 @@ export type PrismicImageProps = {
 const props = defineProps<PrismicImageProps>()
 defineOptions({ name: "PrismicImage" })
 
-const { options } = usePrismic()
-
 if (DEV) {
 	watchEffect(() => {
 		if (typeof props.alt === "string" && props.alt !== "") {
@@ -116,6 +128,20 @@ if (DEV) {
 	})
 }
 
+const castInt = (input: string | number | undefined): number | undefined => {
+	if (typeof input === "number" || typeof input === "undefined") {
+		return input
+	} else {
+		const parsed = Number.parseInt(input)
+
+		if (Number.isNaN(parsed)) {
+			return undefined
+		} else {
+			return parsed
+		}
+	}
+}
+
 const image = computed(() => {
 	if (!isFilled.imageThumbnail(props.field)) {
 		return
@@ -126,10 +152,7 @@ const image = computed(() => {
 	if (props.widths || !props.pixelDensities) {
 		const res = asImageWidthSrcSet(props.field, {
 			...props.imgixParams,
-			widths:
-				props.widths === "defaults"
-					? options.components?.imageWidthSrcSetDefaults
-					: props.widths,
+			widths: props.widths === "defaults" ? undefined : props.widths,
 		})
 
 		src = res.src
@@ -138,23 +161,44 @@ const image = computed(() => {
 		const res = asImagePixelDensitySrcSet(props.field, {
 			...props.imgixParams,
 			pixelDensities:
-				props.pixelDensities === "defaults"
-					? options.components?.imagePixelDensitySrcSetDefaults
-					: props.pixelDensities,
+				props.pixelDensities === "defaults" ? undefined : props.pixelDensities,
 		})
 
 		src = res.src
 		srcSet = res.srcset
 	}
 
+	const ar = props.field.dimensions.width / props.field.dimensions.height
+
+	const castedWidth = castInt(props.width)
+	const castedHeight = castInt(props.height)
+
+	let resolvedWidth = castedWidth ?? props.field.dimensions.width
+	let resolvedHeight = castedHeight ?? props.field.dimensions.height
+
+	if (castedWidth != null && castedHeight == null) {
+		resolvedHeight = castedWidth / ar
+	} else if (castedWidth == null && castedHeight != null) {
+		resolvedWidth = castedHeight * ar
+	}
+
 	return {
 		src,
 		srcSet,
 		alt: props.alt ?? (props.field.alt || props.fallbackAlt),
+		width: Math.round(resolvedWidth),
+		height: Math.round(resolvedHeight),
 	}
 })
 </script>
 
 <template>
-	<img v-if="image" :src="image.src" :srcset="image.srcSet" :alt="image.alt" />
+	<img
+		v-if="image"
+		:src="image.src"
+		:srcset="image.srcSet"
+		:alt="image.alt"
+		:width="image.width"
+		:height="image.height"
+	/>
 </template>

package/src/PrismicLink.vue

@@ -12,8 +12,6 @@ import { isInternalURL } from "./lib/isInternalURL"
 
 import type { ComponentOrTagName } from "./types"
 
-import { usePrismic } from "./usePrismic"
-
 /**
  * The default component rendered for internal URLs.
  */
@@ -47,36 +45,20 @@ export type PrismicLinkProps = {
 	 * The `rel` attribute for the link. By default, `"noreferrer"` is provided if
 	 * the link's URL is external. This prop can be provided a function to use the
 	 * link's metadata to determine the `rel` value.
-	 *
-	 * @defaultValue The one provided to `@prismicio/vue` plugin if configured.
 	 */
 	rel?: string | AsLinkAttrsConfig["rel"]
 
 	/**
-	 * An HTML tag name or a component used to render internal links.
-	 *
-	 * @remarks
-	 * HTML tag names will be rendered using the anchor tag interface (`href`,
-	 * `target`, and `rel` attributes).
-	 * @remarks
-	 * Components will be rendered using Vue Router {@link RouterLink} interface
-	 * (`to` props).
+	 * The Vue component rendered for links when the URL is internal.
 	 *
-	 * @defaultValue The one provided to `@prismicio/vue` plugin if configured, {@link RouterLink} otherwise.
+	 * @defaultValue `<RouterLink>`
 	 */
 	internalComponent?: ComponentOrTagName
 
 	/**
-	 * An HTML tag name or a component used to render external links.
+	 * The Vue component rendered for links when the URL is external.
 	 *
-	 * @remarks
-	 * HTML tag names will be rendered using the anchor tag interface (`href`,
-	 * `target`, and `rel` attributes).
-	 * @remarks
-	 * Components will be rendered using Vue Router {@link RouterLink} interface
-	 * (`to` props).
-	 *
-	 * @defaultValue The one provided to `@prismicio/vue` plugin if configured, `"a"` otherwise.
+	 * @defaultValue `<a>`
 	 */
 	externalComponent?: ComponentOrTagName
 } & (
@@ -99,15 +81,12 @@ export type PrismicLinkProps = {
 const props = defineProps<PrismicLinkProps>()
 defineOptions({ name: "PrismicLink" })
 
-const { options } = usePrismic()
-
 const rawAttrs = computed(() => {
 	return asLinkAttrs(props.field || props.document, {
-		linkResolver: props.linkResolver || options.linkResolver,
+		linkResolver: props.linkResolver,
 		rel(args) {
-			const maybeRel = props.rel || options.components?.linkRel
-			if (maybeRel) {
-				return typeof maybeRel === "function" ? maybeRel(args) : maybeRel
+			if (props.rel) {
+				return typeof props.rel === "function" ? props.rel(args) : props.rel
 			}
 
 			return args.isExternal ? defaultExternalRelAttribute : undefined
@@ -117,12 +96,8 @@ const rawAttrs = computed(() => {
 
 const component = computed(() => {
 	return isInternalURL(rawAttrs.value.href || "")
-		? props.internalComponent ||
-				options.components?.linkInternalComponent ||
-				defaultInternalComponent
-		: props.externalComponent ||
-				options.components?.linkExternalComponent ||
-				defaultExternalComponent
+		? props.internalComponent || defaultInternalComponent
+		: props.externalComponent || defaultExternalComponent
 })
 
 // Match Vue Router's `<RouterLink />` interface unless the component is an anchor tag.