@prismicio/react 2.0.3-debug.2 → 2.0.5

package/dist/index.js

@@ -0,0 +1,429 @@
+import * as React from 'react';
+import * as prismicH from '@prismicio/helpers';
+import * as prismicR from '@prismicio/richtext';
+import { Element } from '@prismicio/richtext';
+export { Element } from '@prismicio/richtext';
+
+const PrismicContext = React.createContext({});
+const PrismicProvider = ({
+  client,
+  linkResolver,
+  richTextComponents,
+  internalLinkComponent,
+  externalLinkComponent,
+  children
+}) => {
+  const value = React.useMemo(() => ({
+    client,
+    linkResolver,
+    richTextComponents,
+    internalLinkComponent,
+    externalLinkComponent
+  }), [
+    client,
+    linkResolver,
+    richTextComponents,
+    internalLinkComponent,
+    externalLinkComponent
+  ]);
+  return /* @__PURE__ */ React.createElement(PrismicContext.Provider, {
+    value
+  }, children);
+};
+
+const usePrismicContext = () => {
+  return React.useContext(PrismicContext) || {};
+};
+
+if (typeof process === "undefined") {
+  globalThis.process = { env: {} };
+}
+const __PRODUCTION__ = process.env.NODE_ENV === "production";
+
+const prefix = "Invariant failed";
+function invariant(condition, message) {
+  if (condition) {
+    return;
+  }
+  if (__PRODUCTION__) {
+    throw new Error(prefix);
+  }
+  throw new Error(`${prefix}: ${message || ""}`);
+}
+
+const usePrismicClient = (explicitClient) => {
+  const context = usePrismicContext();
+  const client = explicitClient || (context == null ? void 0 : context.client);
+  invariant(client, "A @prismicio/client is required to query documents. Provide a client to the hook or to a <PrismicProvider> higher in your component tree.");
+  return client;
+};
+
+const isInternalURL = (url) => {
+  const isInternal = /^(\/(?!\/)|#)/.test(url);
+  const isSpecialLink = !isInternal && !/^https?:\/\//.test(url);
+  return isInternal && !isSpecialLink;
+};
+
+const defaultInternalComponent = "a";
+const defaultExternalComponent = "a";
+const PrismicLink = (props) => {
+  const context = usePrismicContext();
+  const linkResolver = props.linkResolver || context.linkResolver;
+  let href;
+  if ("href" in props) {
+    href = props.href;
+  } else if ("document" in props && props.document) {
+    href = prismicH.asLink(props.document, linkResolver);
+  } else if ("field" in props && props.field) {
+    href = prismicH.asLink(props.field, linkResolver);
+  }
+  const target = props.target || "field" in props && props.field && "target" in props.field && props.field.target || void 0;
+  const rel = props.rel || (target === "_blank" ? "noopener noreferrer" : void 0);
+  const InternalComponent = props.internalComponent || context.internalLinkComponent || defaultInternalComponent;
+  const ExternalComponent = props.externalComponent || context.externalLinkComponent || defaultExternalComponent;
+  const isInternal = href && isInternalURL(href);
+  const Component = isInternal ? InternalComponent : ExternalComponent;
+  const passthroughProps = Object.assign({}, props);
+  delete passthroughProps.linkResolver;
+  delete passthroughProps.internalComponent;
+  delete passthroughProps.externalComponent;
+  delete passthroughProps.rel;
+  delete passthroughProps.target;
+  if ("field" in passthroughProps) {
+    delete passthroughProps.field;
+  } else if ("document" in passthroughProps) {
+    delete passthroughProps.document;
+  } else if ("href" in passthroughProps) {
+    delete passthroughProps.href;
+  }
+  return href ? /* @__PURE__ */ React.createElement(Component, {
+    ...passthroughProps,
+    href,
+    target,
+    rel
+  }) : null;
+};
+
+const PrismicText = (props) => {
+  return React.useMemo(() => {
+    if (props.field) {
+      const text = prismicH.asText(props.field, props.separator);
+      return /* @__PURE__ */ React.createElement(React.Fragment, null, text);
+    } else {
+      return null;
+    }
+  }, [props.field, props.separator]);
+};
+
+const createDefaultSerializer = (args) => prismicR.wrapMapSerializer({
+  heading1: ({ children, key }) => /* @__PURE__ */ React.createElement("h1", {
+    key
+  }, children),
+  heading2: ({ children, key }) => /* @__PURE__ */ React.createElement("h2", {
+    key
+  }, children),
+  heading3: ({ children, key }) => /* @__PURE__ */ React.createElement("h3", {
+    key
+  }, children),
+  heading4: ({ children, key }) => /* @__PURE__ */ React.createElement("h4", {
+    key
+  }, children),
+  heading5: ({ children, key }) => /* @__PURE__ */ React.createElement("h5", {
+    key
+  }, children),
+  heading6: ({ children, key }) => /* @__PURE__ */ React.createElement("h6", {
+    key
+  }, children),
+  paragraph: ({ children, key }) => /* @__PURE__ */ React.createElement("p", {
+    key
+  }, children),
+  preformatted: ({ node, key }) => /* @__PURE__ */ React.createElement("pre", {
+    key
+  }, node.text),
+  strong: ({ children, key }) => /* @__PURE__ */ React.createElement("strong", {
+    key
+  }, children),
+  em: ({ children, key }) => /* @__PURE__ */ React.createElement("em", {
+    key
+  }, children),
+  listItem: ({ children, key }) => /* @__PURE__ */ React.createElement("li", {
+    key
+  }, children),
+  oListItem: ({ children, key }) => /* @__PURE__ */ React.createElement("li", {
+    key
+  }, children),
+  list: ({ children, key }) => /* @__PURE__ */ React.createElement("ul", {
+    key
+  }, children),
+  oList: ({ children, key }) => /* @__PURE__ */ React.createElement("ol", {
+    key
+  }, children),
+  image: ({ node, key }) => {
+    var _a;
+    const img = /* @__PURE__ */ React.createElement("img", {
+      src: node.url,
+      alt: (_a = node.alt) != null ? _a : void 0,
+      "data-copyright": node.copyright ? node.copyright : void 0
+    });
+    return /* @__PURE__ */ React.createElement("p", {
+      key,
+      className: "block-img"
+    }, node.linkTo ? /* @__PURE__ */ React.createElement(PrismicLink, {
+      linkResolver: args.linkResolver,
+      internalComponent: args.internalLinkComponent,
+      externalComponent: args.externalLinkComponent,
+      field: node.linkTo
+    }, img) : img);
+  },
+  embed: ({ node, key }) => {
+    var _a;
+    return /* @__PURE__ */ React.createElement("div", {
+      key,
+      "data-oembed": node.oembed.embed_url,
+      "data-oembed-type": node.oembed.type,
+      "data-oembed-provider": node.oembed.provider_name,
+      dangerouslySetInnerHTML: { __html: (_a = node.oembed.html) != null ? _a : "" }
+    });
+  },
+  hyperlink: ({ node, children, key }) => /* @__PURE__ */ React.createElement(PrismicLink, {
+    key,
+    field: node.data,
+    linkResolver: args.linkResolver,
+    internalComponent: args.internalLinkComponent,
+    externalComponent: args.externalLinkComponent
+  }, children),
+  label: ({ node, children, key }) => /* @__PURE__ */ React.createElement("span", {
+    key,
+    className: node.data.label
+  }, children),
+  span: ({ text, key }) => {
+    const result = [];
+    let i = 0;
+    for (const line of text.split("\n")) {
+      if (i > 0) {
+        result.push(/* @__PURE__ */ React.createElement("br", {
+          key: `${i}__break`
+        }));
+      }
+      result.push(/* @__PURE__ */ React.createElement(React.Fragment, {
+        key: `${i}__line`
+      }, line));
+      i++;
+    }
+    return /* @__PURE__ */ React.createElement(React.Fragment, {
+      key
+    }, result);
+  }
+});
+const PrismicRichText = (props) => {
+  const context = usePrismicContext();
+  return React.useMemo(() => {
+    if (!props.field) {
+      return null;
+    } else {
+      const linkResolver = props.linkResolver || context.linkResolver;
+      const serializer = prismicR.composeSerializers(typeof props.components === "object" ? prismicR.wrapMapSerializer(props.components) : props.components, typeof context.richTextComponents === "object" ? prismicR.wrapMapSerializer(context.richTextComponents) : context.richTextComponents, createDefaultSerializer({
+        linkResolver,
+        internalLinkComponent: props.internalLinkComponent,
+        externalLinkComponent: props.externalLinkComponent
+      }));
+      const serialized = prismicR.serialize(props.field, (type, node, text, children, key) => {
+        const result = serializer(type, node, text, children, key);
+        if (React.isValidElement(result) && result.key == null) {
+          return React.cloneElement(result, { key });
+        } else {
+          return result;
+        }
+      });
+      return /* @__PURE__ */ React.createElement(React.Fragment, null, serialized);
+    }
+  }, [
+    props.field,
+    props.internalLinkComponent,
+    props.externalLinkComponent,
+    props.components,
+    props.linkResolver,
+    context.linkResolver,
+    context.richTextComponents
+  ]);
+};
+
+const pascalCase = (input) => {
+  const camelCased = input.replace(/(?:-|_)(\w)/g, (_, c) => {
+    return c ? c.toUpperCase() : "";
+  });
+  return camelCased[0].toUpperCase() + camelCased.slice(1);
+};
+
+const TODOSliceComponent = __PRODUCTION__ ? () => null : ({
+  slice
+}) => {
+  React.useEffect(() => {
+    console.warn(`[SliceZone] Could not find a component for Slice type "${slice.slice_type}"`, slice);
+  }, [slice]);
+  return /* @__PURE__ */ React.createElement("section", {
+    "data-slice-zone-todo-component": "",
+    "data-slice-type": slice.slice_type
+  }, "Could not find a component for Slice type \u201C", slice.slice_type, "\u201D");
+};
+const SliceZone = ({
+  slices = [],
+  components = {},
+  resolver,
+  defaultComponent = TODOSliceComponent,
+  context = {}
+}) => {
+  const renderedSlices = React.useMemo(() => {
+    return slices.map((slice, index) => {
+      let Comp = components[slice.slice_type] || defaultComponent;
+      if (resolver) {
+        const resolvedComp = resolver({
+          slice,
+          sliceName: pascalCase(slice.slice_type),
+          i: index
+        });
+        if (resolvedComp) {
+          Comp = resolvedComp;
+        }
+      }
+      const key = `${index}-${JSON.stringify(slice)}`;
+      return /* @__PURE__ */ React.createElement(Comp, {
+        key,
+        slice,
+        index,
+        slices,
+        context
+      });
+    });
+  }, [components, context, defaultComponent, slices, resolver]);
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, renderedSlices);
+};
+
+const PrismicToolbar = ({
+  repositoryName,
+  type = "new"
+}) => {
+  const src = `https://static.cdn.prismic.io/prismic.js?repo=${repositoryName}${type === "new" ? "&new=true" : ""}`;
+  React.useEffect(() => {
+    const existingScript = document.querySelector(`script[src="${src}"]`);
+    if (!existingScript) {
+      const script = document.createElement("script");
+      script.src = src;
+      script.defer = true;
+      script.dataset.prismicToolbar = "";
+      script.dataset.repositoryName = repositoryName;
+      script.dataset.type = type;
+      document.body.appendChild(script);
+    }
+  }, [repositoryName, type, src]);
+  return null;
+};
+
+const reducer = (state, action) => {
+  switch (action[0]) {
+    case "start": {
+      return { state: "loading" };
+    }
+    case "succeed": {
+      return { state: "loaded", data: action[1] };
+    }
+    case "fail": {
+      return {
+        ...state,
+        state: "failed",
+        error: action[1]
+      };
+    }
+  }
+};
+const initialState = {
+  state: "idle"
+};
+const isParams = (value) => {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+};
+const useStatefulPrismicClientMethod = (methodName, args, explicitClient) => {
+  const lastArg = args[args.length - 1];
+  const {
+    client: lastArgExplicitClient,
+    skip,
+    ...params
+  } = isParams(lastArg) ? lastArg : {};
+  const argsWithoutParams = isParams(lastArg) ? args.slice(0, -1) : args;
+  const client = usePrismicClient(explicitClient || lastArgExplicitClient);
+  const [state, dispatch] = React.useReducer(reducer, initialState);
+  React.useEffect(() => {
+    if (!skip) {
+      {
+        dispatch(["start"]);
+      }
+      client[methodName].call(client, ...argsWithoutParams, params).then((result) => {
+        {
+          dispatch(["succeed", result]);
+        }
+      }).catch((error) => {
+        {
+          dispatch(["fail", error]);
+        }
+      });
+    }
+  }, [
+    client,
+    methodName,
+    skip,
+    JSON.stringify(argsWithoutParams),
+    JSON.stringify(params)
+  ]);
+  return React.useMemo(() => [
+    state.data,
+    {
+      state: state.state,
+      error: state.error
+    }
+  ], [state]);
+};
+
+const usePrismicPreviewResolver = (args = {}) => {
+  const context = usePrismicContext();
+  const linkResolver = args.linkResolver || context.linkResolver;
+  const result = useStatefulPrismicClientMethod("resolvePreviewURL", [
+    {
+      linkResolver,
+      defaultURL: args.defaultURL || "/",
+      previewToken: args.previewToken,
+      documentID: args.documentID
+    }
+  ], args.client);
+  const [resolvedURL] = result;
+  const { navigate } = args;
+  React.useEffect(() => {
+    if (resolvedURL && navigate) {
+      navigate(resolvedURL);
+    }
+  }, [resolvedURL, navigate]);
+  return result;
+};
+
+const usePrismicDocuments = (...args) => useStatefulPrismicClientMethod("get", args);
+const useFirstPrismicDocument = (...args) => useStatefulPrismicClientMethod("getFirst", args);
+const useAllPrismicDocumentsDangerously = (...args) => useStatefulPrismicClientMethod("dangerouslyGetAll", args);
+const usePrismicDocumentByID = (...args) => useStatefulPrismicClientMethod("getByID", args);
+const usePrismicDocumentsByIDs = (...args) => useStatefulPrismicClientMethod("getByIDs", args);
+const useAllPrismicDocumentsByIDs = (...args) => useStatefulPrismicClientMethod("getAllByIDs", args);
+const usePrismicDocumentByUID = (...args) => useStatefulPrismicClientMethod("getByUID", args);
+const usePrismicDocumentsByUIDs = (...args) => useStatefulPrismicClientMethod("getByUIDs", args);
+const useAllPrismicDocumentsByUIDs = (...args) => useStatefulPrismicClientMethod("getAllByUIDs", args);
+const useSinglePrismicDocument = (...args) => useStatefulPrismicClientMethod("getSingle", args);
+const usePrismicDocumentsByType = (...args) => useStatefulPrismicClientMethod("getByType", args);
+const useAllPrismicDocumentsByType = (...args) => useStatefulPrismicClientMethod("getAllByType", args);
+const usePrismicDocumentsByTag = (...args) => useStatefulPrismicClientMethod("getByTag", args);
+const useAllPrismicDocumentsByTag = (...args) => useStatefulPrismicClientMethod("getAllByTag", args);
+const usePrismicDocumentsBySomeTags = (...args) => useStatefulPrismicClientMethod("getBySomeTags", args);
+const useAllPrismicDocumentsBySomeTags = (...args) => useStatefulPrismicClientMethod("getAllBySomeTags", args);
+const usePrismicDocumentsByEveryTag = (...args) => useStatefulPrismicClientMethod("getByEveryTag", args);
+const useAllPrismicDocumentsByEveryTag = (...args) => useStatefulPrismicClientMethod("getAllByEveryTag", args);
+
+const Elements = Element;
+
+export { Elements, PrismicLink, PrismicProvider, PrismicRichText, PrismicText, PrismicToolbar, SliceZone, TODOSliceComponent, useAllPrismicDocumentsByEveryTag, useAllPrismicDocumentsByIDs, useAllPrismicDocumentsBySomeTags, useAllPrismicDocumentsByTag, useAllPrismicDocumentsByType, useAllPrismicDocumentsByUIDs, useAllPrismicDocumentsDangerously, useFirstPrismicDocument, usePrismicClient, usePrismicContext, usePrismicDocumentByID, usePrismicDocumentByUID, usePrismicDocuments, usePrismicDocumentsByEveryTag, usePrismicDocumentsByIDs, usePrismicDocumentsBySomeTags, usePrismicDocumentsByTag, usePrismicDocumentsByType, usePrismicDocumentsByUIDs, usePrismicPreviewResolver, useSinglePrismicDocument };
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs

@@ -1,11 +1,10 @@
 import * as React from 'react';
-import { createContext, useMemo, useContext, Fragment, useEffect, useReducer } from 'react';
 import * as prismicH from '@prismicio/helpers';
 import * as prismicR from '@prismicio/richtext';
 import { Element } from '@prismicio/richtext';
 export { Element } from '@prismicio/richtext';
 
-const PrismicContext = createContext({});
+const PrismicContext = React.createContext({});
 const PrismicProvider = ({
   client,
   linkResolver,
@@ -14,7 +13,7 @@ const PrismicProvider = ({
   externalLinkComponent,
   children
 }) => {
-  const value = useMemo(() => ({
+  const value = React.useMemo(() => ({
     client,
     linkResolver,
     richTextComponents,
@@ -33,7 +32,7 @@ const PrismicProvider = ({
 };
 
 const usePrismicContext = () => {
-  return useContext(PrismicContext) || {};
+  return React.useContext(PrismicContext) || {};
 };
 
 if (typeof process === "undefined") {
@@ -106,7 +105,7 @@ const PrismicLink = (props) => {
 };
 
 const PrismicText = (props) => {
-  return useMemo(() => {
+  return React.useMemo(() => {
     if (props.field) {
       const text = prismicH.asText(props.field, props.separator);
       return /* @__PURE__ */ React.createElement(React.Fragment, null, text);
@@ -206,30 +205,36 @@ const createDefaultSerializer = (args) => prismicR.wrapMapSerializer({
           key: `${i}__break`
         }));
       }
-      result.push(/* @__PURE__ */ React.createElement(Fragment, {
+      result.push(/* @__PURE__ */ React.createElement(React.Fragment, {
         key: `${i}__line`
       }, line));
       i++;
     }
-    return /* @__PURE__ */ React.createElement(Fragment, {
+    return /* @__PURE__ */ React.createElement(React.Fragment, {
       key
     }, result);
   }
 });
 const PrismicRichText = (props) => {
   const context = usePrismicContext();
-  return useMemo(() => {
+  return React.useMemo(() => {
     if (!props.field) {
       return null;
     } else {
       const linkResolver = props.linkResolver || context.linkResolver;
-      const defaultSerializer = createDefaultSerializer({
+      const serializer = prismicR.composeSerializers(typeof props.components === "object" ? prismicR.wrapMapSerializer(props.components) : props.components, typeof context.richTextComponents === "object" ? prismicR.wrapMapSerializer(context.richTextComponents) : context.richTextComponents, createDefaultSerializer({
         linkResolver,
         internalLinkComponent: props.internalLinkComponent,
         externalLinkComponent: props.externalLinkComponent
+      }));
+      const serialized = prismicR.serialize(props.field, (type, node, text, children, key) => {
+        const result = serializer(type, node, text, children, key);
+        if (React.isValidElement(result) && result.key == null) {
+          return React.cloneElement(result, { key });
+        } else {
+          return result;
+        }
       });
-      const serializer = prismicR.composeSerializers(typeof props.components === "object" ? prismicR.wrapMapSerializer(props.components) : props.components, typeof context.richTextComponents === "object" ? prismicR.wrapMapSerializer(context.richTextComponents) : context.richTextComponents, defaultSerializer);
-      const serialized = prismicR.serialize(props.field, serializer);
       return /* @__PURE__ */ React.createElement(React.Fragment, null, serialized);
     }
   }, [
@@ -253,7 +258,7 @@ const pascalCase = (input) => {
 const TODOSliceComponent = __PRODUCTION__ ? () => null : ({
   slice
 }) => {
-  useEffect(() => {
+  React.useEffect(() => {
     console.warn(`[SliceZone] Could not find a component for Slice type "${slice.slice_type}"`, slice);
   }, [slice]);
   return /* @__PURE__ */ React.createElement("section", {
@@ -268,7 +273,7 @@ const SliceZone = ({
   defaultComponent = TODOSliceComponent,
   context = {}
 }) => {
-  const renderedSlices = useMemo(() => {
+  const renderedSlices = React.useMemo(() => {
     return slices.map((slice, index) => {
       let Comp = components[slice.slice_type] || defaultComponent;
       if (resolver) {
@@ -299,7 +304,7 @@ const PrismicToolbar = ({
   type = "new"
 }) => {
   const src = `https://static.cdn.prismic.io/prismic.js?repo=${repositoryName}${type === "new" ? "&new=true" : ""}`;
-  useEffect(() => {
+  React.useEffect(() => {
     const existingScript = document.querySelector(`script[src="${src}"]`);
     if (!existingScript) {
       const script = document.createElement("script");
@@ -346,8 +351,8 @@ const useStatefulPrismicClientMethod = (methodName, args, explicitClient) => {
   } = isParams(lastArg) ? lastArg : {};
   const argsWithoutParams = isParams(lastArg) ? args.slice(0, -1) : args;
   const client = usePrismicClient(explicitClient || lastArgExplicitClient);
-  const [state, dispatch] = useReducer(reducer, initialState);
-  useEffect(() => {
+  const [state, dispatch] = React.useReducer(reducer, initialState);
+  React.useEffect(() => {
     if (!skip) {
       {
         dispatch(["start"]);
@@ -369,7 +374,7 @@ const useStatefulPrismicClientMethod = (methodName, args, explicitClient) => {
     JSON.stringify(argsWithoutParams),
     JSON.stringify(params)
   ]);
-  return useMemo(() => [
+  return React.useMemo(() => [
     state.data,
     {
       state: state.state,
@@ -391,7 +396,7 @@ const usePrismicPreviewResolver = (args = {}) => {
   ], args.client);
   const [resolvedURL] = result;
   const { navigate } = args;
-  useEffect(() => {
+  React.useEffect(() => {
     if (resolvedURL && navigate) {
       navigate(resolvedURL);
     }