@prismicio/vue 2.0.11 → 2.1.1
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/LICENSE +202 -0
- package/README.md +81 -149
- package/components/common.js +289 -47
- package/components/index.js +283 -45
- package/components/umd.js +292 -49
- package/dist/prismic-vue.common.js +299 -55
- package/dist/prismic-vue.esm.js +292 -50
- package/dist/prismic-vue.js +303 -59
- package/dist/prismic-vue.min.js +1 -1
- package/package.json +86 -47
- package/src/components/Embed.js +32 -32
- package/src/components/Image.js +27 -22
- package/src/components/Link.js +87 -51
- package/src/components/RichText.js +40 -41
- package/src/components/SliceZone.js +145 -0
- package/src/components/Text.js +37 -0
- package/src/components/index.js +26 -22
- package/src/components-bundler.js +10 -5
- package/src/index.js +51 -39
- package/src/methods.js +16 -22
- package/vetur/attributes.json +86 -0
- package/vetur/tags.json +38 -0
package/components/umd.js
CHANGED
|
@@ -1,34 +1,25 @@
|
|
|
1
1
|
(function (global, factory) {
|
|
2
2
|
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('prismic-dom')) :
|
|
3
3
|
typeof define === 'function' && define.amd ? define(['exports', 'prismic-dom'], factory) :
|
|
4
|
-
(factory(
|
|
5
|
-
}(this, (function (exports,PrismicDom) { 'use strict';
|
|
4
|
+
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.PrismicVueComponents = {}, global.prismicDOM));
|
|
5
|
+
})(this, (function (exports, PrismicDom) { 'use strict';
|
|
6
6
|
|
|
7
|
-
|
|
7
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
8
8
|
|
|
9
|
-
|
|
10
|
-
if (key in obj) {
|
|
11
|
-
Object.defineProperty(obj, key, {
|
|
12
|
-
value: value,
|
|
13
|
-
enumerable: true,
|
|
14
|
-
configurable: true,
|
|
15
|
-
writable: true
|
|
16
|
-
});
|
|
17
|
-
} else {
|
|
18
|
-
obj[key] = value;
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
return obj;
|
|
22
|
-
}
|
|
9
|
+
var PrismicDom__default = /*#__PURE__*/_interopDefaultLegacy(PrismicDom);
|
|
23
10
|
|
|
24
11
|
function ownKeys(object, enumerableOnly) {
|
|
25
12
|
var keys = Object.keys(object);
|
|
26
13
|
|
|
27
14
|
if (Object.getOwnPropertySymbols) {
|
|
28
15
|
var symbols = Object.getOwnPropertySymbols(object);
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
16
|
+
|
|
17
|
+
if (enumerableOnly) {
|
|
18
|
+
symbols = symbols.filter(function (sym) {
|
|
19
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
20
|
+
});
|
|
21
|
+
}
|
|
22
|
+
|
|
32
23
|
keys.push.apply(keys, symbols);
|
|
33
24
|
}
|
|
34
25
|
|
|
@@ -55,6 +46,21 @@
|
|
|
55
46
|
return target;
|
|
56
47
|
}
|
|
57
48
|
|
|
49
|
+
function _defineProperty(obj, key, value) {
|
|
50
|
+
if (key in obj) {
|
|
51
|
+
Object.defineProperty(obj, key, {
|
|
52
|
+
value: value,
|
|
53
|
+
enumerable: true,
|
|
54
|
+
configurable: true,
|
|
55
|
+
writable: true
|
|
56
|
+
});
|
|
57
|
+
} else {
|
|
58
|
+
obj[key] = value;
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
return obj;
|
|
62
|
+
}
|
|
63
|
+
|
|
58
64
|
var Embed = {
|
|
59
65
|
name: 'PrismicEmbed',
|
|
60
66
|
functional: true,
|
|
@@ -64,7 +70,7 @@
|
|
|
64
70
|
required: true
|
|
65
71
|
},
|
|
66
72
|
wrapper: {
|
|
67
|
-
type: String,
|
|
73
|
+
type: [String, Object, Function],
|
|
68
74
|
required: false,
|
|
69
75
|
"default": 'div'
|
|
70
76
|
}
|
|
@@ -113,10 +119,15 @@
|
|
|
113
119
|
render: function render(h, _ref) {
|
|
114
120
|
var props = _ref.props,
|
|
115
121
|
data = _ref.data;
|
|
116
|
-
var
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
122
|
+
var field = props.field;
|
|
123
|
+
|
|
124
|
+
if (!field) {
|
|
125
|
+
return null;
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
var url = field.url,
|
|
129
|
+
alt = field.alt,
|
|
130
|
+
copyright = field.copyright;
|
|
120
131
|
return h('img', Object.assign(data, {
|
|
121
132
|
attrs: _objectSpread2(_objectSpread2({}, data.attrs), {}, {
|
|
122
133
|
src: url,
|
|
@@ -127,11 +138,24 @@
|
|
|
127
138
|
}
|
|
128
139
|
};
|
|
129
140
|
|
|
141
|
+
var isInternalURL = function isInternalURL(url) {
|
|
142
|
+
/**
|
|
143
|
+
* @see Regex101 expression: {@link https://regex101.com/r/1y7iod/1}
|
|
144
|
+
*/
|
|
145
|
+
var isInternal = /^\/(?!\/)/.test(url);
|
|
146
|
+
/**
|
|
147
|
+
* @see Regex101 expression: {@link https://regex101.com/r/RnUseS/1}
|
|
148
|
+
*/
|
|
149
|
+
|
|
150
|
+
var isSpecialLink = !isInternal && !/^https?:\/\//i.test(url);
|
|
151
|
+
return isInternal && !isSpecialLink;
|
|
152
|
+
};
|
|
153
|
+
|
|
130
154
|
var Link = (function (_ref) {
|
|
131
155
|
var _ref$component = _ref.component,
|
|
132
|
-
component = _ref$component === void 0 ?
|
|
156
|
+
component = _ref$component === void 0 ? "a" : _ref$component;
|
|
133
157
|
return {
|
|
134
|
-
name:
|
|
158
|
+
name: "PrismicLink",
|
|
135
159
|
functional: true,
|
|
136
160
|
props: {
|
|
137
161
|
field: {
|
|
@@ -141,6 +165,21 @@
|
|
|
141
165
|
linkResolver: {
|
|
142
166
|
type: Function,
|
|
143
167
|
required: false
|
|
168
|
+
},
|
|
169
|
+
target: {
|
|
170
|
+
type: String,
|
|
171
|
+
"default": undefined,
|
|
172
|
+
required: false
|
|
173
|
+
},
|
|
174
|
+
rel: {
|
|
175
|
+
type: String,
|
|
176
|
+
"default": undefined,
|
|
177
|
+
required: false
|
|
178
|
+
},
|
|
179
|
+
blankTargetRelAttribute: {
|
|
180
|
+
type: String,
|
|
181
|
+
"default": "noopener noreferrer",
|
|
182
|
+
required: false
|
|
144
183
|
}
|
|
145
184
|
},
|
|
146
185
|
render: function render(h, _ref2) {
|
|
@@ -155,11 +194,11 @@
|
|
|
155
194
|
return null;
|
|
156
195
|
}
|
|
157
196
|
|
|
158
|
-
var url = parent.$prismic ? parent.$prismic.asLink(field, linkResolver) : PrismicDom__default.Link.url(field, linkResolver || function () {
|
|
197
|
+
var url = parent.$prismic ? parent.$prismic.asLink(field, linkResolver) : PrismicDom__default["default"].Link.url(field, linkResolver || function () {
|
|
159
198
|
return null;
|
|
160
199
|
});
|
|
161
200
|
|
|
162
|
-
if (url
|
|
201
|
+
if (isInternalURL(url) && !props.target) {
|
|
163
202
|
data.props = data.props || {};
|
|
164
203
|
data.props.to = url;
|
|
165
204
|
return h(component, data, children);
|
|
@@ -167,39 +206,53 @@
|
|
|
167
206
|
|
|
168
207
|
data.attrs = _objectSpread2(_objectSpread2({}, data.attrs), {}, {
|
|
169
208
|
href: url
|
|
170
|
-
}, field.target && {
|
|
171
|
-
target: field.target,
|
|
172
|
-
rel: 'noopener'
|
|
173
209
|
});
|
|
174
|
-
|
|
210
|
+
|
|
211
|
+
if (typeof props.target !== "undefined") {
|
|
212
|
+
data.attrs.target = props.target;
|
|
213
|
+
} else if (field.target) {
|
|
214
|
+
data.attrs.target = field.target;
|
|
215
|
+
}
|
|
216
|
+
|
|
217
|
+
if (typeof props.rel !== "undefined") {
|
|
218
|
+
data.attrs.rel = props.rel;
|
|
219
|
+
} else if (data.attrs.target === "_blank") {
|
|
220
|
+
data.attrs.rel = props.blankTargetRelAttribute;
|
|
221
|
+
}
|
|
222
|
+
|
|
223
|
+
return h("a", data, children);
|
|
175
224
|
}
|
|
176
225
|
};
|
|
177
226
|
});
|
|
178
227
|
|
|
179
228
|
var RichText = {
|
|
180
|
-
name:
|
|
229
|
+
name: "PrismicRichText",
|
|
181
230
|
functional: true,
|
|
182
231
|
props: {
|
|
183
232
|
field: {
|
|
184
233
|
type: Array,
|
|
185
234
|
required: true
|
|
186
235
|
},
|
|
236
|
+
linkResolver: {
|
|
237
|
+
type: Function,
|
|
238
|
+
required: false
|
|
239
|
+
},
|
|
187
240
|
htmlSerializer: {
|
|
188
241
|
type: Function,
|
|
189
242
|
required: false
|
|
190
243
|
},
|
|
191
244
|
wrapper: {
|
|
192
|
-
type: String,
|
|
245
|
+
type: [String, Object, Function],
|
|
193
246
|
required: false,
|
|
194
|
-
"default":
|
|
247
|
+
"default": "div"
|
|
195
248
|
}
|
|
196
249
|
},
|
|
197
250
|
render: function render(h, _ref) {
|
|
198
251
|
var props = _ref.props,
|
|
199
252
|
data = _ref.data,
|
|
200
|
-
children = _ref.children,
|
|
201
253
|
parent = _ref.parent;
|
|
202
254
|
var field = props.field,
|
|
255
|
+
linkResolver = props.linkResolver,
|
|
203
256
|
htmlSerializer = props.htmlSerializer,
|
|
204
257
|
wrapper = props.wrapper;
|
|
205
258
|
|
|
@@ -207,7 +260,7 @@
|
|
|
207
260
|
return null;
|
|
208
261
|
}
|
|
209
262
|
|
|
210
|
-
var innerHTML = PrismicDom.RichText.asHtml(field, parent.$prismic.linkResolver, htmlSerializer
|
|
263
|
+
var innerHTML = PrismicDom.RichText.asHtml(field, linkResolver ? linkResolver : parent.$prismic ? parent.$prismic.linkResolver : undefined, htmlSerializer ? htmlSerializer : parent.$prismic ? parent.$prismic.htmlSerializer : undefined);
|
|
211
264
|
return h(wrapper, _objectSpread2(_objectSpread2({}, data), {}, {
|
|
212
265
|
domProps: {
|
|
213
266
|
innerHTML: innerHTML
|
|
@@ -216,17 +269,202 @@
|
|
|
216
269
|
}
|
|
217
270
|
};
|
|
218
271
|
|
|
272
|
+
var Text = {
|
|
273
|
+
name: "PrismicText",
|
|
274
|
+
functional: true,
|
|
275
|
+
props: {
|
|
276
|
+
field: {
|
|
277
|
+
type: Array,
|
|
278
|
+
required: true
|
|
279
|
+
},
|
|
280
|
+
separator: {
|
|
281
|
+
type: String,
|
|
282
|
+
"default": undefined,
|
|
283
|
+
required: false
|
|
284
|
+
},
|
|
285
|
+
wrapper: {
|
|
286
|
+
type: [String, Object, Function],
|
|
287
|
+
required: false,
|
|
288
|
+
"default": "div"
|
|
289
|
+
}
|
|
290
|
+
},
|
|
291
|
+
render: function render(h, _ref) {
|
|
292
|
+
var props = _ref.props,
|
|
293
|
+
data = _ref.data;
|
|
294
|
+
_ref.children;
|
|
295
|
+
_ref.parent;
|
|
296
|
+
var field = props.field,
|
|
297
|
+
separator = props.separator,
|
|
298
|
+
wrapper = props.wrapper;
|
|
299
|
+
|
|
300
|
+
if (!field) {
|
|
301
|
+
return null;
|
|
302
|
+
}
|
|
303
|
+
|
|
304
|
+
var innerHTML = PrismicDom.RichText.asText(field, separator);
|
|
305
|
+
return h(wrapper, _objectSpread2(_objectSpread2({}, data), {}, {
|
|
306
|
+
domProps: {
|
|
307
|
+
innerHTML: innerHTML
|
|
308
|
+
}
|
|
309
|
+
}));
|
|
310
|
+
}
|
|
311
|
+
};
|
|
312
|
+
|
|
313
|
+
// We need to polyfill process if it doesn't exist, such as in the browser.
|
|
314
|
+
if (typeof process === "undefined") {
|
|
315
|
+
globalThis.process = {
|
|
316
|
+
env: {}
|
|
317
|
+
};
|
|
318
|
+
}
|
|
319
|
+
/**
|
|
320
|
+
* `true` if in the production environment, `false` otherwise.
|
|
321
|
+
*
|
|
322
|
+
* This boolean can be used to perform actions only in development environments,
|
|
323
|
+
* such as logging.
|
|
324
|
+
*/
|
|
325
|
+
|
|
326
|
+
|
|
327
|
+
var __PRODUCTION__ = process.env.NODE_ENV === "production";
|
|
328
|
+
|
|
329
|
+
var getSliceComponentProps = function getSliceComponentProps(propsHint) {
|
|
330
|
+
return {
|
|
331
|
+
slice: {
|
|
332
|
+
type: Object,
|
|
333
|
+
required: true
|
|
334
|
+
},
|
|
335
|
+
index: {
|
|
336
|
+
type: Number,
|
|
337
|
+
required: true
|
|
338
|
+
},
|
|
339
|
+
slices: {
|
|
340
|
+
type: Array,
|
|
341
|
+
required: true
|
|
342
|
+
},
|
|
343
|
+
context: {
|
|
344
|
+
type: null,
|
|
345
|
+
required: true
|
|
346
|
+
}
|
|
347
|
+
};
|
|
348
|
+
};
|
|
349
|
+
var TODOSliceComponent = __PRODUCTION__ ? null : {
|
|
350
|
+
name: "TODOSliceComponent",
|
|
351
|
+
functional: true,
|
|
352
|
+
props: getSliceComponentProps(),
|
|
353
|
+
render: function render(h, _ref) {
|
|
354
|
+
var props = _ref.props,
|
|
355
|
+
data = _ref.data;
|
|
356
|
+
console.warn("[SliceZone] Could not find a component for Slice type \"".concat(props.slice.slice_type, "\""), props.slice);
|
|
357
|
+
return h("section", _objectSpread2(_objectSpread2({}, data), {}, {
|
|
358
|
+
attrs: _objectSpread2(_objectSpread2({}, data.attrs), {}, {
|
|
359
|
+
"data-slice-zone-todo-component": "",
|
|
360
|
+
"data-slice-type": props.slice.slice_type
|
|
361
|
+
})
|
|
362
|
+
}), ["Could not find a component for Slice type \"".concat(props.slice.slice_type, "\"")]);
|
|
363
|
+
}
|
|
364
|
+
}; // Just mimiced to prevent confusion but doesn't provide any value with version 2 of this kit
|
|
365
|
+
|
|
366
|
+
var defineSliceZoneComponents = function defineSliceZoneComponents(components) {
|
|
367
|
+
return components;
|
|
368
|
+
};
|
|
369
|
+
var SliceZone = {
|
|
370
|
+
name: "SliceZone",
|
|
371
|
+
props: {
|
|
372
|
+
slices: {
|
|
373
|
+
type: Array,
|
|
374
|
+
required: true
|
|
375
|
+
},
|
|
376
|
+
components: {
|
|
377
|
+
type: Object,
|
|
378
|
+
"default": undefined,
|
|
379
|
+
required: false
|
|
380
|
+
},
|
|
381
|
+
resolver: {
|
|
382
|
+
type: Function,
|
|
383
|
+
"default": undefined,
|
|
384
|
+
required: false
|
|
385
|
+
},
|
|
386
|
+
context: {
|
|
387
|
+
type: null,
|
|
388
|
+
"default": undefined,
|
|
389
|
+
required: false
|
|
390
|
+
},
|
|
391
|
+
defaultComponent: {
|
|
392
|
+
type: Object,
|
|
393
|
+
"default": undefined,
|
|
394
|
+
required: false
|
|
395
|
+
},
|
|
396
|
+
wrapper: {
|
|
397
|
+
type: [String, Object, Function],
|
|
398
|
+
"default": "div",
|
|
399
|
+
required: false
|
|
400
|
+
}
|
|
401
|
+
},
|
|
402
|
+
computed: {
|
|
403
|
+
renderedSlices: function renderedSlices() {
|
|
404
|
+
var _this = this;
|
|
405
|
+
|
|
406
|
+
if (!this.slices) {
|
|
407
|
+
return null;
|
|
408
|
+
}
|
|
409
|
+
|
|
410
|
+
return this.slices.map(function (slice, index) {
|
|
411
|
+
var component = _this.components && slice.slice_type in _this.components ? _this.components[slice.slice_type] : _this.defaultComponent || TODOSliceComponent; // TODO: Remove `resolver` in v3 in favor of `components`.
|
|
412
|
+
|
|
413
|
+
if (_this.resolver) {
|
|
414
|
+
var resolvedComponent = _this.resolver({
|
|
415
|
+
slice: slice,
|
|
416
|
+
sliceName: slice.slice_type,
|
|
417
|
+
i: index
|
|
418
|
+
});
|
|
419
|
+
|
|
420
|
+
if (resolvedComponent) {
|
|
421
|
+
component = resolvedComponent;
|
|
422
|
+
}
|
|
423
|
+
}
|
|
424
|
+
|
|
425
|
+
var p = {
|
|
426
|
+
key: "".concat(slice.slice_type, "-").concat(index),
|
|
427
|
+
props: {
|
|
428
|
+
slice: slice,
|
|
429
|
+
index: index,
|
|
430
|
+
context: _this.context,
|
|
431
|
+
slices: _this.slices
|
|
432
|
+
}
|
|
433
|
+
};
|
|
434
|
+
return {
|
|
435
|
+
component: component,
|
|
436
|
+
p: p
|
|
437
|
+
};
|
|
438
|
+
});
|
|
439
|
+
}
|
|
440
|
+
},
|
|
441
|
+
render: function render(h) {
|
|
442
|
+
// Prevent fatal if user didn't check for field, throws `Invalid prop` warn
|
|
443
|
+
if (!this.slices) {
|
|
444
|
+
return null;
|
|
445
|
+
}
|
|
446
|
+
|
|
447
|
+
return h(this.wrapper, this.renderedSlices.map(function (_ref2) {
|
|
448
|
+
var component = _ref2.component,
|
|
449
|
+
p = _ref2.p;
|
|
450
|
+
return h(component, p);
|
|
451
|
+
}));
|
|
452
|
+
}
|
|
453
|
+
};
|
|
454
|
+
|
|
219
455
|
var NuxtLink = Link({
|
|
220
|
-
component:
|
|
456
|
+
component: "nuxt-link"
|
|
221
457
|
});
|
|
222
458
|
var VueRouterLink = Link({
|
|
223
|
-
component:
|
|
459
|
+
component: "router-link"
|
|
224
460
|
});
|
|
225
461
|
var exp = {
|
|
226
462
|
common: {
|
|
227
463
|
Embed: Embed,
|
|
228
464
|
Image: Image,
|
|
229
|
-
RichText: RichText
|
|
465
|
+
RichText: RichText,
|
|
466
|
+
Text: Text,
|
|
467
|
+
SliceZone: SliceZone
|
|
230
468
|
},
|
|
231
469
|
nuxt: {
|
|
232
470
|
Link: NuxtLink
|
|
@@ -235,16 +473,21 @@
|
|
|
235
473
|
Link: VueRouterLink
|
|
236
474
|
}
|
|
237
475
|
};
|
|
476
|
+
exp.common;
|
|
477
|
+
exp.nuxt;
|
|
478
|
+
exp.vueRouter;
|
|
238
479
|
|
|
239
|
-
var common
|
|
240
|
-
var nuxt
|
|
241
|
-
var vueRouter
|
|
480
|
+
var common = exp.common;
|
|
481
|
+
var nuxt = exp.nuxt;
|
|
482
|
+
var vueRouter = exp.vueRouter;
|
|
242
483
|
|
|
243
|
-
exports.common = common
|
|
244
|
-
exports
|
|
245
|
-
exports.
|
|
246
|
-
exports.
|
|
484
|
+
exports.common = common;
|
|
485
|
+
exports["default"] = exp;
|
|
486
|
+
exports.defineSliceZoneComponents = defineSliceZoneComponents;
|
|
487
|
+
exports.getSliceComponentProps = getSliceComponentProps;
|
|
488
|
+
exports.nuxt = nuxt;
|
|
489
|
+
exports.vueRouter = vueRouter;
|
|
247
490
|
|
|
248
491
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
249
492
|
|
|
250
|
-
}))
|
|
493
|
+
}));
|