@prismicio/vue 4.3.0 → 5.0.0-alpha.0
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/README.md +4 -4
- package/dist/PrismicEmbed.vue.cjs +25 -0
- package/dist/PrismicEmbed.vue.cjs.map +1 -0
- package/dist/PrismicEmbed.vue.d.ts +19 -0
- package/dist/PrismicEmbed.vue.js +26 -0
- package/dist/PrismicEmbed.vue.js.map +1 -0
- package/dist/PrismicEmbed.vue2.cjs +4 -0
- package/dist/PrismicEmbed.vue2.cjs.map +1 -0
- package/dist/PrismicEmbed.vue2.js +5 -0
- package/dist/PrismicEmbed.vue2.js.map +1 -0
- package/dist/PrismicImage.vue.cjs +84 -0
- package/dist/PrismicImage.vue.cjs.map +1 -0
- package/dist/PrismicImage.vue.d.ts +224 -0
- package/dist/PrismicImage.vue.js +85 -0
- package/dist/PrismicImage.vue.js.map +1 -0
- package/dist/PrismicImage.vue2.cjs +4 -0
- package/dist/PrismicImage.vue2.cjs.map +1 -0
- package/dist/PrismicImage.vue2.js +5 -0
- package/dist/PrismicImage.vue2.js.map +1 -0
- package/dist/PrismicLink.vue.cjs +100 -0
- package/dist/PrismicLink.vue.cjs.map +1 -0
- package/dist/PrismicLink.vue.d.ts +278 -0
- package/dist/PrismicLink.vue.js +101 -0
- package/dist/PrismicLink.vue.js.map +1 -0
- package/dist/PrismicLink.vue2.cjs +4 -0
- package/dist/PrismicLink.vue2.cjs.map +1 -0
- package/dist/PrismicLink.vue2.js +5 -0
- package/dist/PrismicLink.vue2.js.map +1 -0
- package/dist/PrismicRichText/DeprecatedPrismicRichText.vue.cjs +90 -0
- package/dist/PrismicRichText/DeprecatedPrismicRichText.vue.cjs.map +1 -0
- package/dist/PrismicRichText/DeprecatedPrismicRichText.vue.d.ts +7 -0
- package/dist/PrismicRichText/DeprecatedPrismicRichText.vue.js +91 -0
- package/dist/PrismicRichText/DeprecatedPrismicRichText.vue.js.map +1 -0
- package/dist/PrismicRichText/DeprecatedPrismicRichText.vue2.cjs +4 -0
- package/dist/PrismicRichText/DeprecatedPrismicRichText.vue2.cjs.map +1 -0
- package/dist/PrismicRichText/DeprecatedPrismicRichText.vue2.js +5 -0
- package/dist/PrismicRichText/DeprecatedPrismicRichText.vue2.js.map +1 -0
- package/dist/PrismicRichText/PrismicRichText.vue.cjs +85 -0
- package/dist/PrismicRichText/PrismicRichText.vue.cjs.map +1 -0
- package/dist/PrismicRichText/PrismicRichText.vue.d.ts +57 -0
- package/dist/PrismicRichText/PrismicRichText.vue.js +86 -0
- package/dist/PrismicRichText/PrismicRichText.vue.js.map +1 -0
- package/dist/PrismicRichText/PrismicRichText.vue2.cjs +4 -0
- package/dist/PrismicRichText/PrismicRichText.vue2.cjs.map +1 -0
- package/dist/PrismicRichText/PrismicRichText.vue2.js +5 -0
- package/dist/PrismicRichText/PrismicRichText.vue2.js.map +1 -0
- package/dist/PrismicRichText/PrismicRichTextDefaultComponent.vue.cjs +133 -0
- package/dist/PrismicRichText/PrismicRichTextDefaultComponent.vue.cjs.map +1 -0
- package/dist/PrismicRichText/PrismicRichTextDefaultComponent.vue.d.ts +37 -0
- package/dist/PrismicRichText/PrismicRichTextDefaultComponent.vue.js +134 -0
- package/dist/PrismicRichText/PrismicRichTextDefaultComponent.vue.js.map +1 -0
- package/dist/PrismicRichText/PrismicRichTextDefaultComponent.vue2.cjs +4 -0
- package/dist/PrismicRichText/PrismicRichTextDefaultComponent.vue2.cjs.map +1 -0
- package/dist/PrismicRichText/PrismicRichTextDefaultComponent.vue2.js +5 -0
- package/dist/PrismicRichText/PrismicRichTextDefaultComponent.vue2.js.map +1 -0
- package/dist/PrismicRichText/PrismicRichTextSerialize.vue.cjs +47 -0
- package/dist/PrismicRichText/PrismicRichTextSerialize.vue.cjs.map +1 -0
- package/dist/PrismicRichText/PrismicRichTextSerialize.vue.d.ts +10 -0
- package/dist/PrismicRichText/PrismicRichTextSerialize.vue.js +48 -0
- package/dist/PrismicRichText/PrismicRichTextSerialize.vue.js.map +1 -0
- package/dist/PrismicRichText/PrismicRichTextSerialize.vue2.cjs +4 -0
- package/dist/PrismicRichText/PrismicRichTextSerialize.vue2.cjs.map +1 -0
- package/dist/PrismicRichText/PrismicRichTextSerialize.vue2.js +5 -0
- package/dist/PrismicRichText/PrismicRichTextSerialize.vue2.js.map +1 -0
- package/dist/PrismicRichText/getRichTextComponentProps.cjs +10 -0
- package/dist/PrismicRichText/getRichTextComponentProps.cjs.map +1 -0
- package/dist/PrismicRichText/getRichTextComponentProps.d.ts +49 -0
- package/dist/PrismicRichText/getRichTextComponentProps.js +10 -0
- package/dist/PrismicRichText/getRichTextComponentProps.js.map +1 -0
- package/dist/PrismicRichText/index.d.ts +2 -0
- package/dist/PrismicRichText/types.d.ts +22 -0
- package/dist/PrismicText.vue.cjs +43 -0
- package/dist/PrismicText.vue.cjs.map +1 -0
- package/dist/PrismicText.vue.d.ts +31 -0
- package/dist/PrismicText.vue.js +44 -0
- package/dist/PrismicText.vue.js.map +1 -0
- package/dist/PrismicText.vue2.cjs +4 -0
- package/dist/PrismicText.vue2.cjs.map +1 -0
- package/dist/PrismicText.vue2.js +5 -0
- package/dist/PrismicText.vue2.js.map +1 -0
- package/dist/SliceZone/SliceZone.vue.cjs +63 -0
- package/dist/SliceZone/SliceZone.vue.cjs.map +1 -0
- package/dist/SliceZone/SliceZone.vue.d.ts +40 -0
- package/dist/SliceZone/SliceZone.vue.js +64 -0
- package/dist/SliceZone/SliceZone.vue.js.map +1 -0
- package/dist/SliceZone/SliceZone.vue2.cjs +4 -0
- package/dist/SliceZone/SliceZone.vue2.cjs.map +1 -0
- package/dist/SliceZone/SliceZone.vue2.js +5 -0
- package/dist/SliceZone/SliceZone.vue2.js.map +1 -0
- package/dist/SliceZone/TODOSliceComponent.cjs +29 -0
- package/dist/SliceZone/TODOSliceComponent.cjs.map +1 -0
- package/dist/SliceZone/TODOSliceComponent.d.ts +9 -0
- package/dist/SliceZone/TODOSliceComponent.js +29 -0
- package/dist/SliceZone/TODOSliceComponent.js.map +1 -0
- package/dist/SliceZone/defineSliceZoneComponents.cjs +14 -0
- package/dist/SliceZone/defineSliceZoneComponents.cjs.map +1 -0
- package/dist/SliceZone/defineSliceZoneComponents.d.ts +36 -0
- package/dist/SliceZone/defineSliceZoneComponents.js +14 -0
- package/dist/SliceZone/defineSliceZoneComponents.js.map +1 -0
- package/dist/SliceZone/getSliceComponentProps.cjs +22 -0
- package/dist/SliceZone/getSliceComponentProps.cjs.map +1 -0
- package/dist/SliceZone/getSliceComponentProps.d.ts +66 -0
- package/dist/SliceZone/getSliceComponentProps.js +22 -0
- package/dist/SliceZone/getSliceComponentProps.js.map +1 -0
- package/dist/SliceZone/index.d.ts +4 -0
- package/dist/SliceZone/types.d.ts +97 -0
- package/dist/createPrismic.cjs +17 -50
- package/dist/createPrismic.cjs.map +1 -1
- package/dist/createPrismic.d.ts +10 -0
- package/dist/createPrismic.js +16 -27
- package/dist/createPrismic.js.map +1 -1
- package/dist/index.cjs +21 -40
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +19 -9
- package/dist/index.js +19 -38
- package/dist/index.js.map +1 -1
- package/dist/lib/Wrapper.vue.cjs +20 -0
- package/dist/lib/Wrapper.vue.cjs.map +1 -0
- package/dist/lib/Wrapper.vue.d.ts +34 -0
- package/dist/lib/Wrapper.vue.js +21 -0
- package/dist/lib/Wrapper.vue.js.map +1 -0
- package/dist/lib/Wrapper.vue2.cjs +4 -0
- package/dist/lib/Wrapper.vue2.cjs.map +1 -0
- package/dist/lib/Wrapper.vue2.js +5 -0
- package/dist/lib/Wrapper.vue2.js.map +1 -0
- package/dist/lib/devMsg.cjs +8 -0
- package/dist/lib/devMsg.cjs.map +1 -0
- package/dist/lib/devMsg.d.ts +16 -0
- package/dist/lib/devMsg.js +8 -0
- package/dist/lib/devMsg.js.map +1 -0
- package/dist/lib/isInternalURL.cjs.map +1 -1
- package/dist/lib/isInternalURL.js.map +1 -1
- package/dist/package.json.cjs +5 -0
- package/dist/package.json.cjs.map +1 -0
- package/dist/package.json.js +5 -0
- package/dist/package.json.js.map +1 -0
- package/dist/types.d.ts +42 -58
- package/dist/usePrismic.cjs +3 -2
- package/dist/usePrismic.cjs.map +1 -1
- package/dist/usePrismic.d.ts +13 -5
- package/dist/usePrismic.js +2 -1
- package/dist/usePrismic.js.map +1 -1
- package/package.json +32 -35
- package/src/PrismicEmbed.vue +42 -0
- package/src/PrismicImage.vue +160 -0
- package/src/PrismicLink.vue +191 -0
- package/src/PrismicRichText/DeprecatedPrismicRichText.vue +130 -0
- package/src/PrismicRichText/PrismicRichText.vue +157 -0
- package/src/PrismicRichText/PrismicRichTextDefaultComponent.vue +63 -0
- package/src/PrismicRichText/PrismicRichTextSerialize.vue +52 -0
- package/src/PrismicRichText/getRichTextComponentProps.ts +63 -0
- package/src/PrismicRichText/index.ts +3 -0
- package/src/PrismicRichText/types.ts +37 -0
- package/src/PrismicText.vue +63 -0
- package/src/SliceZone/SliceZone.vue +113 -0
- package/src/SliceZone/TODOSliceComponent.ts +49 -0
- package/src/SliceZone/defineSliceZoneComponents.ts +67 -0
- package/src/SliceZone/getSliceComponentProps.ts +98 -0
- package/src/SliceZone/index.ts +13 -0
- package/src/SliceZone/types.ts +163 -0
- package/src/createPrismic.ts +54 -53
- package/src/index.ts +33 -58
- package/src/lib/Wrapper.vue +22 -0
- package/src/lib/devMsg.ts +20 -0
- package/src/lib/isInternalURL.ts +4 -4
- package/src/types.ts +91 -109
- package/src/usePrismic.ts +16 -9
- package/dist/components/PrismicEmbed.cjs +0 -36
- package/dist/components/PrismicEmbed.cjs.map +0 -1
- package/dist/components/PrismicEmbed.d.ts +0 -59
- package/dist/components/PrismicEmbed.js +0 -36
- package/dist/components/PrismicEmbed.js.map +0 -1
- package/dist/components/PrismicImage.cjs +0 -122
- package/dist/components/PrismicImage.cjs.map +0 -1
- package/dist/components/PrismicImage.d.ts +0 -163
- package/dist/components/PrismicImage.js +0 -122
- package/dist/components/PrismicImage.js.map +0 -1
- package/dist/components/PrismicLink.cjs +0 -120
- package/dist/components/PrismicLink.cjs.map +0 -1
- package/dist/components/PrismicLink.d.ts +0 -196
- package/dist/components/PrismicLink.js +0 -120
- package/dist/components/PrismicLink.js.map +0 -1
- package/dist/components/PrismicRichText.cjs +0 -108
- package/dist/components/PrismicRichText.cjs.map +0 -1
- package/dist/components/PrismicRichText.d.ts +0 -161
- package/dist/components/PrismicRichText.js +0 -108
- package/dist/components/PrismicRichText.js.map +0 -1
- package/dist/components/PrismicText.cjs +0 -57
- package/dist/components/PrismicText.cjs.map +0 -1
- package/dist/components/PrismicText.d.ts +0 -119
- package/dist/components/PrismicText.js +0 -57
- package/dist/components/PrismicText.js.map +0 -1
- package/dist/components/SliceZone.cjs +0 -156
- package/dist/components/SliceZone.cjs.map +0 -1
- package/dist/components/SliceZone.d.ts +0 -375
- package/dist/components/SliceZone.js +0 -156
- package/dist/components/SliceZone.js.map +0 -1
- package/dist/components/index.d.ts +0 -12
- package/dist/composables.cjs +0 -40
- package/dist/composables.cjs.map +0 -1
- package/dist/composables.d.ts +0 -330
- package/dist/composables.js +0 -40
- package/dist/composables.js.map +0 -1
- package/dist/globalExtensions.d.ts +0 -11
- package/dist/injectionSymbols.cjs +0 -5
- package/dist/injectionSymbols.cjs.map +0 -1
- package/dist/injectionSymbols.d.ts +0 -9
- package/dist/injectionSymbols.js +0 -5
- package/dist/injectionSymbols.js.map +0 -1
- package/dist/lib/__PRODUCTION__.cjs +0 -8
- package/dist/lib/__PRODUCTION__.cjs.map +0 -1
- package/dist/lib/__PRODUCTION__.d.ts +0 -7
- package/dist/lib/__PRODUCTION__.js +0 -8
- package/dist/lib/__PRODUCTION__.js.map +0 -1
- package/dist/lib/getSlots.cjs +0 -19
- package/dist/lib/getSlots.cjs.map +0 -1
- package/dist/lib/getSlots.d.ts +0 -14
- package/dist/lib/getSlots.js +0 -19
- package/dist/lib/getSlots.js.map +0 -1
- package/dist/lib/simplyResolveComponent.cjs +0 -8
- package/dist/lib/simplyResolveComponent.cjs.map +0 -1
- package/dist/lib/simplyResolveComponent.d.ts +0 -12
- package/dist/lib/simplyResolveComponent.js +0 -8
- package/dist/lib/simplyResolveComponent.js.map +0 -1
- package/dist/useStatefulPrismicClientMethod.cjs +0 -39
- package/dist/useStatefulPrismicClientMethod.cjs.map +0 -1
- package/dist/useStatefulPrismicClientMethod.d.ts +0 -64
- package/dist/useStatefulPrismicClientMethod.js +0 -39
- package/dist/useStatefulPrismicClientMethod.js.map +0 -1
- package/src/components/PrismicEmbed.ts +0 -91
- package/src/components/PrismicImage.ts +0 -309
- package/src/components/PrismicLink.ts +0 -326
- package/src/components/PrismicRichText.ts +0 -282
- package/src/components/PrismicText.ts +0 -167
- package/src/components/SliceZone.ts +0 -619
- package/src/components/index.ts +0 -46
- package/src/composables.ts +0 -474
- package/src/globalExtensions.ts +0 -12
- package/src/injectionSymbols.ts +0 -17
- package/src/lib/__PRODUCTION__.ts +0 -12
- package/src/lib/getSlots.ts +0 -37
- package/src/lib/simplyResolveComponent.ts +0 -23
- package/src/useStatefulPrismicClientMethod.ts +0 -156
- package/vetur/attributes.json +0 -113
- package/vetur/tags.json +0 -60
|
@@ -1,122 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const client = require("@prismicio/client");
|
|
4
|
-
const vue = require("vue");
|
|
5
|
-
const __PRODUCTION__ = require("../lib/__PRODUCTION__.cjs");
|
|
6
|
-
const simplyResolveComponent = require("../lib/simplyResolveComponent.cjs");
|
|
7
|
-
const usePrismic = require("../usePrismic.cjs");
|
|
8
|
-
const defaultImageComponent = "img";
|
|
9
|
-
const usePrismicImage = (props) => {
|
|
10
|
-
const { options } = usePrismic.usePrismic();
|
|
11
|
-
const asImage = vue.computed(() => {
|
|
12
|
-
var _a, _b;
|
|
13
|
-
const field = vue.unref(props.field);
|
|
14
|
-
if (!client.isFilled.image(field)) {
|
|
15
|
-
return {
|
|
16
|
-
src: null,
|
|
17
|
-
srcset: null
|
|
18
|
-
};
|
|
19
|
-
}
|
|
20
|
-
const imgixParams = vue.unref(props.imgixParams);
|
|
21
|
-
const widths = vue.unref(props.widths);
|
|
22
|
-
const pixelDensities = vue.unref(props.pixelDensities);
|
|
23
|
-
if (widths) {
|
|
24
|
-
if (!__PRODUCTION__.__PRODUCTION__ && pixelDensities) {
|
|
25
|
-
console.warn("[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.", props);
|
|
26
|
-
}
|
|
27
|
-
return client.asImageWidthSrcSet(field, {
|
|
28
|
-
...imgixParams,
|
|
29
|
-
widths: widths === "defaults" ? (_a = options.components) == null ? void 0 : _a.imageWidthSrcSetDefaults : widths
|
|
30
|
-
});
|
|
31
|
-
} else if (pixelDensities) {
|
|
32
|
-
return client.asImagePixelDensitySrcSet(field, {
|
|
33
|
-
...imgixParams,
|
|
34
|
-
pixelDensities: pixelDensities === "defaults" ? (_b = options.components) == null ? void 0 : _b.imagePixelDensitySrcSetDefaults : pixelDensities
|
|
35
|
-
});
|
|
36
|
-
} else {
|
|
37
|
-
return {
|
|
38
|
-
src: client.asImageSrc(field, imgixParams),
|
|
39
|
-
srcset: null
|
|
40
|
-
};
|
|
41
|
-
}
|
|
42
|
-
});
|
|
43
|
-
const src = vue.computed(() => {
|
|
44
|
-
return asImage.value.src;
|
|
45
|
-
});
|
|
46
|
-
const srcset = vue.computed(() => {
|
|
47
|
-
return asImage.value.srcset;
|
|
48
|
-
});
|
|
49
|
-
const alt = vue.computed(() => {
|
|
50
|
-
return vue.unref(props.field).alt || "";
|
|
51
|
-
});
|
|
52
|
-
const copyright = vue.computed(() => {
|
|
53
|
-
return vue.unref(props.field).copyright || null;
|
|
54
|
-
});
|
|
55
|
-
return {
|
|
56
|
-
src,
|
|
57
|
-
srcset,
|
|
58
|
-
alt,
|
|
59
|
-
copyright
|
|
60
|
-
};
|
|
61
|
-
};
|
|
62
|
-
const PrismicImageImpl = /* @__PURE__ */ vue.defineComponent({
|
|
63
|
-
name: "PrismicImage",
|
|
64
|
-
props: {
|
|
65
|
-
field: {
|
|
66
|
-
type: Object,
|
|
67
|
-
required: true
|
|
68
|
-
},
|
|
69
|
-
imageComponent: {
|
|
70
|
-
type: [String, Object],
|
|
71
|
-
default: void 0,
|
|
72
|
-
required: false
|
|
73
|
-
},
|
|
74
|
-
imgixParams: {
|
|
75
|
-
type: Object,
|
|
76
|
-
default: void 0,
|
|
77
|
-
required: false
|
|
78
|
-
},
|
|
79
|
-
widths: {
|
|
80
|
-
type: [String, Object],
|
|
81
|
-
default: void 0,
|
|
82
|
-
required: false
|
|
83
|
-
},
|
|
84
|
-
pixelDensities: {
|
|
85
|
-
type: [String, Object],
|
|
86
|
-
default: void 0,
|
|
87
|
-
required: false
|
|
88
|
-
}
|
|
89
|
-
},
|
|
90
|
-
setup(props) {
|
|
91
|
-
if (!props.field) {
|
|
92
|
-
return () => null;
|
|
93
|
-
}
|
|
94
|
-
const { options } = usePrismic.usePrismic();
|
|
95
|
-
const type = vue.computed(() => {
|
|
96
|
-
var _a;
|
|
97
|
-
return props.imageComponent || ((_a = options.components) == null ? void 0 : _a.imageComponent) || defaultImageComponent;
|
|
98
|
-
});
|
|
99
|
-
const { src, srcset, alt, copyright } = usePrismicImage(props);
|
|
100
|
-
return () => {
|
|
101
|
-
const attributes = {
|
|
102
|
-
src: src.value,
|
|
103
|
-
srcset: srcset.value,
|
|
104
|
-
alt: alt.value
|
|
105
|
-
};
|
|
106
|
-
switch (type.value) {
|
|
107
|
-
case "img":
|
|
108
|
-
return vue.h("img", attributes);
|
|
109
|
-
default:
|
|
110
|
-
return vue.h(simplyResolveComponent.simplyResolveComponent(type.value), {
|
|
111
|
-
...attributes,
|
|
112
|
-
copyright: copyright.value
|
|
113
|
-
});
|
|
114
|
-
}
|
|
115
|
-
};
|
|
116
|
-
}
|
|
117
|
-
});
|
|
118
|
-
const PrismicImage = PrismicImageImpl;
|
|
119
|
-
exports.PrismicImage = PrismicImage;
|
|
120
|
-
exports.PrismicImageImpl = PrismicImageImpl;
|
|
121
|
-
exports.usePrismicImage = usePrismicImage;
|
|
122
|
-
//# sourceMappingURL=PrismicImage.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"PrismicImage.cjs","sources":["../../../src/components/PrismicImage.ts"],"sourcesContent":["import {\n\tImageField,\n\tasImagePixelDensitySrcSet,\n\tasImageSrc,\n\tasImageWidthSrcSet,\n\tisFilled,\n} from \"@prismicio/client\";\nimport {\n\tAllowedComponentProps,\n\tComponentCustomProps,\n\tComputedRef,\n\tConcreteComponent,\n\tDefineComponent,\n\tPropType,\n\tRaw,\n\tVNodeProps,\n\tcomputed,\n\tdefineComponent,\n\th,\n\tunref,\n} from \"vue\";\n\nimport { __PRODUCTION__ } from \"../lib/__PRODUCTION__\";\nimport { simplyResolveComponent } from \"../lib/simplyResolveComponent\";\n\nimport { VueUseOptions } from \"../types\";\n\nimport { usePrismic } from \"../usePrismic\";\n\n/**\n * The default component rendered for images.\n */\nconst defaultImageComponent = \"img\";\n\n/**\n * Props for `<PrismicImage />`.\n */\nexport type PrismicImageProps = {\n\t/**\n\t * The Prismic image field to render.\n\t */\n\tfield: ImageField | ImageField<string>;\n\n\t/**\n\t * An HTML tag name, a component, or a functional component used to render\n\t * images.\n\t *\n\t * @remarks\n\t * HTML tag names and components will be rendered using the `img` tag\n\t * interface (`src`, `srcset`, and `alt` attribute). Components will also\n\t * receive an additional `copyright` props.\n\t * @defaultValue The one provided to `@prismicio/vue` plugin if configured, `\"img\"` otherwise.\n\t */\n\timageComponent?: string | ConcreteComponent | Raw<DefineComponent>;\n\n\t/**\n\t * An object of Imgix URL API parameters.\n\t *\n\t * @see Imgix URL parameters reference: https://docs.imgix.com/apis/rendering\n\t */\n\timgixParams?: Parameters<typeof asImageSrc>[1];\n\n\t/**\n\t * Adds an additional `srcset` attribute to the image following given widths.\n\t *\n\t * @remarks\n\t * A special value of `\"thumbnails\"` is accepted to automatically use image\n\t * widths coming from the API.\n\t * @remarks\n\t * A special value of `\"defaults\"` is accepted to automatically use image\n\t * widths coming from the plugin configuration.\n\t * @remarks\n\t * This prop is not compatible with the `pixelDensities` prop. When both are\n\t * used the `pixelDensities` prop will be ignored.\n\t */\n\twidths?:\n\t\t| NonNullable<Parameters<typeof asImageWidthSrcSet>[1]>[\"widths\"]\n\t\t| \"thumbnails\"\n\t\t| \"defaults\";\n\n\t/**\n\t * Adds an additional `srcset` attribute to the image following giving pixel\n\t * densities.\n\t *\n\t * @remarks\n\t * A special value of `\"defaults\"` is accepted to automatically use image\n\t * pixel densities coming from the plugin configuration.\n\t * @remarks\n\t * This prop is not compatible with the `widths` prop. When both are used, the\n\t * `pixelDensities` prop will be ignored.\n\t */\n\tpixelDensities?:\n\t\t| NonNullable<\n\t\t\t\tParameters<typeof asImagePixelDensitySrcSet>[1]\n\t\t >[\"pixelDensities\"]\n\t\t| \"defaults\";\n};\n\n/**\n * Options for {@link usePrismicImage}.\n */\nexport type UsePrismicImageOptions = VueUseOptions<\n\tOmit<PrismicImageProps, \"imageComponent\">\n>;\n\n/**\n * Return type of {@link usePrismicImage}.\n */\nexport type UsePrismicImageReturnType = {\n\t/**\n\t * Resolved image `src` value.\n\t */\n\tsrc: ComputedRef<string | null>;\n\n\t/**\n\t * Resolved image `srcset` value.\n\t */\n\tsrcset: ComputedRef<string | null>;\n\n\t/**\n\t * Resolved image `alt` value.\n\t */\n\talt: ComputedRef<string>;\n\n\t/**\n\t * Resolved image `copyright` value.\n\t */\n\tcopyright: ComputedRef<string | null>;\n};\n\n/**\n * A low level composable that returns a resolved information about a Prismic\n * image field.\n *\n * @param props - {@link UsePrismicImageOptions}\n *\n * @returns - Resolved image information {@link UsePrismicImageReturnType}\n */\nexport const usePrismicImage = (\n\tprops: UsePrismicImageOptions,\n): UsePrismicImageReturnType => {\n\tconst { options } = usePrismic();\n\n\tconst asImage = computed(() => {\n\t\tconst field = unref(props.field);\n\n\t\tif (!isFilled.image(field)) {\n\t\t\treturn {\n\t\t\t\tsrc: null,\n\t\t\t\tsrcset: null,\n\t\t\t};\n\t\t}\n\n\t\tconst imgixParams = unref(props.imgixParams);\n\t\tconst widths = unref(props.widths);\n\t\tconst pixelDensities = unref(props.pixelDensities);\n\n\t\tif (widths) {\n\t\t\tif (!__PRODUCTION__ && pixelDensities) {\n\t\t\t\tconsole.warn(\n\t\t\t\t\t\"[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.\",\n\t\t\t\t\tprops,\n\t\t\t\t);\n\t\t\t}\n\n\t\t\treturn asImageWidthSrcSet(field, {\n\t\t\t\t...imgixParams,\n\t\t\t\twidths:\n\t\t\t\t\twidths === \"defaults\"\n\t\t\t\t\t\t? options.components?.imageWidthSrcSetDefaults\n\t\t\t\t\t\t: widths,\n\t\t\t});\n\t\t} else if (pixelDensities) {\n\t\t\treturn asImagePixelDensitySrcSet(field, {\n\t\t\t\t...imgixParams,\n\t\t\t\tpixelDensities:\n\t\t\t\t\tpixelDensities === \"defaults\"\n\t\t\t\t\t\t? options.components?.imagePixelDensitySrcSetDefaults\n\t\t\t\t\t\t: pixelDensities,\n\t\t\t});\n\t\t} else {\n\t\t\treturn {\n\t\t\t\tsrc: asImageSrc(field, imgixParams),\n\t\t\t\tsrcset: null,\n\t\t\t};\n\t\t}\n\t});\n\n\tconst src = computed(() => {\n\t\treturn asImage.value.src;\n\t});\n\tconst srcset = computed(() => {\n\t\treturn asImage.value.srcset;\n\t});\n\tconst alt = computed(() => {\n\t\treturn unref(props.field).alt || \"\";\n\t});\n\tconst copyright = computed(() => {\n\t\treturn unref(props.field).copyright || null;\n\t});\n\n\treturn {\n\t\tsrc,\n\t\tsrcset,\n\t\talt,\n\t\tcopyright,\n\t};\n};\n\n/**\n * `<PrismicImage />` implementation.\n *\n * @internal\n */\nexport const PrismicImageImpl = /*#__PURE__*/ defineComponent({\n\tname: \"PrismicImage\",\n\tprops: {\n\t\tfield: {\n\t\t\ttype: Object as PropType<ImageField | ImageField<string>>,\n\t\t\trequired: true,\n\t\t},\n\t\timageComponent: {\n\t\t\ttype: [String, Object] as PropType<\n\t\t\t\tstring | ConcreteComponent | Raw<DefineComponent>\n\t\t\t>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\timgixParams: {\n\t\t\ttype: Object as PropType<Parameters<typeof asImageSrc>[1]>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\twidths: {\n\t\t\ttype: [String, Object] as PropType<\n\t\t\t\t| NonNullable<Parameters<typeof asImageWidthSrcSet>[1]>[\"widths\"]\n\t\t\t\t| \"thumbnails\"\n\t\t\t\t| \"defaults\"\n\t\t\t>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\tpixelDensities: {\n\t\t\ttype: [String, Object] as PropType<\n\t\t\t\t| NonNullable<\n\t\t\t\t\t\tParameters<typeof asImagePixelDensitySrcSet>[1]\n\t\t\t\t >[\"pixelDensities\"]\n\t\t\t\t| \"defaults\"\n\t\t\t>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t},\n\tsetup(props) {\n\t\t// Prevent fatal if user didn't check for field, throws `Invalid prop` warn\n\t\tif (!props.field) {\n\t\t\treturn () => null;\n\t\t}\n\n\t\tconst { options } = usePrismic();\n\n\t\tconst type = computed(() => {\n\t\t\treturn (\n\t\t\t\tprops.imageComponent ||\n\t\t\t\toptions.components?.imageComponent ||\n\t\t\t\tdefaultImageComponent\n\t\t\t);\n\t\t});\n\n\t\tconst { src, srcset, alt, copyright } = usePrismicImage(props);\n\n\t\treturn () => {\n\t\t\tconst attributes = {\n\t\t\t\tsrc: src.value,\n\t\t\t\tsrcset: srcset.value,\n\t\t\t\talt: alt.value,\n\t\t\t};\n\n\t\t\tswitch (type.value) {\n\t\t\t\tcase \"img\":\n\t\t\t\t\t// Fitting img tag interface\n\t\t\t\t\treturn h(\"img\", attributes);\n\n\t\t\t\tdefault:\n\t\t\t\t\treturn h(simplyResolveComponent(type.value), {\n\t\t\t\t\t\t...attributes,\n\t\t\t\t\t\tcopyright: copyright.value,\n\t\t\t\t\t});\n\t\t\t}\n\t\t};\n\t},\n});\n\n// export the public type for h/tsx inference\n// also to avoid inline import() in generated d.ts files\n/**\n * Component to render a Prismic image field.\n *\n * @see Component props {@link PrismicImageProps}\n * @see Templating image fields {@link https://prismic.io/docs/technologies/vue-template-content#images}\n */\nexport const PrismicImage = PrismicImageImpl as unknown as {\n\tnew (): {\n\t\t$props: AllowedComponentProps &\n\t\t\tComponentCustomProps &\n\t\t\tVNodeProps &\n\t\t\tPrismicImageProps;\n\t};\n};\n"],"names":["usePrismic","computed","unref","isFilled","__PRODUCTION__","asImageWidthSrcSet","asImagePixelDensitySrcSet","asImageSrc","defineComponent","h","simplyResolveComponent"],"mappings":"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"}
|
|
@@ -1,163 +0,0 @@
|
|
|
1
|
-
import { ImageField, asImagePixelDensitySrcSet, asImageSrc, asImageWidthSrcSet } from "@prismicio/client";
|
|
2
|
-
import { AllowedComponentProps, ComponentCustomProps, ComputedRef, ConcreteComponent, DefineComponent, PropType, Raw, VNodeProps } from "vue";
|
|
3
|
-
import { VueUseOptions } from "../types";
|
|
4
|
-
/**
|
|
5
|
-
* Props for `<PrismicImage />`.
|
|
6
|
-
*/
|
|
7
|
-
export type PrismicImageProps = {
|
|
8
|
-
/**
|
|
9
|
-
* The Prismic image field to render.
|
|
10
|
-
*/
|
|
11
|
-
field: ImageField | ImageField<string>;
|
|
12
|
-
/**
|
|
13
|
-
* An HTML tag name, a component, or a functional component used to render
|
|
14
|
-
* images.
|
|
15
|
-
*
|
|
16
|
-
* @remarks
|
|
17
|
-
* HTML tag names and components will be rendered using the `img` tag
|
|
18
|
-
* interface (`src`, `srcset`, and `alt` attribute). Components will also
|
|
19
|
-
* receive an additional `copyright` props.
|
|
20
|
-
* @defaultValue The one provided to `@prismicio/vue` plugin if configured, `"img"` otherwise.
|
|
21
|
-
*/
|
|
22
|
-
imageComponent?: string | ConcreteComponent | Raw<DefineComponent>;
|
|
23
|
-
/**
|
|
24
|
-
* An object of Imgix URL API parameters.
|
|
25
|
-
*
|
|
26
|
-
* @see Imgix URL parameters reference: https://docs.imgix.com/apis/rendering
|
|
27
|
-
*/
|
|
28
|
-
imgixParams?: Parameters<typeof asImageSrc>[1];
|
|
29
|
-
/**
|
|
30
|
-
* Adds an additional `srcset` attribute to the image following given widths.
|
|
31
|
-
*
|
|
32
|
-
* @remarks
|
|
33
|
-
* A special value of `"thumbnails"` is accepted to automatically use image
|
|
34
|
-
* widths coming from the API.
|
|
35
|
-
* @remarks
|
|
36
|
-
* A special value of `"defaults"` is accepted to automatically use image
|
|
37
|
-
* widths coming from the plugin configuration.
|
|
38
|
-
* @remarks
|
|
39
|
-
* This prop is not compatible with the `pixelDensities` prop. When both are
|
|
40
|
-
* used the `pixelDensities` prop will be ignored.
|
|
41
|
-
*/
|
|
42
|
-
widths?: NonNullable<Parameters<typeof asImageWidthSrcSet>[1]>["widths"] | "thumbnails" | "defaults";
|
|
43
|
-
/**
|
|
44
|
-
* Adds an additional `srcset` attribute to the image following giving pixel
|
|
45
|
-
* densities.
|
|
46
|
-
*
|
|
47
|
-
* @remarks
|
|
48
|
-
* A special value of `"defaults"` is accepted to automatically use image
|
|
49
|
-
* pixel densities coming from the plugin configuration.
|
|
50
|
-
* @remarks
|
|
51
|
-
* This prop is not compatible with the `widths` prop. When both are used, the
|
|
52
|
-
* `pixelDensities` prop will be ignored.
|
|
53
|
-
*/
|
|
54
|
-
pixelDensities?: NonNullable<Parameters<typeof asImagePixelDensitySrcSet>[1]>["pixelDensities"] | "defaults";
|
|
55
|
-
};
|
|
56
|
-
/**
|
|
57
|
-
* Options for {@link usePrismicImage}.
|
|
58
|
-
*/
|
|
59
|
-
export type UsePrismicImageOptions = VueUseOptions<Omit<PrismicImageProps, "imageComponent">>;
|
|
60
|
-
/**
|
|
61
|
-
* Return type of {@link usePrismicImage}.
|
|
62
|
-
*/
|
|
63
|
-
export type UsePrismicImageReturnType = {
|
|
64
|
-
/**
|
|
65
|
-
* Resolved image `src` value.
|
|
66
|
-
*/
|
|
67
|
-
src: ComputedRef<string | null>;
|
|
68
|
-
/**
|
|
69
|
-
* Resolved image `srcset` value.
|
|
70
|
-
*/
|
|
71
|
-
srcset: ComputedRef<string | null>;
|
|
72
|
-
/**
|
|
73
|
-
* Resolved image `alt` value.
|
|
74
|
-
*/
|
|
75
|
-
alt: ComputedRef<string>;
|
|
76
|
-
/**
|
|
77
|
-
* Resolved image `copyright` value.
|
|
78
|
-
*/
|
|
79
|
-
copyright: ComputedRef<string | null>;
|
|
80
|
-
};
|
|
81
|
-
/**
|
|
82
|
-
* A low level composable that returns a resolved information about a Prismic
|
|
83
|
-
* image field.
|
|
84
|
-
*
|
|
85
|
-
* @param props - {@link UsePrismicImageOptions}
|
|
86
|
-
*
|
|
87
|
-
* @returns - Resolved image information {@link UsePrismicImageReturnType}
|
|
88
|
-
*/
|
|
89
|
-
export declare const usePrismicImage: (props: UsePrismicImageOptions) => UsePrismicImageReturnType;
|
|
90
|
-
/**
|
|
91
|
-
* `<PrismicImage />` implementation.
|
|
92
|
-
*
|
|
93
|
-
* @internal
|
|
94
|
-
*/
|
|
95
|
-
export declare const PrismicImageImpl: DefineComponent<{
|
|
96
|
-
field: {
|
|
97
|
-
type: PropType<ImageField | ImageField<string>>;
|
|
98
|
-
required: true;
|
|
99
|
-
};
|
|
100
|
-
imageComponent: {
|
|
101
|
-
type: PropType<string | ConcreteComponent | Raw<DefineComponent>>;
|
|
102
|
-
default: undefined;
|
|
103
|
-
required: false;
|
|
104
|
-
};
|
|
105
|
-
imgixParams: {
|
|
106
|
-
type: PropType<Parameters<typeof asImageSrc>[1]>;
|
|
107
|
-
default: undefined;
|
|
108
|
-
required: false;
|
|
109
|
-
};
|
|
110
|
-
widths: {
|
|
111
|
-
type: PropType<NonNullable<Parameters<typeof asImageWidthSrcSet>[1]>["widths"] | "thumbnails" | "defaults">;
|
|
112
|
-
default: undefined;
|
|
113
|
-
required: false;
|
|
114
|
-
};
|
|
115
|
-
pixelDensities: {
|
|
116
|
-
type: PropType<NonNullable<Parameters<typeof asImagePixelDensitySrcSet>[1]>["pixelDensities"] | "defaults">;
|
|
117
|
-
default: undefined;
|
|
118
|
-
required: false;
|
|
119
|
-
};
|
|
120
|
-
}, (() => null) | (() => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
|
121
|
-
[key: string]: any;
|
|
122
|
-
}>), unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
123
|
-
field: {
|
|
124
|
-
type: PropType<ImageField | ImageField<string>>;
|
|
125
|
-
required: true;
|
|
126
|
-
};
|
|
127
|
-
imageComponent: {
|
|
128
|
-
type: PropType<string | ConcreteComponent | Raw<DefineComponent>>;
|
|
129
|
-
default: undefined;
|
|
130
|
-
required: false;
|
|
131
|
-
};
|
|
132
|
-
imgixParams: {
|
|
133
|
-
type: PropType<Parameters<typeof asImageSrc>[1]>;
|
|
134
|
-
default: undefined;
|
|
135
|
-
required: false;
|
|
136
|
-
};
|
|
137
|
-
widths: {
|
|
138
|
-
type: PropType<NonNullable<Parameters<typeof asImageWidthSrcSet>[1]>["widths"] | "thumbnails" | "defaults">;
|
|
139
|
-
default: undefined;
|
|
140
|
-
required: false;
|
|
141
|
-
};
|
|
142
|
-
pixelDensities: {
|
|
143
|
-
type: PropType<NonNullable<Parameters<typeof asImagePixelDensitySrcSet>[1]>["pixelDensities"] | "defaults">;
|
|
144
|
-
default: undefined;
|
|
145
|
-
required: false;
|
|
146
|
-
};
|
|
147
|
-
}>>, {
|
|
148
|
-
widths: number[] | "thumbnails" | "defaults" | undefined;
|
|
149
|
-
pixelDensities: number[] | "defaults" | undefined;
|
|
150
|
-
imageComponent: string | ConcreteComponent | Raw<DefineComponent>;
|
|
151
|
-
imgixParams: import("imgix-url-builder/*").ImgixURLParams | undefined;
|
|
152
|
-
}, {}>;
|
|
153
|
-
/**
|
|
154
|
-
* Component to render a Prismic image field.
|
|
155
|
-
*
|
|
156
|
-
* @see Component props {@link PrismicImageProps}
|
|
157
|
-
* @see Templating image fields {@link https://prismic.io/docs/technologies/vue-template-content#images}
|
|
158
|
-
*/
|
|
159
|
-
export declare const PrismicImage: {
|
|
160
|
-
new (): {
|
|
161
|
-
$props: AllowedComponentProps & ComponentCustomProps & VNodeProps & PrismicImageProps;
|
|
162
|
-
};
|
|
163
|
-
};
|
|
@@ -1,122 +0,0 @@
|
|
|
1
|
-
import { isFilled, asImageWidthSrcSet, asImagePixelDensitySrcSet, asImageSrc } from "@prismicio/client";
|
|
2
|
-
import { computed, unref, defineComponent, h } from "vue";
|
|
3
|
-
import { __PRODUCTION__ } from "../lib/__PRODUCTION__.js";
|
|
4
|
-
import { simplyResolveComponent } from "../lib/simplyResolveComponent.js";
|
|
5
|
-
import { usePrismic } from "../usePrismic.js";
|
|
6
|
-
const defaultImageComponent = "img";
|
|
7
|
-
const usePrismicImage = (props) => {
|
|
8
|
-
const { options } = usePrismic();
|
|
9
|
-
const asImage = computed(() => {
|
|
10
|
-
var _a, _b;
|
|
11
|
-
const field = unref(props.field);
|
|
12
|
-
if (!isFilled.image(field)) {
|
|
13
|
-
return {
|
|
14
|
-
src: null,
|
|
15
|
-
srcset: null
|
|
16
|
-
};
|
|
17
|
-
}
|
|
18
|
-
const imgixParams = unref(props.imgixParams);
|
|
19
|
-
const widths = unref(props.widths);
|
|
20
|
-
const pixelDensities = unref(props.pixelDensities);
|
|
21
|
-
if (widths) {
|
|
22
|
-
if (!__PRODUCTION__ && pixelDensities) {
|
|
23
|
-
console.warn("[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.", props);
|
|
24
|
-
}
|
|
25
|
-
return asImageWidthSrcSet(field, {
|
|
26
|
-
...imgixParams,
|
|
27
|
-
widths: widths === "defaults" ? (_a = options.components) == null ? void 0 : _a.imageWidthSrcSetDefaults : widths
|
|
28
|
-
});
|
|
29
|
-
} else if (pixelDensities) {
|
|
30
|
-
return asImagePixelDensitySrcSet(field, {
|
|
31
|
-
...imgixParams,
|
|
32
|
-
pixelDensities: pixelDensities === "defaults" ? (_b = options.components) == null ? void 0 : _b.imagePixelDensitySrcSetDefaults : pixelDensities
|
|
33
|
-
});
|
|
34
|
-
} else {
|
|
35
|
-
return {
|
|
36
|
-
src: asImageSrc(field, imgixParams),
|
|
37
|
-
srcset: null
|
|
38
|
-
};
|
|
39
|
-
}
|
|
40
|
-
});
|
|
41
|
-
const src = computed(() => {
|
|
42
|
-
return asImage.value.src;
|
|
43
|
-
});
|
|
44
|
-
const srcset = computed(() => {
|
|
45
|
-
return asImage.value.srcset;
|
|
46
|
-
});
|
|
47
|
-
const alt = computed(() => {
|
|
48
|
-
return unref(props.field).alt || "";
|
|
49
|
-
});
|
|
50
|
-
const copyright = computed(() => {
|
|
51
|
-
return unref(props.field).copyright || null;
|
|
52
|
-
});
|
|
53
|
-
return {
|
|
54
|
-
src,
|
|
55
|
-
srcset,
|
|
56
|
-
alt,
|
|
57
|
-
copyright
|
|
58
|
-
};
|
|
59
|
-
};
|
|
60
|
-
const PrismicImageImpl = /* @__PURE__ */ defineComponent({
|
|
61
|
-
name: "PrismicImage",
|
|
62
|
-
props: {
|
|
63
|
-
field: {
|
|
64
|
-
type: Object,
|
|
65
|
-
required: true
|
|
66
|
-
},
|
|
67
|
-
imageComponent: {
|
|
68
|
-
type: [String, Object],
|
|
69
|
-
default: void 0,
|
|
70
|
-
required: false
|
|
71
|
-
},
|
|
72
|
-
imgixParams: {
|
|
73
|
-
type: Object,
|
|
74
|
-
default: void 0,
|
|
75
|
-
required: false
|
|
76
|
-
},
|
|
77
|
-
widths: {
|
|
78
|
-
type: [String, Object],
|
|
79
|
-
default: void 0,
|
|
80
|
-
required: false
|
|
81
|
-
},
|
|
82
|
-
pixelDensities: {
|
|
83
|
-
type: [String, Object],
|
|
84
|
-
default: void 0,
|
|
85
|
-
required: false
|
|
86
|
-
}
|
|
87
|
-
},
|
|
88
|
-
setup(props) {
|
|
89
|
-
if (!props.field) {
|
|
90
|
-
return () => null;
|
|
91
|
-
}
|
|
92
|
-
const { options } = usePrismic();
|
|
93
|
-
const type = computed(() => {
|
|
94
|
-
var _a;
|
|
95
|
-
return props.imageComponent || ((_a = options.components) == null ? void 0 : _a.imageComponent) || defaultImageComponent;
|
|
96
|
-
});
|
|
97
|
-
const { src, srcset, alt, copyright } = usePrismicImage(props);
|
|
98
|
-
return () => {
|
|
99
|
-
const attributes = {
|
|
100
|
-
src: src.value,
|
|
101
|
-
srcset: srcset.value,
|
|
102
|
-
alt: alt.value
|
|
103
|
-
};
|
|
104
|
-
switch (type.value) {
|
|
105
|
-
case "img":
|
|
106
|
-
return h("img", attributes);
|
|
107
|
-
default:
|
|
108
|
-
return h(simplyResolveComponent(type.value), {
|
|
109
|
-
...attributes,
|
|
110
|
-
copyright: copyright.value
|
|
111
|
-
});
|
|
112
|
-
}
|
|
113
|
-
};
|
|
114
|
-
}
|
|
115
|
-
});
|
|
116
|
-
const PrismicImage = PrismicImageImpl;
|
|
117
|
-
export {
|
|
118
|
-
PrismicImage,
|
|
119
|
-
PrismicImageImpl,
|
|
120
|
-
usePrismicImage
|
|
121
|
-
};
|
|
122
|
-
//# sourceMappingURL=PrismicImage.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"PrismicImage.js","sources":["../../../src/components/PrismicImage.ts"],"sourcesContent":["import {\n\tImageField,\n\tasImagePixelDensitySrcSet,\n\tasImageSrc,\n\tasImageWidthSrcSet,\n\tisFilled,\n} from \"@prismicio/client\";\nimport {\n\tAllowedComponentProps,\n\tComponentCustomProps,\n\tComputedRef,\n\tConcreteComponent,\n\tDefineComponent,\n\tPropType,\n\tRaw,\n\tVNodeProps,\n\tcomputed,\n\tdefineComponent,\n\th,\n\tunref,\n} from \"vue\";\n\nimport { __PRODUCTION__ } from \"../lib/__PRODUCTION__\";\nimport { simplyResolveComponent } from \"../lib/simplyResolveComponent\";\n\nimport { VueUseOptions } from \"../types\";\n\nimport { usePrismic } from \"../usePrismic\";\n\n/**\n * The default component rendered for images.\n */\nconst defaultImageComponent = \"img\";\n\n/**\n * Props for `<PrismicImage />`.\n */\nexport type PrismicImageProps = {\n\t/**\n\t * The Prismic image field to render.\n\t */\n\tfield: ImageField | ImageField<string>;\n\n\t/**\n\t * An HTML tag name, a component, or a functional component used to render\n\t * images.\n\t *\n\t * @remarks\n\t * HTML tag names and components will be rendered using the `img` tag\n\t * interface (`src`, `srcset`, and `alt` attribute). Components will also\n\t * receive an additional `copyright` props.\n\t * @defaultValue The one provided to `@prismicio/vue` plugin if configured, `\"img\"` otherwise.\n\t */\n\timageComponent?: string | ConcreteComponent | Raw<DefineComponent>;\n\n\t/**\n\t * An object of Imgix URL API parameters.\n\t *\n\t * @see Imgix URL parameters reference: https://docs.imgix.com/apis/rendering\n\t */\n\timgixParams?: Parameters<typeof asImageSrc>[1];\n\n\t/**\n\t * Adds an additional `srcset` attribute to the image following given widths.\n\t *\n\t * @remarks\n\t * A special value of `\"thumbnails\"` is accepted to automatically use image\n\t * widths coming from the API.\n\t * @remarks\n\t * A special value of `\"defaults\"` is accepted to automatically use image\n\t * widths coming from the plugin configuration.\n\t * @remarks\n\t * This prop is not compatible with the `pixelDensities` prop. When both are\n\t * used the `pixelDensities` prop will be ignored.\n\t */\n\twidths?:\n\t\t| NonNullable<Parameters<typeof asImageWidthSrcSet>[1]>[\"widths\"]\n\t\t| \"thumbnails\"\n\t\t| \"defaults\";\n\n\t/**\n\t * Adds an additional `srcset` attribute to the image following giving pixel\n\t * densities.\n\t *\n\t * @remarks\n\t * A special value of `\"defaults\"` is accepted to automatically use image\n\t * pixel densities coming from the plugin configuration.\n\t * @remarks\n\t * This prop is not compatible with the `widths` prop. When both are used, the\n\t * `pixelDensities` prop will be ignored.\n\t */\n\tpixelDensities?:\n\t\t| NonNullable<\n\t\t\t\tParameters<typeof asImagePixelDensitySrcSet>[1]\n\t\t >[\"pixelDensities\"]\n\t\t| \"defaults\";\n};\n\n/**\n * Options for {@link usePrismicImage}.\n */\nexport type UsePrismicImageOptions = VueUseOptions<\n\tOmit<PrismicImageProps, \"imageComponent\">\n>;\n\n/**\n * Return type of {@link usePrismicImage}.\n */\nexport type UsePrismicImageReturnType = {\n\t/**\n\t * Resolved image `src` value.\n\t */\n\tsrc: ComputedRef<string | null>;\n\n\t/**\n\t * Resolved image `srcset` value.\n\t */\n\tsrcset: ComputedRef<string | null>;\n\n\t/**\n\t * Resolved image `alt` value.\n\t */\n\talt: ComputedRef<string>;\n\n\t/**\n\t * Resolved image `copyright` value.\n\t */\n\tcopyright: ComputedRef<string | null>;\n};\n\n/**\n * A low level composable that returns a resolved information about a Prismic\n * image field.\n *\n * @param props - {@link UsePrismicImageOptions}\n *\n * @returns - Resolved image information {@link UsePrismicImageReturnType}\n */\nexport const usePrismicImage = (\n\tprops: UsePrismicImageOptions,\n): UsePrismicImageReturnType => {\n\tconst { options } = usePrismic();\n\n\tconst asImage = computed(() => {\n\t\tconst field = unref(props.field);\n\n\t\tif (!isFilled.image(field)) {\n\t\t\treturn {\n\t\t\t\tsrc: null,\n\t\t\t\tsrcset: null,\n\t\t\t};\n\t\t}\n\n\t\tconst imgixParams = unref(props.imgixParams);\n\t\tconst widths = unref(props.widths);\n\t\tconst pixelDensities = unref(props.pixelDensities);\n\n\t\tif (widths) {\n\t\t\tif (!__PRODUCTION__ && pixelDensities) {\n\t\t\t\tconsole.warn(\n\t\t\t\t\t\"[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.\",\n\t\t\t\t\tprops,\n\t\t\t\t);\n\t\t\t}\n\n\t\t\treturn asImageWidthSrcSet(field, {\n\t\t\t\t...imgixParams,\n\t\t\t\twidths:\n\t\t\t\t\twidths === \"defaults\"\n\t\t\t\t\t\t? options.components?.imageWidthSrcSetDefaults\n\t\t\t\t\t\t: widths,\n\t\t\t});\n\t\t} else if (pixelDensities) {\n\t\t\treturn asImagePixelDensitySrcSet(field, {\n\t\t\t\t...imgixParams,\n\t\t\t\tpixelDensities:\n\t\t\t\t\tpixelDensities === \"defaults\"\n\t\t\t\t\t\t? options.components?.imagePixelDensitySrcSetDefaults\n\t\t\t\t\t\t: pixelDensities,\n\t\t\t});\n\t\t} else {\n\t\t\treturn {\n\t\t\t\tsrc: asImageSrc(field, imgixParams),\n\t\t\t\tsrcset: null,\n\t\t\t};\n\t\t}\n\t});\n\n\tconst src = computed(() => {\n\t\treturn asImage.value.src;\n\t});\n\tconst srcset = computed(() => {\n\t\treturn asImage.value.srcset;\n\t});\n\tconst alt = computed(() => {\n\t\treturn unref(props.field).alt || \"\";\n\t});\n\tconst copyright = computed(() => {\n\t\treturn unref(props.field).copyright || null;\n\t});\n\n\treturn {\n\t\tsrc,\n\t\tsrcset,\n\t\talt,\n\t\tcopyright,\n\t};\n};\n\n/**\n * `<PrismicImage />` implementation.\n *\n * @internal\n */\nexport const PrismicImageImpl = /*#__PURE__*/ defineComponent({\n\tname: \"PrismicImage\",\n\tprops: {\n\t\tfield: {\n\t\t\ttype: Object as PropType<ImageField | ImageField<string>>,\n\t\t\trequired: true,\n\t\t},\n\t\timageComponent: {\n\t\t\ttype: [String, Object] as PropType<\n\t\t\t\tstring | ConcreteComponent | Raw<DefineComponent>\n\t\t\t>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\timgixParams: {\n\t\t\ttype: Object as PropType<Parameters<typeof asImageSrc>[1]>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\twidths: {\n\t\t\ttype: [String, Object] as PropType<\n\t\t\t\t| NonNullable<Parameters<typeof asImageWidthSrcSet>[1]>[\"widths\"]\n\t\t\t\t| \"thumbnails\"\n\t\t\t\t| \"defaults\"\n\t\t\t>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\tpixelDensities: {\n\t\t\ttype: [String, Object] as PropType<\n\t\t\t\t| NonNullable<\n\t\t\t\t\t\tParameters<typeof asImagePixelDensitySrcSet>[1]\n\t\t\t\t >[\"pixelDensities\"]\n\t\t\t\t| \"defaults\"\n\t\t\t>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t},\n\tsetup(props) {\n\t\t// Prevent fatal if user didn't check for field, throws `Invalid prop` warn\n\t\tif (!props.field) {\n\t\t\treturn () => null;\n\t\t}\n\n\t\tconst { options } = usePrismic();\n\n\t\tconst type = computed(() => {\n\t\t\treturn (\n\t\t\t\tprops.imageComponent ||\n\t\t\t\toptions.components?.imageComponent ||\n\t\t\t\tdefaultImageComponent\n\t\t\t);\n\t\t});\n\n\t\tconst { src, srcset, alt, copyright } = usePrismicImage(props);\n\n\t\treturn () => {\n\t\t\tconst attributes = {\n\t\t\t\tsrc: src.value,\n\t\t\t\tsrcset: srcset.value,\n\t\t\t\talt: alt.value,\n\t\t\t};\n\n\t\t\tswitch (type.value) {\n\t\t\t\tcase \"img\":\n\t\t\t\t\t// Fitting img tag interface\n\t\t\t\t\treturn h(\"img\", attributes);\n\n\t\t\t\tdefault:\n\t\t\t\t\treturn h(simplyResolveComponent(type.value), {\n\t\t\t\t\t\t...attributes,\n\t\t\t\t\t\tcopyright: copyright.value,\n\t\t\t\t\t});\n\t\t\t}\n\t\t};\n\t},\n});\n\n// export the public type for h/tsx inference\n// also to avoid inline import() in generated d.ts files\n/**\n * Component to render a Prismic image field.\n *\n * @see Component props {@link PrismicImageProps}\n * @see Templating image fields {@link https://prismic.io/docs/technologies/vue-template-content#images}\n */\nexport const PrismicImage = PrismicImageImpl as unknown as {\n\tnew (): {\n\t\t$props: AllowedComponentProps &\n\t\t\tComponentCustomProps &\n\t\t\tVNodeProps &\n\t\t\tPrismicImageProps;\n\t};\n};\n"],"names":[],"mappings":"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"}
|
|
@@ -1,120 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const client = require("@prismicio/client");
|
|
4
|
-
const vue = require("vue");
|
|
5
|
-
const getSlots = require("../lib/getSlots.cjs");
|
|
6
|
-
const isInternalURL = require("../lib/isInternalURL.cjs");
|
|
7
|
-
const simplyResolveComponent = require("../lib/simplyResolveComponent.cjs");
|
|
8
|
-
const usePrismic = require("../usePrismic.cjs");
|
|
9
|
-
const defaultInternalComponent = "router-link";
|
|
10
|
-
const defaultExternalComponent = "a";
|
|
11
|
-
const defaultBlankTargetRelAttribute = "noopener noreferrer";
|
|
12
|
-
const usePrismicLink = (props) => {
|
|
13
|
-
const { options } = usePrismic.usePrismic();
|
|
14
|
-
const type = vue.computed(() => {
|
|
15
|
-
var _a, _b;
|
|
16
|
-
const internalComponent = vue.unref(props.internalComponent) || ((_a = options.components) == null ? void 0 : _a.linkInternalComponent) || defaultInternalComponent;
|
|
17
|
-
const externalComponent = vue.unref(props.externalComponent) || ((_b = options.components) == null ? void 0 : _b.linkExternalComponent) || defaultExternalComponent;
|
|
18
|
-
return href.value && isInternalURL.isInternalURL(href.value) && !target.value ? internalComponent : externalComponent;
|
|
19
|
-
});
|
|
20
|
-
const href = vue.computed(() => {
|
|
21
|
-
const field = vue.unref(props.field);
|
|
22
|
-
const linkResolver = vue.unref(props.linkResolver) ?? options.linkResolver;
|
|
23
|
-
return client.asLink(field, linkResolver) ?? "";
|
|
24
|
-
});
|
|
25
|
-
const target = vue.computed(() => {
|
|
26
|
-
const field = vue.unref(props.field);
|
|
27
|
-
const target2 = vue.unref(props.target);
|
|
28
|
-
if (typeof target2 !== "undefined") {
|
|
29
|
-
return target2;
|
|
30
|
-
} else {
|
|
31
|
-
return field && "target" in field && field.target ? field.target : null;
|
|
32
|
-
}
|
|
33
|
-
});
|
|
34
|
-
const rel = vue.computed(() => {
|
|
35
|
-
var _a;
|
|
36
|
-
const rel2 = vue.unref(props.rel);
|
|
37
|
-
if (typeof rel2 !== "undefined") {
|
|
38
|
-
return rel2;
|
|
39
|
-
} else if (target.value === "_blank") {
|
|
40
|
-
const blankTargetRelAttribute = vue.unref(props.blankTargetRelAttribute);
|
|
41
|
-
if (typeof blankTargetRelAttribute !== "undefined") {
|
|
42
|
-
return blankTargetRelAttribute;
|
|
43
|
-
} else {
|
|
44
|
-
return typeof ((_a = options.components) == null ? void 0 : _a.linkBlankTargetRelAttribute) !== "undefined" ? options.components.linkBlankTargetRelAttribute : defaultBlankTargetRelAttribute;
|
|
45
|
-
}
|
|
46
|
-
} else {
|
|
47
|
-
return null;
|
|
48
|
-
}
|
|
49
|
-
});
|
|
50
|
-
const text = vue.computed(() => {
|
|
51
|
-
const field = vue.unref(props.field);
|
|
52
|
-
return field && "text" in field ? field.text : void 0;
|
|
53
|
-
});
|
|
54
|
-
return {
|
|
55
|
-
type,
|
|
56
|
-
href,
|
|
57
|
-
target,
|
|
58
|
-
rel,
|
|
59
|
-
text
|
|
60
|
-
};
|
|
61
|
-
};
|
|
62
|
-
const PrismicLinkImpl = /* @__PURE__ */ vue.defineComponent({
|
|
63
|
-
name: "PrismicLink",
|
|
64
|
-
props: {
|
|
65
|
-
field: {
|
|
66
|
-
type: Object,
|
|
67
|
-
required: true
|
|
68
|
-
},
|
|
69
|
-
linkResolver: {
|
|
70
|
-
type: Function,
|
|
71
|
-
default: void 0,
|
|
72
|
-
required: false
|
|
73
|
-
},
|
|
74
|
-
target: {
|
|
75
|
-
type: String,
|
|
76
|
-
default: void 0,
|
|
77
|
-
required: false
|
|
78
|
-
},
|
|
79
|
-
rel: {
|
|
80
|
-
type: String,
|
|
81
|
-
default: void 0,
|
|
82
|
-
required: false
|
|
83
|
-
},
|
|
84
|
-
blankTargetRelAttribute: {
|
|
85
|
-
type: String,
|
|
86
|
-
default: void 0,
|
|
87
|
-
required: false
|
|
88
|
-
},
|
|
89
|
-
internalComponent: {
|
|
90
|
-
type: [String, Object, Function],
|
|
91
|
-
default: void 0,
|
|
92
|
-
required: false
|
|
93
|
-
},
|
|
94
|
-
externalComponent: {
|
|
95
|
-
type: [String, Object, Function],
|
|
96
|
-
default: void 0,
|
|
97
|
-
required: false
|
|
98
|
-
}
|
|
99
|
-
},
|
|
100
|
-
setup(props, { slots }) {
|
|
101
|
-
if (!props.field) {
|
|
102
|
-
return () => null;
|
|
103
|
-
}
|
|
104
|
-
const { type, href, target, rel, text } = usePrismicLink(props);
|
|
105
|
-
return () => {
|
|
106
|
-
const parent = type.value === "a" ? "a" : simplyResolveComponent.simplyResolveComponent(type.value);
|
|
107
|
-
const computedSlots = getSlots.getSlots(parent, slots, vue.reactive({ href: href.value, text: text.value }), text.value);
|
|
108
|
-
if (typeof parent === "string") {
|
|
109
|
-
return vue.h(parent, { href: href.value, target: target.value, rel: rel.value }, computedSlots);
|
|
110
|
-
} else {
|
|
111
|
-
return vue.h(parent, { to: href.value, target: target.value, rel: rel.value }, computedSlots);
|
|
112
|
-
}
|
|
113
|
-
};
|
|
114
|
-
}
|
|
115
|
-
});
|
|
116
|
-
const PrismicLink = PrismicLinkImpl;
|
|
117
|
-
exports.PrismicLink = PrismicLink;
|
|
118
|
-
exports.PrismicLinkImpl = PrismicLinkImpl;
|
|
119
|
-
exports.usePrismicLink = usePrismicLink;
|
|
120
|
-
//# sourceMappingURL=PrismicLink.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"PrismicLink.cjs","sources":["../../../src/components/PrismicLink.ts"],"sourcesContent":["import {\n\tLinkField,\n\tLinkResolverFunction,\n\tPrismicDocument,\n\tasLink,\n} from \"@prismicio/client\";\nimport {\n\tAllowedComponentProps,\n\tComponentCustomProps,\n\tComputedRef,\n\tConcreteComponent,\n\tDefineComponent,\n\tPropType,\n\tRaw,\n\tVNodeProps,\n\tcomputed,\n\tdefineComponent,\n\th,\n\treactive,\n\tunref,\n} from \"vue\";\n\nimport { getSlots } from \"../lib/getSlots\";\nimport { isInternalURL } from \"../lib/isInternalURL\";\nimport { simplyResolveComponent } from \"../lib/simplyResolveComponent\";\n\nimport { VueUseOptions } from \"../types\";\n\nimport { usePrismic } from \"../usePrismic\";\n\n/**\n * The default component rendered for internal URLs.\n */\nconst defaultInternalComponent = \"router-link\";\n\n/**\n * The default component rendered for external URLs.\n */\nconst defaultExternalComponent = \"a\";\n\n/**\n * The default rel attribute rendered for blank target URLs.\n */\nconst defaultBlankTargetRelAttribute = \"noopener noreferrer\";\n\n/**\n * Props for `<PrismicLink />`.\n */\nexport type PrismicLinkProps = {\n\t/**\n\t * The Prismic link field or document to render.\n\t */\n\tfield: LinkField | PrismicDocument;\n\n\t/**\n\t * A link resolver function used to resolve links when not using the route\n\t * resolver parameter with `@prismicio/client`.\n\t *\n\t * @defaultValue The link resolver provided to `@prismicio/vue` plugin if configured.\n\t *\n\t * @see Link resolver documentation {@link https://prismic.io/docs/core-concepts/link-resolver-route-resolver#link-resolver}\n\t */\n\tlinkResolver?: LinkResolverFunction;\n\n\t/**\n\t * An explicit `target` attribute to apply to the rendered link.\n\t */\n\ttarget?: string | null;\n\n\t/**\n\t * An explicit `rel` attribute to apply to the rendered link.\n\t */\n\trel?: string | null;\n\n\t/**\n\t * Value of the `rel` attribute to use on links rendered with\n\t * `target=\"_blank\"`.\n\t *\n\t * @defaultValue The one provided to `@prismicio/vue` plugin if configured, `\"noopener noreferrer\"` otherwise.\n\t */\n\tblankTargetRelAttribute?: string | null;\n\n\t/**\n\t * An HTML tag name, a component, or a functional component used to render\n\t * internal links.\n\t *\n\t * @remarks\n\t * HTML tag names will be rendered using the anchor tag interface (`href`,\n\t * `target`, and `rel` attributes).\n\t * @remarks\n\t * Components will be rendered using Vue Router {@link RouterLink} interface\n\t * (`to` props).\n\t * @defaultValue The one provided to `@prismicio/vue` plugin if configured, {@link RouterLink} otherwise.\n\t */\n\tinternalComponent?: string | ConcreteComponent | Raw<DefineComponent>;\n\n\t/**\n\t * An HTML tag name, a component, or a functional component used to render\n\t * external links.\n\t *\n\t * @remarks\n\t * HTML tag names will be rendered using the anchor tag interface (`href`,\n\t * `target`, and `rel` attributes).\n\t * @remarks\n\t * Components will be rendered using Vue Router {@link RouterLink} interface\n\t * (`to` props).\n\t * @defaultValue The one provided to `@prismicio/vue` plugin if configured, `\"a\"` otherwise.\n\t */\n\texternalComponent?: string | ConcreteComponent | Raw<DefineComponent>;\n};\n\n/**\n * Options for {@link usePrismicLink}.\n */\nexport type UsePrismicLinkOptions = VueUseOptions<PrismicLinkProps>;\n\n/**\n * Return type of {@link usePrismicLink}.\n */\nexport type UsePrismicLinkReturnType = {\n\t/**\n\t * Suggested component to render for provided link field.\n\t */\n\ttype: ComputedRef<string | ConcreteComponent | Raw<DefineComponent>>;\n\n\t/**\n\t * Resolved anchor `href` value.\n\t */\n\thref: ComputedRef<string>;\n\n\t/**\n\t * Resolved anchor `target` value.\n\t */\n\ttarget: ComputedRef<string | null>;\n\n\t/**\n\t * Resolved anchor `rel` value.\n\t */\n\trel: ComputedRef<string | null>;\n\n\t/**\n\t * Resolved link text.\n\t */\n\ttext: ComputedRef<string | undefined>;\n};\n\n/**\n * A low level composable that returns resolved information about a Prismic link\n * field.\n *\n * @param props - {@link UsePrismicLinkOptions}\n *\n * @returns - Resolved link information {@link UsePrismicLinkReturnType}\n */\nexport const usePrismicLink = (\n\tprops: UsePrismicLinkOptions,\n): UsePrismicLinkReturnType => {\n\tconst { options } = usePrismic();\n\n\tconst type = computed(() => {\n\t\tconst internalComponent =\n\t\t\tunref(props.internalComponent) ||\n\t\t\toptions.components?.linkInternalComponent ||\n\t\t\tdefaultInternalComponent;\n\n\t\tconst externalComponent =\n\t\t\tunref(props.externalComponent) ||\n\t\t\toptions.components?.linkExternalComponent ||\n\t\t\tdefaultExternalComponent;\n\n\t\treturn href.value && isInternalURL(href.value) && !target.value\n\t\t\t? internalComponent\n\t\t\t: externalComponent;\n\t});\n\tconst href = computed(() => {\n\t\tconst field = unref(props.field);\n\t\tconst linkResolver = unref(props.linkResolver) ?? options.linkResolver;\n\n\t\treturn asLink(field, linkResolver) ?? \"\";\n\t});\n\tconst target = computed(() => {\n\t\tconst field = unref(props.field);\n\t\tconst target = unref(props.target);\n\n\t\tif (typeof target !== \"undefined\") {\n\t\t\treturn target;\n\t\t} else {\n\t\t\treturn field && \"target\" in field && field.target ? field.target : null;\n\t\t}\n\t});\n\tconst rel = computed(() => {\n\t\tconst rel = unref(props.rel);\n\n\t\tif (typeof rel !== \"undefined\") {\n\t\t\treturn rel;\n\t\t} else if (target.value === \"_blank\") {\n\t\t\tconst blankTargetRelAttribute = unref(props.blankTargetRelAttribute);\n\n\t\t\tif (typeof blankTargetRelAttribute !== \"undefined\") {\n\t\t\t\treturn blankTargetRelAttribute;\n\t\t\t} else {\n\t\t\t\treturn typeof options.components?.linkBlankTargetRelAttribute !==\n\t\t\t\t\t\"undefined\"\n\t\t\t\t\t? options.components.linkBlankTargetRelAttribute\n\t\t\t\t\t: defaultBlankTargetRelAttribute;\n\t\t\t}\n\t\t} else {\n\t\t\treturn null;\n\t\t}\n\t});\n\n\tconst text = computed(() => {\n\t\tconst field = unref(props.field);\n\n\t\treturn field && \"text\" in field ? field.text : undefined;\n\t});\n\n\treturn {\n\t\ttype,\n\t\thref,\n\t\ttarget,\n\t\trel,\n\t\ttext,\n\t};\n};\n\n/**\n * `<PrismicLink />` implementation.\n *\n * @internal\n */\nexport const PrismicLinkImpl = /*#__PURE__*/ defineComponent({\n\tname: \"PrismicLink\",\n\tprops: {\n\t\tfield: {\n\t\t\ttype: Object as PropType<LinkField | PrismicDocument>,\n\t\t\trequired: true,\n\t\t},\n\t\tlinkResolver: {\n\t\t\ttype: Function as PropType<LinkResolverFunction>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\ttarget: {\n\t\t\ttype: String as PropType<string | null>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\trel: {\n\t\t\ttype: String as PropType<string | null>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\tblankTargetRelAttribute: {\n\t\t\ttype: String as PropType<string | null>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\tinternalComponent: {\n\t\t\ttype: [String, Object, Function] as PropType<\n\t\t\t\tstring | ConcreteComponent | Raw<DefineComponent>\n\t\t\t>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\texternalComponent: {\n\t\t\ttype: [String, Object, Function] as PropType<\n\t\t\t\tstring | ConcreteComponent | Raw<DefineComponent>\n\t\t\t>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t},\n\tsetup(props, { slots }) {\n\t\t// Prevent fatal if user didn't check for field, throws `Invalid prop` warn\n\t\tif (!props.field) {\n\t\t\treturn () => null;\n\t\t}\n\n\t\tconst { type, href, target, rel, text } = usePrismicLink(props);\n\n\t\treturn () => {\n\t\t\tconst parent =\n\t\t\t\ttype.value === \"a\" ? \"a\" : simplyResolveComponent(type.value);\n\t\t\tconst computedSlots = getSlots(\n\t\t\t\tparent,\n\t\t\t\tslots,\n\t\t\t\treactive({ href: href.value, text: text.value }),\n\t\t\t\ttext.value,\n\t\t\t);\n\n\t\t\tif (typeof parent === \"string\") {\n\t\t\t\t// Fitting anchor tag interface\n\t\t\t\treturn h(\n\t\t\t\t\tparent,\n\t\t\t\t\t{ href: href.value, target: target.value, rel: rel.value },\n\t\t\t\t\tcomputedSlots,\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\t// Fitting Vue Router Link interface\n\t\t\t\treturn h(\n\t\t\t\t\tparent,\n\t\t\t\t\t{ to: href.value, target: target.value, rel: rel.value },\n\t\t\t\t\tcomputedSlots,\n\t\t\t\t);\n\t\t\t}\n\t\t};\n\t},\n});\n\n// export the public type for h/tsx inference\n// also to avoid inline import() in generated d.ts files\n/**\n * Component to render a Prismic link field.\n *\n * @see Component props {@link PrismicLinkProps}\n * @see Templating link fields {@link https://prismic.io/docs/technologies/vue-template-content#links-and-content-relationships}\n */\nexport const PrismicLink = PrismicLinkImpl as unknown as {\n\tnew (): {\n\t\t$props: AllowedComponentProps &\n\t\t\tComponentCustomProps &\n\t\t\tVNodeProps &\n\t\t\tPrismicLinkProps;\n\t};\n};\n"],"names":["usePrismic","computed","unref","isInternalURL","asLink","target","rel","defineComponent","simplyResolveComponent","getSlots","reactive","h"],"mappings":"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"}
|