@prismicio/vue 2.0.11 → 2.1.1

package/src/components/index.js

@@ -1,27 +1,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;

package/src/components-bundler.js

@@ -1,7 +1,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;

package/src/index.js

@@ -1,49 +1,61 @@
-import prismicJS from '@prismicio/client'
+import prismicJS from "@prismicio/client";
+const { client } = prismicJS;
 
-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.predicate = prismicJS.Predicates;
+		Vue.prototype.$prismic.cookie = {
+			preview: prismicJS.previewCookie,
+		};
+		Vue.prototype.$prismic.endpoint = options.endpoint;
+		Vue.prototype.$prismic.linkResolver = options.linkResolver;
+		Vue.prototype.$prismic.htmlSerializer = options.htmlSerializer;
+		Vue.prototype.$prismic.client = 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;

package/src/methods.js

@@ -1,31 +1,25 @@
-import PrismicDOM from 'prismic-dom'
+import PrismicDOM from "prismic-dom";
 
 export function asHtml(richText, linkResolver, htmlSerializer) {
-  if (richText) {
-    return PrismicDOM.RichText.asHtml(
-      richText,
-      linkResolver,
-      htmlSerializer
-    )
-  }
+	if (richText) {
+		return PrismicDOM.RichText.asHtml(richText, linkResolver, htmlSerializer);
+	}
 }
 export function asText(richText, joinString) {
-  if (richText) {
-    return PrismicDOM.RichText.asText(richText, joinString)
-  }
-  return ''
+	if (richText) {
+		return PrismicDOM.RichText.asText(richText, joinString);
+	}
+
+	return "";
 }
 
 export function asLink(link, linkResolver) {
-  if (link) {
-    return PrismicDOM.Link.url(
-      link,
-      linkResolver
-    )
-  }
+	if (link) {
+		return PrismicDOM.Link.url(link, linkResolver);
+	}
 }
 export function asDate(date) {
-  if (date) {
-    return PrismicDOM.Date(date)
-  }
-}
+	if (date) {
+		return PrismicDOM.Date(date);
+	}
+}

package/vetur/attributes.json

@@ -0,0 +1,86 @@
+{
+	"prismic-embed/field": {
+		"type": "object",
+		"description": "The Prismic embed field to render."
+	},
+	"prismic-embed/wrapper": {
+		"type": "string | object | function",
+		"description": "An HTML tag name, a component, or a functional component used to wrap the output. Defaults to `\"div\"`."
+	},
+
+	"prismic-image/field": {
+		"type": "object",
+		"description": "The Prismic image field to render."
+	},
+
+	"prismic-link/field": {
+		"type": "object",
+		"description": "The Prismic link field or document to render."
+	},
+	"prismic-link/link-resolver": {
+		"type": "function",
+		"description": "A link resolver function used to resolve links when not using the route resolver parameter with `@prismicio/client`. Defaults to the link resolver provided to `@prismicio/vue` plugin if configured."
+	},
+	"prismic-link/target": {
+		"type": "string",
+		"description": "An explicit `target` attribute to apply to the rendered link."
+	},
+	"prismic-link/rel": {
+		"type": "string",
+		"description": "An explicit `rel` attribute to apply to the rendered link."
+	},
+	"prismic-link/blank-target-rel-attribute": {
+		"type": "string",
+		"description": "Value of the `rel` attribute to use on links rendered with `target=\"_blank\"`. Defaults to the one provided to `@prismicio/vue` plugin if configured, `\"noopener noreferrer\"` otherwise."
+	},
+
+	"prismic-rich-text/field": {
+		"type": "array",
+		"description": "The Prismic rich text or title field to render."
+	},
+	"prismic-rich-text/link-resolver": {
+		"type": "function",
+		"description": "A link resolver function used to resolve links when not using the route resolver parameter with `@prismicio/client`. Defaults to the link resolver provided to `@prismicio/vue` plugin if configured."
+	},
+	"prismic-rich-text/html-serializer": {
+		"type": "function | object",
+		"description": "An HTML serializer to customize the way rich text fields are rendered. Defaults to the HTML serializer provided to `@prismicio/vue` plugin if configured."
+	},
+	"prismic-rich-text/wrapper": {
+		"type": "string | object | function",
+		"description": "An HTML tag name, a component, or a functional component used to wrap the output. Defaults to `\"div\"`."
+	},
+
+	"prismic-text/field": {
+		"type": "array",
+		"description": "The Prismic rich text or title field to render."
+	},
+	"prismic-text/separator": {
+		"type": "string",
+		"description": "Separator used to join each element. Defaults to `\" \"` (a space)"
+	},
+	"prismic-text/wrapper": {
+		"type": "string | object | function",
+		"description": "An HTML tag name, a component, or a functional component used to wrap the output. Defaults to `\"div\"`."
+	},
+
+	"slice-zone/slices": {
+		"type": "array",
+		"description": "List of Slice data from the Slice Zone."
+	},
+	"slice-zone/components": {
+		"type": "array",
+		"description": "A record mapping Slice types to Vue components."
+	},
+	"slice-zone/context": {
+		"description": "Arbitrary data made available to all Slice components."
+	},
+	"slice-zone/default-component": {
+		"type": "string | object | function",
+		"description": "A component or a functional component rendered if a component mapping from the `components` prop cannot be found. Defaults to the Slice Zone default component provided to `@prismicio/vue` plugin if configured, otherwise `null` when `process.env.NODE_ENV === \"production\"` else `\"todo-slice-component\"`"
+	},
+	"slice-zone/wrapper": {
+		"type": "string | object | function",
+		"description": "An HTML tag name, a component, or a functional component used to wrap the output. Defaults to `\"div\"`."
+	}
+}

package/vetur/tags.json

@@ -0,0 +1,38 @@
+{
+	"prismic-embed": {
+		"attributes": ["field", "wrapper"],
+		"description": "Component to render a Prismic embed field."
+	},
+	"prismic-image": {
+		"attributes": ["field"],
+		"description": "Component to render a Prismic image field."
+	},
+	"prismic-link": {
+		"attributes": [
+			"field",
+			"link-resolver",
+			"target",
+			"rel",
+			"blank-target-rel-attribute"
+		],
+		"description": "Component to render a Prismic link field."
+	},
+	"prismic-rich-text": {
+		"attributes": ["field", "link-resolver", "html-serializer", "wrapper"],
+		"description": "Component to render a Prismic rich text field as HTML."
+	},
+	"prismic-text": {
+		"attributes": ["field", "separator", "wrapper"],
+		"description": "Component to render a Prismic rich text field as plain text."
+	},
+	"slice-zone": {
+		"attributes": [
+			"slices",
+			"components",
+			"context",
+			"default-component",
+			"wrapper"
+		],
+		"description": "Component to render a Prismic Slice Zone."
+	}
+}