New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@prismicio/vue

Package Overview
Dependencies
Maintainers
19
Versions
59
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@prismicio/vue - npm Package Compare versions

Comparing version 2.0.11 to 2.1.0-alpha.0

LICENSE
src/components/SliceZone.js
src/components/Text.js

316

components/common.js

@@ -5,21 +5,7 @@ 'use strict';

function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
var PrismicDom = require('prismic-dom');
var PrismicDom__default = _interopDefault(PrismicDom);
function _defineProperty(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
return obj;
}
var PrismicDom__default = /*#__PURE__*/_interopDefaultLegacy(PrismicDom);

@@ -31,5 +17,9 @@ function ownKeys(object, enumerableOnly) {

var symbols = Object.getOwnPropertySymbols(object);
if (enumerableOnly) symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
if (enumerableOnly) {
symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
}
keys.push.apply(keys, symbols);

@@ -61,2 +51,17 @@ }

function _defineProperty(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
var Embed = {

@@ -134,7 +139,20 @@ name: 'PrismicEmbed',

var isInternalURL = function isInternalURL(url) {
/**
* @see Regex101 expression: {@link https://regex101.com/r/1y7iod/1}
*/
var isInternal = /^\/(?!\/)/.test(url);
/**
* @see Regex101 expression: {@link https://regex101.com/r/RnUseS/1}
*/
var isSpecialLink = !isInternal && !/^https?:\/\//i.test(url);
return isInternal && !isSpecialLink;
};
var Link = (function (_ref) {
var _ref$component = _ref.component,
component = _ref$component === void 0 ? 'a' : _ref$component;
component = _ref$component === void 0 ? "a" : _ref$component;
return {
name: 'PrismicLink',
name: "PrismicLink",
functional: true,

@@ -149,2 +167,17 @@ props: {

required: false
},
target: {
type: String,
"default": undefined,
required: false
},
rel: {
type: String,
"default": undefined,
required: false
},
blankTargetRelAttribute: {
type: String,
"default": "noopener",
required: false
}

@@ -164,7 +197,7 @@ },

var url = parent.$prismic ? parent.$prismic.asLink(field, linkResolver) : PrismicDom__default.Link.url(field, linkResolver || function () {
var url = parent.$prismic ? parent.$prismic.asLink(field, linkResolver) : PrismicDom__default["default"].Link.url(field, linkResolver || function () {
return null;
});
if (url.indexOf('/') === 0) {
if (isInternalURL(url) && !props.target) {
data.props = data.props || {};

@@ -177,7 +210,13 @@ data.props.to = url;

href: url
}, field.target && {
target: field.target,
rel: 'noopener'
});
return h('a', data, children);
if (typeof props.target !== "undefined" || field.target) {
data.attrs.target = typeof props.target !== "undefined" ? props.target : field.target;
if (data.attrs.target === "_blank") {
data.attrs.rel = typeof props.rel !== "undefined" ? props.rel : props.blankTargetRelAttribute;
}
}
return h("a", data, children);
}

@@ -188,3 +227,3 @@ };

var RichText = {
name: 'PrismicRichText',
name: "PrismicRichText",
functional: true,

@@ -196,2 +235,6 @@ props: {

},
linkResolver: {
type: Function,
required: false
},
htmlSerializer: {

@@ -204,3 +247,3 @@ type: Function,

required: false,
"default": 'div'
"default": "div"
}

@@ -211,5 +254,5 @@ },

data = _ref.data,
children = _ref.children,
parent = _ref.parent;
var field = props.field,
linkResolver = props.linkResolver,
htmlSerializer = props.htmlSerializer,

@@ -222,3 +265,3 @@ wrapper = props.wrapper;

var innerHTML = PrismicDom.RichText.asHtml(field, parent.$prismic.linkResolver, htmlSerializer || parent.$prismic.htmlSerializer);
var innerHTML = PrismicDom.RichText.asHtml(field, linkResolver || parent.$prismic.linkResolver, htmlSerializer || parent.$prismic.htmlSerializer);
return h(wrapper, _objectSpread2(_objectSpread2({}, data), {}, {

@@ -232,7 +275,191 @@ domProps: {

var Text = {
name: "PrismicText",
functional: true,
props: {
field: {
type: Array,
required: true
},
separator: {
type: String,
"default": undefined,
required: false
},
wrapper: {
type: String,
required: false,
"default": "div"
}
},
render: function render(h, _ref) {
var props = _ref.props,
data = _ref.data;
_ref.children;
_ref.parent;
var field = props.field,
separator = props.separator,
wrapper = props.wrapper;
if (!field) {
return null;
}
var innerHTML = PrismicDom.RichText.asText(field, separator);
return h(wrapper, _objectSpread2(_objectSpread2({}, data), {}, {
domProps: {
innerHTML: innerHTML
}
}));
}
};
// We need to polyfill process if it doesn't exist, such as in the browser.
if (typeof process === "undefined") {
globalThis.process = {
env: {}
};
}
/**
* `true` if in the production environment, `false` otherwise.
*
* This boolean can be used to perform actions only in development environments,
* such as logging.
*/
var __PRODUCTION__ = process.env.NODE_ENV === "production";
var getSliceComponentProps = function getSliceComponentProps(propsHint) {
return {
slice: {
type: Object,
required: true
},
index: {
type: Number,
required: true
},
slices: {
type: Array,
required: true
},
context: {
type: null,
required: true
}
};
};
var TODOSliceComponent = __PRODUCTION__ ? function () {
return null;
} : {
name: "TODOSliceCOmponent",
functional: true,
props: getSliceComponentProps(),
renfer: function renfer(h, _ref) {
var props = _ref.props,
data = _ref.data;
console.warn("[SliceZone] Could not find a component for Slice type \"".concat(props.slice.slice_type, "\""), props.slice);
return function () {
return h("section", _objectSpread2(_objectSpread2({}, data), {}, {
"data-slice-zone-todo-component": "",
"data-slice-type": props.slice.slice_type
}), ["Could not find a component for Slice type \"".concat(props.slice.slice_type, "\"")]);
};
}
}; // Just mimiced to prevent confusion but doesn't provide any value with version 2 of this kit
var defineSliceZoneComponents = function defineSliceZoneComponents(components) {
return components;
};
var SliceZone = {
name: "SliceZone",
functional: true,
props: {
slices: {
type: Array,
required: true
},
components: {
type: Object,
"default": undefined,
required: false
},
resolver: {
type: Function,
"default": undefined,
required: false
},
context: {
type: null,
"default": undefined,
required: false
},
defaultComponent: {
type: Object,
"default": undefined,
required: false
},
wrapper: {
type: [String, Object, Function],
"default": "div",
required: false
}
},
render: function render(h, _ref2) {
var props = _ref2.props,
data = _ref2.data;
// Prevent fatal if user didn't check for field, throws `Invalid prop` warn
if (!props.slices) {
return function () {
return null;
};
}
var renderedSlices = computed(function () {
return props.slices.map(function (slice, index) {
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`.
if (props.resolver) {
var resolvedComponent = props.resolver({
slice: slice,
sliceName: slice.slice_type,
i: index
});
if (resolvedComponent) {
component = resolvedComponent;
}
}
var p = {
key: "".concat(slice.slice_type, "-").concat(index),
slice: slice,
index: index,
context: props.context,
slices: props.slices
};
return h(component, p);
});
});
var parent = props.wrapper;
if (typeof parent === "string") {
return h(parent, data, renderedSlices.value);
} else {
return h(parent, data, {
"default": function _default() {
return renderedSlices.value;
}
});
}
}
};
var NuxtLink = Link({
component: 'nuxt-link'
component: "nuxt-link"
});
var VueRouterLink = Link({
component: 'router-link'
component: "router-link"
});

@@ -243,3 +470,5 @@ var exp = {

Image: Image,
RichText: RichText
RichText: RichText,
Text: Text,
SliceZone: SliceZone
},

@@ -253,10 +482,15 @@ nuxt: {

};
exp.common;
exp.nuxt;
exp.vueRouter;
var common$1 = exp.common;
var nuxt$1 = exp.nuxt;
var vueRouter$1 = exp.vueRouter;
var common = exp.common;
var nuxt = exp.nuxt;
var vueRouter = exp.vueRouter;
exports.common = common$1;
exports.nuxt = nuxt$1;
exports.vueRouter = vueRouter$1;
exports.default = exp;
exports.common = common;
exports["default"] = exp;
exports.defineSliceZoneComponents = defineSliceZoneComponents;
exports.getSliceComponentProps = getSliceComponentProps;
exports.nuxt = nuxt;
exports.vueRouter = vueRouter;

308

components/index.js

@@ -1,18 +0,3 @@

import PrismicDom, { RichText } from 'prismic-dom';
import PrismicDom, { RichText as RichText$1 } from 'prismic-dom';
function _defineProperty(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
function ownKeys(object, enumerableOnly) {

@@ -23,5 +8,9 @@ var keys = Object.keys(object);

var symbols = Object.getOwnPropertySymbols(object);
if (enumerableOnly) symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
if (enumerableOnly) {
symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
}
keys.push.apply(keys, symbols);

@@ -53,2 +42,17 @@ }

function _defineProperty(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
var Embed = {

@@ -126,7 +130,20 @@ name: 'PrismicEmbed',

var isInternalURL = function isInternalURL(url) {
/**
* @see Regex101 expression: {@link https://regex101.com/r/1y7iod/1}
*/
var isInternal = /^\/(?!\/)/.test(url);
/**
* @see Regex101 expression: {@link https://regex101.com/r/RnUseS/1}
*/
var isSpecialLink = !isInternal && !/^https?:\/\//i.test(url);
return isInternal && !isSpecialLink;
};
var Link = (function (_ref) {
var _ref$component = _ref.component,
component = _ref$component === void 0 ? 'a' : _ref$component;
component = _ref$component === void 0 ? "a" : _ref$component;
return {
name: 'PrismicLink',
name: "PrismicLink",
functional: true,

@@ -141,2 +158,17 @@ props: {

required: false
},
target: {
type: String,
"default": undefined,
required: false
},
rel: {
type: String,
"default": undefined,
required: false
},
blankTargetRelAttribute: {
type: String,
"default": "noopener",
required: false
}

@@ -160,3 +192,3 @@ },

if (url.indexOf('/') === 0) {
if (isInternalURL(url) && !props.target) {
data.props = data.props || {};

@@ -169,7 +201,13 @@ data.props.to = url;

href: url
}, field.target && {
target: field.target,
rel: 'noopener'
});
return h('a', data, children);
if (typeof props.target !== "undefined" || field.target) {
data.attrs.target = typeof props.target !== "undefined" ? props.target : field.target;
if (data.attrs.target === "_blank") {
data.attrs.rel = typeof props.rel !== "undefined" ? props.rel : props.blankTargetRelAttribute;
}
}
return h("a", data, children);
}

@@ -179,4 +217,4 @@ };

var RichText$1 = {
name: 'PrismicRichText',
var RichText = {
name: "PrismicRichText",
functional: true,

@@ -188,2 +226,6 @@ props: {

},
linkResolver: {
type: Function,
required: false
},
htmlSerializer: {

@@ -196,3 +238,3 @@ type: Function,

required: false,
"default": 'div'
"default": "div"
}

@@ -203,5 +245,5 @@ },

data = _ref.data,
children = _ref.children,
parent = _ref.parent;
var field = props.field,
linkResolver = props.linkResolver,
htmlSerializer = props.htmlSerializer,

@@ -214,3 +256,3 @@ wrapper = props.wrapper;

var innerHTML = RichText.asHtml(field, parent.$prismic.linkResolver, htmlSerializer || parent.$prismic.htmlSerializer);
var innerHTML = RichText$1.asHtml(field, linkResolver || parent.$prismic.linkResolver, htmlSerializer || parent.$prismic.htmlSerializer);
return h(wrapper, _objectSpread2(_objectSpread2({}, data), {}, {

@@ -224,7 +266,191 @@ domProps: {

var Text = {
name: "PrismicText",
functional: true,
props: {
field: {
type: Array,
required: true
},
separator: {
type: String,
"default": undefined,
required: false
},
wrapper: {
type: String,
required: false,
"default": "div"
}
},
render: function render(h, _ref) {
var props = _ref.props,
data = _ref.data;
_ref.children;
_ref.parent;
var field = props.field,
separator = props.separator,
wrapper = props.wrapper;
if (!field) {
return null;
}
var innerHTML = RichText$1.asText(field, separator);
return h(wrapper, _objectSpread2(_objectSpread2({}, data), {}, {
domProps: {
innerHTML: innerHTML
}
}));
}
};
// We need to polyfill process if it doesn't exist, such as in the browser.
if (typeof process === "undefined") {
globalThis.process = {
env: {}
};
}
/**
* `true` if in the production environment, `false` otherwise.
*
* This boolean can be used to perform actions only in development environments,
* such as logging.
*/
var __PRODUCTION__ = process.env.NODE_ENV === "production";
var getSliceComponentProps = function getSliceComponentProps(propsHint) {
return {
slice: {
type: Object,
required: true
},
index: {
type: Number,
required: true
},
slices: {
type: Array,
required: true
},
context: {
type: null,
required: true
}
};
};
var TODOSliceComponent = __PRODUCTION__ ? function () {
return null;
} : {
name: "TODOSliceCOmponent",
functional: true,
props: getSliceComponentProps(),
renfer: function renfer(h, _ref) {
var props = _ref.props,
data = _ref.data;
console.warn("[SliceZone] Could not find a component for Slice type \"".concat(props.slice.slice_type, "\""), props.slice);
return function () {
return h("section", _objectSpread2(_objectSpread2({}, data), {}, {
"data-slice-zone-todo-component": "",
"data-slice-type": props.slice.slice_type
}), ["Could not find a component for Slice type \"".concat(props.slice.slice_type, "\"")]);
};
}
}; // Just mimiced to prevent confusion but doesn't provide any value with version 2 of this kit
var defineSliceZoneComponents = function defineSliceZoneComponents(components) {
return components;
};
var SliceZone = {
name: "SliceZone",
functional: true,
props: {
slices: {
type: Array,
required: true
},
components: {
type: Object,
"default": undefined,
required: false
},
resolver: {
type: Function,
"default": undefined,
required: false
},
context: {
type: null,
"default": undefined,
required: false
},
defaultComponent: {
type: Object,
"default": undefined,
required: false
},
wrapper: {
type: [String, Object, Function],
"default": "div",
required: false
}
},
render: function render(h, _ref2) {
var props = _ref2.props,
data = _ref2.data;
// Prevent fatal if user didn't check for field, throws `Invalid prop` warn
if (!props.slices) {
return function () {
return null;
};
}
var renderedSlices = computed(function () {
return props.slices.map(function (slice, index) {
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`.
if (props.resolver) {
var resolvedComponent = props.resolver({
slice: slice,
sliceName: slice.slice_type,
i: index
});
if (resolvedComponent) {
component = resolvedComponent;
}
}
var p = {
key: "".concat(slice.slice_type, "-").concat(index),
slice: slice,
index: index,
context: props.context,
slices: props.slices
};
return h(component, p);
});
});
var parent = props.wrapper;
if (typeof parent === "string") {
return h(parent, data, renderedSlices.value);
} else {
return h(parent, data, {
"default": function _default() {
return renderedSlices.value;
}
});
}
}
};
var NuxtLink = Link({
component: 'nuxt-link'
component: "nuxt-link"
});
var VueRouterLink = Link({
component: 'router-link'
component: "router-link"
});

@@ -235,3 +461,5 @@ var exp = {

Image: Image,
RichText: RichText$1
RichText: RichText,
Text: Text,
SliceZone: SliceZone
},

@@ -245,8 +473,10 @@ nuxt: {

};
exp.common;
exp.nuxt;
exp.vueRouter;
var common$1 = exp.common;
var nuxt$1 = exp.nuxt;
var vueRouter$1 = exp.vueRouter;
var common = exp.common;
var nuxt = exp.nuxt;
var vueRouter = exp.vueRouter;
export default exp;
export { common$1 as common, nuxt$1 as nuxt, vueRouter$1 as vueRouter };
export { common, exp as default, defineSliceZoneComponents, getSliceComponentProps, nuxt, vueRouter };

321

components/umd.js
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('prismic-dom')) :
typeof define === 'function' && define.amd ? define(['exports', 'prismic-dom'], factory) :
(factory((global.PrismicVueComponents = {}),global.prismicDOM));
}(this, (function (exports,PrismicDom) { 'use strict';
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.PrismicVueComponents = {}, global.prismicDOM));
})(this, (function (exports, PrismicDom) { 'use strict';
var PrismicDom__default = 'default' in PrismicDom ? PrismicDom['default'] : PrismicDom;
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
function _defineProperty(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
var PrismicDom__default = /*#__PURE__*/_interopDefaultLegacy(PrismicDom);
return obj;
}
function ownKeys(object, enumerableOnly) {

@@ -29,5 +16,9 @@ var keys = Object.keys(object);

var symbols = Object.getOwnPropertySymbols(object);
if (enumerableOnly) symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
if (enumerableOnly) {
symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
}
keys.push.apply(keys, symbols);

@@ -59,2 +50,17 @@ }

function _defineProperty(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
var Embed = {

@@ -132,7 +138,20 @@ name: 'PrismicEmbed',

var isInternalURL = function isInternalURL(url) {
/**
* @see Regex101 expression: {@link https://regex101.com/r/1y7iod/1}
*/
var isInternal = /^\/(?!\/)/.test(url);
/**
* @see Regex101 expression: {@link https://regex101.com/r/RnUseS/1}
*/
var isSpecialLink = !isInternal && !/^https?:\/\//i.test(url);
return isInternal && !isSpecialLink;
};
var Link = (function (_ref) {
var _ref$component = _ref.component,
component = _ref$component === void 0 ? 'a' : _ref$component;
component = _ref$component === void 0 ? "a" : _ref$component;
return {
name: 'PrismicLink',
name: "PrismicLink",
functional: true,

@@ -147,2 +166,17 @@ props: {

required: false
},
target: {
type: String,
"default": undefined,
required: false
},
rel: {
type: String,
"default": undefined,
required: false
},
blankTargetRelAttribute: {
type: String,
"default": "noopener",
required: false
}

@@ -162,7 +196,7 @@ },

var url = parent.$prismic ? parent.$prismic.asLink(field, linkResolver) : PrismicDom__default.Link.url(field, linkResolver || function () {
var url = parent.$prismic ? parent.$prismic.asLink(field, linkResolver) : PrismicDom__default["default"].Link.url(field, linkResolver || function () {
return null;
});
if (url.indexOf('/') === 0) {
if (isInternalURL(url) && !props.target) {
data.props = data.props || {};

@@ -175,7 +209,13 @@ data.props.to = url;

href: url
}, field.target && {
target: field.target,
rel: 'noopener'
});
return h('a', data, children);
if (typeof props.target !== "undefined" || field.target) {
data.attrs.target = typeof props.target !== "undefined" ? props.target : field.target;
if (data.attrs.target === "_blank") {
data.attrs.rel = typeof props.rel !== "undefined" ? props.rel : props.blankTargetRelAttribute;
}
}
return h("a", data, children);
}

@@ -186,3 +226,3 @@ };

var RichText = {
name: 'PrismicRichText',
name: "PrismicRichText",
functional: true,

@@ -194,2 +234,6 @@ props: {

},
linkResolver: {
type: Function,
required: false
},
htmlSerializer: {

@@ -202,3 +246,3 @@ type: Function,

required: false,
"default": 'div'
"default": "div"
}

@@ -209,5 +253,5 @@ },

data = _ref.data,
children = _ref.children,
parent = _ref.parent;
var field = props.field,
linkResolver = props.linkResolver,
htmlSerializer = props.htmlSerializer,

@@ -220,3 +264,3 @@ wrapper = props.wrapper;

var innerHTML = PrismicDom.RichText.asHtml(field, parent.$prismic.linkResolver, htmlSerializer || parent.$prismic.htmlSerializer);
var innerHTML = PrismicDom.RichText.asHtml(field, linkResolver || parent.$prismic.linkResolver, htmlSerializer || parent.$prismic.htmlSerializer);
return h(wrapper, _objectSpread2(_objectSpread2({}, data), {}, {

@@ -230,7 +274,191 @@ domProps: {

var Text = {
name: "PrismicText",
functional: true,
props: {
field: {
type: Array,
required: true
},
separator: {
type: String,
"default": undefined,
required: false
},
wrapper: {
type: String,
required: false,
"default": "div"
}
},
render: function render(h, _ref) {
var props = _ref.props,
data = _ref.data;
_ref.children;
_ref.parent;
var field = props.field,
separator = props.separator,
wrapper = props.wrapper;
if (!field) {
return null;
}
var innerHTML = PrismicDom.RichText.asText(field, separator);
return h(wrapper, _objectSpread2(_objectSpread2({}, data), {}, {
domProps: {
innerHTML: innerHTML
}
}));
}
};
// We need to polyfill process if it doesn't exist, such as in the browser.
if (typeof process === "undefined") {
globalThis.process = {
env: {}
};
}
/**
* `true` if in the production environment, `false` otherwise.
*
* This boolean can be used to perform actions only in development environments,
* such as logging.
*/
var __PRODUCTION__ = process.env.NODE_ENV === "production";
var getSliceComponentProps = function getSliceComponentProps(propsHint) {
return {
slice: {
type: Object,
required: true
},
index: {
type: Number,
required: true
},
slices: {
type: Array,
required: true
},
context: {
type: null,
required: true
}
};
};
var TODOSliceComponent = __PRODUCTION__ ? function () {
return null;
} : {
name: "TODOSliceCOmponent",
functional: true,
props: getSliceComponentProps(),
renfer: function renfer(h, _ref) {
var props = _ref.props,
data = _ref.data;
console.warn("[SliceZone] Could not find a component for Slice type \"".concat(props.slice.slice_type, "\""), props.slice);
return function () {
return h("section", _objectSpread2(_objectSpread2({}, data), {}, {
"data-slice-zone-todo-component": "",
"data-slice-type": props.slice.slice_type
}), ["Could not find a component for Slice type \"".concat(props.slice.slice_type, "\"")]);
};
}
}; // Just mimiced to prevent confusion but doesn't provide any value with version 2 of this kit
var defineSliceZoneComponents = function defineSliceZoneComponents(components) {
return components;
};
var SliceZone = {
name: "SliceZone",
functional: true,
props: {
slices: {
type: Array,
required: true
},
components: {
type: Object,
"default": undefined,
required: false
},
resolver: {
type: Function,
"default": undefined,
required: false
},
context: {
type: null,
"default": undefined,
required: false
},
defaultComponent: {
type: Object,
"default": undefined,
required: false
},
wrapper: {
type: [String, Object, Function],
"default": "div",
required: false
}
},
render: function render(h, _ref2) {
var props = _ref2.props,
data = _ref2.data;
// Prevent fatal if user didn't check for field, throws `Invalid prop` warn
if (!props.slices) {
return function () {
return null;
};
}
var renderedSlices = computed(function () {
return props.slices.map(function (slice, index) {
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`.
if (props.resolver) {
var resolvedComponent = props.resolver({
slice: slice,
sliceName: slice.slice_type,
i: index
});
if (resolvedComponent) {
component = resolvedComponent;
}
}
var p = {
key: "".concat(slice.slice_type, "-").concat(index),
slice: slice,
index: index,
context: props.context,
slices: props.slices
};
return h(component, p);
});
});
var parent = props.wrapper;
if (typeof parent === "string") {
return h(parent, data, renderedSlices.value);
} else {
return h(parent, data, {
"default": function _default() {
return renderedSlices.value;
}
});
}
}
};
var NuxtLink = Link({
component: 'nuxt-link'
component: "nuxt-link"
});
var VueRouterLink = Link({
component: 'router-link'
component: "router-link"
});

@@ -241,3 +469,5 @@ var exp = {

Image: Image,
RichText: RichText
RichText: RichText,
Text: Text,
SliceZone: SliceZone
},

@@ -251,14 +481,19 @@ nuxt: {

};
exp.common;
exp.nuxt;
exp.vueRouter;
var common$1 = exp.common;
var nuxt$1 = exp.nuxt;
var vueRouter$1 = exp.vueRouter;
var common = exp.common;
var nuxt = exp.nuxt;
var vueRouter = exp.vueRouter;
exports.common = common$1;
exports.nuxt = nuxt$1;
exports.vueRouter = vueRouter$1;
exports.default = exp;
exports.common = common;
exports["default"] = exp;
exports.defineSliceZoneComponents = defineSliceZoneComponents;
exports.getSliceComponentProps = getSliceComponentProps;
exports.nuxt = nuxt;
exports.vueRouter = vueRouter;
Object.defineProperty(exports, '__esModule', { value: true });
})));
}));

326

dist/prismic-vue.common.js
'use strict';
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
var prismicJS = require('@prismicio/client');
var PrismicDOM = require('prismic-dom');
var PrismicDOM__default = _interopDefault(PrismicDOM);
var prismicJS = _interopDefault(require('@prismicio/client'));
function _defineProperty(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
return obj;
}
var prismicJS__default = /*#__PURE__*/_interopDefaultLegacy(prismicJS);
var PrismicDOM__default = /*#__PURE__*/_interopDefaultLegacy(PrismicDOM);

@@ -29,5 +16,9 @@ function ownKeys(object, enumerableOnly) {

var symbols = Object.getOwnPropertySymbols(object);
if (enumerableOnly) symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
if (enumerableOnly) {
symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
}
keys.push.apply(keys, symbols);

@@ -59,2 +50,17 @@ }

function _defineProperty(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
function _slicedToArray(arr, i) {

@@ -69,10 +75,13 @@ return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();

function _iterableToArrayLimit(arr, i) {
if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
if (_i == null) return;
var _arr = [];
var _n = true;
var _d = false;
var _e = undefined;
var _s, _e;
try {
for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
_arr.push(_s.value);

@@ -189,7 +198,20 @@

var isInternalURL = function isInternalURL(url) {
/**
* @see Regex101 expression: {@link https://regex101.com/r/1y7iod/1}
*/
var isInternal = /^\/(?!\/)/.test(url);
/**
* @see Regex101 expression: {@link https://regex101.com/r/RnUseS/1}
*/
var isSpecialLink = !isInternal && !/^https?:\/\//i.test(url);
return isInternal && !isSpecialLink;
};
var Link = (function (_ref) {
var _ref$component = _ref.component,
component = _ref$component === void 0 ? 'a' : _ref$component;
component = _ref$component === void 0 ? "a" : _ref$component;
return {
name: 'PrismicLink',
name: "PrismicLink",
functional: true,

@@ -204,2 +226,17 @@ props: {

required: false
},
target: {
type: String,
"default": undefined,
required: false
},
rel: {
type: String,
"default": undefined,
required: false
},
blankTargetRelAttribute: {
type: String,
"default": "noopener",
required: false
}

@@ -219,7 +256,7 @@ },

var url = parent.$prismic ? parent.$prismic.asLink(field, linkResolver) : PrismicDOM__default.Link.url(field, linkResolver || function () {
var url = parent.$prismic ? parent.$prismic.asLink(field, linkResolver) : PrismicDOM__default["default"].Link.url(field, linkResolver || function () {
return null;
});
if (url.indexOf('/') === 0) {
if (isInternalURL(url) && !props.target) {
data.props = data.props || {};

@@ -232,7 +269,13 @@ data.props.to = url;

href: url
}, field.target && {
target: field.target,
rel: 'noopener'
});
return h('a', data, children);
if (typeof props.target !== "undefined" || field.target) {
data.attrs.target = typeof props.target !== "undefined" ? props.target : field.target;
if (data.attrs.target === "_blank") {
data.attrs.rel = typeof props.rel !== "undefined" ? props.rel : props.blankTargetRelAttribute;
}
}
return h("a", data, children);
}

@@ -243,3 +286,3 @@ };

var RichText = {
name: 'PrismicRichText',
name: "PrismicRichText",
functional: true,

@@ -251,2 +294,6 @@ props: {

},
linkResolver: {
type: Function,
required: false
},
htmlSerializer: {

@@ -259,3 +306,3 @@ type: Function,

required: false,
"default": 'div'
"default": "div"
}

@@ -266,5 +313,5 @@ },

data = _ref.data,
children = _ref.children,
parent = _ref.parent;
var field = props.field,
linkResolver = props.linkResolver,
htmlSerializer = props.htmlSerializer,

@@ -277,3 +324,3 @@ wrapper = props.wrapper;

var innerHTML = PrismicDOM.RichText.asHtml(field, parent.$prismic.linkResolver, htmlSerializer || parent.$prismic.htmlSerializer);
var innerHTML = PrismicDOM.RichText.asHtml(field, linkResolver || parent.$prismic.linkResolver, htmlSerializer || parent.$prismic.htmlSerializer);
return h(wrapper, _objectSpread2(_objectSpread2({}, data), {}, {

@@ -287,7 +334,187 @@ domProps: {

var Text = {
name: "PrismicText",
functional: true,
props: {
field: {
type: Array,
required: true
},
separator: {
type: String,
"default": undefined,
required: false
},
wrapper: {
type: String,
required: false,
"default": "div"
}
},
render: function render(h, _ref) {
var props = _ref.props,
data = _ref.data;
_ref.children;
_ref.parent;
var field = props.field,
separator = props.separator,
wrapper = props.wrapper;
if (!field) {
return null;
}
var innerHTML = PrismicDOM.RichText.asText(field, separator);
return h(wrapper, _objectSpread2(_objectSpread2({}, data), {}, {
domProps: {
innerHTML: innerHTML
}
}));
}
};
// We need to polyfill process if it doesn't exist, such as in the browser.
if (typeof process === "undefined") {
globalThis.process = {
env: {}
};
}
/**
* `true` if in the production environment, `false` otherwise.
*
* This boolean can be used to perform actions only in development environments,
* such as logging.
*/
var __PRODUCTION__ = process.env.NODE_ENV === "production";
var getSliceComponentProps = function getSliceComponentProps(propsHint) {
return {
slice: {
type: Object,
required: true
},
index: {
type: Number,
required: true
},
slices: {
type: Array,
required: true
},
context: {
type: null,
required: true
}
};
};
var TODOSliceComponent = __PRODUCTION__ ? function () {
return null;
} : {
name: "TODOSliceCOmponent",
functional: true,
props: getSliceComponentProps(),
renfer: function renfer(h, _ref) {
var props = _ref.props,
data = _ref.data;
console.warn("[SliceZone] Could not find a component for Slice type \"".concat(props.slice.slice_type, "\""), props.slice);
return function () {
return h("section", _objectSpread2(_objectSpread2({}, data), {}, {
"data-slice-zone-todo-component": "",
"data-slice-type": props.slice.slice_type
}), ["Could not find a component for Slice type \"".concat(props.slice.slice_type, "\"")]);
};
}
}; // Just mimiced to prevent confusion but doesn't provide any value with version 2 of this kit
var SliceZone = {
name: "SliceZone",
functional: true,
props: {
slices: {
type: Array,
required: true
},
components: {
type: Object,
"default": undefined,
required: false
},
resolver: {
type: Function,
"default": undefined,
required: false
},
context: {
type: null,
"default": undefined,
required: false
},
defaultComponent: {
type: Object,
"default": undefined,
required: false
},
wrapper: {
type: [String, Object, Function],
"default": "div",
required: false
}
},
render: function render(h, _ref2) {
var props = _ref2.props,
data = _ref2.data;
// Prevent fatal if user didn't check for field, throws `Invalid prop` warn
if (!props.slices) {
return function () {
return null;
};
}
var renderedSlices = computed(function () {
return props.slices.map(function (slice, index) {
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`.
if (props.resolver) {
var resolvedComponent = props.resolver({
slice: slice,
sliceName: slice.slice_type,
i: index
});
if (resolvedComponent) {
component = resolvedComponent;
}
}
var p = {
key: "".concat(slice.slice_type, "-").concat(index),
slice: slice,
index: index,
context: props.context,
slices: props.slices
};
return h(component, p);
});
});
var parent = props.wrapper;
if (typeof parent === "string") {
return h(parent, data, renderedSlices.value);
} else {
return h(parent, data, {
"default": function _default() {
return renderedSlices.value;
}
});
}
}
};
var NuxtLink = Link({
component: 'nuxt-link'
component: "nuxt-link"
});
var VueRouterLink = Link({
component: 'router-link'
component: "router-link"
});

@@ -298,3 +525,5 @@ var exp = {

Image: Image,
RichText: RichText
RichText: RichText,
Text: Text,
SliceZone: SliceZone
},

@@ -311,3 +540,3 @@ nuxt: {

if (richText) {
return PrismicDOM__default.RichText.asHtml(richText, linkResolver, htmlSerializer);
return PrismicDOM__default["default"].RichText.asHtml(richText, linkResolver, htmlSerializer);
}

@@ -317,3 +546,3 @@ }

if (richText) {
return PrismicDOM__default.RichText.asText(richText, joinString);
return PrismicDOM__default["default"].RichText.asText(richText, joinString);
}

@@ -325,3 +554,3 @@

if (link) {
return PrismicDOM__default.Link.url(link, linkResolver);
return PrismicDOM__default["default"].Link.url(link, linkResolver);
}

@@ -331,3 +560,3 @@ }

if (date) {
return PrismicDOM__default.Date(date);
return PrismicDOM__default["default"].Date(date);
}

@@ -341,2 +570,3 @@ }

Vue.prototype.$prismic.asHTML = Vue.prototype.$prismic.asHtml;
Vue.prototype.$prismic.asText = asText;

@@ -354,8 +584,8 @@ Vue.prototype.$prismic.richTextAsPlain = asText;

var _options$linkType = options.linkType,
linkType = _options$linkType === void 0 ? 'vueRouter' : _options$linkType;
Vue.prototype.$prismic = prismicJS;
linkType = _options$linkType === void 0 ? "vueRouter" : _options$linkType;
Vue.prototype.$prismic = prismicJS__default["default"];
Vue.prototype.$prismic.endpoint = options.endpoint;
Vue.prototype.$prismic.linkResolver = options.linkResolver;
Vue.prototype.$prismic.htmlSerializer = options.htmlSerializer;
Vue.prototype.$prismic.client = prismicJS.client(options.endpoint, options.apiOptions);
Vue.prototype.$prismic.client = prismicJS__default["default"].client(options.endpoint, options.apiOptions);
attachMethods(Vue, options);

@@ -371,5 +601,5 @@

Object.entries(components).forEach(function (_ref) {
var _ref2 = _slicedToArray(_ref, 2),
_ = _ref2[0],
c = _ref2[1];
var _ref2 = _slicedToArray(_ref, 2);
_ref2[0];
var c = _ref2[1];

@@ -376,0 +606,0 @@ Vue.component(c.name, c);

312

dist/prismic-vue.esm.js

@@ -1,19 +0,4 @@

import PrismicDOM, { RichText } from 'prismic-dom';
import prismicJS from '@prismicio/client';
import PrismicDOM, { RichText as RichText$1 } from 'prismic-dom';
function _defineProperty(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
function ownKeys(object, enumerableOnly) {

@@ -24,5 +9,9 @@ var keys = Object.keys(object);

var symbols = Object.getOwnPropertySymbols(object);
if (enumerableOnly) symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
if (enumerableOnly) {
symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
}
keys.push.apply(keys, symbols);

@@ -54,2 +43,17 @@ }

function _defineProperty(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
function _slicedToArray(arr, i) {

@@ -64,10 +68,13 @@ return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();

function _iterableToArrayLimit(arr, i) {
if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
if (_i == null) return;
var _arr = [];
var _n = true;
var _d = false;
var _e = undefined;
var _s, _e;
try {
for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
_arr.push(_s.value);

@@ -184,7 +191,20 @@

var isInternalURL = function isInternalURL(url) {
/**
* @see Regex101 expression: {@link https://regex101.com/r/1y7iod/1}
*/
var isInternal = /^\/(?!\/)/.test(url);
/**
* @see Regex101 expression: {@link https://regex101.com/r/RnUseS/1}
*/
var isSpecialLink = !isInternal && !/^https?:\/\//i.test(url);
return isInternal && !isSpecialLink;
};
var Link = (function (_ref) {
var _ref$component = _ref.component,
component = _ref$component === void 0 ? 'a' : _ref$component;
component = _ref$component === void 0 ? "a" : _ref$component;
return {
name: 'PrismicLink',
name: "PrismicLink",
functional: true,

@@ -199,2 +219,17 @@ props: {

required: false
},
target: {
type: String,
"default": undefined,
required: false
},
rel: {
type: String,
"default": undefined,
required: false
},
blankTargetRelAttribute: {
type: String,
"default": "noopener",
required: false
}

@@ -218,3 +253,3 @@ },

if (url.indexOf('/') === 0) {
if (isInternalURL(url) && !props.target) {
data.props = data.props || {};

@@ -227,7 +262,13 @@ data.props.to = url;

href: url
}, field.target && {
target: field.target,
rel: 'noopener'
});
return h('a', data, children);
if (typeof props.target !== "undefined" || field.target) {
data.attrs.target = typeof props.target !== "undefined" ? props.target : field.target;
if (data.attrs.target === "_blank") {
data.attrs.rel = typeof props.rel !== "undefined" ? props.rel : props.blankTargetRelAttribute;
}
}
return h("a", data, children);
}

@@ -237,4 +278,4 @@ };

var RichText$1 = {
name: 'PrismicRichText',
var RichText = {
name: "PrismicRichText",
functional: true,

@@ -246,2 +287,6 @@ props: {

},
linkResolver: {
type: Function,
required: false
},
htmlSerializer: {

@@ -254,3 +299,3 @@ type: Function,

required: false,
"default": 'div'
"default": "div"
}

@@ -261,5 +306,5 @@ },

data = _ref.data,
children = _ref.children,
parent = _ref.parent;
var field = props.field,
linkResolver = props.linkResolver,
htmlSerializer = props.htmlSerializer,

@@ -272,3 +317,3 @@ wrapper = props.wrapper;

var innerHTML = RichText.asHtml(field, parent.$prismic.linkResolver, htmlSerializer || parent.$prismic.htmlSerializer);
var innerHTML = RichText$1.asHtml(field, linkResolver || parent.$prismic.linkResolver, htmlSerializer || parent.$prismic.htmlSerializer);
return h(wrapper, _objectSpread2(_objectSpread2({}, data), {}, {

@@ -282,7 +327,187 @@ domProps: {

var Text = {
name: "PrismicText",
functional: true,
props: {
field: {
type: Array,
required: true
},
separator: {
type: String,
"default": undefined,
required: false
},
wrapper: {
type: String,
required: false,
"default": "div"
}
},
render: function render(h, _ref) {
var props = _ref.props,
data = _ref.data;
_ref.children;
_ref.parent;
var field = props.field,
separator = props.separator,
wrapper = props.wrapper;
if (!field) {
return null;
}
var innerHTML = RichText$1.asText(field, separator);
return h(wrapper, _objectSpread2(_objectSpread2({}, data), {}, {
domProps: {
innerHTML: innerHTML
}
}));
}
};
// We need to polyfill process if it doesn't exist, such as in the browser.
if (typeof process === "undefined") {
globalThis.process = {
env: {}
};
}
/**
* `true` if in the production environment, `false` otherwise.
*
* This boolean can be used to perform actions only in development environments,
* such as logging.
*/
var __PRODUCTION__ = process.env.NODE_ENV === "production";
var getSliceComponentProps = function getSliceComponentProps(propsHint) {
return {
slice: {
type: Object,
required: true
},
index: {
type: Number,
required: true
},
slices: {
type: Array,
required: true
},
context: {
type: null,
required: true
}
};
};
var TODOSliceComponent = __PRODUCTION__ ? function () {
return null;
} : {
name: "TODOSliceCOmponent",
functional: true,
props: getSliceComponentProps(),
renfer: function renfer(h, _ref) {
var props = _ref.props,
data = _ref.data;
console.warn("[SliceZone] Could not find a component for Slice type \"".concat(props.slice.slice_type, "\""), props.slice);
return function () {
return h("section", _objectSpread2(_objectSpread2({}, data), {}, {
"data-slice-zone-todo-component": "",
"data-slice-type": props.slice.slice_type
}), ["Could not find a component for Slice type \"".concat(props.slice.slice_type, "\"")]);
};
}
}; // Just mimiced to prevent confusion but doesn't provide any value with version 2 of this kit
var SliceZone = {
name: "SliceZone",
functional: true,
props: {
slices: {
type: Array,
required: true
},
components: {
type: Object,
"default": undefined,
required: false
},
resolver: {
type: Function,
"default": undefined,
required: false
},
context: {
type: null,
"default": undefined,
required: false
},
defaultComponent: {
type: Object,
"default": undefined,
required: false
},
wrapper: {
type: [String, Object, Function],
"default": "div",
required: false
}
},
render: function render(h, _ref2) {
var props = _ref2.props,
data = _ref2.data;
// Prevent fatal if user didn't check for field, throws `Invalid prop` warn
if (!props.slices) {
return function () {
return null;
};
}
var renderedSlices = computed(function () {
return props.slices.map(function (slice, index) {
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`.
if (props.resolver) {
var resolvedComponent = props.resolver({
slice: slice,
sliceName: slice.slice_type,
i: index
});
if (resolvedComponent) {
component = resolvedComponent;
}
}
var p = {
key: "".concat(slice.slice_type, "-").concat(index),
slice: slice,
index: index,
context: props.context,
slices: props.slices
};
return h(component, p);
});
});
var parent = props.wrapper;
if (typeof parent === "string") {
return h(parent, data, renderedSlices.value);
} else {
return h(parent, data, {
"default": function _default() {
return renderedSlices.value;
}
});
}
}
};
var NuxtLink = Link({
component: 'nuxt-link'
component: "nuxt-link"
});
var VueRouterLink = Link({
component: 'router-link'
component: "router-link"
});

@@ -293,3 +518,5 @@ var exp = {

Image: Image,
RichText: RichText$1
RichText: RichText,
Text: Text,
SliceZone: SliceZone
},

@@ -332,2 +559,3 @@ nuxt: {

Vue.prototype.$prismic.asHTML = Vue.prototype.$prismic.asHtml;
Vue.prototype.$prismic.asText = asText;

@@ -345,3 +573,3 @@ Vue.prototype.$prismic.richTextAsPlain = asText;

var _options$linkType = options.linkType,
linkType = _options$linkType === void 0 ? 'vueRouter' : _options$linkType;
linkType = _options$linkType === void 0 ? "vueRouter" : _options$linkType;
Vue.prototype.$prismic = prismicJS;

@@ -362,5 +590,5 @@ Vue.prototype.$prismic.endpoint = options.endpoint;

Object.entries(components).forEach(function (_ref) {
var _ref2 = _slicedToArray(_ref, 2),
_ = _ref2[0],
c = _ref2[1];
var _ref2 = _slicedToArray(_ref, 2);
_ref2[0];
var c = _ref2[1];

@@ -372,2 +600,2 @@ Vue.component(c.name, c);

export default PrismicVue;
export { PrismicVue as default };

334

dist/prismic-vue.js
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('prismic-dom'), require('@prismicio/client')) :
typeof define === 'function' && define.amd ? define(['prismic-dom', '@prismicio/client'], factory) :
(global.PrismicVue = factory(global.prismicDOM,global.prismicJS));
}(this, (function (PrismicDOM,prismicJS) { 'use strict';
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('@prismicio/client'), require('prismic-dom')) :
typeof define === 'function' && define.amd ? define(['@prismicio/client', 'prismic-dom'], factory) :
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.PrismicVue = factory(global.prismicJS, global.prismicDOM));
})(this, (function (prismicJS, PrismicDOM) { 'use strict';
var PrismicDOM__default = 'default' in PrismicDOM ? PrismicDOM['default'] : PrismicDOM;
prismicJS = prismicJS && prismicJS.hasOwnProperty('default') ? prismicJS['default'] : prismicJS;
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
function _defineProperty(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
var prismicJS__default = /*#__PURE__*/_interopDefaultLegacy(prismicJS);
var PrismicDOM__default = /*#__PURE__*/_interopDefaultLegacy(PrismicDOM);
return obj;
}
function ownKeys(object, enumerableOnly) {

@@ -30,5 +17,9 @@ var keys = Object.keys(object);

var symbols = Object.getOwnPropertySymbols(object);
if (enumerableOnly) symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
if (enumerableOnly) {
symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
}
keys.push.apply(keys, symbols);

@@ -60,2 +51,17 @@ }

function _defineProperty(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
function _slicedToArray(arr, i) {

@@ -70,10 +76,13 @@ return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();

function _iterableToArrayLimit(arr, i) {
if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
if (_i == null) return;
var _arr = [];
var _n = true;
var _d = false;
var _e = undefined;
var _s, _e;
try {
for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
_arr.push(_s.value);

@@ -190,7 +199,20 @@

var isInternalURL = function isInternalURL(url) {
/**
* @see Regex101 expression: {@link https://regex101.com/r/1y7iod/1}
*/
var isInternal = /^\/(?!\/)/.test(url);
/**
* @see Regex101 expression: {@link https://regex101.com/r/RnUseS/1}
*/
var isSpecialLink = !isInternal && !/^https?:\/\//i.test(url);
return isInternal && !isSpecialLink;
};
var Link = (function (_ref) {
var _ref$component = _ref.component,
component = _ref$component === void 0 ? 'a' : _ref$component;
component = _ref$component === void 0 ? "a" : _ref$component;
return {
name: 'PrismicLink',
name: "PrismicLink",
functional: true,

@@ -205,2 +227,17 @@ props: {

required: false
},
target: {
type: String,
"default": undefined,
required: false
},
rel: {
type: String,
"default": undefined,
required: false
},
blankTargetRelAttribute: {
type: String,
"default": "noopener",
required: false
}

@@ -220,7 +257,7 @@ },

var url = parent.$prismic ? parent.$prismic.asLink(field, linkResolver) : PrismicDOM__default.Link.url(field, linkResolver || function () {
var url = parent.$prismic ? parent.$prismic.asLink(field, linkResolver) : PrismicDOM__default["default"].Link.url(field, linkResolver || function () {
return null;
});
if (url.indexOf('/') === 0) {
if (isInternalURL(url) && !props.target) {
data.props = data.props || {};

@@ -233,7 +270,13 @@ data.props.to = url;

href: url
}, field.target && {
target: field.target,
rel: 'noopener'
});
return h('a', data, children);
if (typeof props.target !== "undefined" || field.target) {
data.attrs.target = typeof props.target !== "undefined" ? props.target : field.target;
if (data.attrs.target === "_blank") {
data.attrs.rel = typeof props.rel !== "undefined" ? props.rel : props.blankTargetRelAttribute;
}
}
return h("a", data, children);
}

@@ -244,3 +287,3 @@ };

var RichText = {
name: 'PrismicRichText',
name: "PrismicRichText",
functional: true,

@@ -252,2 +295,6 @@ props: {

},
linkResolver: {
type: Function,
required: false
},
htmlSerializer: {

@@ -260,3 +307,3 @@ type: Function,

required: false,
"default": 'div'
"default": "div"
}

@@ -267,5 +314,5 @@ },

data = _ref.data,
children = _ref.children,
parent = _ref.parent;
var field = props.field,
linkResolver = props.linkResolver,
htmlSerializer = props.htmlSerializer,

@@ -278,3 +325,3 @@ wrapper = props.wrapper;

var innerHTML = PrismicDOM.RichText.asHtml(field, parent.$prismic.linkResolver, htmlSerializer || parent.$prismic.htmlSerializer);
var innerHTML = PrismicDOM.RichText.asHtml(field, linkResolver || parent.$prismic.linkResolver, htmlSerializer || parent.$prismic.htmlSerializer);
return h(wrapper, _objectSpread2(_objectSpread2({}, data), {}, {

@@ -288,7 +335,187 @@ domProps: {

var Text = {
name: "PrismicText",
functional: true,
props: {
field: {
type: Array,
required: true
},
separator: {
type: String,
"default": undefined,
required: false
},
wrapper: {
type: String,
required: false,
"default": "div"
}
},
render: function render(h, _ref) {
var props = _ref.props,
data = _ref.data;
_ref.children;
_ref.parent;
var field = props.field,
separator = props.separator,
wrapper = props.wrapper;
if (!field) {
return null;
}
var innerHTML = PrismicDOM.RichText.asText(field, separator);
return h(wrapper, _objectSpread2(_objectSpread2({}, data), {}, {
domProps: {
innerHTML: innerHTML
}
}));
}
};
// We need to polyfill process if it doesn't exist, such as in the browser.
if (typeof process === "undefined") {
globalThis.process = {
env: {}
};
}
/**
* `true` if in the production environment, `false` otherwise.
*
* This boolean can be used to perform actions only in development environments,
* such as logging.
*/
var __PRODUCTION__ = process.env.NODE_ENV === "production";
var getSliceComponentProps = function getSliceComponentProps(propsHint) {
return {
slice: {
type: Object,
required: true
},
index: {
type: Number,
required: true
},
slices: {
type: Array,
required: true
},
context: {
type: null,
required: true
}
};
};
var TODOSliceComponent = __PRODUCTION__ ? function () {
return null;
} : {
name: "TODOSliceCOmponent",
functional: true,
props: getSliceComponentProps(),
renfer: function renfer(h, _ref) {
var props = _ref.props,
data = _ref.data;
console.warn("[SliceZone] Could not find a component for Slice type \"".concat(props.slice.slice_type, "\""), props.slice);
return function () {
return h("section", _objectSpread2(_objectSpread2({}, data), {}, {
"data-slice-zone-todo-component": "",
"data-slice-type": props.slice.slice_type
}), ["Could not find a component for Slice type \"".concat(props.slice.slice_type, "\"")]);
};
}
}; // Just mimiced to prevent confusion but doesn't provide any value with version 2 of this kit
var SliceZone = {
name: "SliceZone",
functional: true,
props: {
slices: {
type: Array,
required: true
},
components: {
type: Object,
"default": undefined,
required: false
},
resolver: {
type: Function,
"default": undefined,
required: false
},
context: {
type: null,
"default": undefined,
required: false
},
defaultComponent: {
type: Object,
"default": undefined,
required: false
},
wrapper: {
type: [String, Object, Function],
"default": "div",
required: false
}
},
render: function render(h, _ref2) {
var props = _ref2.props,
data = _ref2.data;
// Prevent fatal if user didn't check for field, throws `Invalid prop` warn
if (!props.slices) {
return function () {
return null;
};
}
var renderedSlices = computed(function () {
return props.slices.map(function (slice, index) {
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`.
if (props.resolver) {
var resolvedComponent = props.resolver({
slice: slice,
sliceName: slice.slice_type,
i: index
});
if (resolvedComponent) {
component = resolvedComponent;
}
}
var p = {
key: "".concat(slice.slice_type, "-").concat(index),
slice: slice,
index: index,
context: props.context,
slices: props.slices
};
return h(component, p);
});
});
var parent = props.wrapper;
if (typeof parent === "string") {
return h(parent, data, renderedSlices.value);
} else {
return h(parent, data, {
"default": function _default() {
return renderedSlices.value;
}
});
}
}
};
var NuxtLink = Link({
component: 'nuxt-link'
component: "nuxt-link"
});
var VueRouterLink = Link({
component: 'router-link'
component: "router-link"
});

@@ -299,3 +526,5 @@ var exp = {

Image: Image,
RichText: RichText
RichText: RichText,
Text: Text,
SliceZone: SliceZone
},

@@ -312,3 +541,3 @@ nuxt: {

if (richText) {
return PrismicDOM__default.RichText.asHtml(richText, linkResolver, htmlSerializer);
return PrismicDOM__default["default"].RichText.asHtml(richText, linkResolver, htmlSerializer);
}

@@ -318,3 +547,3 @@ }

if (richText) {
return PrismicDOM__default.RichText.asText(richText, joinString);
return PrismicDOM__default["default"].RichText.asText(richText, joinString);
}

@@ -326,3 +555,3 @@

if (link) {
return PrismicDOM__default.Link.url(link, linkResolver);
return PrismicDOM__default["default"].Link.url(link, linkResolver);
}

@@ -332,3 +561,3 @@ }

if (date) {
return PrismicDOM__default.Date(date);
return PrismicDOM__default["default"].Date(date);
}

@@ -342,2 +571,3 @@ }

Vue.prototype.$prismic.asHTML = Vue.prototype.$prismic.asHtml;
Vue.prototype.$prismic.asText = asText;

@@ -355,8 +585,8 @@ Vue.prototype.$prismic.richTextAsPlain = asText;

var _options$linkType = options.linkType,
linkType = _options$linkType === void 0 ? 'vueRouter' : _options$linkType;
Vue.prototype.$prismic = prismicJS;
linkType = _options$linkType === void 0 ? "vueRouter" : _options$linkType;
Vue.prototype.$prismic = prismicJS__default["default"];
Vue.prototype.$prismic.endpoint = options.endpoint;
Vue.prototype.$prismic.linkResolver = options.linkResolver;
Vue.prototype.$prismic.htmlSerializer = options.htmlSerializer;
Vue.prototype.$prismic.client = prismicJS.client(options.endpoint, options.apiOptions);
Vue.prototype.$prismic.client = prismicJS__default["default"].client(options.endpoint, options.apiOptions);
attachMethods(Vue, options);

@@ -372,5 +602,5 @@

Object.entries(components).forEach(function (_ref) {
var _ref2 = _slicedToArray(_ref, 2),
_ = _ref2[0],
c = _ref2[1];
var _ref2 = _slicedToArray(_ref, 2);
_ref2[0];
var c = _ref2[1];

@@ -384,2 +614,2 @@ Vue.component(c.name, c);

})));
}));

2

dist/prismic-vue.min.js

@@ -1,1 +0,1 @@

(function(global,factory){typeof exports==="object"&&typeof module!=="undefined"?module.exports=factory(require("prismic-dom"),require("@prismicio/client")):typeof define==="function"&&define.amd?define(["prismic-dom","@prismicio/client"],factory):global.PrismicVue=factory(global.prismicDOM,global.prismicJS)})(this,function(PrismicDOM,prismicJS){"use strict";var PrismicDOM__default="default"in PrismicDOM?PrismicDOM["default"]:PrismicDOM;prismicJS=prismicJS&&prismicJS.hasOwnProperty("default")?prismicJS["default"]:prismicJS;function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable});keys.push.apply(keys,symbols)}return keys}function _objectSpread2(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};if(i%2){ownKeys(Object(source),true).forEach(function(key){_defineProperty(target,key,source[key])})}else if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}}return target}function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_unsupportedIterableToArray(arr,i)||_nonIterableRest()}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}function _iterableToArrayLimit(arr,i){if(typeof Symbol==="undefined"||!(Symbol.iterator in Object(arr)))return;var _arr=[];var _n=true;var _d=false;var _e=undefined;try{for(var _i=arr[Symbol.iterator](),_s;!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break}}catch(err){_d=true;_e=err}finally{try{if(!_n&&_i["return"]!=null)_i["return"]()}finally{if(_d)throw _e}}return _arr}function _unsupportedIterableToArray(o,minLen){if(!o)return;if(typeof o==="string")return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);if(n==="Object"&&o.constructor)n=o.constructor.name;if(n==="Map"||n==="Set")return Array.from(o);if(n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}function _arrayLikeToArray(arr,len){if(len==null||len>arr.length)len=arr.length;for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var Embed={name:"PrismicEmbed",functional:true,props:{field:{type:Object,required:true},wrapper:{type:String,required:false,default:"div"}},render:function render(h,_ref){var props=_ref.props,data=_ref.data;var field=props.field,wrapper=props.wrapper;if(!field||!field.html){return null}var embedUrl=field.embed_url,type=field.type,providerName=field.provider_name;var attrs=_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({},data.attrs),embedUrl&&{"data-oembed":embedUrl}),type&&{"data-oembed-type":type}),providerName&&{"data-oembed-provider":providerName});return h(wrapper,_objectSpread2(_objectSpread2({},Object.assign(data,{attrs:attrs})),{},{domProps:{innerHTML:field.html}}))}};var Image={name:"PrismicImage",functional:true,props:{field:{type:Object,required:true}},render:function render(h,_ref){var props=_ref.props,data=_ref.data;var _props$field=props.field,url=_props$field.url,alt=_props$field.alt,copyright=_props$field.copyright;return h("img",Object.assign(data,{attrs:_objectSpread2(_objectSpread2({},data.attrs),{},{src:url,alt:alt,copyright:copyright})}))}};var Link=function(_ref){var _ref$component=_ref.component,component=_ref$component===void 0?"a":_ref$component;return{name:"PrismicLink",functional:true,props:{field:{type:Object,required:true},linkResolver:{type:Function,required:false}},render:function render(h,_ref2){var props=_ref2.props,data=_ref2.data,children=_ref2.children,parent=_ref2.parent;var field=props.field,linkResolver=props.linkResolver;if(!field){return null}var url=parent.$prismic?parent.$prismic.asLink(field,linkResolver):PrismicDOM__default.Link.url(field,linkResolver||function(){return null});if(url.indexOf("/")===0){data.props=data.props||{};data.props.to=url;return h(component,data,children)}data.attrs=_objectSpread2(_objectSpread2({},data.attrs),{},{href:url},field.target&&{target:field.target,rel:"noopener"});return h("a",data,children)}}};var RichText={name:"PrismicRichText",functional:true,props:{field:{type:Array,required:true},htmlSerializer:{type:Function,required:false},wrapper:{type:String,required:false,default:"div"}},render:function render(h,_ref){var props=_ref.props,data=_ref.data,children=_ref.children,parent=_ref.parent;var field=props.field,htmlSerializer=props.htmlSerializer,wrapper=props.wrapper;if(!field){return null}var innerHTML=PrismicDOM.RichText.asHtml(field,parent.$prismic.linkResolver,htmlSerializer||parent.$prismic.htmlSerializer);return h(wrapper,_objectSpread2(_objectSpread2({},data),{},{domProps:{innerHTML:innerHTML}}))}};var NuxtLink=Link({component:"nuxt-link"});var VueRouterLink=Link({component:"router-link"});var exp={common:{Embed:Embed,Image:Image,RichText:RichText},nuxt:{Link:NuxtLink},vueRouter:{Link:VueRouterLink}};function asHtml(richText,linkResolver,htmlSerializer){if(richText){return PrismicDOM__default.RichText.asHtml(richText,linkResolver,htmlSerializer)}}function asText(richText,joinString){if(richText){return PrismicDOM__default.RichText.asText(richText,joinString)}return""}function asLink(link,linkResolver){if(link){return PrismicDOM__default.Link.url(link,linkResolver)}}function asDate(date){if(date){return PrismicDOM__default.Date(date)}}function attachMethods(Vue,options){Vue.prototype.$prismic.asHtml=function(richText,linkResolver,htmlSerializer){return asHtml(richText,linkResolver||options.linkResolver,htmlSerializer||options.htmlSerializer)};Vue.prototype.$prismic.asText=asText;Vue.prototype.$prismic.richTextAsPlain=asText;Vue.prototype.$prismic.asDate=asDate;Vue.prototype.$prismic.asLink=function(link,linkResolver){return asLink(link,linkResolver||options.linkResolver)}}var PrismicVue={install:function install(Vue,options){var _options$linkType=options.linkType,linkType=_options$linkType===void 0?"vueRouter":_options$linkType;Vue.prototype.$prismic=prismicJS;Vue.prototype.$prismic.endpoint=options.endpoint;Vue.prototype.$prismic.linkResolver=options.linkResolver;Vue.prototype.$prismic.htmlSerializer=options.htmlSerializer;Vue.prototype.$prismic.client=prismicJS.client(options.endpoint,options.apiOptions);attachMethods(Vue,options);var components=_objectSpread2(_objectSpread2({},exp.common),exp[linkType]);Object.entries(components).forEach(function(_ref){var _ref2=_slicedToArray(_ref,2),_=_ref2[0],c=_ref2[1];Vue.component(c.name,c)})}};return PrismicVue});
(function(global,factory){typeof exports==="object"&&typeof module!=="undefined"?module.exports=factory(require("@prismicio/client"),require("prismic-dom")):typeof define==="function"&&define.amd?define(["@prismicio/client","prismic-dom"],factory):(global=typeof globalThis!=="undefined"?globalThis:global||self,global.PrismicVue=factory(global.prismicJS,global.prismicDOM))})(this,function(prismicJS,PrismicDOM){"use strict";function _interopDefaultLegacy(e){return e&&typeof e==="object"&&"default"in e?e:{default:e}}var prismicJS__default=_interopDefaultLegacy(prismicJS);var PrismicDOM__default=_interopDefaultLegacy(PrismicDOM);function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _objectSpread2(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};if(i%2){ownKeys(Object(source),true).forEach(function(key){_defineProperty(target,key,source[key])})}else if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}}return target}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_unsupportedIterableToArray(arr,i)||_nonIterableRest()}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}function _iterableToArrayLimit(arr,i){var _i=arr==null?null:typeof Symbol!=="undefined"&&arr[Symbol.iterator]||arr["@@iterator"];if(_i==null)return;var _arr=[];var _n=true;var _d=false;var _s,_e;try{for(_i=_i.call(arr);!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break}}catch(err){_d=true;_e=err}finally{try{if(!_n&&_i["return"]!=null)_i["return"]()}finally{if(_d)throw _e}}return _arr}function _unsupportedIterableToArray(o,minLen){if(!o)return;if(typeof o==="string")return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);if(n==="Object"&&o.constructor)n=o.constructor.name;if(n==="Map"||n==="Set")return Array.from(o);if(n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}function _arrayLikeToArray(arr,len){if(len==null||len>arr.length)len=arr.length;for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var Embed={name:"PrismicEmbed",functional:true,props:{field:{type:Object,required:true},wrapper:{type:String,required:false,default:"div"}},render:function render(h,_ref){var props=_ref.props,data=_ref.data;var field=props.field,wrapper=props.wrapper;if(!field||!field.html){return null}var embedUrl=field.embed_url,type=field.type,providerName=field.provider_name;var attrs=_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({},data.attrs),embedUrl&&{"data-oembed":embedUrl}),type&&{"data-oembed-type":type}),providerName&&{"data-oembed-provider":providerName});return h(wrapper,_objectSpread2(_objectSpread2({},Object.assign(data,{attrs:attrs})),{},{domProps:{innerHTML:field.html}}))}};var Image={name:"PrismicImage",functional:true,props:{field:{type:Object,required:true}},render:function render(h,_ref){var props=_ref.props,data=_ref.data;var _props$field=props.field,url=_props$field.url,alt=_props$field.alt,copyright=_props$field.copyright;return h("img",Object.assign(data,{attrs:_objectSpread2(_objectSpread2({},data.attrs),{},{src:url,alt:alt,copyright:copyright})}))}};var isInternalURL=function isInternalURL(url){var isInternal=/^\/(?!\/)/.test(url);var isSpecialLink=!isInternal&&!/^https?:\/\//i.test(url);return isInternal&&!isSpecialLink};var Link=function(_ref){var _ref$component=_ref.component,component=_ref$component===void 0?"a":_ref$component;return{name:"PrismicLink",functional:true,props:{field:{type:Object,required:true},linkResolver:{type:Function,required:false},target:{type:String,default:undefined,required:false},rel:{type:String,default:undefined,required:false},blankTargetRelAttribute:{type:String,default:"noopener",required:false}},render:function render(h,_ref2){var props=_ref2.props,data=_ref2.data,children=_ref2.children,parent=_ref2.parent;var field=props.field,linkResolver=props.linkResolver;if(!field){return null}var url=parent.$prismic?parent.$prismic.asLink(field,linkResolver):PrismicDOM__default["default"].Link.url(field,linkResolver||function(){return null});if(isInternalURL(url)&&!props.target){data.props=data.props||{};data.props.to=url;return h(component,data,children)}data.attrs=_objectSpread2(_objectSpread2({},data.attrs),{},{href:url});if(typeof props.target!=="undefined"||field.target){data.attrs.target=typeof props.target!=="undefined"?props.target:field.target;if(data.attrs.target==="_blank"){data.attrs.rel=typeof props.rel!=="undefined"?props.rel:props.blankTargetRelAttribute}}return h("a",data,children)}}};var RichText={name:"PrismicRichText",functional:true,props:{field:{type:Array,required:true},linkResolver:{type:Function,required:false},htmlSerializer:{type:Function,required:false},wrapper:{type:String,required:false,default:"div"}},render:function render(h,_ref){var props=_ref.props,data=_ref.data,parent=_ref.parent;var field=props.field,linkResolver=props.linkResolver,htmlSerializer=props.htmlSerializer,wrapper=props.wrapper;if(!field){return null}var innerHTML=PrismicDOM.RichText.asHtml(field,linkResolver||parent.$prismic.linkResolver,htmlSerializer||parent.$prismic.htmlSerializer);return h(wrapper,_objectSpread2(_objectSpread2({},data),{},{domProps:{innerHTML:innerHTML}}))}};var Text={name:"PrismicText",functional:true,props:{field:{type:Array,required:true},separator:{type:String,default:undefined,required:false},wrapper:{type:String,required:false,default:"div"}},render:function render(h,_ref){var props=_ref.props,data=_ref.data;_ref.children;_ref.parent;var field=props.field,separator=props.separator,wrapper=props.wrapper;if(!field){return null}var innerHTML=PrismicDOM.RichText.asText(field,separator);return h(wrapper,_objectSpread2(_objectSpread2({},data),{},{domProps:{innerHTML:innerHTML}}))}};if(typeof process==="undefined"){globalThis.process={env:{}}}var __PRODUCTION__=process.env.NODE_ENV==="production";var getSliceComponentProps=function getSliceComponentProps(propsHint){return{slice:{type:Object,required:true},index:{type:Number,required:true},slices:{type:Array,required:true},context:{type:null,required:true}}};var TODOSliceComponent=__PRODUCTION__?function(){return null}:{name:"TODOSliceCOmponent",functional:true,props:getSliceComponentProps(),renfer:function renfer(h,_ref){var props=_ref.props,data=_ref.data;console.warn('[SliceZone] Could not find a component for Slice type "'.concat(props.slice.slice_type,'"'),props.slice);return function(){return h("section",_objectSpread2(_objectSpread2({},data),{},{"data-slice-zone-todo-component":"","data-slice-type":props.slice.slice_type}),['Could not find a component for Slice type "'.concat(props.slice.slice_type,'"')])}}};var SliceZone={name:"SliceZone",functional:true,props:{slices:{type:Array,required:true},components:{type:Object,default:undefined,required:false},resolver:{type:Function,default:undefined,required:false},context:{type:null,default:undefined,required:false},defaultComponent:{type:Object,default:undefined,required:false},wrapper:{type:[String,Object,Function],default:"div",required:false}},render:function render(h,_ref2){var props=_ref2.props,data=_ref2.data;if(!props.slices){return function(){return null}}var renderedSlices=computed(function(){return props.slices.map(function(slice,index){var component=props.components&&slice.slice_type in props.components?props.components[slice.slice_type]:props.defaultComponent||TODOSliceComponent;if(props.resolver){var resolvedComponent=props.resolver({slice:slice,sliceName:slice.slice_type,i:index});if(resolvedComponent){component=resolvedComponent}}var p={key:"".concat(slice.slice_type,"-").concat(index),slice:slice,index:index,context:props.context,slices:props.slices};return h(component,p)})});var parent=props.wrapper;if(typeof parent==="string"){return h(parent,data,renderedSlices.value)}else{return h(parent,data,{default:function _default(){return renderedSlices.value}})}}};var NuxtLink=Link({component:"nuxt-link"});var VueRouterLink=Link({component:"router-link"});var exp={common:{Embed:Embed,Image:Image,RichText:RichText,Text:Text,SliceZone:SliceZone},nuxt:{Link:NuxtLink},vueRouter:{Link:VueRouterLink}};function asHtml(richText,linkResolver,htmlSerializer){if(richText){return PrismicDOM__default["default"].RichText.asHtml(richText,linkResolver,htmlSerializer)}}function asText(richText,joinString){if(richText){return PrismicDOM__default["default"].RichText.asText(richText,joinString)}return""}function asLink(link,linkResolver){if(link){return PrismicDOM__default["default"].Link.url(link,linkResolver)}}function asDate(date){if(date){return PrismicDOM__default["default"].Date(date)}}function attachMethods(Vue,options){Vue.prototype.$prismic.asHtml=function(richText,linkResolver,htmlSerializer){return asHtml(richText,linkResolver||options.linkResolver,htmlSerializer||options.htmlSerializer)};Vue.prototype.$prismic.asHTML=Vue.prototype.$prismic.asHtml;Vue.prototype.$prismic.asText=asText;Vue.prototype.$prismic.richTextAsPlain=asText;Vue.prototype.$prismic.asDate=asDate;Vue.prototype.$prismic.asLink=function(link,linkResolver){return asLink(link,linkResolver||options.linkResolver)}}var PrismicVue={install:function install(Vue,options){var _options$linkType=options.linkType,linkType=_options$linkType===void 0?"vueRouter":_options$linkType;Vue.prototype.$prismic=prismicJS__default["default"];Vue.prototype.$prismic.endpoint=options.endpoint;Vue.prototype.$prismic.linkResolver=options.linkResolver;Vue.prototype.$prismic.htmlSerializer=options.htmlSerializer;Vue.prototype.$prismic.client=prismicJS__default["default"].client(options.endpoint,options.apiOptions);attachMethods(Vue,options);var components=_objectSpread2(_objectSpread2({},exp.common),exp[linkType]);Object.entries(components).forEach(function(_ref){var _ref2=_slicedToArray(_ref,2);_ref2[0];var c=_ref2[1];Vue.component(c.name,c)})}};return PrismicVue});

98

package.json
{
"name": "@prismicio/vue",
"version": "2.0.11",
"description": "Vue.js plugin to facilitate integration of content managed with Prismic",
"license": "Apache-2.0",
"repository": "github:prismicio/prismic-vue",
"author": "Prismic",
"components": "dist/components.esm.js",
"main": "dist/prismic-vue.common.js",
"module": "dist/prismic-vue.esm.js",
"unpkg": "dist/prismic-vue.min.js",
"jsdelivr": "dist/prismic-vue.min.js",
"files": [
"components",
"dist",
"src"
],
"scripts": {
"build": "rollup -c --environment BUILD:production && uglifyjs dist/prismic-vue.js -o dist/prismic-vue.min.js",
"release": "npm run build && npm publish",
"beauty": "rollup -c",
"dev": "rollup -c --watch --environment BUILD:development",
"visualize": "rollup -c --config-visualize"
},
"peerDependencies": {
"@prismicio/client": "^4.0.0",
"prismic-dom": "^2.2.5"
},
"engines": {
"node": ">= 6.0.0",
"npm": ">= 3.0.0"
},
"devDependencies": {
"@babel/core": "^7.6.0",
"@babel/preset-env": "^7.6.0",
"@prismicio/client": "^4.0.0",
"postcss": "^7.0.35",
"prismic-dom": "^2.2.5",
"rollup": "^0.62.0",
"rollup-plugin-auto-named-exports": "^1.0.0-beta.3",
"rollup-plugin-babel": "^4.3.3",
"rollup-plugin-commonjs": "^9.1.3",
"rollup-plugin-node-resolve": "^3.3.0",
"rollup-plugin-visualizer": "^2.6.0",
"rollup-plugin-vue": "^4.3.0",
"uglify-js": "^3.4.3",
"vue-template-compiler": "^2.6.12"
}
"name": "@prismicio/vue",
"version": "2.1.0-alpha.0",
"description": "Vue.js plugin to facilitate integration of content managed with Prismic",
"license": "Apache-2.0",
"repository": "github:prismicio/prismic-vue",
"author": "Prismic",
"components": "dist/components.esm.js",
"main": "dist/prismic-vue.common.js",
"module": "dist/prismic-vue.esm.js",
"unpkg": "dist/prismic-vue.min.js",
"jsdelivr": "dist/prismic-vue.min.js",
"files": [
"components",
"dist",
"src"
],
"scripts": {
"build": "rollup -c --environment BUILD:production && uglifyjs dist/prismic-vue.js -o dist/prismic-vue.min.js",
"release": "npm run build && npm publish",
"beauty": "rollup -c",
"dev": "rollup -c --watch --environment BUILD:development",
"visualize": "rollup -c --config-visualize"
},
"peerDependencies": {
"vue": "^2.6.0",
"@prismicio/client": "^4.0.0 || ^5.0.0",
"prismic-dom": "^2.2.0"
},
"engines": {
"node": ">= 6.0.0"
},
"devDependencies": {
"@babel/core": "^7.16.0",
"@babel/preset-env": "^7.16.4",
"@prismicio/client": "^5.1.0",
"postcss": "^8.3.11",
"prismic-dom": "^2.2.6",
"rollup": "^2.60.1",
"rollup-plugin-auto-named-exports": "^1.0.0-beta.3",
"rollup-plugin-babel": "^4.4.0",
"rollup-plugin-commonjs": "^10.1.0",
"rollup-plugin-node-resolve": "^5.2.0",
"rollup-plugin-visualizer": "^5.5.2",
"rollup-plugin-vue": "^6.0.0",
"uglify-js": "^3.14.3",
"vue-template-compiler": "^2.6.14"
},
"vetur": {
"tags": "vetur/tags.json",
"attributes": "vetur/attributes.json"
}
}

216

README.md

@@ -1,176 +0,108 @@

![alt text](https://prismic.io/...1b58998/images/logo-dark.svg)
<!--
[![npm version](https://badge.fury.io/js/%40prismicio%2Fvue.svg)](http://badge.fury.io/js/@prismicio/vue)
Replace all on all files (README.md, CONTRIBUTING.md, bug_report.md, package.json):
- @prismicio/vue
- Vue plugin, components, and composables to fetch and present Prismic content
- prismicio/prismic-vue
- prismic-vue
# @prismicio/vue V₂
-->
> Vue.js plugin to facilitate integration of content managed with [Prismic.io](https://prismic.io).
Looking for a Nuxt solution? Here you go 👉 [@nuxtjs/prismic plugin](https://github.com/nuxt-community/prismic)
# @prismicio/vue
# Install
[![npm version][npm-version-src]][npm-version-href]
[![npm downloads][npm-downloads-src]][npm-downloads-href]
[![Github Actions CI][github-actions-ci-src]][github-actions-ci-href]
[![Codecov][codecov-src]][codecov-href]
[![Conventional Commits][conventional-commits-src]][conventional-commits-href]
[![License][license-src]][license-href]
⚠️ We've moved `prismic-vue` to `@prismicio/vue`. You can safely replace the former with the latter to your node modules ✌️
<!-- TODO: Replacing link to Prismic with [Prismic][prismic] is useful here -->
`@prismic/vue` relies on `@prismicio/client` and `prismic-dom`.
If you are migrating from V1, make sure to install them too as they are now peer dependencies.
``` bash
npm install @prismicio/vue @prismicio/client prismic-dom
```
👉 quick note: @prismicio/client is a library responsible for _making requests to your Prismic endpoint_,
while prismic-dom is responsible for serializing html from RichText ([RichText you said?](https://user-guides.prismic.io/en/articles/383762-rich-text)).
[Vue][vue] plugin and components to fetch and present [Prismic][prismic] content.
# What it does
- 📝 &nbsp;Display content from Prismic like [Rich Text][prismic-rich-text] and [Link][prismic-link] fields;
- 🍡 &nbsp;Render Prismic [Slice Zones][prismic-slices] declaratively with Vue components;
- 🎣 &nbsp;Fetch Prismic content using Vue [options-api].
This package serves two purposes and can actually be split into two different parts.
## Install
#### 1- Queries
The first purpose of `@prismicio/vue` is to offer an easy way to fetch your Prismic content. When registering `PrismicVue`, we directly inject a `@prismicio/client` instance, to be used anywhere in your Vue project.
``` javascript
import prismicJS from 'prismic-js';
const PrismicVue = {
install: function (Vue, options) {
Vue.prototype.$prismic = prismicJS
Vue.prototype.$prismic.endpoint = options.endpoint
Vue.prototype.$prismic.linkResolver = options.linkResolver
Vue.prototype.$prismic.client = prismicJS.client(options.endpoint, options.apiOptions)
...
}
}
```bash
npm install @prismicio/vue
```
### 2 - Components
## Documentation
The second purpose of `@prismicio/vue` is to globally register components that will help you _display content queried via your Prismic API_. Their purpose is (mostly) to serialize Prismic data into html. These components being used in other libraries (like `@nuxtjs/prismic`), note that you can actually import them without registering `PrismicVue`.
<!-- To discover what's new on this package check out [the changelog][changelog]. -->
For full documentation, visit the [official Prismic documentation][prismic-docs].
# Usage
## Contributing
This [getting started guide](https://prismic.io/docs/vuejs/getting-started/integrating-with-existing-project) should be of great help to kickstart your first Prismic/Vue project.
In case you're more into markdown, you can alternatevely keep reading ☺️
Whether you're helping us fix bugs, improve the docs, or spread the word, we'd love to have you as part of the Prismic developer community!
### 1/Register PrismicVue
First, you should register the plugin:
```javascript
import PrismicVue from '@prismicio/vue'
**Asking a question**: [Open a new topic][forum-question] on our community forum explaining what you want to achieve / your question. Our support team will get back to you shortly.
Vue.use(PrismicVue, {
endpoint: 'https://your-api-endpoint.prismic.io/api/v2',
linkResolver: function(doc) {
if (doc.type === 'home') {
return '/';
}
},
});
```
**Reporting a bug**: [Open an issue][repo-bug-report] explaining your application's setup and the bug you're encountering.
When registering the plugin, you may pass these options. Although `linkResolver` and `htmlSerializer` are not required, they are usually pretty useful. Make sure to check them out! ✌️
**Suggesting an improvement**: [Open an issue][repo-feature-request] explaining your improvement or feature so we can discuss and learn more.
**Submitting code changes**: For small fixes, feel free to [open a pull request][repo-pull-requests] with a description of your changes. For large changes, please first [open an issue][repo-feature-request] so we can discuss if and how the changes should be implemented.
| Option name | Type | Required | Default value | Description |
|---------------- |---------- |---------- |--------------- |---------------------------------------------------------------------------------------------------------------------- |
| endpoint | string | yes | none | Your Prismic api endpoint |
| linkResolver | function | no | none | See [Link Resolving in Javascript](https://prismic.io/docs/javascript/beyond-the-api/link-resolving) |
| htmlSerializer | function | no | none | See [html Serializer documentation](https://prismic.io/docs/javascript/beyond-the-api/html-serializer) |
| linkType | string | no | vueRouter | Link components may be handled differently based on what you use. Currently accepted values: 'vueRouter' and 'nuxt'. |
<!-- For more clarity on this project and its structure you can also check out the detailed [CONTRIBUTING.md][contributing] document. -->
### 2/Query your content
Because we inject a `@prismicio/client` instance into Vue, each of its method are accessible from your components. Make sure to check [its documentation](https://github.com/prismicio/prismic-javascript)!
## License
A bare bone example that fetches data from a `home` document and then sets a `fields` data object:
```javascript
export default {
name: 'MyComponent',
data() {
return {
fields: {
title: [],
logo: {},
somethingRich: []
}
}
},
methods: {
getContent () {
this.$prismic.client.getSingle('home')
.then((document) => {
this.fields = document.data
})
}
},
created () {
this.getContent();
}
}
```
Copyright 2013-2021 Prismic <contact@prismic.io> (https://prismic.io)
### 3/use components
Following the example above, let's write the associated template:
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
```html
<template>
<section>
<prismic-image :field="fields.logo" />
<prismic-rich-text :field="fields.title" />
<prismic-rich-text :field="fields.somethingRich" />
</section>
</template>
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
```
> :warning: In-dom templates don't support self-closing tags, close them manually instead, e.g.: `<prismic-image :field="fields.logo"></prismic-image>`
<!-- Links -->
👆 If you were to log `document.data` in our previous query, you would notice that `title` and `somethingRich` are actually arrays instead of strings. This is because Prismic provides content writers with a WYSIWYG editor. It's awesome for formatting text but harder to deal with on client side. Fortunately, `prismic-rich-text` is a component made to deal with this format.
[prismic]: https://prismic.io
Obviously, `prismic-image` works the same way on image fields, stored in your Prismic API.
<!-- TODO: Replace link with a more useful one if available -->
# List of components
[prismic-docs]: https://prismic.io/docs/technologies/vuejs
[changelog]: ./CHANGELOG.md
[contributing]: ./CONTRIBUTING.md
[vue]: https://v3.vuejs.org
[prismic-rich-text]: https://prismic.io/docs/core-concepts/rich-text-title
[prismic-link]: https://prismic.io/docs/core-concepts/link-content-relationship
[prismic-slices]: https://prismic.io/docs/core-concepts/slices
[vue-composition]: https://v3.vuejs.org/guide/composition-api-introduction.html
[vue-options]: https://v3.vuejs.org/guide/introduction.html
List of available components and use cases:
<!-- TODO: Replace link with a more useful one if available -->
[forum-question]: https://community.prismic.io/c/kits-and-dev-languages/vue-js/16
[repo-bug-report]: https://github.com/prismicio/prismic-vue/issues/new?assignees=&labels=bug&template=bug_report.md&title=
[repo-feature-request]: https://github.com/prismicio/prismic-vue/issues/new?assignees=&labels=enhancement&template=feature_request.md&title=
[repo-pull-requests]: https://github.com/prismicio/prismic-vue/pulls
| Component | Prismic type | Use case | Example use |
|------------------- |------------------- |------------------------------------------------------------------ |----------------------------------------------------------------------------------------------------- |
| prismic-rich-text | Rich Text, Title | Used when you need formatting fir text (bold, italic, embeds...) | `<prismic-rich-text :field="field.description" wrapper="div" :htmlSerializer="myLocalSerializer"/>` |
| prismic-link | Link | Used to resolve links stored in your Prismic content. | `<prismic-link :field="menuLink.link">My link</prismic-link>` |
| prismic-image | Image | Used to display images stored in Prismic. | `<prismic-image :field="fields.logo" />` |
| prismic-embed | Embed | Used to display embeds stored in Prismic. | `<prismic-embed :field="fields.embed" wrapper="div" />` |
<!-- Badges -->
👆 Make sure to have a look at their source code: it is quite short, does simple things and might help you understand how we convert a Prismic API response into something that can actually be committed to the DOM.
# Integrate @prismicio/vue components
If you are working on a `@prismicio/vue` integration (like Nuxt does for example), you might find the need to use the components, without using the actual `PrismicVue` plugin. We've got you covered:
```javascript
import { common, vueRouter, nuxt } from '@prismicio/vue/components';
console.log(common) // { Embed, Image, RichText ...}
console.log(nuxt) // { Link }
// etc.
Vue.prototype.$prismic = {
// because some components
// require a link resolver
linkResolver() { /* ... */}
}
// Register common components
Object.entries(common).forEach(([_, component]) => {
Vue.component(component.name, component)
})
```
Thanks for reading 👋
---
## License
This software is licensed under the Apache 2 license, quoted below.
Copyright 2013-2020 Prismic (http://prismic.io).
Licensed under the Apache License, Version 2.0 (the "License"); you may not use this project except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
[npm-version-src]: https://img.shields.io/npm/v/@prismicio/vue/latest.svg
[npm-version-href]: https://npmjs.com/package/@prismicio/vue
[npm-downloads-src]: https://img.shields.io/npm/dm/@prismicio/vue.svg
[npm-downloads-href]: https://npmjs.com/package/@prismicio/vue
[github-actions-ci-src]: https://github.com/prismicio/prismic-vue/workflows/ci/badge.svg
[github-actions-ci-href]: https://github.com/prismicio/prismic-vue/actions?query=workflow%3Aci
[codecov-src]: https://img.shields.io/codecov/c/github/prismicio/prismic-vue.svg
[codecov-href]: https://codecov.io/gh/prismicio/prismic-vue
[conventional-commits-src]: https://img.shields.io/badge/Conventional%20Commits-1.0.0-yellow.svg
[conventional-commits-href]: https://conventionalcommits.org
[license-src]: https://img.shields.io/npm/l/@prismicio/vue.svg
[license-href]: https://npmjs.com/package/@prismicio/vue

15

src/components-bundler.js

@@ -1,7 +0,12 @@

import exp from './components'
import exp from "./components";
export const common = exp.common
export const nuxt = exp.nuxt
export const vueRouter = exp.vueRouter
export {
getSliceComponentProps,
defineSliceZoneComponents,
} from "./components/SliceZone";
export default exp
export const common = exp.common;
export const nuxt = exp.nuxt;
export const vueRouter = exp.vueRouter;
export default exp;

48

src/components/index.js

@@ -1,27 +0,31 @@

import Embed from './Embed'
import Image from './Image'
import Link from './Link'
import RichText from './RichText'
import Embed from "./Embed";
import Image from "./Image";
import Link from "./Link";
import RichText from "./RichText";
import Text from "./Text";
import { SliceZone } from "./SliceZone";
const NuxtLink = Link({ component: 'nuxt-link' })
const VueRouterLink = Link({ component: 'router-link' })
const NuxtLink = Link({ component: "nuxt-link" });
const VueRouterLink = Link({ component: "router-link" });
const exp = {
common: {
Embed,
Image,
RichText,
},
nuxt: {
Link: NuxtLink,
},
vueRouter: {
Link: VueRouterLink,
}
}
common: {
Embed,
Image,
RichText,
Text,
SliceZone,
},
nuxt: {
Link: NuxtLink,
},
vueRouter: {
Link: VueRouterLink,
},
};
export const common = exp.common
export const nuxt = exp.nuxt
export const vueRouter = exp.vueRouter
export const common = exp.common;
export const nuxt = exp.nuxt;
export const vueRouter = exp.vueRouter;
export default exp
export default exp;

124

src/components/Link.js

@@ -1,51 +0,87 @@

import PrismicDom from 'prismic-dom'
import PrismicDom from "prismic-dom";
export default ({
component = 'a'
}) => ({
name: 'PrismicLink',
functional: true,
props: {
field: {
type: Object,
required: true,
},
linkResolver: {
type: Function,
required: false
}
},
render(h, { props, data, children, parent }) {
const { field, linkResolver } = props
const isInternalURL = (url) => {
/**
* @see Regex101 expression: {@link https://regex101.com/r/1y7iod/1}
*/
const isInternal = /^\/(?!\/)/.test(url);
/**
* @see Regex101 expression: {@link https://regex101.com/r/RnUseS/1}
*/
const isSpecialLink = !isInternal && !/^https?:\/\//i.test(url);
if (!field) {
return null
}
return isInternal && !isSpecialLink;
};
const url = parent.$prismic
? parent.$prismic.asLink(field, linkResolver)
: PrismicDom.Link.url(field, linkResolver || function() { return null; })
export default ({ component = "a" }) => ({
name: "PrismicLink",
functional: true,
props: {
field: {
type: Object,
required: true,
},
linkResolver: {
type: Function,
required: false,
},
target: {
type: String,
default: undefined,
required: false,
},
rel: {
type: String,
default: undefined,
required: false,
},
blankTargetRelAttribute: {
type: String,
default: "noopener",
required: false,
},
},
render(h, { props, data, children, parent }) {
const { field, linkResolver } = props;
if (url.indexOf('/') === 0) {
data.props = data.props || {};
data.props.to = url;
if (!field) {
return null;
}
return h(component, data, children);
}
const url = parent.$prismic
? parent.$prismic.asLink(field, linkResolver)
: PrismicDom.Link.url(
field,
linkResolver ||
function () {
return null;
}
);
data.attrs = {
...data.attrs,
href: url,
...field.target && {
target: field.target,
rel: 'noopener',
},
}
if (isInternalURL(url) && !props.target) {
data.props = data.props || {};
data.props.to = url;
return h(
'a',
data,
children,
);
}
})
return h(component, data, children);
}
data.attrs = {
...data.attrs,
href: url,
};
if (typeof props.target !== "undefined" || field.target) {
data.attrs.target =
typeof props.target !== "undefined" ? props.target : field.target;
if (data.attrs.target === "_blank") {
data.attrs.rel =
typeof props.rel !== "undefined"
? props.rel
: props.blankTargetRelAttribute;
}
}
return h("a", data, children);
},
});

81

src/components/RichText.js

@@ -1,45 +0,44 @@

import { RichText } from 'prismic-dom'
import { RichText } from "prismic-dom";
export default {
name: 'PrismicRichText',
functional: true,
props: {
field: {
type: Array,
required: true,
},
htmlSerializer: {
type: Function,
required: false,
},
wrapper: {
type: String,
required: false,
default: 'div',
}
},
render(h, {
props, data, children, parent
}) {
const { field, htmlSerializer, wrapper } = props
name: "PrismicRichText",
functional: true,
props: {
field: {
type: Array,
required: true,
},
linkResolver: {
type: Function,
required: false,
},
htmlSerializer: {
type: Function,
required: false,
},
wrapper: {
type: String,
required: false,
default: "div",
},
},
render(h, { props, data, parent }) {
const { field, linkResolver, htmlSerializer, wrapper } = props;
if (!field) {
return null
}
const innerHTML = RichText.asHtml(
field,
parent.$prismic.linkResolver,
htmlSerializer || parent.$prismic.htmlSerializer
)
if (!field) {
return null;
}
const innerHTML = RichText.asHtml(
field,
linkResolver || parent.$prismic.linkResolver,
htmlSerializer || parent.$prismic.htmlSerializer
);
return h(
wrapper,
{
...data,
domProps: {
innerHTML
},
},
)
}
}
return h(wrapper, {
...data,
domProps: {
innerHTML,
},
});
},
};

85

src/index.js

@@ -1,49 +0,56 @@

import prismicJS from '@prismicio/client'
import prismicJS from "@prismicio/client";
import Components from './components'
import { asHtml, asText, asDate, asLink } from './methods'
import Components from "./components";
import { asHtml, asText, asDate, asLink } from "./methods";
function attachMethods(Vue, options) {
Vue.prototype.$prismic.asHtml = function(richText, linkResolver, htmlSerializer) {
return asHtml(
richText,
linkResolver || options.linkResolver,
htmlSerializer || options.htmlSerializer
)
}
Vue.prototype.$prismic.asText = asText
Vue.prototype.$prismic.richTextAsPlain = asText
Vue.prototype.$prismic.asDate = asDate
Vue.prototype.$prismic.asLink = function(link, linkResolver) {
return asLink(link, linkResolver || options.linkResolver)
}
Vue.prototype.$prismic.asHtml = function(
richText,
linkResolver,
htmlSerializer
) {
return asHtml(
richText,
linkResolver || options.linkResolver,
htmlSerializer || options.htmlSerializer
);
};
Vue.prototype.$prismic.asHTML = Vue.prototype.$prismic.asHtml;
Vue.prototype.$prismic.asText = asText;
Vue.prototype.$prismic.richTextAsPlain = asText;
Vue.prototype.$prismic.asDate = asDate;
Vue.prototype.$prismic.asLink = function(link, linkResolver) {
return asLink(link, linkResolver || options.linkResolver);
};
}
const PrismicVue = {
install: function (Vue, options) {
const { linkType = 'vueRouter' } = options
Vue.prototype.$prismic = prismicJS
Vue.prototype.$prismic.endpoint = options.endpoint
Vue.prototype.$prismic.linkResolver = options.linkResolver
Vue.prototype.$prismic.htmlSerializer = options.htmlSerializer
Vue.prototype.$prismic.client = prismicJS.client(options.endpoint, options.apiOptions)
install: function(Vue, options) {
const { linkType = "vueRouter" } = options;
Vue.prototype.$prismic = prismicJS;
Vue.prototype.$prismic.endpoint = options.endpoint;
Vue.prototype.$prismic.linkResolver = options.linkResolver;
Vue.prototype.$prismic.htmlSerializer = options.htmlSerializer;
Vue.prototype.$prismic.client = prismicJS.client(
options.endpoint,
options.apiOptions
);
attachMethods(Vue, options)
attachMethods(Vue, options);
const components = {
...Components.common,
...Components[linkType]
}
const components = {
...Components.common,
...Components[linkType]
};
/**
* Global registration of common components + stack specific components.
* Currently, only Nuxt links differ though. Use `linkType: 'nuxt'` in that case.
*/
Object.entries(components)
.forEach(([_, c]) => {
Vue.component(c.name, c)
})
}
}
/**
* Global registration of common components + stack specific components.
* Currently, only Nuxt links differ though. Use `linkType: 'nuxt'` in that case.
*/
Object.entries(components).forEach(([_, c]) => {
Vue.component(c.name, c);
});
}
};
export default PrismicVue
export default PrismicVue;
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc