@prismicio/vue 4.3.0 → 4.3.2
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.
- package/dist/components/PrismicEmbed.cjs.map +1 -1
- package/dist/components/PrismicEmbed.d.ts +7 -7
- package/dist/components/PrismicEmbed.js.map +1 -1
- package/dist/components/PrismicImage.cjs.map +1 -1
- package/dist/components/PrismicImage.d.ts +10 -8
- package/dist/components/PrismicImage.js.map +1 -1
- package/dist/components/PrismicLink.cjs.map +1 -1
- package/dist/components/PrismicLink.d.ts +10 -8
- package/dist/components/PrismicLink.js.map +1 -1
- package/dist/components/PrismicRichText.cjs +5 -1
- package/dist/components/PrismicRichText.cjs.map +1 -1
- package/dist/components/PrismicRichText.d.ts +8 -8
- package/dist/components/PrismicRichText.js +6 -2
- package/dist/components/PrismicRichText.js.map +1 -1
- package/dist/components/PrismicText.cjs.map +1 -1
- package/dist/components/PrismicText.d.ts +8 -8
- package/dist/components/PrismicText.js.map +1 -1
- package/dist/components/SliceZone.cjs.map +1 -1
- package/dist/components/SliceZone.d.ts +14 -12
- package/dist/components/SliceZone.js.map +1 -1
- package/dist/components/index.d.ts +1 -1
- package/dist/composables.cjs.map +1 -1
- package/dist/composables.d.ts +20 -2
- package/dist/composables.js.map +1 -1
- package/dist/createPrismic.cjs.map +1 -1
- package/dist/createPrismic.js.map +1 -1
- package/dist/injectionSymbols.cjs.map +1 -1
- package/dist/injectionSymbols.js.map +1 -1
- package/dist/lib/__PRODUCTION__.cjs.map +1 -1
- package/dist/lib/__PRODUCTION__.js.map +1 -1
- package/dist/lib/getSlots.cjs +7 -5
- package/dist/lib/getSlots.cjs.map +1 -1
- package/dist/lib/getSlots.d.ts +2 -2
- package/dist/lib/getSlots.js +7 -5
- package/dist/lib/getSlots.js.map +1 -1
- package/dist/lib/isInternalURL.cjs.map +1 -1
- package/dist/lib/isInternalURL.js.map +1 -1
- package/dist/lib/simplyResolveComponent.cjs.map +1 -1
- package/dist/lib/simplyResolveComponent.d.ts +1 -1
- package/dist/lib/simplyResolveComponent.js.map +1 -1
- package/dist/types.d.ts +11 -2
- package/dist/usePrismic.cjs.map +1 -1
- package/dist/usePrismic.d.ts +5 -5
- package/dist/usePrismic.js.map +1 -1
- package/dist/useStatefulPrismicClientMethod.cjs.map +1 -1
- package/dist/useStatefulPrismicClientMethod.d.ts +4 -3
- package/dist/useStatefulPrismicClientMethod.js.map +1 -1
- package/package.json +27 -28
- package/src/components/PrismicEmbed.ts +16 -17
- package/src/components/PrismicImage.ts +57 -59
- package/src/components/PrismicLink.ts +68 -70
- package/src/components/PrismicRichText.ts +71 -68
- package/src/components/PrismicText.ts +30 -32
- package/src/components/SliceZone.ts +94 -96
- package/src/components/index.ts +12 -16
- package/src/composables.ts +41 -23
- package/src/createPrismic.ts +40 -34
- package/src/globalExtensions.ts +2 -2
- package/src/index.ts +10 -10
- package/src/injectionSymbols.ts +4 -4
- package/src/lib/__PRODUCTION__.ts +2 -2
- package/src/lib/getSlots.ts +18 -12
- package/src/lib/isInternalURL.ts +4 -4
- package/src/lib/simplyResolveComponent.ts +4 -9
- package/src/types.ts +61 -52
- package/src/usePrismic.ts +9 -9
- package/src/useStatefulPrismicClientMethod.ts +42 -40
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useStatefulPrismicClientMethod.cjs","sources":["../../src/useStatefulPrismicClientMethod.ts"],"sourcesContent":["import {\n\tClient,\n\tForbiddenError,\n\tParsingError,\n\tPrismicError,\n} from \"@prismicio/client\"
|
|
1
|
+
{"version":3,"file":"useStatefulPrismicClientMethod.cjs","sources":["../../src/useStatefulPrismicClientMethod.ts"],"sourcesContent":["import type {\n\tClient,\n\tForbiddenError,\n\tParsingError,\n\tPrismicError,\n} from \"@prismicio/client\"\nimport type { Ref } from \"vue\"\nimport { isRef, ref, shallowRef, unref, watch } from \"vue\"\n\nimport type { VueUseParameters } from \"./types\"\nimport { PrismicClientComposableState } from \"./types\"\n\nimport { usePrismic } from \"./usePrismic\"\n\n// Helpers\ntype UnwrapPromise<T> = T extends Promise<infer U> ? U : T\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype ClientMethodLike = (...args: any[]) => Promise<any> | any\ntype ClientMethods = typeof Client.prototype\ntype ClientError = PrismicError<unknown> | ParsingError | ForbiddenError\n\n// Interfaces\n\n/**\n * @internal\n */\nexport type ClientMethodParameters<TMethodName extends keyof ClientMethods> =\n\tClientMethods[TMethodName] extends ClientMethodLike\n\t\t? VueUseParameters<Parameters<ClientMethods[TMethodName]>>\n\t\t: never\n\n/**\n * @internal\n */\nexport type ClientMethodReturnType<TMethodName extends keyof ClientMethods> =\n\tClientMethods[TMethodName] extends ClientMethodLike\n\t\t? ReturnType<ClientMethods[TMethodName]>\n\t\t: never\n\n/**\n * @internal\n */\nexport type ComposableOnlyParameters = {\n\tclient?: Ref<Client> | Client\n}\n\n/**\n * The return type of a `@prismicio/client` Vue composable.\n *\n * @typeParam TData - The expected format of the `data` property of the returned\n * object\n */\nexport type ClientComposableReturnType<TData = unknown> = {\n\t/**\n\t * The current state of the composable's client method call.\n\t */\n\tstate: Ref<PrismicClientComposableState>\n\n\t/**\n\t * Data returned by the client.\n\t */\n\tdata: Ref<TData | null>\n\n\t/**\n\t * Error returned by the composable's client method call if in an errror\n\t * state.\n\t */\n\terror: Ref<ClientError | Error | null>\n\n\t/**\n\t * Perform the composable's client method call again.\n\t */\n\trefresh: () => Promise<void>\n}\n\n/**\n * Determines if a value is a `@prismicio/client` params object.\n *\n * @param value - The value to check\n *\n * @returns `true` if `value` is a `@prismicio/client` params object, `false`\n * otherwise\n */\nconst isParams = (\n\tvalue: unknown,\n): value is ClientMethodParameters<\"get\">[0] & ComposableOnlyParameters => {\n\t// This is a *very* naive check.\n\treturn typeof value === \"object\" && value !== null && !Array.isArray(value)\n}\n\n/**\n * A low level Vue composable that uses provided method name on plugin or\n * provided client with given arguments. The composable has its own internal\n * state manager to report async status, such as pending or error statuses.\n *\n * @typeParam TClientMethodName - A method name from `@prismicio/client`\n * @typeParam TClientMethodArguments - The method expected arguments\n * @typeParam TClientMethodReturnType - The method expected return type\n *\n * @param method - The `@prismicio/client` method name to use\n * @param args - The arguments to use with requested method\n *\n * @returns The composable payload {@link ClientComposableReturnType}\n *\n * @internal\n */\nexport const useStatefulPrismicClientMethod = <\n\tTClientMethodName extends keyof ClientMethods,\n\tTClientMethodArguments extends ClientMethodParameters<TClientMethodName>,\n\tTClientMethodReturnType extends UnwrapPromise<\n\t\tClientMethodReturnType<TClientMethodName>\n\t>,\n>(\n\tmethodName: TClientMethodName,\n\targs: TClientMethodArguments,\n): ClientComposableReturnType<TClientMethodReturnType> => {\n\tconst { client } = usePrismic()\n\n\tconst state = ref<PrismicClientComposableState>(\n\t\tPrismicClientComposableState.Idle,\n\t)\n\tconst data = shallowRef<TClientMethodReturnType | null>(null)\n\tconst error = ref<ClientError | Error | null>(null)\n\tconst refresh = async (): Promise<void> => {\n\t\tconst lastArg = unref(args[args.length - 1])\n\t\tconst { client: explicitClient, ...params } = isParams(lastArg)\n\t\t\t? (lastArg as ClientMethodParameters<\"get\">[0] & ComposableOnlyParameters)\n\t\t\t: ({} as ComposableOnlyParameters)\n\t\tconst argsWithoutParams = isParams(lastArg) ? args.slice(0, -1) : args\n\n\t\tstate.value = PrismicClientComposableState.Pending\n\t\tdata.value = null\n\t\terror.value = null\n\t\ttry {\n\t\t\tdata.value = await (\n\t\t\t\t(unref(explicitClient) || client)[methodName] as ClientMethodLike\n\t\t\t)(\n\t\t\t\t...argsWithoutParams.map((arg: Ref<unknown> | unknown) => unref(arg)),\n\t\t\t\tparams,\n\t\t\t)\n\t\t\tstate.value = PrismicClientComposableState.Success\n\t\t} catch (err) {\n\t\t\tstate.value = PrismicClientComposableState.Error\n\t\t\terror.value = err as ClientError | Error\n\t\t}\n\t}\n\n\t// Watch reactive args\n\tconst refArgs = args.filter((arg) => isRef(arg))\n\tif (refArgs.length) {\n\t\twatch(refArgs, refresh, { deep: true })\n\t}\n\n\t// Fetch once\n\trefresh()\n\n\treturn { state, data, error, refresh }\n}\n"],"names":["usePrismic","ref","shallowRef","unref","isRef","watch"],"mappings":";;;;AAmFA,MAAM,WAAW,CAChB,UACyE;AAElE,SAAA,OAAO,UAAU,YAAY,UAAU,QAAQ,CAAC,MAAM,QAAQ,KAAK;AAC3E;AAkBa,MAAA,iCAAiC,CAO7C,YACA,SACwD;AAClD,QAAA,EAAE,OAAM,IAAKA;AAEnB,QAAM,QAAQC,IAAA;AAAA,IAAG;AAAA;AAAA,EAAA;AAGX,QAAA,OAAOC,eAA2C,IAAI;AACtD,QAAA,QAAQD,QAAgC,IAAI;AAClD,QAAM,UAAU,YAA0B;AACzC,UAAM,UAAUE,IAAAA,MAAM,KAAK,KAAK,SAAS,CAAC,CAAC;AACrC,UAAA,EAAE,QAAQ,gBAAgB,GAAG,WAAW,SAAS,OAAO,IAC1D,UACA;AACE,UAAA,oBAAoB,SAAS,OAAO,IAAI,KAAK,MAAM,GAAG,EAAE,IAAI;AAElE,UAAM,QAAK;AACX,SAAK,QAAQ;AACb,UAAM,QAAQ;AACV,QAAA;AACH,WAAK,QAAQ,OACXA,IAAA,MAAM,cAAc,KAAK,QAAQ,UAAU,EAE5C,GAAG,kBAAkB,IAAI,CAAC,QAAgCA,UAAM,GAAG,CAAC,GACpE,MAAM;AAEP,YAAM,QAAK;AAAA,aACH,KAAK;AACb,YAAM,QAAK;AACX,YAAM,QAAQ;AAAA,IAAA;AAAA,EAEhB;AAGA,QAAM,UAAU,KAAK,OAAO,CAAC,QAAQC,IAAAA,MAAM,GAAG,CAAC;AAC/C,MAAI,QAAQ,QAAQ;AACnBC,QAAAA,MAAM,SAAS,SAAS,EAAE,MAAM,MAAM;AAAA,EAAA;;AAMvC,SAAO,EAAE,OAAO,MAAM,OAAO,QAAO;AACrC;;"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
import { Client, ForbiddenError, ParsingError, PrismicError } from "@prismicio/client";
|
|
2
|
-
import { Ref } from "vue";
|
|
3
|
-
import {
|
|
1
|
+
import type { Client, ForbiddenError, ParsingError, PrismicError } from "@prismicio/client";
|
|
2
|
+
import type { Ref } from "vue";
|
|
3
|
+
import type { VueUseParameters } from "./types";
|
|
4
|
+
import { PrismicClientComposableState } from "./types";
|
|
4
5
|
type UnwrapPromise<T> = T extends Promise<infer U> ? U : T;
|
|
5
6
|
type ClientMethodLike = (...args: any[]) => Promise<any> | any;
|
|
6
7
|
type ClientMethods = typeof Client.prototype;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useStatefulPrismicClientMethod.js","sources":["../../src/useStatefulPrismicClientMethod.ts"],"sourcesContent":["import {\n\tClient,\n\tForbiddenError,\n\tParsingError,\n\tPrismicError,\n} from \"@prismicio/client\"
|
|
1
|
+
{"version":3,"file":"useStatefulPrismicClientMethod.js","sources":["../../src/useStatefulPrismicClientMethod.ts"],"sourcesContent":["import type {\n\tClient,\n\tForbiddenError,\n\tParsingError,\n\tPrismicError,\n} from \"@prismicio/client\"\nimport type { Ref } from \"vue\"\nimport { isRef, ref, shallowRef, unref, watch } from \"vue\"\n\nimport type { VueUseParameters } from \"./types\"\nimport { PrismicClientComposableState } from \"./types\"\n\nimport { usePrismic } from \"./usePrismic\"\n\n// Helpers\ntype UnwrapPromise<T> = T extends Promise<infer U> ? U : T\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype ClientMethodLike = (...args: any[]) => Promise<any> | any\ntype ClientMethods = typeof Client.prototype\ntype ClientError = PrismicError<unknown> | ParsingError | ForbiddenError\n\n// Interfaces\n\n/**\n * @internal\n */\nexport type ClientMethodParameters<TMethodName extends keyof ClientMethods> =\n\tClientMethods[TMethodName] extends ClientMethodLike\n\t\t? VueUseParameters<Parameters<ClientMethods[TMethodName]>>\n\t\t: never\n\n/**\n * @internal\n */\nexport type ClientMethodReturnType<TMethodName extends keyof ClientMethods> =\n\tClientMethods[TMethodName] extends ClientMethodLike\n\t\t? ReturnType<ClientMethods[TMethodName]>\n\t\t: never\n\n/**\n * @internal\n */\nexport type ComposableOnlyParameters = {\n\tclient?: Ref<Client> | Client\n}\n\n/**\n * The return type of a `@prismicio/client` Vue composable.\n *\n * @typeParam TData - The expected format of the `data` property of the returned\n * object\n */\nexport type ClientComposableReturnType<TData = unknown> = {\n\t/**\n\t * The current state of the composable's client method call.\n\t */\n\tstate: Ref<PrismicClientComposableState>\n\n\t/**\n\t * Data returned by the client.\n\t */\n\tdata: Ref<TData | null>\n\n\t/**\n\t * Error returned by the composable's client method call if in an errror\n\t * state.\n\t */\n\terror: Ref<ClientError | Error | null>\n\n\t/**\n\t * Perform the composable's client method call again.\n\t */\n\trefresh: () => Promise<void>\n}\n\n/**\n * Determines if a value is a `@prismicio/client` params object.\n *\n * @param value - The value to check\n *\n * @returns `true` if `value` is a `@prismicio/client` params object, `false`\n * otherwise\n */\nconst isParams = (\n\tvalue: unknown,\n): value is ClientMethodParameters<\"get\">[0] & ComposableOnlyParameters => {\n\t// This is a *very* naive check.\n\treturn typeof value === \"object\" && value !== null && !Array.isArray(value)\n}\n\n/**\n * A low level Vue composable that uses provided method name on plugin or\n * provided client with given arguments. The composable has its own internal\n * state manager to report async status, such as pending or error statuses.\n *\n * @typeParam TClientMethodName - A method name from `@prismicio/client`\n * @typeParam TClientMethodArguments - The method expected arguments\n * @typeParam TClientMethodReturnType - The method expected return type\n *\n * @param method - The `@prismicio/client` method name to use\n * @param args - The arguments to use with requested method\n *\n * @returns The composable payload {@link ClientComposableReturnType}\n *\n * @internal\n */\nexport const useStatefulPrismicClientMethod = <\n\tTClientMethodName extends keyof ClientMethods,\n\tTClientMethodArguments extends ClientMethodParameters<TClientMethodName>,\n\tTClientMethodReturnType extends UnwrapPromise<\n\t\tClientMethodReturnType<TClientMethodName>\n\t>,\n>(\n\tmethodName: TClientMethodName,\n\targs: TClientMethodArguments,\n): ClientComposableReturnType<TClientMethodReturnType> => {\n\tconst { client } = usePrismic()\n\n\tconst state = ref<PrismicClientComposableState>(\n\t\tPrismicClientComposableState.Idle,\n\t)\n\tconst data = shallowRef<TClientMethodReturnType | null>(null)\n\tconst error = ref<ClientError | Error | null>(null)\n\tconst refresh = async (): Promise<void> => {\n\t\tconst lastArg = unref(args[args.length - 1])\n\t\tconst { client: explicitClient, ...params } = isParams(lastArg)\n\t\t\t? (lastArg as ClientMethodParameters<\"get\">[0] & ComposableOnlyParameters)\n\t\t\t: ({} as ComposableOnlyParameters)\n\t\tconst argsWithoutParams = isParams(lastArg) ? args.slice(0, -1) : args\n\n\t\tstate.value = PrismicClientComposableState.Pending\n\t\tdata.value = null\n\t\terror.value = null\n\t\ttry {\n\t\t\tdata.value = await (\n\t\t\t\t(unref(explicitClient) || client)[methodName] as ClientMethodLike\n\t\t\t)(\n\t\t\t\t...argsWithoutParams.map((arg: Ref<unknown> | unknown) => unref(arg)),\n\t\t\t\tparams,\n\t\t\t)\n\t\t\tstate.value = PrismicClientComposableState.Success\n\t\t} catch (err) {\n\t\t\tstate.value = PrismicClientComposableState.Error\n\t\t\terror.value = err as ClientError | Error\n\t\t}\n\t}\n\n\t// Watch reactive args\n\tconst refArgs = args.filter((arg) => isRef(arg))\n\tif (refArgs.length) {\n\t\twatch(refArgs, refresh, { deep: true })\n\t}\n\n\t// Fetch once\n\trefresh()\n\n\treturn { state, data, error, refresh }\n}\n"],"names":[],"mappings":";;AAmFA,MAAM,WAAW,CAChB,UACyE;AAElE,SAAA,OAAO,UAAU,YAAY,UAAU,QAAQ,CAAC,MAAM,QAAQ,KAAK;AAC3E;AAkBa,MAAA,iCAAiC,CAO7C,YACA,SACwD;AAClD,QAAA,EAAE,OAAM,IAAK;AAEnB,QAAM,QAAQ;AAAA,IAAG;AAAA;AAAA,EAAA;AAGX,QAAA,OAAO,WAA2C,IAAI;AACtD,QAAA,QAAQ,IAAgC,IAAI;AAClD,QAAM,UAAU,YAA0B;AACzC,UAAM,UAAU,MAAM,KAAK,KAAK,SAAS,CAAC,CAAC;AACrC,UAAA,EAAE,QAAQ,gBAAgB,GAAG,WAAW,SAAS,OAAO,IAC1D,UACA;AACE,UAAA,oBAAoB,SAAS,OAAO,IAAI,KAAK,MAAM,GAAG,EAAE,IAAI;AAElE,UAAM,QAAK;AACX,SAAK,QAAQ;AACb,UAAM,QAAQ;AACV,QAAA;AACH,WAAK,QAAQ,OACX,MAAM,cAAc,KAAK,QAAQ,UAAU,EAE5C,GAAG,kBAAkB,IAAI,CAAC,QAAgC,MAAM,GAAG,CAAC,GACpE,MAAM;AAEP,YAAM,QAAK;AAAA,aACH,KAAK;AACb,YAAM,QAAK;AACX,YAAM,QAAQ;AAAA,IAAA;AAAA,EAEhB;AAGA,QAAM,UAAU,KAAK,OAAO,CAAC,QAAQ,MAAM,GAAG,CAAC;AAC/C,MAAI,QAAQ,QAAQ;AACnB,UAAM,SAAS,SAAS,EAAE,MAAM,MAAM;AAAA,EAAA;;AAMvC,SAAO,EAAE,OAAO,MAAM,OAAO,QAAO;AACrC;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@prismicio/vue",
|
|
3
|
-
"version": "4.3.
|
|
3
|
+
"version": "4.3.2",
|
|
4
4
|
"description": "Vue plugin, components, and composables to fetch and present Prismic content",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"typescript",
|
|
@@ -48,47 +48,46 @@
|
|
|
48
48
|
"release:dry": "standard-version --dry-run",
|
|
49
49
|
"release:beta": "npm run test && standard-version --release-as major --prerelease beta && git push --follow-tags && npm run build && npm publish --tag beta",
|
|
50
50
|
"release:beta:dry": "standard-version --release-as major --prerelease beta --dry-run",
|
|
51
|
-
"lint": "eslint
|
|
52
|
-
"types": "vitest typecheck --run && tsc --noEmit",
|
|
53
|
-
"types:watch": "vitest typecheck",
|
|
51
|
+
"lint": "eslint",
|
|
52
|
+
"types": "vitest --typecheck.only --run && tsc --noEmit",
|
|
53
|
+
"types:watch": "vitest --typecheck.only",
|
|
54
54
|
"unit": "vitest run --coverage",
|
|
55
55
|
"unit:watch": "vitest watch",
|
|
56
56
|
"size": "size-limit",
|
|
57
57
|
"test": "npm run lint && npm run types && npm run unit && npm run build && npm run size"
|
|
58
58
|
},
|
|
59
59
|
"dependencies": {
|
|
60
|
-
"@prismicio/client": "^7.
|
|
60
|
+
"@prismicio/client": "^7.12.0",
|
|
61
61
|
"isomorphic-unfetch": "^3.1.0",
|
|
62
|
-
"vue-router": "^4.
|
|
62
|
+
"vue-router": "^4.5.0"
|
|
63
63
|
},
|
|
64
64
|
"devDependencies": {
|
|
65
|
-
"@
|
|
66
|
-
"@
|
|
65
|
+
"@eslint/js": "^9.16.0",
|
|
66
|
+
"@prismicio/mock": "^0.4.0",
|
|
67
|
+
"@size-limit/preset-small-lib": "^11.1.6",
|
|
67
68
|
"@trivago/prettier-plugin-sort-imports": "^4.3.0",
|
|
68
69
|
"@types/jsdom-global": "^3.0.7",
|
|
69
|
-
"@
|
|
70
|
-
"@
|
|
71
|
-
"@
|
|
72
|
-
"@vitest/coverage-v8": "^0.34.6",
|
|
73
|
-
"@vue/compiler-sfc": "^3.4.38",
|
|
74
|
-
"@vue/eslint-config-typescript": "^11.0.3",
|
|
70
|
+
"@vitejs/plugin-vue": "^5.2.1",
|
|
71
|
+
"@vitest/coverage-v8": "^2.1.8",
|
|
72
|
+
"@vue/eslint-config-typescript": "^14.1.4",
|
|
75
73
|
"@vue/test-utils": "^2.4.6",
|
|
76
|
-
"eslint": "^
|
|
77
|
-
"eslint-config-prettier": "^
|
|
78
|
-
"eslint-plugin-prettier": "^
|
|
79
|
-
"eslint-plugin-tsdoc": "^0.
|
|
80
|
-
"eslint-plugin-vue": "^9.
|
|
81
|
-
"jsdom": "^
|
|
74
|
+
"eslint": "^9.16.0",
|
|
75
|
+
"eslint-config-prettier": "^9.1.0",
|
|
76
|
+
"eslint-plugin-prettier": "^5.2.1",
|
|
77
|
+
"eslint-plugin-tsdoc": "^0.4.0",
|
|
78
|
+
"eslint-plugin-vue": "^9.32.0",
|
|
79
|
+
"jsdom": "^25.0.1",
|
|
82
80
|
"jsdom-global": "^3.0.2",
|
|
83
|
-
"prettier": "^
|
|
84
|
-
"prettier-plugin-jsdoc": "^
|
|
85
|
-
"size-limit": "^
|
|
81
|
+
"prettier": "^3.4.1",
|
|
82
|
+
"prettier-plugin-jsdoc": "^1.3.0",
|
|
83
|
+
"size-limit": "^11.1.6",
|
|
86
84
|
"standard-version": "^9.5.0",
|
|
87
|
-
"typescript": "^5.
|
|
88
|
-
"
|
|
89
|
-
"vite
|
|
90
|
-
"
|
|
91
|
-
"
|
|
85
|
+
"typescript": "^5.7.2",
|
|
86
|
+
"typescript-eslint": "^8.17.0",
|
|
87
|
+
"vite": "^6.0.2",
|
|
88
|
+
"vite-plugin-sdk": "^0.1.3",
|
|
89
|
+
"vitest": "^2.1.8",
|
|
90
|
+
"vue": "^3.5.13"
|
|
92
91
|
},
|
|
93
92
|
"peerDependencies": {
|
|
94
93
|
"vue": "^3.0.0"
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { EmbedField } from "@prismicio/client"
|
|
2
|
-
import {
|
|
1
|
+
import type { EmbedField } from "@prismicio/client"
|
|
2
|
+
import type {
|
|
3
3
|
AllowedComponentProps,
|
|
4
4
|
ComponentCustomProps,
|
|
5
5
|
ConcreteComponent,
|
|
@@ -7,16 +7,15 @@ import {
|
|
|
7
7
|
PropType,
|
|
8
8
|
Raw,
|
|
9
9
|
VNodeProps,
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
} from "vue";
|
|
10
|
+
} from "vue"
|
|
11
|
+
import { defineComponent, h } from "vue"
|
|
13
12
|
|
|
14
|
-
import { simplyResolveComponent } from "../lib/simplyResolveComponent"
|
|
13
|
+
import { simplyResolveComponent } from "../lib/simplyResolveComponent"
|
|
15
14
|
|
|
16
15
|
/**
|
|
17
16
|
* The default component rendered to wrap the embed.
|
|
18
17
|
*/
|
|
19
|
-
const defaultWrapper = "div"
|
|
18
|
+
const defaultWrapper = "div"
|
|
20
19
|
|
|
21
20
|
/**
|
|
22
21
|
* Props for `<PrismicEmbed />`.
|
|
@@ -25,7 +24,7 @@ export type PrismicEmbedProps = {
|
|
|
25
24
|
/**
|
|
26
25
|
* The Prismic embed field to render.
|
|
27
26
|
*/
|
|
28
|
-
field: EmbedField
|
|
27
|
+
field: EmbedField
|
|
29
28
|
|
|
30
29
|
/**
|
|
31
30
|
* An HTML tag name, a component, or a functional component used to wrap the
|
|
@@ -33,8 +32,8 @@ export type PrismicEmbedProps = {
|
|
|
33
32
|
*
|
|
34
33
|
* @defaultValue `"div"`
|
|
35
34
|
*/
|
|
36
|
-
wrapper?: string | ConcreteComponent | Raw<DefineComponent
|
|
37
|
-
}
|
|
35
|
+
wrapper?: string | ConcreteComponent | Raw<DefineComponent>
|
|
36
|
+
}
|
|
38
37
|
|
|
39
38
|
/**
|
|
40
39
|
* `<PrismicEmbed />` implementation.
|
|
@@ -59,7 +58,7 @@ export const PrismicEmbedImpl = /*#__PURE__*/ defineComponent({
|
|
|
59
58
|
setup(props) {
|
|
60
59
|
// Prevent fatal if user didn't check for field, throws `Invalid prop` warn
|
|
61
60
|
if (!props.field) {
|
|
62
|
-
return () => null
|
|
61
|
+
return () => null
|
|
63
62
|
}
|
|
64
63
|
|
|
65
64
|
return () => {
|
|
@@ -68,10 +67,10 @@ export const PrismicEmbedImpl = /*#__PURE__*/ defineComponent({
|
|
|
68
67
|
"data-oembed-type": props.field.type,
|
|
69
68
|
"data-oembed-provider": props.field.provider_name,
|
|
70
69
|
innerHTML: props.field.html || null,
|
|
71
|
-
})
|
|
72
|
-
}
|
|
70
|
+
})
|
|
71
|
+
}
|
|
73
72
|
},
|
|
74
|
-
})
|
|
73
|
+
})
|
|
75
74
|
|
|
76
75
|
// export the public type for h/tsx inference
|
|
77
76
|
// also to avoid inline import() in generated d.ts files
|
|
@@ -86,6 +85,6 @@ export const PrismicEmbed = PrismicEmbedImpl as unknown as {
|
|
|
86
85
|
$props: AllowedComponentProps &
|
|
87
86
|
ComponentCustomProps &
|
|
88
87
|
VNodeProps &
|
|
89
|
-
PrismicEmbedProps
|
|
90
|
-
}
|
|
91
|
-
}
|
|
88
|
+
PrismicEmbedProps
|
|
89
|
+
}
|
|
90
|
+
}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
+
import type { ImageField } from "@prismicio/client"
|
|
1
2
|
import {
|
|
2
|
-
ImageField,
|
|
3
3
|
asImagePixelDensitySrcSet,
|
|
4
4
|
asImageSrc,
|
|
5
5
|
asImageWidthSrcSet,
|
|
6
6
|
isFilled,
|
|
7
|
-
} from "@prismicio/client"
|
|
8
|
-
import {
|
|
7
|
+
} from "@prismicio/client"
|
|
8
|
+
import type {
|
|
9
9
|
AllowedComponentProps,
|
|
10
10
|
ComponentCustomProps,
|
|
11
11
|
ComputedRef,
|
|
@@ -14,23 +14,20 @@ import {
|
|
|
14
14
|
PropType,
|
|
15
15
|
Raw,
|
|
16
16
|
VNodeProps,
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
h,
|
|
20
|
-
unref,
|
|
21
|
-
} from "vue";
|
|
17
|
+
} from "vue"
|
|
18
|
+
import { computed, defineComponent, h, unref } from "vue"
|
|
22
19
|
|
|
23
|
-
import { __PRODUCTION__ } from "../lib/__PRODUCTION__"
|
|
24
|
-
import { simplyResolveComponent } from "../lib/simplyResolveComponent"
|
|
20
|
+
import { __PRODUCTION__ } from "../lib/__PRODUCTION__"
|
|
21
|
+
import { simplyResolveComponent } from "../lib/simplyResolveComponent"
|
|
25
22
|
|
|
26
|
-
import { VueUseOptions } from "../types"
|
|
23
|
+
import type { VueUseOptions } from "../types"
|
|
27
24
|
|
|
28
|
-
import { usePrismic } from "../usePrismic"
|
|
25
|
+
import { usePrismic } from "../usePrismic"
|
|
29
26
|
|
|
30
27
|
/**
|
|
31
28
|
* The default component rendered for images.
|
|
32
29
|
*/
|
|
33
|
-
const defaultImageComponent = "img"
|
|
30
|
+
const defaultImageComponent = "img"
|
|
34
31
|
|
|
35
32
|
/**
|
|
36
33
|
* Props for `<PrismicImage />`.
|
|
@@ -39,7 +36,7 @@ export type PrismicImageProps = {
|
|
|
39
36
|
/**
|
|
40
37
|
* The Prismic image field to render.
|
|
41
38
|
*/
|
|
42
|
-
field: ImageField | ImageField<string
|
|
39
|
+
field: ImageField | ImageField<string>
|
|
43
40
|
|
|
44
41
|
/**
|
|
45
42
|
* An HTML tag name, a component, or a functional component used to render
|
|
@@ -49,16 +46,17 @@ export type PrismicImageProps = {
|
|
|
49
46
|
* HTML tag names and components will be rendered using the `img` tag
|
|
50
47
|
* interface (`src`, `srcset`, and `alt` attribute). Components will also
|
|
51
48
|
* receive an additional `copyright` props.
|
|
49
|
+
*
|
|
52
50
|
* @defaultValue The one provided to `@prismicio/vue` plugin if configured, `"img"` otherwise.
|
|
53
51
|
*/
|
|
54
|
-
imageComponent?: string | ConcreteComponent | Raw<DefineComponent
|
|
52
|
+
imageComponent?: string | ConcreteComponent | Raw<DefineComponent>
|
|
55
53
|
|
|
56
54
|
/**
|
|
57
55
|
* An object of Imgix URL API parameters.
|
|
58
56
|
*
|
|
59
57
|
* @see Imgix URL parameters reference: https://docs.imgix.com/apis/rendering
|
|
60
58
|
*/
|
|
61
|
-
imgixParams?: Parameters<typeof asImageSrc>[1]
|
|
59
|
+
imgixParams?: Parameters<typeof asImageSrc>[1]
|
|
62
60
|
|
|
63
61
|
/**
|
|
64
62
|
* Adds an additional `srcset` attribute to the image following given widths.
|
|
@@ -76,7 +74,7 @@ export type PrismicImageProps = {
|
|
|
76
74
|
widths?:
|
|
77
75
|
| NonNullable<Parameters<typeof asImageWidthSrcSet>[1]>["widths"]
|
|
78
76
|
| "thumbnails"
|
|
79
|
-
| "defaults"
|
|
77
|
+
| "defaults"
|
|
80
78
|
|
|
81
79
|
/**
|
|
82
80
|
* Adds an additional `srcset` attribute to the image following giving pixel
|
|
@@ -93,15 +91,15 @@ export type PrismicImageProps = {
|
|
|
93
91
|
| NonNullable<
|
|
94
92
|
Parameters<typeof asImagePixelDensitySrcSet>[1]
|
|
95
93
|
>["pixelDensities"]
|
|
96
|
-
| "defaults"
|
|
97
|
-
}
|
|
94
|
+
| "defaults"
|
|
95
|
+
}
|
|
98
96
|
|
|
99
97
|
/**
|
|
100
98
|
* Options for {@link usePrismicImage}.
|
|
101
99
|
*/
|
|
102
100
|
export type UsePrismicImageOptions = VueUseOptions<
|
|
103
101
|
Omit<PrismicImageProps, "imageComponent">
|
|
104
|
-
|
|
102
|
+
>
|
|
105
103
|
|
|
106
104
|
/**
|
|
107
105
|
* Return type of {@link usePrismicImage}.
|
|
@@ -110,23 +108,23 @@ export type UsePrismicImageReturnType = {
|
|
|
110
108
|
/**
|
|
111
109
|
* Resolved image `src` value.
|
|
112
110
|
*/
|
|
113
|
-
src: ComputedRef<string | null
|
|
111
|
+
src: ComputedRef<string | null>
|
|
114
112
|
|
|
115
113
|
/**
|
|
116
114
|
* Resolved image `srcset` value.
|
|
117
115
|
*/
|
|
118
|
-
srcset: ComputedRef<string | null
|
|
116
|
+
srcset: ComputedRef<string | null>
|
|
119
117
|
|
|
120
118
|
/**
|
|
121
119
|
* Resolved image `alt` value.
|
|
122
120
|
*/
|
|
123
|
-
alt: ComputedRef<string
|
|
121
|
+
alt: ComputedRef<string>
|
|
124
122
|
|
|
125
123
|
/**
|
|
126
124
|
* Resolved image `copyright` value.
|
|
127
125
|
*/
|
|
128
|
-
copyright: ComputedRef<string | null
|
|
129
|
-
}
|
|
126
|
+
copyright: ComputedRef<string | null>
|
|
127
|
+
}
|
|
130
128
|
|
|
131
129
|
/**
|
|
132
130
|
* A low level composable that returns a resolved information about a Prismic
|
|
@@ -139,28 +137,28 @@ export type UsePrismicImageReturnType = {
|
|
|
139
137
|
export const usePrismicImage = (
|
|
140
138
|
props: UsePrismicImageOptions,
|
|
141
139
|
): UsePrismicImageReturnType => {
|
|
142
|
-
const { options } = usePrismic()
|
|
140
|
+
const { options } = usePrismic()
|
|
143
141
|
|
|
144
142
|
const asImage = computed(() => {
|
|
145
|
-
const field = unref(props.field)
|
|
143
|
+
const field = unref(props.field)
|
|
146
144
|
|
|
147
145
|
if (!isFilled.image(field)) {
|
|
148
146
|
return {
|
|
149
147
|
src: null,
|
|
150
148
|
srcset: null,
|
|
151
|
-
}
|
|
149
|
+
}
|
|
152
150
|
}
|
|
153
151
|
|
|
154
|
-
const imgixParams = unref(props.imgixParams)
|
|
155
|
-
const widths = unref(props.widths)
|
|
156
|
-
const pixelDensities = unref(props.pixelDensities)
|
|
152
|
+
const imgixParams = unref(props.imgixParams)
|
|
153
|
+
const widths = unref(props.widths)
|
|
154
|
+
const pixelDensities = unref(props.pixelDensities)
|
|
157
155
|
|
|
158
156
|
if (widths) {
|
|
159
157
|
if (!__PRODUCTION__ && pixelDensities) {
|
|
160
158
|
console.warn(
|
|
161
159
|
"[PrismicImage] Only one of `widths` or `pixelDensities` props can be provided. You can resolve this warning by removing either the `widths` or `pixelDensities` prop. `widths` will be used in this case.",
|
|
162
160
|
props,
|
|
163
|
-
)
|
|
161
|
+
)
|
|
164
162
|
}
|
|
165
163
|
|
|
166
164
|
return asImageWidthSrcSet(field, {
|
|
@@ -169,7 +167,7 @@ export const usePrismicImage = (
|
|
|
169
167
|
widths === "defaults"
|
|
170
168
|
? options.components?.imageWidthSrcSetDefaults
|
|
171
169
|
: widths,
|
|
172
|
-
})
|
|
170
|
+
})
|
|
173
171
|
} else if (pixelDensities) {
|
|
174
172
|
return asImagePixelDensitySrcSet(field, {
|
|
175
173
|
...imgixParams,
|
|
@@ -177,35 +175,35 @@ export const usePrismicImage = (
|
|
|
177
175
|
pixelDensities === "defaults"
|
|
178
176
|
? options.components?.imagePixelDensitySrcSetDefaults
|
|
179
177
|
: pixelDensities,
|
|
180
|
-
})
|
|
178
|
+
})
|
|
181
179
|
} else {
|
|
182
180
|
return {
|
|
183
181
|
src: asImageSrc(field, imgixParams),
|
|
184
182
|
srcset: null,
|
|
185
|
-
}
|
|
183
|
+
}
|
|
186
184
|
}
|
|
187
|
-
})
|
|
185
|
+
})
|
|
188
186
|
|
|
189
187
|
const src = computed(() => {
|
|
190
|
-
return asImage.value.src
|
|
191
|
-
})
|
|
188
|
+
return asImage.value.src
|
|
189
|
+
})
|
|
192
190
|
const srcset = computed(() => {
|
|
193
|
-
return asImage.value.srcset
|
|
194
|
-
})
|
|
191
|
+
return asImage.value.srcset
|
|
192
|
+
})
|
|
195
193
|
const alt = computed(() => {
|
|
196
|
-
return unref(props.field).alt || ""
|
|
197
|
-
})
|
|
194
|
+
return unref(props.field).alt || ""
|
|
195
|
+
})
|
|
198
196
|
const copyright = computed(() => {
|
|
199
|
-
return unref(props.field).copyright || null
|
|
200
|
-
})
|
|
197
|
+
return unref(props.field).copyright || null
|
|
198
|
+
})
|
|
201
199
|
|
|
202
200
|
return {
|
|
203
201
|
src,
|
|
204
202
|
srcset,
|
|
205
203
|
alt,
|
|
206
204
|
copyright,
|
|
207
|
-
}
|
|
208
|
-
}
|
|
205
|
+
}
|
|
206
|
+
}
|
|
209
207
|
|
|
210
208
|
/**
|
|
211
209
|
* `<PrismicImage />` implementation.
|
|
@@ -254,42 +252,42 @@ export const PrismicImageImpl = /*#__PURE__*/ defineComponent({
|
|
|
254
252
|
setup(props) {
|
|
255
253
|
// Prevent fatal if user didn't check for field, throws `Invalid prop` warn
|
|
256
254
|
if (!props.field) {
|
|
257
|
-
return () => null
|
|
255
|
+
return () => null
|
|
258
256
|
}
|
|
259
257
|
|
|
260
|
-
const { options } = usePrismic()
|
|
258
|
+
const { options } = usePrismic()
|
|
261
259
|
|
|
262
260
|
const type = computed(() => {
|
|
263
261
|
return (
|
|
264
262
|
props.imageComponent ||
|
|
265
263
|
options.components?.imageComponent ||
|
|
266
264
|
defaultImageComponent
|
|
267
|
-
)
|
|
268
|
-
})
|
|
265
|
+
)
|
|
266
|
+
})
|
|
269
267
|
|
|
270
|
-
const { src, srcset, alt, copyright } = usePrismicImage(props)
|
|
268
|
+
const { src, srcset, alt, copyright } = usePrismicImage(props)
|
|
271
269
|
|
|
272
270
|
return () => {
|
|
273
271
|
const attributes = {
|
|
274
272
|
src: src.value,
|
|
275
273
|
srcset: srcset.value,
|
|
276
274
|
alt: alt.value,
|
|
277
|
-
}
|
|
275
|
+
}
|
|
278
276
|
|
|
279
277
|
switch (type.value) {
|
|
280
278
|
case "img":
|
|
281
279
|
// Fitting img tag interface
|
|
282
|
-
return h("img", attributes)
|
|
280
|
+
return h("img", attributes)
|
|
283
281
|
|
|
284
282
|
default:
|
|
285
283
|
return h(simplyResolveComponent(type.value), {
|
|
286
284
|
...attributes,
|
|
287
285
|
copyright: copyright.value,
|
|
288
|
-
})
|
|
286
|
+
})
|
|
289
287
|
}
|
|
290
|
-
}
|
|
288
|
+
}
|
|
291
289
|
},
|
|
292
|
-
})
|
|
290
|
+
})
|
|
293
291
|
|
|
294
292
|
// export the public type for h/tsx inference
|
|
295
293
|
// also to avoid inline import() in generated d.ts files
|
|
@@ -304,6 +302,6 @@ export const PrismicImage = PrismicImageImpl as unknown as {
|
|
|
304
302
|
$props: AllowedComponentProps &
|
|
305
303
|
ComponentCustomProps &
|
|
306
304
|
VNodeProps &
|
|
307
|
-
PrismicImageProps
|
|
308
|
-
}
|
|
309
|
-
}
|
|
305
|
+
PrismicImageProps
|
|
306
|
+
}
|
|
307
|
+
}
|