@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/common.js
CHANGED
|
@@ -2,34 +2,24 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
|
|
6
|
-
|
|
7
5
|
var PrismicDom = require('prismic-dom');
|
|
8
|
-
var PrismicDom__default = _interopDefault(PrismicDom);
|
|
9
6
|
|
|
10
|
-
function
|
|
11
|
-
if (key in obj) {
|
|
12
|
-
Object.defineProperty(obj, key, {
|
|
13
|
-
value: value,
|
|
14
|
-
enumerable: true,
|
|
15
|
-
configurable: true,
|
|
16
|
-
writable: true
|
|
17
|
-
});
|
|
18
|
-
} else {
|
|
19
|
-
obj[key] = value;
|
|
20
|
-
}
|
|
7
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
21
8
|
|
|
22
|
-
|
|
23
|
-
}
|
|
9
|
+
var PrismicDom__default = /*#__PURE__*/_interopDefaultLegacy(PrismicDom);
|
|
24
10
|
|
|
25
11
|
function ownKeys(object, enumerableOnly) {
|
|
26
12
|
var keys = Object.keys(object);
|
|
27
13
|
|
|
28
14
|
if (Object.getOwnPropertySymbols) {
|
|
29
15
|
var symbols = Object.getOwnPropertySymbols(object);
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
16
|
+
|
|
17
|
+
if (enumerableOnly) {
|
|
18
|
+
symbols = symbols.filter(function (sym) {
|
|
19
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
20
|
+
});
|
|
21
|
+
}
|
|
22
|
+
|
|
33
23
|
keys.push.apply(keys, symbols);
|
|
34
24
|
}
|
|
35
25
|
|
|
@@ -56,6 +46,21 @@ function _objectSpread2(target) {
|
|
|
56
46
|
return target;
|
|
57
47
|
}
|
|
58
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
|
+
|
|
59
64
|
var Embed = {
|
|
60
65
|
name: 'PrismicEmbed',
|
|
61
66
|
functional: true,
|
|
@@ -65,7 +70,7 @@ var Embed = {
|
|
|
65
70
|
required: true
|
|
66
71
|
},
|
|
67
72
|
wrapper: {
|
|
68
|
-
type: String,
|
|
73
|
+
type: [String, Object, Function],
|
|
69
74
|
required: false,
|
|
70
75
|
"default": 'div'
|
|
71
76
|
}
|
|
@@ -114,10 +119,15 @@ var Image = {
|
|
|
114
119
|
render: function render(h, _ref) {
|
|
115
120
|
var props = _ref.props,
|
|
116
121
|
data = _ref.data;
|
|
117
|
-
var
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
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;
|
|
121
131
|
return h('img', Object.assign(data, {
|
|
122
132
|
attrs: _objectSpread2(_objectSpread2({}, data.attrs), {}, {
|
|
123
133
|
src: url,
|
|
@@ -128,11 +138,24 @@ var Image = {
|
|
|
128
138
|
}
|
|
129
139
|
};
|
|
130
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
|
+
|
|
131
154
|
var Link = (function (_ref) {
|
|
132
155
|
var _ref$component = _ref.component,
|
|
133
|
-
component = _ref$component === void 0 ?
|
|
156
|
+
component = _ref$component === void 0 ? "a" : _ref$component;
|
|
134
157
|
return {
|
|
135
|
-
name:
|
|
158
|
+
name: "PrismicLink",
|
|
136
159
|
functional: true,
|
|
137
160
|
props: {
|
|
138
161
|
field: {
|
|
@@ -142,6 +165,21 @@ var Link = (function (_ref) {
|
|
|
142
165
|
linkResolver: {
|
|
143
166
|
type: Function,
|
|
144
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
|
|
145
183
|
}
|
|
146
184
|
},
|
|
147
185
|
render: function render(h, _ref2) {
|
|
@@ -156,11 +194,11 @@ var Link = (function (_ref) {
|
|
|
156
194
|
return null;
|
|
157
195
|
}
|
|
158
196
|
|
|
159
|
-
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 () {
|
|
160
198
|
return null;
|
|
161
199
|
});
|
|
162
200
|
|
|
163
|
-
if (url
|
|
201
|
+
if (isInternalURL(url) && !props.target) {
|
|
164
202
|
data.props = data.props || {};
|
|
165
203
|
data.props.to = url;
|
|
166
204
|
return h(component, data, children);
|
|
@@ -168,39 +206,53 @@ var Link = (function (_ref) {
|
|
|
168
206
|
|
|
169
207
|
data.attrs = _objectSpread2(_objectSpread2({}, data.attrs), {}, {
|
|
170
208
|
href: url
|
|
171
|
-
}, field.target && {
|
|
172
|
-
target: field.target,
|
|
173
|
-
rel: 'noopener'
|
|
174
209
|
});
|
|
175
|
-
|
|
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);
|
|
176
224
|
}
|
|
177
225
|
};
|
|
178
226
|
});
|
|
179
227
|
|
|
180
228
|
var RichText = {
|
|
181
|
-
name:
|
|
229
|
+
name: "PrismicRichText",
|
|
182
230
|
functional: true,
|
|
183
231
|
props: {
|
|
184
232
|
field: {
|
|
185
233
|
type: Array,
|
|
186
234
|
required: true
|
|
187
235
|
},
|
|
236
|
+
linkResolver: {
|
|
237
|
+
type: Function,
|
|
238
|
+
required: false
|
|
239
|
+
},
|
|
188
240
|
htmlSerializer: {
|
|
189
241
|
type: Function,
|
|
190
242
|
required: false
|
|
191
243
|
},
|
|
192
244
|
wrapper: {
|
|
193
|
-
type: String,
|
|
245
|
+
type: [String, Object, Function],
|
|
194
246
|
required: false,
|
|
195
|
-
"default":
|
|
247
|
+
"default": "div"
|
|
196
248
|
}
|
|
197
249
|
},
|
|
198
250
|
render: function render(h, _ref) {
|
|
199
251
|
var props = _ref.props,
|
|
200
252
|
data = _ref.data,
|
|
201
|
-
children = _ref.children,
|
|
202
253
|
parent = _ref.parent;
|
|
203
254
|
var field = props.field,
|
|
255
|
+
linkResolver = props.linkResolver,
|
|
204
256
|
htmlSerializer = props.htmlSerializer,
|
|
205
257
|
wrapper = props.wrapper;
|
|
206
258
|
|
|
@@ -208,7 +260,7 @@ var RichText = {
|
|
|
208
260
|
return null;
|
|
209
261
|
}
|
|
210
262
|
|
|
211
|
-
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);
|
|
212
264
|
return h(wrapper, _objectSpread2(_objectSpread2({}, data), {}, {
|
|
213
265
|
domProps: {
|
|
214
266
|
innerHTML: innerHTML
|
|
@@ -217,17 +269,202 @@ var RichText = {
|
|
|
217
269
|
}
|
|
218
270
|
};
|
|
219
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
|
+
|
|
220
455
|
var NuxtLink = Link({
|
|
221
|
-
component:
|
|
456
|
+
component: "nuxt-link"
|
|
222
457
|
});
|
|
223
458
|
var VueRouterLink = Link({
|
|
224
|
-
component:
|
|
459
|
+
component: "router-link"
|
|
225
460
|
});
|
|
226
461
|
var exp = {
|
|
227
462
|
common: {
|
|
228
463
|
Embed: Embed,
|
|
229
464
|
Image: Image,
|
|
230
|
-
RichText: RichText
|
|
465
|
+
RichText: RichText,
|
|
466
|
+
Text: Text,
|
|
467
|
+
SliceZone: SliceZone
|
|
231
468
|
},
|
|
232
469
|
nuxt: {
|
|
233
470
|
Link: NuxtLink
|
|
@@ -236,12 +473,17 @@ var exp = {
|
|
|
236
473
|
Link: VueRouterLink
|
|
237
474
|
}
|
|
238
475
|
};
|
|
476
|
+
exp.common;
|
|
477
|
+
exp.nuxt;
|
|
478
|
+
exp.vueRouter;
|
|
239
479
|
|
|
240
|
-
var common
|
|
241
|
-
var nuxt
|
|
242
|
-
var vueRouter
|
|
480
|
+
var common = exp.common;
|
|
481
|
+
var nuxt = exp.nuxt;
|
|
482
|
+
var vueRouter = exp.vueRouter;
|
|
243
483
|
|
|
244
|
-
exports.common = common
|
|
245
|
-
exports
|
|
246
|
-
exports.
|
|
247
|
-
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;
|