@prismicio/react 2.0.4 → 2.0.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/dist/index.js +429 -0
  2. package/package.json +1 -1
package/dist/index.js ADDED
@@ -0,0 +1,429 @@
1
+ import * as React from 'react';
2
+ import * as prismicH from '@prismicio/helpers';
3
+ import * as prismicR from '@prismicio/richtext';
4
+ import { Element } from '@prismicio/richtext';
5
+ export { Element } from '@prismicio/richtext';
6
+
7
+ const PrismicContext = React.createContext({});
8
+ const PrismicProvider = ({
9
+ client,
10
+ linkResolver,
11
+ richTextComponents,
12
+ internalLinkComponent,
13
+ externalLinkComponent,
14
+ children
15
+ }) => {
16
+ const value = React.useMemo(() => ({
17
+ client,
18
+ linkResolver,
19
+ richTextComponents,
20
+ internalLinkComponent,
21
+ externalLinkComponent
22
+ }), [
23
+ client,
24
+ linkResolver,
25
+ richTextComponents,
26
+ internalLinkComponent,
27
+ externalLinkComponent
28
+ ]);
29
+ return /* @__PURE__ */ React.createElement(PrismicContext.Provider, {
30
+ value
31
+ }, children);
32
+ };
33
+
34
+ const usePrismicContext = () => {
35
+ return React.useContext(PrismicContext) || {};
36
+ };
37
+
38
+ if (typeof process === "undefined") {
39
+ globalThis.process = { env: {} };
40
+ }
41
+ const __PRODUCTION__ = process.env.NODE_ENV === "production";
42
+
43
+ const prefix = "Invariant failed";
44
+ function invariant(condition, message) {
45
+ if (condition) {
46
+ return;
47
+ }
48
+ if (__PRODUCTION__) {
49
+ throw new Error(prefix);
50
+ }
51
+ throw new Error(`${prefix}: ${message || ""}`);
52
+ }
53
+
54
+ const usePrismicClient = (explicitClient) => {
55
+ const context = usePrismicContext();
56
+ const client = explicitClient || (context == null ? void 0 : context.client);
57
+ 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.");
58
+ return client;
59
+ };
60
+
61
+ const isInternalURL = (url) => {
62
+ const isInternal = /^(\/(?!\/)|#)/.test(url);
63
+ const isSpecialLink = !isInternal && !/^https?:\/\//.test(url);
64
+ return isInternal && !isSpecialLink;
65
+ };
66
+
67
+ const defaultInternalComponent = "a";
68
+ const defaultExternalComponent = "a";
69
+ const PrismicLink = (props) => {
70
+ const context = usePrismicContext();
71
+ const linkResolver = props.linkResolver || context.linkResolver;
72
+ let href;
73
+ if ("href" in props) {
74
+ href = props.href;
75
+ } else if ("document" in props && props.document) {
76
+ href = prismicH.asLink(props.document, linkResolver);
77
+ } else if ("field" in props && props.field) {
78
+ href = prismicH.asLink(props.field, linkResolver);
79
+ }
80
+ const target = props.target || "field" in props && props.field && "target" in props.field && props.field.target || void 0;
81
+ const rel = props.rel || (target === "_blank" ? "noopener noreferrer" : void 0);
82
+ const InternalComponent = props.internalComponent || context.internalLinkComponent || defaultInternalComponent;
83
+ const ExternalComponent = props.externalComponent || context.externalLinkComponent || defaultExternalComponent;
84
+ const isInternal = href && isInternalURL(href);
85
+ const Component = isInternal ? InternalComponent : ExternalComponent;
86
+ const passthroughProps = Object.assign({}, props);
87
+ delete passthroughProps.linkResolver;
88
+ delete passthroughProps.internalComponent;
89
+ delete passthroughProps.externalComponent;
90
+ delete passthroughProps.rel;
91
+ delete passthroughProps.target;
92
+ if ("field" in passthroughProps) {
93
+ delete passthroughProps.field;
94
+ } else if ("document" in passthroughProps) {
95
+ delete passthroughProps.document;
96
+ } else if ("href" in passthroughProps) {
97
+ delete passthroughProps.href;
98
+ }
99
+ return href ? /* @__PURE__ */ React.createElement(Component, {
100
+ ...passthroughProps,
101
+ href,
102
+ target,
103
+ rel
104
+ }) : null;
105
+ };
106
+
107
+ const PrismicText = (props) => {
108
+ return React.useMemo(() => {
109
+ if (props.field) {
110
+ const text = prismicH.asText(props.field, props.separator);
111
+ return /* @__PURE__ */ React.createElement(React.Fragment, null, text);
112
+ } else {
113
+ return null;
114
+ }
115
+ }, [props.field, props.separator]);
116
+ };
117
+
118
+ const createDefaultSerializer = (args) => prismicR.wrapMapSerializer({
119
+ heading1: ({ children, key }) => /* @__PURE__ */ React.createElement("h1", {
120
+ key
121
+ }, children),
122
+ heading2: ({ children, key }) => /* @__PURE__ */ React.createElement("h2", {
123
+ key
124
+ }, children),
125
+ heading3: ({ children, key }) => /* @__PURE__ */ React.createElement("h3", {
126
+ key
127
+ }, children),
128
+ heading4: ({ children, key }) => /* @__PURE__ */ React.createElement("h4", {
129
+ key
130
+ }, children),
131
+ heading5: ({ children, key }) => /* @__PURE__ */ React.createElement("h5", {
132
+ key
133
+ }, children),
134
+ heading6: ({ children, key }) => /* @__PURE__ */ React.createElement("h6", {
135
+ key
136
+ }, children),
137
+ paragraph: ({ children, key }) => /* @__PURE__ */ React.createElement("p", {
138
+ key
139
+ }, children),
140
+ preformatted: ({ node, key }) => /* @__PURE__ */ React.createElement("pre", {
141
+ key
142
+ }, node.text),
143
+ strong: ({ children, key }) => /* @__PURE__ */ React.createElement("strong", {
144
+ key
145
+ }, children),
146
+ em: ({ children, key }) => /* @__PURE__ */ React.createElement("em", {
147
+ key
148
+ }, children),
149
+ listItem: ({ children, key }) => /* @__PURE__ */ React.createElement("li", {
150
+ key
151
+ }, children),
152
+ oListItem: ({ children, key }) => /* @__PURE__ */ React.createElement("li", {
153
+ key
154
+ }, children),
155
+ list: ({ children, key }) => /* @__PURE__ */ React.createElement("ul", {
156
+ key
157
+ }, children),
158
+ oList: ({ children, key }) => /* @__PURE__ */ React.createElement("ol", {
159
+ key
160
+ }, children),
161
+ image: ({ node, key }) => {
162
+ var _a;
163
+ const img = /* @__PURE__ */ React.createElement("img", {
164
+ src: node.url,
165
+ alt: (_a = node.alt) != null ? _a : void 0,
166
+ "data-copyright": node.copyright ? node.copyright : void 0
167
+ });
168
+ return /* @__PURE__ */ React.createElement("p", {
169
+ key,
170
+ className: "block-img"
171
+ }, node.linkTo ? /* @__PURE__ */ React.createElement(PrismicLink, {
172
+ linkResolver: args.linkResolver,
173
+ internalComponent: args.internalLinkComponent,
174
+ externalComponent: args.externalLinkComponent,
175
+ field: node.linkTo
176
+ }, img) : img);
177
+ },
178
+ embed: ({ node, key }) => {
179
+ var _a;
180
+ return /* @__PURE__ */ React.createElement("div", {
181
+ key,
182
+ "data-oembed": node.oembed.embed_url,
183
+ "data-oembed-type": node.oembed.type,
184
+ "data-oembed-provider": node.oembed.provider_name,
185
+ dangerouslySetInnerHTML: { __html: (_a = node.oembed.html) != null ? _a : "" }
186
+ });
187
+ },
188
+ hyperlink: ({ node, children, key }) => /* @__PURE__ */ React.createElement(PrismicLink, {
189
+ key,
190
+ field: node.data,
191
+ linkResolver: args.linkResolver,
192
+ internalComponent: args.internalLinkComponent,
193
+ externalComponent: args.externalLinkComponent
194
+ }, children),
195
+ label: ({ node, children, key }) => /* @__PURE__ */ React.createElement("span", {
196
+ key,
197
+ className: node.data.label
198
+ }, children),
199
+ span: ({ text, key }) => {
200
+ const result = [];
201
+ let i = 0;
202
+ for (const line of text.split("\n")) {
203
+ if (i > 0) {
204
+ result.push(/* @__PURE__ */ React.createElement("br", {
205
+ key: `${i}__break`
206
+ }));
207
+ }
208
+ result.push(/* @__PURE__ */ React.createElement(React.Fragment, {
209
+ key: `${i}__line`
210
+ }, line));
211
+ i++;
212
+ }
213
+ return /* @__PURE__ */ React.createElement(React.Fragment, {
214
+ key
215
+ }, result);
216
+ }
217
+ });
218
+ const PrismicRichText = (props) => {
219
+ const context = usePrismicContext();
220
+ return React.useMemo(() => {
221
+ if (!props.field) {
222
+ return null;
223
+ } else {
224
+ const linkResolver = props.linkResolver || context.linkResolver;
225
+ 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({
226
+ linkResolver,
227
+ internalLinkComponent: props.internalLinkComponent,
228
+ externalLinkComponent: props.externalLinkComponent
229
+ }));
230
+ const serialized = prismicR.serialize(props.field, (type, node, text, children, key) => {
231
+ const result = serializer(type, node, text, children, key);
232
+ if (React.isValidElement(result) && result.key == null) {
233
+ return React.cloneElement(result, { key });
234
+ } else {
235
+ return result;
236
+ }
237
+ });
238
+ return /* @__PURE__ */ React.createElement(React.Fragment, null, serialized);
239
+ }
240
+ }, [
241
+ props.field,
242
+ props.internalLinkComponent,
243
+ props.externalLinkComponent,
244
+ props.components,
245
+ props.linkResolver,
246
+ context.linkResolver,
247
+ context.richTextComponents
248
+ ]);
249
+ };
250
+
251
+ const pascalCase = (input) => {
252
+ const camelCased = input.replace(/(?:-|_)(\w)/g, (_, c) => {
253
+ return c ? c.toUpperCase() : "";
254
+ });
255
+ return camelCased[0].toUpperCase() + camelCased.slice(1);
256
+ };
257
+
258
+ const TODOSliceComponent = __PRODUCTION__ ? () => null : ({
259
+ slice
260
+ }) => {
261
+ React.useEffect(() => {
262
+ console.warn(`[SliceZone] Could not find a component for Slice type "${slice.slice_type}"`, slice);
263
+ }, [slice]);
264
+ return /* @__PURE__ */ React.createElement("section", {
265
+ "data-slice-zone-todo-component": "",
266
+ "data-slice-type": slice.slice_type
267
+ }, "Could not find a component for Slice type \u201C", slice.slice_type, "\u201D");
268
+ };
269
+ const SliceZone = ({
270
+ slices = [],
271
+ components = {},
272
+ resolver,
273
+ defaultComponent = TODOSliceComponent,
274
+ context = {}
275
+ }) => {
276
+ const renderedSlices = React.useMemo(() => {
277
+ return slices.map((slice, index) => {
278
+ let Comp = components[slice.slice_type] || defaultComponent;
279
+ if (resolver) {
280
+ const resolvedComp = resolver({
281
+ slice,
282
+ sliceName: pascalCase(slice.slice_type),
283
+ i: index
284
+ });
285
+ if (resolvedComp) {
286
+ Comp = resolvedComp;
287
+ }
288
+ }
289
+ const key = `${index}-${JSON.stringify(slice)}`;
290
+ return /* @__PURE__ */ React.createElement(Comp, {
291
+ key,
292
+ slice,
293
+ index,
294
+ slices,
295
+ context
296
+ });
297
+ });
298
+ }, [components, context, defaultComponent, slices, resolver]);
299
+ return /* @__PURE__ */ React.createElement(React.Fragment, null, renderedSlices);
300
+ };
301
+
302
+ const PrismicToolbar = ({
303
+ repositoryName,
304
+ type = "new"
305
+ }) => {
306
+ const src = `https://static.cdn.prismic.io/prismic.js?repo=${repositoryName}${type === "new" ? "&new=true" : ""}`;
307
+ React.useEffect(() => {
308
+ const existingScript = document.querySelector(`script[src="${src}"]`);
309
+ if (!existingScript) {
310
+ const script = document.createElement("script");
311
+ script.src = src;
312
+ script.defer = true;
313
+ script.dataset.prismicToolbar = "";
314
+ script.dataset.repositoryName = repositoryName;
315
+ script.dataset.type = type;
316
+ document.body.appendChild(script);
317
+ }
318
+ }, [repositoryName, type, src]);
319
+ return null;
320
+ };
321
+
322
+ const reducer = (state, action) => {
323
+ switch (action[0]) {
324
+ case "start": {
325
+ return { state: "loading" };
326
+ }
327
+ case "succeed": {
328
+ return { state: "loaded", data: action[1] };
329
+ }
330
+ case "fail": {
331
+ return {
332
+ ...state,
333
+ state: "failed",
334
+ error: action[1]
335
+ };
336
+ }
337
+ }
338
+ };
339
+ const initialState = {
340
+ state: "idle"
341
+ };
342
+ const isParams = (value) => {
343
+ return typeof value === "object" && value !== null && !Array.isArray(value);
344
+ };
345
+ const useStatefulPrismicClientMethod = (methodName, args, explicitClient) => {
346
+ const lastArg = args[args.length - 1];
347
+ const {
348
+ client: lastArgExplicitClient,
349
+ skip,
350
+ ...params
351
+ } = isParams(lastArg) ? lastArg : {};
352
+ const argsWithoutParams = isParams(lastArg) ? args.slice(0, -1) : args;
353
+ const client = usePrismicClient(explicitClient || lastArgExplicitClient);
354
+ const [state, dispatch] = React.useReducer(reducer, initialState);
355
+ React.useEffect(() => {
356
+ if (!skip) {
357
+ {
358
+ dispatch(["start"]);
359
+ }
360
+ client[methodName].call(client, ...argsWithoutParams, params).then((result) => {
361
+ {
362
+ dispatch(["succeed", result]);
363
+ }
364
+ }).catch((error) => {
365
+ {
366
+ dispatch(["fail", error]);
367
+ }
368
+ });
369
+ }
370
+ }, [
371
+ client,
372
+ methodName,
373
+ skip,
374
+ JSON.stringify(argsWithoutParams),
375
+ JSON.stringify(params)
376
+ ]);
377
+ return React.useMemo(() => [
378
+ state.data,
379
+ {
380
+ state: state.state,
381
+ error: state.error
382
+ }
383
+ ], [state]);
384
+ };
385
+
386
+ const usePrismicPreviewResolver = (args = {}) => {
387
+ const context = usePrismicContext();
388
+ const linkResolver = args.linkResolver || context.linkResolver;
389
+ const result = useStatefulPrismicClientMethod("resolvePreviewURL", [
390
+ {
391
+ linkResolver,
392
+ defaultURL: args.defaultURL || "/",
393
+ previewToken: args.previewToken,
394
+ documentID: args.documentID
395
+ }
396
+ ], args.client);
397
+ const [resolvedURL] = result;
398
+ const { navigate } = args;
399
+ React.useEffect(() => {
400
+ if (resolvedURL && navigate) {
401
+ navigate(resolvedURL);
402
+ }
403
+ }, [resolvedURL, navigate]);
404
+ return result;
405
+ };
406
+
407
+ const usePrismicDocuments = (...args) => useStatefulPrismicClientMethod("get", args);
408
+ const useFirstPrismicDocument = (...args) => useStatefulPrismicClientMethod("getFirst", args);
409
+ const useAllPrismicDocumentsDangerously = (...args) => useStatefulPrismicClientMethod("dangerouslyGetAll", args);
410
+ const usePrismicDocumentByID = (...args) => useStatefulPrismicClientMethod("getByID", args);
411
+ const usePrismicDocumentsByIDs = (...args) => useStatefulPrismicClientMethod("getByIDs", args);
412
+ const useAllPrismicDocumentsByIDs = (...args) => useStatefulPrismicClientMethod("getAllByIDs", args);
413
+ const usePrismicDocumentByUID = (...args) => useStatefulPrismicClientMethod("getByUID", args);
414
+ const usePrismicDocumentsByUIDs = (...args) => useStatefulPrismicClientMethod("getByUIDs", args);
415
+ const useAllPrismicDocumentsByUIDs = (...args) => useStatefulPrismicClientMethod("getAllByUIDs", args);
416
+ const useSinglePrismicDocument = (...args) => useStatefulPrismicClientMethod("getSingle", args);
417
+ const usePrismicDocumentsByType = (...args) => useStatefulPrismicClientMethod("getByType", args);
418
+ const useAllPrismicDocumentsByType = (...args) => useStatefulPrismicClientMethod("getAllByType", args);
419
+ const usePrismicDocumentsByTag = (...args) => useStatefulPrismicClientMethod("getByTag", args);
420
+ const useAllPrismicDocumentsByTag = (...args) => useStatefulPrismicClientMethod("getAllByTag", args);
421
+ const usePrismicDocumentsBySomeTags = (...args) => useStatefulPrismicClientMethod("getBySomeTags", args);
422
+ const useAllPrismicDocumentsBySomeTags = (...args) => useStatefulPrismicClientMethod("getAllBySomeTags", args);
423
+ const usePrismicDocumentsByEveryTag = (...args) => useStatefulPrismicClientMethod("getByEveryTag", args);
424
+ const useAllPrismicDocumentsByEveryTag = (...args) => useStatefulPrismicClientMethod("getAllByEveryTag", args);
425
+
426
+ const Elements = Element;
427
+
428
+ 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 };
429
+ //# sourceMappingURL=index.mjs.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@prismicio/react",
3
- "version": "2.0.4",
3
+ "version": "2.0.5",
4
4
  "description": "React components and hooks to fetch and present Prismic content",
5
5
  "keywords": [
6
6
  "typescript",