@prismicio/vue 2.0.8 → 2.1.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/LICENSE +202 -0
- package/README.md +81 -149
- package/components/common.js +481 -0
- package/components/index.js +468 -0
- package/components/umd.js +485 -0
- package/dist/prismic-vue.common.js +281 -52
- package/dist/prismic-vue.esm.js +274 -47
- package/dist/prismic-vue.js +285 -56
- package/dist/prismic-vue.min.js +1 -1
- package/package.json +51 -41
- package/src/components/Link.js +87 -54
- package/src/components/RichText.js +40 -41
- package/src/components/SliceZone.js +144 -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 +46 -39
- package/.babelrc +0 -7
- package/.editorconfig +0 -12
- package/rollup.config.js +0 -72
- package/stats.html +0 -4318
package/dist/prismic-vue.esm.js
CHANGED
|
@@ -1,29 +1,18 @@
|
|
|
1
|
-
import PrismicDOM, { RichText } from 'prismic-dom';
|
|
2
1
|
import prismicJS from '@prismicio/client';
|
|
3
|
-
|
|
4
|
-
function _defineProperty(obj, key, value) {
|
|
5
|
-
if (key in obj) {
|
|
6
|
-
Object.defineProperty(obj, key, {
|
|
7
|
-
value: value,
|
|
8
|
-
enumerable: true,
|
|
9
|
-
configurable: true,
|
|
10
|
-
writable: true
|
|
11
|
-
});
|
|
12
|
-
} else {
|
|
13
|
-
obj[key] = value;
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
return obj;
|
|
17
|
-
}
|
|
2
|
+
import PrismicDOM, { RichText as RichText$1 } from 'prismic-dom';
|
|
18
3
|
|
|
19
4
|
function ownKeys(object, enumerableOnly) {
|
|
20
5
|
var keys = Object.keys(object);
|
|
21
6
|
|
|
22
7
|
if (Object.getOwnPropertySymbols) {
|
|
23
8
|
var symbols = Object.getOwnPropertySymbols(object);
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
9
|
+
|
|
10
|
+
if (enumerableOnly) {
|
|
11
|
+
symbols = symbols.filter(function (sym) {
|
|
12
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
13
|
+
});
|
|
14
|
+
}
|
|
15
|
+
|
|
27
16
|
keys.push.apply(keys, symbols);
|
|
28
17
|
}
|
|
29
18
|
|
|
@@ -50,6 +39,21 @@ function _objectSpread2(target) {
|
|
|
50
39
|
return target;
|
|
51
40
|
}
|
|
52
41
|
|
|
42
|
+
function _defineProperty(obj, key, value) {
|
|
43
|
+
if (key in obj) {
|
|
44
|
+
Object.defineProperty(obj, key, {
|
|
45
|
+
value: value,
|
|
46
|
+
enumerable: true,
|
|
47
|
+
configurable: true,
|
|
48
|
+
writable: true
|
|
49
|
+
});
|
|
50
|
+
} else {
|
|
51
|
+
obj[key] = value;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
return obj;
|
|
55
|
+
}
|
|
56
|
+
|
|
53
57
|
function _slicedToArray(arr, i) {
|
|
54
58
|
return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
|
|
55
59
|
}
|
|
@@ -59,14 +63,17 @@ function _arrayWithHoles(arr) {
|
|
|
59
63
|
}
|
|
60
64
|
|
|
61
65
|
function _iterableToArrayLimit(arr, i) {
|
|
62
|
-
|
|
66
|
+
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
|
|
67
|
+
|
|
68
|
+
if (_i == null) return;
|
|
63
69
|
var _arr = [];
|
|
64
70
|
var _n = true;
|
|
65
71
|
var _d = false;
|
|
66
|
-
|
|
72
|
+
|
|
73
|
+
var _s, _e;
|
|
67
74
|
|
|
68
75
|
try {
|
|
69
|
-
for (
|
|
76
|
+
for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
|
|
70
77
|
_arr.push(_s.value);
|
|
71
78
|
|
|
72
79
|
if (i && _arr.length === i) break;
|
|
@@ -178,11 +185,24 @@ var Image = {
|
|
|
178
185
|
}
|
|
179
186
|
};
|
|
180
187
|
|
|
188
|
+
var isInternalURL = function isInternalURL(url) {
|
|
189
|
+
/**
|
|
190
|
+
* @see Regex101 expression: {@link https://regex101.com/r/1y7iod/1}
|
|
191
|
+
*/
|
|
192
|
+
var isInternal = /^\/(?!\/)/.test(url);
|
|
193
|
+
/**
|
|
194
|
+
* @see Regex101 expression: {@link https://regex101.com/r/RnUseS/1}
|
|
195
|
+
*/
|
|
196
|
+
|
|
197
|
+
var isSpecialLink = !isInternal && !/^https?:\/\//i.test(url);
|
|
198
|
+
return isInternal && !isSpecialLink;
|
|
199
|
+
};
|
|
200
|
+
|
|
181
201
|
var Link = (function (_ref) {
|
|
182
202
|
var _ref$component = _ref.component,
|
|
183
|
-
component = _ref$component === void 0 ?
|
|
203
|
+
component = _ref$component === void 0 ? "a" : _ref$component;
|
|
184
204
|
return {
|
|
185
|
-
name:
|
|
205
|
+
name: "PrismicLink",
|
|
186
206
|
functional: true,
|
|
187
207
|
props: {
|
|
188
208
|
field: {
|
|
@@ -191,10 +211,22 @@ var Link = (function (_ref) {
|
|
|
191
211
|
},
|
|
192
212
|
linkResolver: {
|
|
193
213
|
type: Function,
|
|
194
|
-
required: false
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
214
|
+
required: false
|
|
215
|
+
},
|
|
216
|
+
target: {
|
|
217
|
+
type: String,
|
|
218
|
+
"default": undefined,
|
|
219
|
+
required: false
|
|
220
|
+
},
|
|
221
|
+
rel: {
|
|
222
|
+
type: String,
|
|
223
|
+
"default": undefined,
|
|
224
|
+
required: false
|
|
225
|
+
},
|
|
226
|
+
blankTargetRelAttribute: {
|
|
227
|
+
type: String,
|
|
228
|
+
"default": "noopener",
|
|
229
|
+
required: false
|
|
198
230
|
}
|
|
199
231
|
},
|
|
200
232
|
render: function render(h, _ref2) {
|
|
@@ -209,9 +241,11 @@ var Link = (function (_ref) {
|
|
|
209
241
|
return null;
|
|
210
242
|
}
|
|
211
243
|
|
|
212
|
-
var url = parent.$prismic ? parent.$prismic.asLink(field, linkResolver) : PrismicDOM.Link.url(field, linkResolver)
|
|
244
|
+
var url = parent.$prismic ? parent.$prismic.asLink(field, linkResolver) : PrismicDOM.Link.url(field, linkResolver || function () {
|
|
245
|
+
return null;
|
|
246
|
+
});
|
|
213
247
|
|
|
214
|
-
if (url
|
|
248
|
+
if (isInternalURL(url) && !props.target) {
|
|
215
249
|
data.props = data.props || {};
|
|
216
250
|
data.props.to = url;
|
|
217
251
|
return h(component, data, children);
|
|
@@ -219,23 +253,33 @@ var Link = (function (_ref) {
|
|
|
219
253
|
|
|
220
254
|
data.attrs = _objectSpread2(_objectSpread2({}, data.attrs), {}, {
|
|
221
255
|
href: url
|
|
222
|
-
}, field.target && {
|
|
223
|
-
target: field.target,
|
|
224
|
-
rel: 'noopener'
|
|
225
256
|
});
|
|
226
|
-
|
|
257
|
+
|
|
258
|
+
if (typeof props.target !== "undefined" || field.target) {
|
|
259
|
+
data.attrs.target = typeof props.target !== "undefined" ? props.target : field.target;
|
|
260
|
+
|
|
261
|
+
if (data.attrs.target === "_blank") {
|
|
262
|
+
data.attrs.rel = typeof props.rel !== "undefined" ? props.rel : props.blankTargetRelAttribute;
|
|
263
|
+
}
|
|
264
|
+
}
|
|
265
|
+
|
|
266
|
+
return h("a", data, children);
|
|
227
267
|
}
|
|
228
268
|
};
|
|
229
269
|
});
|
|
230
270
|
|
|
231
|
-
var RichText
|
|
232
|
-
name:
|
|
271
|
+
var RichText = {
|
|
272
|
+
name: "PrismicRichText",
|
|
233
273
|
functional: true,
|
|
234
274
|
props: {
|
|
235
275
|
field: {
|
|
236
276
|
type: Array,
|
|
237
277
|
required: true
|
|
238
278
|
},
|
|
279
|
+
linkResolver: {
|
|
280
|
+
type: Function,
|
|
281
|
+
required: false
|
|
282
|
+
},
|
|
239
283
|
htmlSerializer: {
|
|
240
284
|
type: Function,
|
|
241
285
|
required: false
|
|
@@ -243,15 +287,15 @@ var RichText$1 = {
|
|
|
243
287
|
wrapper: {
|
|
244
288
|
type: String,
|
|
245
289
|
required: false,
|
|
246
|
-
"default":
|
|
290
|
+
"default": "div"
|
|
247
291
|
}
|
|
248
292
|
},
|
|
249
293
|
render: function render(h, _ref) {
|
|
250
294
|
var props = _ref.props,
|
|
251
295
|
data = _ref.data,
|
|
252
|
-
children = _ref.children,
|
|
253
296
|
parent = _ref.parent;
|
|
254
297
|
var field = props.field,
|
|
298
|
+
linkResolver = props.linkResolver,
|
|
255
299
|
htmlSerializer = props.htmlSerializer,
|
|
256
300
|
wrapper = props.wrapper;
|
|
257
301
|
|
|
@@ -259,7 +303,48 @@ var RichText$1 = {
|
|
|
259
303
|
return null;
|
|
260
304
|
}
|
|
261
305
|
|
|
262
|
-
var innerHTML = RichText.asHtml(field, parent.$prismic.linkResolver, htmlSerializer || parent.$prismic.htmlSerializer);
|
|
306
|
+
var innerHTML = RichText$1.asHtml(field, linkResolver || parent.$prismic.linkResolver, htmlSerializer || parent.$prismic.htmlSerializer);
|
|
307
|
+
return h(wrapper, _objectSpread2(_objectSpread2({}, data), {}, {
|
|
308
|
+
domProps: {
|
|
309
|
+
innerHTML: innerHTML
|
|
310
|
+
}
|
|
311
|
+
}));
|
|
312
|
+
}
|
|
313
|
+
};
|
|
314
|
+
|
|
315
|
+
var Text = {
|
|
316
|
+
name: "PrismicText",
|
|
317
|
+
functional: true,
|
|
318
|
+
props: {
|
|
319
|
+
field: {
|
|
320
|
+
type: Array,
|
|
321
|
+
required: true
|
|
322
|
+
},
|
|
323
|
+
separator: {
|
|
324
|
+
type: String,
|
|
325
|
+
"default": undefined,
|
|
326
|
+
required: false
|
|
327
|
+
},
|
|
328
|
+
wrapper: {
|
|
329
|
+
type: String,
|
|
330
|
+
required: false,
|
|
331
|
+
"default": "div"
|
|
332
|
+
}
|
|
333
|
+
},
|
|
334
|
+
render: function render(h, _ref) {
|
|
335
|
+
var props = _ref.props,
|
|
336
|
+
data = _ref.data;
|
|
337
|
+
_ref.children;
|
|
338
|
+
_ref.parent;
|
|
339
|
+
var field = props.field,
|
|
340
|
+
separator = props.separator,
|
|
341
|
+
wrapper = props.wrapper;
|
|
342
|
+
|
|
343
|
+
if (!field) {
|
|
344
|
+
return null;
|
|
345
|
+
}
|
|
346
|
+
|
|
347
|
+
var innerHTML = RichText$1.asText(field, separator);
|
|
263
348
|
return h(wrapper, _objectSpread2(_objectSpread2({}, data), {}, {
|
|
264
349
|
domProps: {
|
|
265
350
|
innerHTML: innerHTML
|
|
@@ -268,17 +353,158 @@ var RichText$1 = {
|
|
|
268
353
|
}
|
|
269
354
|
};
|
|
270
355
|
|
|
356
|
+
// We need to polyfill process if it doesn't exist, such as in the browser.
|
|
357
|
+
if (typeof process === "undefined") {
|
|
358
|
+
globalThis.process = {
|
|
359
|
+
env: {}
|
|
360
|
+
};
|
|
361
|
+
}
|
|
362
|
+
/**
|
|
363
|
+
* `true` if in the production environment, `false` otherwise.
|
|
364
|
+
*
|
|
365
|
+
* This boolean can be used to perform actions only in development environments,
|
|
366
|
+
* such as logging.
|
|
367
|
+
*/
|
|
368
|
+
|
|
369
|
+
|
|
370
|
+
var __PRODUCTION__ = process.env.NODE_ENV === "production";
|
|
371
|
+
|
|
372
|
+
var getSliceComponentProps = function getSliceComponentProps(propsHint) {
|
|
373
|
+
return {
|
|
374
|
+
slice: {
|
|
375
|
+
type: Object,
|
|
376
|
+
required: true
|
|
377
|
+
},
|
|
378
|
+
index: {
|
|
379
|
+
type: Number,
|
|
380
|
+
required: true
|
|
381
|
+
},
|
|
382
|
+
slices: {
|
|
383
|
+
type: Array,
|
|
384
|
+
required: true
|
|
385
|
+
},
|
|
386
|
+
context: {
|
|
387
|
+
type: null,
|
|
388
|
+
required: true
|
|
389
|
+
}
|
|
390
|
+
};
|
|
391
|
+
};
|
|
392
|
+
var TODOSliceComponent = __PRODUCTION__ ? function () {
|
|
393
|
+
return null;
|
|
394
|
+
} : {
|
|
395
|
+
name: "TODOSliceCOmponent",
|
|
396
|
+
functional: true,
|
|
397
|
+
props: getSliceComponentProps(),
|
|
398
|
+
renfer: function renfer(h, _ref) {
|
|
399
|
+
var props = _ref.props,
|
|
400
|
+
data = _ref.data;
|
|
401
|
+
console.warn("[SliceZone] Could not find a component for Slice type \"".concat(props.slice.slice_type, "\""), props.slice);
|
|
402
|
+
return function () {
|
|
403
|
+
return h("section", _objectSpread2(_objectSpread2({}, data), {}, {
|
|
404
|
+
"data-slice-zone-todo-component": "",
|
|
405
|
+
"data-slice-type": props.slice.slice_type
|
|
406
|
+
}), ["Could not find a component for Slice type \"".concat(props.slice.slice_type, "\"")]);
|
|
407
|
+
};
|
|
408
|
+
}
|
|
409
|
+
}; // Just mimiced to prevent confusion but doesn't provide any value with version 2 of this kit
|
|
410
|
+
var SliceZone = {
|
|
411
|
+
name: "SliceZone",
|
|
412
|
+
functional: true,
|
|
413
|
+
props: {
|
|
414
|
+
slices: {
|
|
415
|
+
type: Array,
|
|
416
|
+
required: true
|
|
417
|
+
},
|
|
418
|
+
components: {
|
|
419
|
+
type: Object,
|
|
420
|
+
"default": undefined,
|
|
421
|
+
required: false
|
|
422
|
+
},
|
|
423
|
+
resolver: {
|
|
424
|
+
type: Function,
|
|
425
|
+
"default": undefined,
|
|
426
|
+
required: false
|
|
427
|
+
},
|
|
428
|
+
context: {
|
|
429
|
+
type: null,
|
|
430
|
+
"default": undefined,
|
|
431
|
+
required: false
|
|
432
|
+
},
|
|
433
|
+
defaultComponent: {
|
|
434
|
+
type: Object,
|
|
435
|
+
"default": undefined,
|
|
436
|
+
required: false
|
|
437
|
+
},
|
|
438
|
+
wrapper: {
|
|
439
|
+
type: [String, Object, Function],
|
|
440
|
+
"default": "div",
|
|
441
|
+
required: false
|
|
442
|
+
}
|
|
443
|
+
},
|
|
444
|
+
render: function render(h, _ref2) {
|
|
445
|
+
var props = _ref2.props,
|
|
446
|
+
data = _ref2.data;
|
|
447
|
+
|
|
448
|
+
// Prevent fatal if user didn't check for field, throws `Invalid prop` warn
|
|
449
|
+
if (!props.slices) {
|
|
450
|
+
return function () {
|
|
451
|
+
return null;
|
|
452
|
+
};
|
|
453
|
+
}
|
|
454
|
+
|
|
455
|
+
var renderedSlices = computed(function () {
|
|
456
|
+
return props.slices.map(function (slice, index) {
|
|
457
|
+
var component = props.components && slice.slice_type in props.components ? props.components[slice.slice_type] : props.defaultComponent || TODOSliceComponent; // TODO: Remove `resolver` in v3 in favor of `components`.
|
|
458
|
+
|
|
459
|
+
if (props.resolver) {
|
|
460
|
+
var resolvedComponent = props.resolver({
|
|
461
|
+
slice: slice,
|
|
462
|
+
sliceName: slice.slice_type,
|
|
463
|
+
i: index
|
|
464
|
+
});
|
|
465
|
+
|
|
466
|
+
if (resolvedComponent) {
|
|
467
|
+
component = resolvedComponent;
|
|
468
|
+
}
|
|
469
|
+
}
|
|
470
|
+
|
|
471
|
+
var p = {
|
|
472
|
+
key: "".concat(slice.slice_type, "-").concat(index),
|
|
473
|
+
slice: slice,
|
|
474
|
+
index: index,
|
|
475
|
+
context: props.context,
|
|
476
|
+
slices: props.slices
|
|
477
|
+
};
|
|
478
|
+
return h(component, p);
|
|
479
|
+
});
|
|
480
|
+
});
|
|
481
|
+
var parent = props.wrapper;
|
|
482
|
+
|
|
483
|
+
if (typeof parent === "string") {
|
|
484
|
+
return h(parent, data, renderedSlices.value);
|
|
485
|
+
} else {
|
|
486
|
+
return h(parent, data, {
|
|
487
|
+
"default": function _default() {
|
|
488
|
+
return renderedSlices.value;
|
|
489
|
+
}
|
|
490
|
+
});
|
|
491
|
+
}
|
|
492
|
+
}
|
|
493
|
+
};
|
|
494
|
+
|
|
271
495
|
var NuxtLink = Link({
|
|
272
|
-
component:
|
|
496
|
+
component: "nuxt-link"
|
|
273
497
|
});
|
|
274
498
|
var VueRouterLink = Link({
|
|
275
|
-
component:
|
|
499
|
+
component: "router-link"
|
|
276
500
|
});
|
|
277
501
|
var exp = {
|
|
278
502
|
common: {
|
|
279
503
|
Embed: Embed,
|
|
280
504
|
Image: Image,
|
|
281
|
-
RichText: RichText
|
|
505
|
+
RichText: RichText,
|
|
506
|
+
Text: Text,
|
|
507
|
+
SliceZone: SliceZone
|
|
282
508
|
},
|
|
283
509
|
nuxt: {
|
|
284
510
|
Link: NuxtLink
|
|
@@ -316,6 +542,7 @@ function attachMethods(Vue, options) {
|
|
|
316
542
|
return asHtml(richText, linkResolver || options.linkResolver, htmlSerializer || options.htmlSerializer);
|
|
317
543
|
};
|
|
318
544
|
|
|
545
|
+
Vue.prototype.$prismic.asHTML = Vue.prototype.$prismic.asHtml;
|
|
319
546
|
Vue.prototype.$prismic.asText = asText;
|
|
320
547
|
Vue.prototype.$prismic.richTextAsPlain = asText;
|
|
321
548
|
Vue.prototype.$prismic.asDate = asDate;
|
|
@@ -328,7 +555,7 @@ function attachMethods(Vue, options) {
|
|
|
328
555
|
var PrismicVue = {
|
|
329
556
|
install: function install(Vue, options) {
|
|
330
557
|
var _options$linkType = options.linkType,
|
|
331
|
-
linkType = _options$linkType === void 0 ?
|
|
558
|
+
linkType = _options$linkType === void 0 ? "vueRouter" : _options$linkType;
|
|
332
559
|
Vue.prototype.$prismic = prismicJS;
|
|
333
560
|
Vue.prototype.$prismic.endpoint = options.endpoint;
|
|
334
561
|
Vue.prototype.$prismic.linkResolver = options.linkResolver;
|
|
@@ -344,13 +571,13 @@ var PrismicVue = {
|
|
|
344
571
|
|
|
345
572
|
|
|
346
573
|
Object.entries(components).forEach(function (_ref) {
|
|
347
|
-
var _ref2 = _slicedToArray(_ref, 2)
|
|
348
|
-
|
|
349
|
-
c = _ref2[1];
|
|
574
|
+
var _ref2 = _slicedToArray(_ref, 2);
|
|
575
|
+
_ref2[0];
|
|
576
|
+
var c = _ref2[1];
|
|
350
577
|
|
|
351
578
|
Vue.component(c.name, c);
|
|
352
579
|
});
|
|
353
580
|
}
|
|
354
581
|
};
|
|
355
582
|
|
|
356
|
-
export default
|
|
583
|
+
export { PrismicVue as default };
|