Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@contentful/live-preview

Package Overview
Dependencies
Maintainers
165
Versions
219
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@contentful/live-preview - npm Package Compare versions

Comparing version 1.17.1 to 2.0.0

dist/index-1a6c8643.cjs

13

dist/index.d.ts
import { InspectorMode } from './inspectorMode';
import { LiveUpdates } from './liveUpdates';
import { Argument, InspectorModeTags, LivePreviewProps, SubscribeCallback } from './types';
import { Argument, InspectorModeTags, LivePreviewProps, SubscribeCallback, Subscription } from './types';
export interface ContentfulLivePreviewInitConfig {
locale: string;
debugMode?: boolean;

@@ -9,2 +10,7 @@ enableInspectorMode?: boolean;

}
export interface ContentfulSubscribeConfig {
data: Argument;
locale: string;
callback: SubscribeCallback;
}
export declare class ContentfulLivePreview {

@@ -16,4 +22,5 @@ static initialized: boolean;

static liveUpdatesEnabled: boolean;
static init({ debugMode, enableInspectorMode, enableLiveUpdates, }?: ContentfulLivePreviewInitConfig): Promise<InspectorMode | null> | undefined;
static subscribe(data: Argument, locale: string, callback: SubscribeCallback): VoidFunction;
static locale: string;
static init({ locale, debugMode, enableInspectorMode, enableLiveUpdates, }: ContentfulLivePreviewInitConfig): Promise<InspectorMode | null> | undefined;
static subscribe(config: Subscription): VoidFunction;
static getProps({ fieldId, entryId, locale }: LivePreviewProps): InspectorModeTags;

@@ -20,0 +27,0 @@ static toggleInspectorMode(): boolean;

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

import { C as r } from "./index-64e479f0.js";
import { C as r } from "./index-524cd730.js";
export {

@@ -3,0 +3,0 @@ r as ContentfulLivePreview

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

import { Argument, SubscribeCallback } from './types';
import { ContentfulSubscribeConfig } from '.';
/**

@@ -35,3 +35,3 @@ * LiveUpdates for the Contentful Live Preview mode

*/
subscribe(data: Argument, locale: string, cb: SubscribeCallback): VoidFunction;
subscribe({ data, locale, callback }: ContentfulSubscribeConfig): VoidFunction;
}
import { type PropsWithChildren, type ReactElement } from 'react';
import { ContentfulLivePreviewInitConfig } from '.';
import { ContentfulLivePreviewInitConfig } from './index';
import { Argument, InspectorModeTags, LivePreviewProps } from './types';

@@ -8,3 +8,3 @@ /**

*/
export declare function ContentfulLivePreviewProvider({ children, debugMode, enableInspectorMode, enableLiveUpdates, }: PropsWithChildren<ContentfulLivePreviewInitConfig>): ReactElement;
export declare function ContentfulLivePreviewProvider({ children, locale, debugMode, enableInspectorMode, enableLiveUpdates, }: PropsWithChildren<ContentfulLivePreviewInitConfig>): ReactElement;
/**

@@ -16,3 +16,3 @@ * Receives updates directly from the Contentful Editor inside the LivePreview

*/
export declare function useContentfulLiveUpdates<T extends Argument | null | undefined>(data: T, locale: string, skip?: boolean): T;
export declare function useContentfulLiveUpdates<T extends Argument | null | undefined>(data: T, locale?: string, skip?: boolean): T;
type GetInspectorModeProps<T> = (props: {

@@ -19,0 +19,0 @@ [K in Exclude<keyof LivePreviewProps, keyof T>]: LivePreviewProps[K];

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

import * as V from "react";
import ke, { createContext as pr, useState as gr, useRef as Oe, useContext as De, useMemo as hr, useCallback as yr } from "react";
import { C as Q, d as mr } from "./index-64e479f0.js";
import * as U from "react";
import ke, { createContext as gr, useMemo as De, useState as hr, useRef as Oe, useContext as Ae, useCallback as yr } from "react";
import { C as Q, d as mr } from "./index-524cd730.js";
var Z = { exports: {} }, F = {};

@@ -19,12 +19,12 @@ /**

Pe = 1;
var n = ke, a = Symbol.for("react.element"), s = Symbol.for("react.fragment"), o = Object.prototype.hasOwnProperty, v = n.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, w = { key: !0, ref: !0, __self: !0, __source: !0 };
function O(R, g, T) {
var h, _ = {}, P = null, W = null;
T !== void 0 && (P = "" + T), g.key !== void 0 && (P = "" + g.key), g.ref !== void 0 && (W = g.ref);
var n = ke, a = Symbol.for("react.element"), s = Symbol.for("react.fragment"), u = Object.prototype.hasOwnProperty, v = n.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, _ = { key: !0, ref: !0, __self: !0, __source: !0 };
function O(R, g, w) {
var h, b = {}, P = null, W = null;
w !== void 0 && (P = "" + w), g.key !== void 0 && (P = "" + g.key), g.ref !== void 0 && (W = g.ref);
for (h in g)
o.call(g, h) && !w.hasOwnProperty(h) && (_[h] = g[h]);
u.call(g, h) && !_.hasOwnProperty(h) && (b[h] = g[h]);
if (R && R.defaultProps)
for (h in g = R.defaultProps, g)
_[h] === void 0 && (_[h] = g[h]);
return { $$typeof: a, type: R, key: P, ref: W, props: _, _owner: v.current };
b[h] === void 0 && (b[h] = g[h]);
return { $$typeof: a, type: R, key: P, ref: W, props: b, _owner: v.current };
}

@@ -46,7 +46,7 @@ return F.Fragment = s, F.jsx = O, F.jsxs = O, F;

return Se || (Se = 1, process.env.NODE_ENV !== "production" && function() {
var n = ke, a = Symbol.for("react.element"), s = Symbol.for("react.portal"), o = Symbol.for("react.fragment"), v = Symbol.for("react.strict_mode"), w = Symbol.for("react.profiler"), O = Symbol.for("react.provider"), R = Symbol.for("react.context"), g = Symbol.for("react.forward_ref"), T = Symbol.for("react.suspense"), h = Symbol.for("react.suspense_list"), _ = Symbol.for("react.memo"), P = Symbol.for("react.lazy"), W = Symbol.for("react.offscreen"), re = Symbol.iterator, Ae = "@@iterator";
function Fe(e) {
var n = ke, a = Symbol.for("react.element"), s = Symbol.for("react.portal"), u = Symbol.for("react.fragment"), v = Symbol.for("react.strict_mode"), _ = Symbol.for("react.profiler"), O = Symbol.for("react.provider"), R = Symbol.for("react.context"), g = Symbol.for("react.forward_ref"), w = Symbol.for("react.suspense"), h = Symbol.for("react.suspense_list"), b = Symbol.for("react.memo"), P = Symbol.for("react.lazy"), W = Symbol.for("react.offscreen"), re = Symbol.iterator, Fe = "@@iterator";
function Ie(e) {
if (e === null || typeof e != "object")
return null;
var r = re && e[re] || e[Ae];
var r = re && e[re] || e[Fe];
return typeof r == "function" ? r : null;

@@ -59,6 +59,6 @@ }

t[i - 1] = arguments[i];
Ie("error", e, t);
Le("error", e, t);
}
}
function Ie(e, r, t) {
function Le(e, r, t) {
{

@@ -73,6 +73,6 @@ var i = j.ReactDebugCurrentFrame, l = i.getStackAddendum();

}
var Le = !1, We = !1, Ye = !1, $e = !1, Me = !1, te;
var We = !1, Ye = !1, $e = !1, Me = !1, Ne = !1, te;
te = Symbol.for("react.module.reference");
function Ne(e) {
return !!(typeof e == "string" || typeof e == "function" || e === o || e === w || Me || e === v || e === T || e === h || $e || e === W || Le || We || Ye || typeof e == "object" && e !== null && (e.$$typeof === P || e.$$typeof === _ || e.$$typeof === O || e.$$typeof === R || e.$$typeof === g || // This needs to include all possible module reference object
function Ve(e) {
return !!(typeof e == "string" || typeof e == "function" || e === u || e === _ || Ne || e === v || e === w || e === h || Me || e === W || We || Ye || $e || typeof e == "object" && e !== null && (e.$$typeof === P || e.$$typeof === b || e.$$typeof === O || e.$$typeof === R || e.$$typeof === g || // This needs to include all possible module reference object
// types supported by any Flight configuration anywhere since

@@ -93,3 +93,3 @@ // we don't know which Flight build this will end up being used

}
function b(e) {
function C(e) {
if (e == null)

@@ -102,11 +102,11 @@ return null;

switch (e) {
case o:
case u:
return "Fragment";
case s:
return "Portal";
case w:
case _:
return "Profiler";
case v:
return "StrictMode";
case T:
case w:
return "Suspense";

@@ -126,9 +126,9 @@ case h:

return Ue(e, e.render, "ForwardRef");
case _:
case b:
var i = e.displayName || null;
return i !== null ? i : b(e.type) || "Memo";
return i !== null ? i : C(e.type) || "Memo";
case P: {
var l = e, c = l._payload, f = l._init;
try {
return b(f(c));
return C(f(c));
} catch {

@@ -145,3 +145,3 @@ return null;

ce.__reactDisabledLog = !0;
function Ve() {
function Be() {
{

@@ -169,3 +169,3 @@ if (D === 0) {

}
function Be() {
function ze() {
{

@@ -221,4 +221,4 @@ if (D--, D === 0) {

{
var ze = typeof WeakMap == "function" ? WeakMap : Map;
$ = new ze();
var qe = typeof WeakMap == "function" ? WeakMap : Map;
$ = new qe();
}

@@ -238,3 +238,3 @@ function ve(e, r) {

var c;
c = B.current, B.current = null, Ve();
c = B.current, B.current = null, Be();
try {

@@ -252,4 +252,4 @@ if (r) {

Reflect.construct(f, []);
} catch (C) {
i = C;
} catch (T) {
i = T;
}

@@ -260,4 +260,4 @@ Reflect.construct(e, [], f);

f.call();
} catch (C) {
i = C;
} catch (T) {
i = T;
}

@@ -269,20 +269,20 @@ e.call(f.prototype);

throw Error();
} catch (C) {
i = C;
} catch (T) {
i = T;
}
e();
}
} catch (C) {
if (C && i && typeof C.stack == "string") {
for (var u = C.stack.split(`
} catch (T) {
if (T && i && typeof T.stack == "string") {
for (var o = T.stack.split(`
`), m = i.stack.split(`
`), d = u.length - 1, p = m.length - 1; d >= 1 && p >= 0 && u[d] !== m[p]; )
`), d = o.length - 1, p = m.length - 1; d >= 1 && p >= 0 && o[d] !== m[p]; )
p--;
for (; d >= 1 && p >= 0; d--, p--)
if (u[d] !== m[p]) {
if (o[d] !== m[p]) {
if (d !== 1 || p !== 1)
do
if (d--, p--, p < 0 || u[d] !== m[p]) {
if (d--, p--, p < 0 || o[d] !== m[p]) {
var E = `
` + u[d].replace(" at new ", " at ");
` + o[d].replace(" at new ", " at ");
return e.displayName && E.includes("<anonymous>") && (E = E.replace("<anonymous>", e.displayName)), typeof e == "function" && $.set(e, E), E;

@@ -295,3 +295,3 @@ }

} finally {
q = !1, B.current = c, Be(), Error.prepareStackTrace = l;
q = !1, B.current = c, ze(), Error.prepareStackTrace = l;
}

@@ -301,6 +301,6 @@ var k = e ? e.displayName || e.name : "", we = k ? Y(k) : "";

}
function qe(e, r, t) {
function Je(e, r, t) {
return ve(e, !1);
}
function Je(e) {
function Ge(e) {
var r = e.prototype;

@@ -313,7 +313,7 @@ return !!(r && r.isReactComponent);

if (typeof e == "function")
return ve(e, Je(e));
return ve(e, Ge(e));
if (typeof e == "string")
return Y(e);
switch (e) {
case T:
case w:
return Y("Suspense");

@@ -326,4 +326,4 @@ case h:

case g:
return qe(e.render);
case _:
return Je(e.render);
case b:
return M(e.type, r, t);

@@ -341,3 +341,3 @@ case P: {

var N = Object.prototype.hasOwnProperty, de = {}, pe = j.ReactDebugCurrentFrame;
function U(e) {
function V(e) {
if (e) {

@@ -349,3 +349,3 @@ var r = e._owner, t = M(e.type, e._source, r ? r.type : null);

}
function Ge(e, r, t, i, l) {
function Ke(e, r, t, i, l) {
{

@@ -355,3 +355,3 @@ var c = Function.call.bind(N);

if (c(e, f)) {
var u = void 0;
var o = void 0;
try {

@@ -362,15 +362,15 @@ if (typeof e[f] != "function") {

}
u = e[f](r, f, i, t, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
o = e[f](r, f, i, t, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
} catch (d) {
u = d;
o = d;
}
u && !(u instanceof Error) && (U(l), y("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", i || "React class", t, f, typeof u), U(null)), u instanceof Error && !(u.message in de) && (de[u.message] = !0, U(l), y("Failed %s type: %s", t, u.message), U(null));
o && !(o instanceof Error) && (V(l), y("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", i || "React class", t, f, typeof o), V(null)), o instanceof Error && !(o.message in de) && (de[o.message] = !0, V(l), y("Failed %s type: %s", t, o.message), V(null));
}
}
}
var Ke = Array.isArray;
var He = Array.isArray;
function J(e) {
return Ke(e);
return He(e);
}
function He(e) {
function Xe(e) {
{

@@ -381,3 +381,3 @@ var r = typeof Symbol == "function" && Symbol.toStringTag, t = r && e[Symbol.toStringTag] || e.constructor.name || "Object";

}
function Xe(e) {
function Ze(e) {
try {

@@ -393,6 +393,6 @@ return ge(e), !1;

function he(e) {
if (Xe(e))
return y("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", He(e)), ge(e);
if (Ze(e))
return y("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", Xe(e)), ge(e);
}
var A = j.ReactCurrentOwner, Ze = {
var A = j.ReactCurrentOwner, Qe = {
key: !0,

@@ -404,3 +404,3 @@ ref: !0,

G = {};
function Qe(e) {
function er(e) {
if (N.call(e, "ref")) {

@@ -413,3 +413,3 @@ var r = Object.getOwnPropertyDescriptor(e, "ref").get;

}
function er(e) {
function rr(e) {
if (N.call(e, "key")) {

@@ -422,9 +422,9 @@ var r = Object.getOwnPropertyDescriptor(e, "key").get;

}
function rr(e, r) {
function tr(e, r) {
if (typeof e.ref == "string" && A.current && r && A.current.stateNode !== r) {
var t = b(A.current.type);
G[t] || (y('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref', b(A.current.type), e.ref), G[t] = !0);
var t = C(A.current.type);
G[t] || (y('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref', C(A.current.type), e.ref), G[t] = !0);
}
}
function tr(e, r) {
function nr(e, r) {
{

@@ -440,3 +440,3 @@ var t = function() {

}
function nr(e, r) {
function ar(e, r) {
{

@@ -452,4 +452,4 @@ var t = function() {

}
var ar = function(e, r, t, i, l, c, f) {
var u = {
var ir = function(e, r, t, i, l, c, f) {
var o = {
// This tag allows us to uniquely identify this as a React Element

@@ -465,3 +465,3 @@ $$typeof: a,

};
return u._store = {}, Object.defineProperty(u._store, "validated", {
return o._store = {}, Object.defineProperty(o._store, "validated", {
configurable: !1,

@@ -471,3 +471,3 @@ enumerable: !1,

value: !1
}), Object.defineProperty(u, "_self", {
}), Object.defineProperty(o, "_self", {
configurable: !1,

@@ -477,3 +477,3 @@ enumerable: !1,

value: i
}), Object.defineProperty(u, "_source", {
}), Object.defineProperty(o, "_source", {
configurable: !1,

@@ -483,10 +483,10 @@ enumerable: !1,

value: l
}), Object.freeze && (Object.freeze(u.props), Object.freeze(u)), u;
}), Object.freeze && (Object.freeze(o.props), Object.freeze(o)), o;
};
function ir(e, r, t, i, l) {
function ur(e, r, t, i, l) {
{
var c, f = {}, u = null, m = null;
t !== void 0 && (he(t), u = "" + t), er(r) && (he(r.key), u = "" + r.key), Qe(r) && (m = r.ref, rr(r, l));
var c, f = {}, o = null, m = null;
t !== void 0 && (he(t), o = "" + t), rr(r) && (he(r.key), o = "" + r.key), er(r) && (m = r.ref, tr(r, l));
for (c in r)
N.call(r, c) && !Ze.hasOwnProperty(c) && (f[c] = r[c]);
N.call(r, c) && !Qe.hasOwnProperty(c) && (f[c] = r[c]);
if (e && e.defaultProps) {

@@ -497,7 +497,7 @@ var d = e.defaultProps;

}
if (u || m) {
if (o || m) {
var p = typeof e == "function" ? e.displayName || e.name || "Unknown" : e;
u && tr(f, p), m && nr(f, p);
o && nr(f, p), m && ar(f, p);
}
return ar(e, u, m, l, i, A.current, f);
return ir(e, o, m, l, i, A.current, f);
}

@@ -521,3 +521,3 @@ }

if (K.current) {
var e = b(K.current.type);
var e = C(K.current.type);
if (e)

@@ -531,3 +531,3 @@ return `

}
function ur(e) {
function or(e) {
{

@@ -544,3 +544,3 @@ if (e !== void 0) {

var _e = {};
function or(e) {
function sr(e) {
{

@@ -562,3 +562,3 @@ var r = Re();

e._store.validated = !0;
var t = or(r);
var t = sr(r);
if (_e[t])

@@ -568,3 +568,3 @@ return;

var i = "";
e && e._owner && e._owner !== K.current && (i = " It was passed a child from " + b(e._owner.type) + "."), x(e), y('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', t, i), x(null);
e && e._owner && e._owner !== K.current && (i = " It was passed a child from " + C(e._owner.type) + "."), x(e), y('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', t, i), x(null);
}

@@ -584,3 +584,3 @@ }

else if (e) {
var l = Fe(e);
var l = Ie(e);
if (typeof l == "function" && l !== e.entries)

@@ -592,3 +592,3 @@ for (var c = l.call(e), f; !(f = c.next()).done; )

}
function sr(e) {
function fr(e) {
{

@@ -603,3 +603,3 @@ var r = e.type;

// Inner props are checked in the reconciler.
r.$$typeof === _))
r.$$typeof === b))
t = r.propTypes;

@@ -609,7 +609,7 @@ else

if (t) {
var i = b(r);
Ge(t, e.props, "prop", i, e);
var i = C(r);
Ke(t, e.props, "prop", i, e);
} else if (r.PropTypes !== void 0 && !H) {
H = !0;
var l = b(r);
var l = C(r);
y("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", l || "Unknown");

@@ -620,3 +620,3 @@ }

}
function fr(e) {
function lr(e) {
{

@@ -635,12 +635,12 @@ for (var r = Object.keys(e.props), t = 0; t < r.length; t++) {

{
var f = Ne(e);
var f = Ve(e);
if (!f) {
var u = "";
(e === void 0 || typeof e == "object" && e !== null && Object.keys(e).length === 0) && (u += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
var m = ur(l);
m ? u += m : u += Re();
var o = "";
(e === void 0 || typeof e == "object" && e !== null && Object.keys(e).length === 0) && (o += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
var m = or(l);
m ? o += m : o += Re();
var d;
e === null ? d = "null" : J(e) ? d = "array" : e !== void 0 && e.$$typeof === a ? (d = "<" + (b(e.type) || "Unknown") + " />", u = " Did you accidentally export a JSX literal instead of a component?") : d = typeof e, y("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", d, u);
e === null ? d = "null" : J(e) ? d = "array" : e !== void 0 && e.$$typeof === a ? (d = "<" + (C(e.type) || "Unknown") + " />", o = " Did you accidentally export a JSX literal instead of a component?") : d = typeof e, y("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", d, o);
}
var p = ir(e, r, t, l, c);
var p = ur(e, r, t, l, c);
if (p == null)

@@ -661,13 +661,13 @@ return p;

}
return e === o ? fr(p) : sr(p), p;
return e === u ? lr(p) : fr(p), p;
}
}
function lr(e, r, t) {
function cr(e, r, t) {
return Te(e, r, t, !0);
}
function cr(e, r, t) {
function vr(e, r, t) {
return Te(e, r, t, !1);
}
var vr = cr, dr = lr;
I.Fragment = o, I.jsx = vr, I.jsxs = dr;
var dr = vr, pr = cr;
I.Fragment = u, I.jsx = dr, I.jsxs = pr;
}()), I;

@@ -683,3 +683,3 @@ }

function L(n, a) {
var s, o, v;
var s, u, v;
if (n === a)

@@ -693,6 +693,6 @@ return !0;

if (s === Array) {
if ((o = n.length) === a.length)
for (; o-- && L(n[o], a[o]); )
if ((u = n.length) === a.length)
for (; u-- && L(n[u], a[u]); )
;
return o === -1;
return u === -1;
}

@@ -702,4 +702,4 @@ if (s === Set) {

return !1;
for (o of n)
if (v = o, v && typeof v == "object" && (v = xe(a, v), !v) || !a.has(v))
for (u of n)
if (v = u, v && typeof v == "object" && (v = xe(a, v), !v) || !a.has(v))
return !1;

@@ -711,4 +711,4 @@ return !0;

return !1;
for (o of n)
if (v = o[0], v && typeof v == "object" && (v = xe(a, v), !v) || !L(o[1], a.get(v)))
for (u of n)
if (v = u[0], v && typeof v == "object" && (v = xe(a, v), !v) || !L(u[1], a.get(v)))
return !1;

@@ -720,19 +720,19 @@ return !0;

else if (s === DataView) {
if ((o = n.byteLength) === a.byteLength)
for (; o-- && n.getInt8(o) === a.getInt8(o); )
if ((u = n.byteLength) === a.byteLength)
for (; u-- && n.getInt8(u) === a.getInt8(u); )
;
return o === -1;
return u === -1;
}
if (ArrayBuffer.isView(n)) {
if ((o = n.byteLength) === a.byteLength)
for (; o-- && n[o] === a[o]; )
if ((u = n.byteLength) === a.byteLength)
for (; u-- && n[u] === a[u]; )
;
return o === -1;
return u === -1;
}
if (!s || typeof n == "object") {
o = 0;
u = 0;
for (s in n)
if (je.call(n, s) && ++o && !je.call(a, s) || !(s in a) || !L(n[s], a[s]))
if (je.call(n, s) && ++u && !je.call(a, s) || !(s in a) || !L(n[s], a[s]))
return !1;
return Object.keys(a).length === o;
return Object.keys(a).length === u;
}

@@ -743,4 +743,4 @@ }

function br(n) {
var a = V.useRef(n), s = V.useRef(0);
return L(n, a.current) || (a.current = n, s.current += 1), V.useMemo(function() {
var a = U.useRef(n), s = U.useRef(0);
return L(n, a.current) || (a.current = n, s.current += 1), U.useMemo(function() {
return a.current;

@@ -750,30 +750,34 @@ }, [s.current]);

function Cr(n, a) {
return V.useEffect(n, br(a));
return U.useEffect(n, br(a));
}
const ee = pr(null);
const ee = gr(null);
function Or({
children: n,
debugMode: a = !1,
enableInspectorMode: s = !0,
enableLiveUpdates: o = !0
locale: a,
debugMode: s = !1,
enableInspectorMode: u = !0,
enableLiveUpdates: v = !0
}) {
return Q.init({ debugMode: a, enableInspectorMode: s, enableLiveUpdates: o }), /* @__PURE__ */ _r.jsx(
ee.Provider,
{
value: { debugMode: a, enableInspectorMode: s, enableLiveUpdates: o },
children: n
}
Q.init({ locale: a, debugMode: s, enableInspectorMode: u, enableLiveUpdates: v });
const _ = De(
() => ({ locale: a, debugMode: s, enableInspectorMode: u, enableLiveUpdates: v }),
[a, s, u, v]
);
return /* @__PURE__ */ _r.jsx(ee.Provider, { value: _, children: n });
}
function Pr(n, a, s = !1) {
const [o, v] = gr({ data: n, version: 1 }), w = Oe(n), O = Oe(mr(v)), R = De(ee), g = hr(() => R && !R.enableLiveUpdates || s ? !1 : !!(Array.isArray(n) && n.length || n && typeof n == "object" && Object.keys(n).length), [R, s, n]);
const [u, v] = hr({ data: n, version: 1 }), _ = Oe(n), O = Oe(mr(v)), R = Ae(ee), g = De(() => R && !R.enableLiveUpdates || s ? !1 : !!(Array.isArray(n) && n.length || n && typeof n == "object" && Object.keys(n).length), [R, s, n]);
return Cr(() => {
if (w.current !== n && (v({ data: n, version: 1 }), w.current = n), !!g)
return Q.subscribe(n, a, (T) => {
O.current((h) => ({ data: T, version: h.version++ }));
if (_.current !== n && (v({ data: n, version: 1 }), _.current = n), !!g)
return Q.subscribe({
data: n,
locale: a,
callback: (w) => {
O.current((h) => ({ data: w, version: h.version++ }));
}
});
}, [n, g]), o.data;
}, [n, g]), u.data;
}
function Sr(n) {
const a = De(ee);
const a = Ae(ee);
return yr(

@@ -780,0 +784,0 @@ (s) => a != null && a.enableInspectorMode ? Q.getProps({ ...n, ...s }) : null,

@@ -7,3 +7,3 @@ import type { AssetProps, EntryProps, ContentTypeProps } from 'contentful-management';

entryId: string;
locale: string;
locale?: string;
};

@@ -88,2 +88,7 @@ export declare const enum TagAttributes {

};
export interface Subscription {
data: Argument;
locale: string;
callback: SubscribeCallback;
}
export {};
{
"name": "@contentful/live-preview",
"version": "1.17.1",
"version": "2.0.0",
"author": "Contentful GmbH",

@@ -63,3 +63,3 @@ "license": "MIT",

"@testing-library/react": "14.0.0",
"@types/node": "^18.14.0",
"@types/node": "^20.1.0",
"@types/react": "^18.0.27",

@@ -82,3 +82,3 @@ "@types/react-dom": "^18.0.10",

"vite-plugin-dts": "^2.0.1",
"vitest": "^0.30.0"
"vitest": "^0.31.0"
},

@@ -85,0 +85,0 @@ "peerDependencies": {

@@ -36,3 +36,3 @@ # @contentful/live-preview

ContentfulLivePreview.init();
ContentfulLivePreview.init({ locale: 'en-US'});
```

@@ -50,2 +50,3 @@

ContentfulLivePreview.init({
locale: 'set-your-locale-here' // This is required and allows you to set the locale once and have it reused throughout the preview
enableInspectorMode: false, // This allows you to toggle the inspector mode which is on by default

@@ -57,5 +58,23 @@ enableLiveUpdates: false, // This allows you to toggle the live updates which is on by default

#### Overriding Locale
It is possible to override the locale you set in the init command for a more flexible workflow. If you need to override the locale you can do so either in the getProps command like below:
```jsx
ContentfulLivePreview.getProps({ entryId: id, fieldId: 'title', locale: 'fr' });
```
You can also override it when using our useContentfulLiveUpdates hook like below:
```tsx
import { useContentfulLiveUpdates } from '@contentful/live-preview/react';
// ...
const updated = useContentfulLiveUpdates(originalData, locale);
// ...
```
### Inspector Mode (field tagging)
To use the inspector mode, you need to tag fields by adding the live preview data-attributes (`data-contentful-entry-id`, `data-contentful-field-id`, `data-contentful-locale`) to the rendered HTML element output.
To use the inspector mode, you need to tag fields by adding the live preview data-attributes (`data-contentful-entry-id`, `data-contentful-field-id`) to the rendered HTML element output.

@@ -71,3 +90,3 @@ You can do this in React via our helper function.

<h1 {...ContentfulLivePreview.getProps({ entryId: id, fieldId: 'title', locale })}>
<h1 {...ContentfulLivePreview.getProps({ entryId: id, fieldId: 'title' })}>
{title}

@@ -86,3 +105,3 @@ </h1>

// ...
const updated = useContentfulLiveUpdates(originalData, locale);
const updated = useContentfulLiveUpdates(originalData);
// ...

@@ -108,3 +127,3 @@ ```

2. Initialize the SDK with the `ContentfulLivePreviewProvider` and add the stylesheet for field tagging inside `_app.tsx` or `_app.js`.
The `ContentfulLivePreviewProvider` accepts the same arguments as the [init function](#init-configuration).
The `ContentfulLivePreviewProvider` accepts the same arguments as the [init function](#init-configuration).

@@ -116,3 +135,3 @@ ```tsx

const CustomApp = ({ Component, pageProps }) => (
<ContentfulLivePreviewProvider>
<ContentfulLivePreviewProvider locale="en-US">
<Component {...pageProps}>

@@ -124,2 +143,3 @@ </ContentfulLivePreviewProvider>

This provides the posibility to only enable live updates and the inspector mode inside the preview mode:
```tsx

@@ -130,3 +150,3 @@ import '@contentful/live-preview/style.css';

const CustomApp = ({ Component, pageProps }) => (
<ContentfulLivePreviewProvider enableInspectorMode={pageProps.previewActive} enableLiveUpdates={pageProps.previewActive}>
<ContentfulLivePreviewProvider locale="en-US" enableInspectorMode={pageProps.previewActive} enableLiveUpdates={pageProps.previewActive}>
<Component {...pageProps}>

@@ -144,4 +164,3 @@ </ContentfulLivePreviewProvider>

const data = useContentfulLiveUpdates(
blogPost,
locale
blogPost
);

@@ -158,3 +177,2 @@

fieldId: 'text',
locale,
})}>

@@ -174,3 +192,3 @@ {data.text}

export default function BlogPost: ({ blogPost }) {
const inspectorProps = useContentfulInspectorMode({ entryId: data.sys.id, locale })
const inspectorProps = useContentfulInspectorMode({ entryId: data.sys.id })

@@ -218,8 +236,8 @@ return (

import React from "react";
import React from 'react';
import { ContentfulLivePreview } from '@contentful/live-preview/react';
export const wrapRootElement = ({ element }) => (
<ContentfulLivePreviewProvider>{element}</ContentfulLivePreviewProvider>
)
<ContentfulLivePreviewProvider locale="en-US">{element}</ContentfulLivePreviewProvider>
);
```

@@ -263,11 +281,8 @@

export default function Hero({ contentful_id, ...props }) {
const inspectorProps = useContentfulInspectorMode()
const inspectorProps = useContentfulInspectorMode();
// Live updates for this component
const data = useContentfulLiveUpdates(
{
...props,
sys: { id: props.contentful_id },
},
locale
);
const data = useContentfulLiveUpdates({
...props,
sys: { id: props.contentful_id },
});

@@ -283,3 +298,2 @@ return (

fieldId: 'text',
locale,
})}>

@@ -286,0 +300,0 @@ {data.text}

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

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

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc