@storyblok/react 1.0.3 → 1.0.6
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.
- package/README.md +3 -3
- package/dist/storyblok-react.js +3 -3
- package/dist/storyblok-react.mjs +254 -245
- package/package.json +11 -11
package/README.md
CHANGED
|
@@ -204,10 +204,10 @@ You can **choose the features to use** when you initialize the plugin. In that w
|
|
|
204
204
|
|
|
205
205
|
#### Storyblok API
|
|
206
206
|
|
|
207
|
-
You can use an `apiOptions` object. This is passed down to the
|
|
207
|
+
You can use an `apiOptions` object. This is passed down to the [storyblok-js-client config object](https://github.com/storyblok/storyblok-js-client#class-storyblok):
|
|
208
208
|
|
|
209
209
|
```js
|
|
210
|
-
|
|
210
|
+
storyblokInit({
|
|
211
211
|
accessToken: "YOUR_ACCESS_TOKEN",
|
|
212
212
|
apiOptions: {
|
|
213
213
|
// storyblok-js-client config object
|
|
@@ -231,7 +231,7 @@ storyblokInit({});
|
|
|
231
231
|
|
|
232
232
|
#### Storyblok Bridge
|
|
233
233
|
|
|
234
|
-
If you don't use `
|
|
234
|
+
If you don't use `useStoryblokBridge`, you still have access to the raw `window.StoryblokBridge`:
|
|
235
235
|
|
|
236
236
|
```js
|
|
237
237
|
const sbBridge = new window.StoryblokBridge(options);
|
package/dist/storyblok-react.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
var
|
|
2
|
-
* storyblok-js-client
|
|
1
|
+
(function(l,h){typeof exports=="object"&&typeof module!="undefined"?h(exports,require("react"),require("axios")):typeof define=="function"&&define.amd?define(["exports","react","axios"],h):(l=typeof globalThis!="undefined"?globalThis:l||self,h(l.storyblokReact={},l.React,l.e))})(this,function(l,h,p){"use strict";var it=Object.defineProperty;var v=Object.getOwnPropertySymbols;var N=Object.prototype.hasOwnProperty,x=Object.prototype.propertyIsEnumerable;var M=(l,h,p)=>h in l?it(l,h,{enumerable:!0,configurable:!0,writable:!0,value:p}):l[h]=p,q=(l,h)=>{for(var p in h||(h={}))N.call(h,p)&&M(l,p,h[p]);if(v)for(var p of v(h))x.call(h,p)&&M(l,p,h[p]);return l};var B=(l,h)=>{var p={};for(var f in l)N.call(l,f)&&h.indexOf(f)<0&&(p[f]=l[f]);if(l!=null&&v)for(var f of v(l))h.indexOf(f)<0&&x.call(l,f)&&(p[f]=l[f]);return p};function f(o){return o&&typeof o=="object"&&"default"in o?o:{default:o}}var S=f(h),L=f(p),D=Object.defineProperty,z=Object.defineProperties,U=Object.getOwnPropertyDescriptors,E=Object.getOwnPropertySymbols,V=Object.prototype.hasOwnProperty,J=Object.prototype.propertyIsEnumerable,P=(o,t,e)=>t in o?D(o,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):o[t]=e,g=(o,t)=>{for(var e in t||(t={}))V.call(t,e)&&P(o,e,t[e]);if(E)for(var e of E(t))J.call(t,e)&&P(o,e,t[e]);return o},_=(o,t)=>z(o,U(t));let O=!1;const $=[],Y=o=>new Promise((t,e)=>{if(typeof window=="undefined"||(window.storyblokRegisterEvent=s=>{if(window.location===window.parent.location){console.warn("You are not in Draft Mode or in the Visual Editor.");return}O?s():$.push(s)},document.getElementById("storyblok-javascript-bridge")))return;const r=document.createElement("script");r.async=!0,r.src=o,r.id="storyblok-javascript-bridge",r.onerror=s=>e(s),r.onload=s=>{$.forEach(n=>n()),O=!0,t(s)},document.getElementsByTagName("head")[0].appendChild(r)});/*!
|
|
2
|
+
* storyblok-js-client v4.5.2
|
|
3
3
|
* Universal JavaScript SDK for Storyblok's API
|
|
4
4
|
* (c) 2020-2022 Stobylok Team
|
|
5
|
-
*/function C(s){return typeof s=="number"&&s==s&&s!==1/0&&s!==-1/0}function A(s,e,t){if(!C(e))throw new TypeError("Expected `limit` to be a finite number");if(!C(t))throw new TypeError("Expected `interval` to be a finite number");var r=[],o=[],n=0,i=function(){n++;var u=setTimeout(function(){n--,r.length>0&&i(),o=o.filter(function(d){return d!==u})},t);o.indexOf(u)<0&&o.push(u);var c=r.shift();c.resolve(s.apply(c.self,c.args))},a=function(){var u=arguments,c=this;return new Promise(function(d,k){r.push({resolve:d,reject:k,args:u,self:c}),n<e&&i()})};return a.abort=function(){o.forEach(clearTimeout),o=[],r.forEach(function(u){u.reject(new throttle.AbortError)}),r.length=0},a}A.AbortError=function(){Error.call(this,"Throttled function aborted"),this.name="AbortError"};const H=function(s,e){if(!s)return null;let t={};for(let r in s){let o=s[r];e.indexOf(r)>-1&&o!==null&&(t[r]=o)}return t};var F={nodes:{horizontal_rule:s=>({singleTag:"hr"}),blockquote:s=>({tag:"blockquote"}),bullet_list:s=>({tag:"ul"}),code_block:s=>({tag:["pre",{tag:"code",attrs:s.attrs}]}),hard_break:s=>({singleTag:"br"}),heading:s=>({tag:"h"+s.attrs.level}),image:s=>({singleTag:[{tag:"img",attrs:H(s.attrs,["src","alt","title"])}]}),list_item:s=>({tag:"li"}),ordered_list:s=>({tag:"ol"}),paragraph:s=>({tag:"p"})},marks:{bold:()=>({tag:"b"}),strike:()=>({tag:"strike"}),underline:()=>({tag:"u"}),strong:()=>({tag:"strong"}),code:()=>({tag:"code"}),italic:()=>({tag:"i"}),link(s){const e=g({},s.attrs),{linktype:t="url"}=s.attrs;return t==="email"&&(e.href="mailto:"+e.href),e.anchor&&(e.href=`${e.href}#${e.anchor}`,delete e.anchor),{tag:[{tag:"a",attrs:e}]}},styled:s=>({tag:[{tag:"span",attrs:s.attrs}]})}};class G{constructor(e){e||(e=F),this.marks=e.marks||[],this.nodes=e.nodes||[]}addNode(e,t){this.nodes[e]=t}addMark(e,t){this.marks[e]=t}render(e={}){if(e.content&&Array.isArray(e.content)){let t="";return e.content.forEach(r=>{t+=this.renderNode(r)}),t}return console.warn("The render method must receive an object with a content field, which is an array"),""}renderNode(e){let t=[];e.marks&&e.marks.forEach(o=>{const n=this.getMatchingMark(o);n&&t.push(this.renderOpeningTag(n.tag))});const r=this.getMatchingNode(e);return r&&r.tag&&t.push(this.renderOpeningTag(r.tag)),e.content?e.content.forEach(o=>{t.push(this.renderNode(o))}):e.text?t.push(function(o){const n={"&":"&","<":"<",">":">",'"':""","'":"'"},i=/[&<>"']/g,a=RegExp(i.source);return o&&a.test(o)?o.replace(i,u=>n[u]):o}(e.text)):r&&r.singleTag?t.push(this.renderTag(r.singleTag," /")):r&&r.html&&t.push(r.html),r&&r.tag&&t.push(this.renderClosingTag(r.tag)),e.marks&&e.marks.slice(0).reverse().forEach(o=>{const n=this.getMatchingMark(o);n&&t.push(this.renderClosingTag(n.tag))}),t.join("")}renderTag(e,t){return e.constructor===String?`<${e}${t}>`:e.map(r=>{if(r.constructor===String)return`<${r}${t}>`;{let o="<"+r.tag;if(r.attrs)for(let n in r.attrs){let i=r.attrs[n];i!==null&&(o+=` ${n}="${i}"`)}return`${o}${t}>`}}).join("")}renderOpeningTag(e){return this.renderTag(e,"")}renderClosingTag(e){return e.constructor===String?`</${e}>`:e.slice(0).reverse().map(t=>t.constructor===String?`</${t}>`:`</${t.tag}>`).join("")}getMatchingNode(e){if(typeof this.nodes[e.type]=="function")return this.nodes[e.type](e)}getMatchingMark(e){if(typeof this.marks[e.type]=="function")return this.marks[e.type](e)}}const Q=(s=0,e=s)=>{const t=Math.abs(e-s)||0,r=s<e?1:-1;return((o=0,n)=>[...Array(o)].map(n))(t,(o,n)=>n*r+s)},w=(s,e,t)=>{const r=[];for(const o in s){if(!Object.prototype.hasOwnProperty.call(s,o))continue;const n=s[o],i=t?"":encodeURIComponent(o);let a;a=typeof n=="object"?w(n,e?e+encodeURIComponent("["+i+"]"):i,Array.isArray(n)):(e?e+encodeURIComponent("["+i+"]"):i)+"="+encodeURIComponent(n),r.push(a)}return r.join("&")};let b={},y={};class W{constructor(e,t){if(!t){let n=e.region?"-"+e.region:"",i=e.https===!1?"http":"https";t=e.oauthToken===void 0?`${i}://api${n}.storyblok.com/v2`:`${i}://api${n}.storyblok.com/v1`}let r=Object.assign({},e.headers),o=5;e.oauthToken!==void 0&&(r.Authorization=e.oauthToken,o=3),e.rateLimit!==void 0&&(o=e.rateLimit),this.richTextResolver=new G(e.richTextSchema),typeof e.componentResolver=="function"&&this.setComponentResolver(e.componentResolver),this.maxRetries=e.maxRetries||5,this.throttle=A(this.throttledRequest,o,1e3),this.accessToken=e.accessToken,this.relations={},this.links={},this.cache=e.cache||{clear:"manual"},this.client=L.default.create({baseURL:t,timeout:e.timeout||0,headers:r,proxy:e.proxy||!1}),e.responseInterceptor&&this.client.interceptors.response.use(n=>e.responseInterceptor(n))}setComponentResolver(e){this.richTextResolver.addNode("blok",t=>{let r="";return t.attrs.body.forEach(o=>{r+=e(o.component,o)}),{html:r}})}parseParams(e={}){return e.version||(e.version="published"),e.token||(e.token=this.getToken()),e.cv||(e.cv=y[e.token]),Array.isArray(e.resolve_relations)&&(e.resolve_relations=e.resolve_relations.join(",")),e}factoryParamOptions(e,t={}){return((r="")=>r.indexOf("/cdn/")>-1)(e)?this.parseParams(t):t}makeRequest(e,t,r,o){const n=this.factoryParamOptions(e,((i={},a=25,u=1)=>_(g({},i),{per_page:a,page:u}))(t,r,o));return this.cacheResponse(e,n)}get(e,t){let r="/"+e;const o=this.factoryParamOptions(r,t);return this.cacheResponse(r,o)}async getAll(e,t={},r){const o=t.per_page||25,n="/"+e,i=n.split("/");r=r||i[i.length-1];const a=await this.makeRequest(n,t,o,1),u=Math.ceil(a.total/o);return((c=[],d)=>c.map(d).reduce((k,se)=>[...k,...se],[]))([a,...await(async(c=[],d)=>Promise.all(c.map(d)))(Q(1,u),async c=>this.makeRequest(n,t,o,c+1))],c=>Object.values(c.data[r]))}post(e,t){let r="/"+e;return this.throttle("post",r,t)}put(e,t){let r="/"+e;return this.throttle("put",r,t)}delete(e,t){let r="/"+e;return this.throttle("delete",r,t)}getStories(e){return this.get("cdn/stories",e)}getStory(e,t){return this.get("cdn/stories/"+e,t)}setToken(e){this.accessToken=e}getToken(){return this.accessToken}_cleanCopy(e){return JSON.parse(JSON.stringify(e))}_insertLinks(e,t){const r=e[t];r&&r.fieldtype=="multilink"&&r.linktype=="story"&&typeof r.id=="string"&&this.links[r.id]?r.story=this._cleanCopy(this.links[r.id]):r&&r.linktype==="story"&&typeof r.uuid=="string"&&this.links[r.uuid]&&(r.story=this._cleanCopy(this.links[r.uuid]))}_insertRelations(e,t,r){if(r.indexOf(e.component+"."+t)>-1){if(typeof e[t]=="string")this.relations[e[t]]&&(e[t]=this._cleanCopy(this.relations[e[t]]));else if(e[t].constructor===Array){let o=[];e[t].forEach(n=>{this.relations[n]&&o.push(this._cleanCopy(this.relations[n]))}),e[t]=o}}}iterateTree(e,t){let r=o=>{if(o!=null){if(o.constructor===Array)for(let n=0;n<o.length;n++)r(o[n]);else if(o.constructor===Object){if(o._stopResolving)return;for(let n in o)(o.component&&o._uid||o.type==="link")&&(this._insertRelations(o,n,t),this._insertLinks(o,n)),r(o[n])}}};r(e.content)}async resolveLinks(e,t){let r=[];if(e.link_uuids){const o=e.link_uuids.length;let n=[];const i=50;for(let a=0;a<o;a+=i){const u=Math.min(o,a+i);n.push(e.link_uuids.slice(a,u))}for(let a=0;a<n.length;a++)(await this.getStories({per_page:i,language:t.language,version:t.version,by_uuids:n[a].join(",")})).data.stories.forEach(u=>{r.push(u)})}else r=e.links;r.forEach(o=>{this.links[o.uuid]=_(g({},o),{_stopResolving:!0})})}async resolveRelations(e,t){let r=[];if(e.rel_uuids){const o=e.rel_uuids.length;let n=[];const i=50;for(let a=0;a<o;a+=i){const u=Math.min(o,a+i);n.push(e.rel_uuids.slice(a,u))}for(let a=0;a<n.length;a++)(await this.getStories({per_page:i,language:t.language,version:t.version,by_uuids:n[a].join(",")})).data.stories.forEach(u=>{r.push(u)})}else r=e.rels;r.forEach(o=>{this.relations[o.uuid]=_(g({},o),{_stopResolving:!0})})}async resolveStories(e,t){let r=[];t.resolve_relations!==void 0&&t.resolve_relations.length>0&&(r=t.resolve_relations.split(","),await this.resolveRelations(e,t)),["1","story","url"].indexOf(t.resolve_links)>-1&&await this.resolveLinks(e,t);for(const o in this.relations)this.iterateTree(this.relations[o],r);e.story?this.iterateTree(e.story,r):e.stories.forEach(o=>{this.iterateTree(o,r)})}cacheResponse(e,t,r){return r===void 0&&(r=0),new Promise(async(o,n)=>{let i=w({url:e,params:t}),a=this.cacheProvider();if(this.cache.clear==="auto"&&t.version==="draft"&&await this.flushCache(),t.version==="published"&&e!="/cdn/spaces/me"){const c=await a.get(i);if(c)return o(c)}try{let c=await this.throttle("get",e,{params:t,paramsSerializer:k=>w(k)}),d={data:c.data,headers:c.headers};if(c.headers["per-page"]&&(d=Object.assign({},d,{perPage:parseInt(c.headers["per-page"]),total:parseInt(c.headers.total)})),c.status!=200)return n(c);(d.data.story||d.data.stories)&&await this.resolveStories(d.data,t),t.version==="published"&&e!="/cdn/spaces/me"&&a.set(i,d),d.data.cv&&(t.version=="draft"&&y[t.token]!=d.data.cv&&this.flushCache(),y[t.token]=d.data.cv),o(d)}catch(c){if(c.response&&c.response.status===429&&(r+=1)<this.maxRetries)return console.log(`Hit rate limit. Retrying in ${r} seconds.`),await(u=1e3*r,new Promise(d=>setTimeout(d,u))),this.cacheResponse(e,t,r).then(o).catch(n);n(c)}var u})}throttledRequest(e,t,r){return this.client[e](t,r)}cacheVersions(){return y}cacheVersion(){return y[this.accessToken]}setCacheVersion(e){this.accessToken&&(y[this.accessToken]=e)}cacheProvider(){switch(this.cache.type){case"memory":return{get:e=>b[e],getAll:()=>b,set(e,t){b[e]=t},flush(){b={}}};default:return{get(){},getAll(){},set(){},flush(){}}}}async flushCache(){return await this.cacheProvider().flush(),this}}var X=(s={})=>{const{apiOptions:e}=s;if(!e.accessToken){console.error("You need to provide an access token to interact with Storyblok API. Read https://www.storyblok.com/docs/api/content-delivery#topics/authentication");return}return{storyblokApi:new W(e)}},Z=s=>{if(typeof s!="object"||typeof s._editable=="undefined")return{};const e=JSON.parse(s._editable.replace(/^<!--#storyblok#/,"").replace(/-->$/,""));return{"data-blok-c":JSON.stringify(e),"data-blok-uid":e.id+"-"+e.uid}};const T=(s,e,t={})=>{if(typeof window!="undefined"){if(typeof window.storyblokRegisterEvent=="undefined"){console.error("Storyblok Bridge is disabled. Please enable it to use it. Read https://github.com/storyblok/storyblok-js");return}if(!s){console.warn("Story ID is not defined. Please provide a valid ID.");return}window.storyblokRegisterEvent(()=>{new window.StoryblokBridge(t).on(["input","published","change"],o=>{o.action=="input"&&o.story.id===s?e(o.story):window.location.reload()})})}},K=(s={})=>{const{bridge:e,accessToken:t,use:r=[],apiOptions:o={}}=s;o.accessToken=o.accessToken||t;const n={bridge:e,apiOptions:o};let i={};return r.forEach(a=>{i=g(g({},i),a(n))}),e!==!1&&z("https://app.storyblok.com/f/storyblok-v2-latest.js"),i},ee=t=>{var r=t,{blok:s}=r,e=B(r,["blok"]);if(!s)return console.error("Please provide a 'blok' property to the StoryblokComponent"),E.default.createElement("div",null,"Please provide a blok property to the StoryblokComponent");const o=I(s.component);return o?E.default.createElement(o,q({blok:s},e)):""},te=(s,e={},t={})=>{let[r,o]=h.useState({});return m?(T(r.id,n=>o(n),t),h.useEffect(async()=>{const{data:n}=await m.get(`cdn/stories/${s}`,e);o(n.story)},[]),r):(console.error("You can't use useStoryblok if you're not loading apiPlugin."),null)},re=(s={},e={})=>{let[t,r]=h.useState(s);return T(t.id,o=>r(o),e),h.useEffect(()=>{r(s)},[s]),t};let m=null;const $=()=>(m||console.error("You can't use useStoryblokApi if you're not loading apiPlugin."),m);let S={};const I=s=>S[s]?S[s]:(console.error(`Component ${s} doesn't exist.`),!1),oe=(s={})=>{const{storyblokApi:e}=K(s);m=e,S=s.components};l.StoryblokComponent=ee,l.apiPlugin=X,l.getComponent=I,l.getStoryblokApi=$,l.storyblokEditable=Z,l.storyblokInit=oe,l.useStoryblok=te,l.useStoryblokApi=$,l.useStoryblokBridge=T,l.useStoryblokState=re,Object.defineProperties(l,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
|
|
5
|
+
*/function A(o){return typeof o=="number"&&o==o&&o!==1/0&&o!==-1/0}function j(o,t,e){if(!A(t))throw new TypeError("Expected `limit` to be a finite number");if(!A(e))throw new TypeError("Expected `interval` to be a finite number");var r=[],s=[],n=0,i=function(){n++;var u=setTimeout(function(){n--,r.length>0&&i(),s=s.filter(function(d){return d!==u})},e);s.indexOf(u)<0&&s.push(u);var c=r.shift();c.resolve(o.apply(c.self,c.args))},a=function(){var u=arguments,c=this;return new Promise(function(d,k){r.push({resolve:d,reject:k,args:u,self:c}),n<t&&i()})};return a.abort=function(){s.forEach(clearTimeout),s=[],r.forEach(function(u){u.reject(new throttle.AbortError)}),r.length=0},a}j.AbortError=function(){Error.call(this,"Throttled function aborted"),this.name="AbortError"};const H=function(o,t){if(!o)return null;let e={};for(let r in o){let s=o[r];t.indexOf(r)>-1&&s!==null&&(e[r]=s)}return e};var F={nodes:{horizontal_rule:()=>({singleTag:"hr"}),blockquote:()=>({tag:"blockquote"}),bullet_list:()=>({tag:"ul"}),code_block:o=>({tag:["pre",{tag:"code",attrs:o.attrs}]}),hard_break:()=>({singleTag:"br"}),heading:o=>({tag:`h${o.attrs.level}`}),image:o=>({singleTag:[{tag:"img",attrs:H(o.attrs,["src","alt","title"])}]}),list_item:()=>({tag:"li"}),ordered_list:()=>({tag:"ol"}),paragraph:()=>({tag:"p"})},marks:{bold:()=>({tag:"b"}),strike:()=>({tag:"strike"}),underline:()=>({tag:"u"}),strong:()=>({tag:"strong"}),code:()=>({tag:"code"}),italic:()=>({tag:"i"}),link(o){const t=g({},o.attrs),{linktype:e="url"}=o.attrs;return e==="email"&&(t.href=`mailto:${t.href}`),t.anchor&&(t.href=`${t.href}#${t.anchor}`,delete t.anchor),{tag:[{tag:"a",attrs:t}]}},styled:o=>({tag:[{tag:"span",attrs:o.attrs}]})}};class G{constructor(t){t||(t=F),this.marks=t.marks||[],this.nodes=t.nodes||[]}addNode(t,e){this.nodes[t]=e}addMark(t,e){this.marks[t]=e}render(t={}){if(t.content&&Array.isArray(t.content)){let e="";return t.content.forEach(r=>{e+=this.renderNode(r)}),e}return console.warn("The render method must receive an object with a content field, which is an array"),""}renderNode(t){let e=[];t.marks&&t.marks.forEach(s=>{const n=this.getMatchingMark(s);n&&e.push(this.renderOpeningTag(n.tag))});const r=this.getMatchingNode(t);return r&&r.tag&&e.push(this.renderOpeningTag(r.tag)),t.content?t.content.forEach(s=>{e.push(this.renderNode(s))}):t.text?e.push(function(s){const n={"&":"&","<":"<",">":">",'"':""","'":"'"},i=/[&<>"']/g,a=RegExp(i.source);return s&&a.test(s)?s.replace(i,u=>n[u]):s}(t.text)):r&&r.singleTag?e.push(this.renderTag(r.singleTag," /")):r&&r.html&&e.push(r.html),r&&r.tag&&e.push(this.renderClosingTag(r.tag)),t.marks&&t.marks.slice(0).reverse().forEach(s=>{const n=this.getMatchingMark(s);n&&e.push(this.renderClosingTag(n.tag))}),e.join("")}renderTag(t,e){return t.constructor===String?`<${t}${e}>`:t.map(r=>{if(r.constructor===String)return`<${r}${e}>`;{let s=`<${r.tag}`;if(r.attrs)for(let n in r.attrs){let i=r.attrs[n];i!==null&&(s+=` ${n}="${i}"`)}return`${s}${e}>`}}).join("")}renderOpeningTag(t){return this.renderTag(t,"")}renderClosingTag(t){return t.constructor===String?`</${t}>`:t.slice(0).reverse().map(e=>e.constructor===String?`</${e}>`:`</${e.tag}>`).join("")}getMatchingNode(t){if(typeof this.nodes[t.type]=="function")return this.nodes[t.type](t)}getMatchingMark(t){if(typeof this.marks[t.type]=="function")return this.marks[t.type](t)}}const Q=(o=0,t=o)=>{const e=Math.abs(t-o)||0,r=o<t?1:-1;return((s=0,n)=>[...Array(s)].map(n))(e,(s,n)=>n*r+o)},w=(o,t,e)=>{const r=[];for(const s in o){if(!Object.prototype.hasOwnProperty.call(o,s))continue;const n=o[s],i=e?"":encodeURIComponent(s);let a;a=typeof n=="object"?w(n,t?t+encodeURIComponent("["+i+"]"):i,Array.isArray(n)):(t?t+encodeURIComponent("["+i+"]"):i)+"="+encodeURIComponent(n),r.push(a)}return r.join("&")};let b={},y={};class W{constructor(t,e){if(!e){let n=t.region?`-${t.region}`:"",i=t.https===!1?"http":"https";e=t.oauthToken===void 0?`${i}://api${n}.storyblok.com/v2`:`${i}://api${n}.storyblok.com/v1`}let r=Object.assign({},t.headers),s=5;t.oauthToken!==void 0&&(r.Authorization=t.oauthToken,s=3),t.rateLimit!==void 0&&(s=t.rateLimit),this.richTextResolver=new G(t.richTextSchema),typeof t.componentResolver=="function"&&this.setComponentResolver(t.componentResolver),this.maxRetries=t.maxRetries||5,this.throttle=j(this.throttledRequest,s,1e3),this.accessToken=t.accessToken,this.relations={},this.links={},this.cache=t.cache||{clear:"manual"},this.client=L.default.create({baseURL:e,timeout:t.timeout||0,headers:r,proxy:t.proxy||!1}),t.responseInterceptor&&this.client.interceptors.response.use(n=>t.responseInterceptor(n)),this.resolveNestedRelations=t.resolveNestedRelations||!0}setComponentResolver(t){this.richTextResolver.addNode("blok",e=>{let r="";return e.attrs.body.forEach(s=>{r+=t(s.component,s)}),{html:r}})}parseParams(t={}){return t.version||(t.version="published"),t.token||(t.token=this.getToken()),t.cv||(t.cv=y[t.token]),Array.isArray(t.resolve_relations)&&(t.resolve_relations=t.resolve_relations.join(",")),t}factoryParamOptions(t,e={}){return((r="")=>r.indexOf("/cdn/")>-1)(t)?this.parseParams(e):e}makeRequest(t,e,r,s){const n=this.factoryParamOptions(t,((i={},a=25,u=1)=>_(g({},i),{per_page:a,page:u}))(e,r,s));return this.cacheResponse(t,n)}get(t,e){let r=`/${t}`;const s=this.factoryParamOptions(r,e);return this.cacheResponse(r,s)}async getAll(t,e={},r){const s=e.per_page||25,n=`/${t}`,i=n.split("/");r=r||i[i.length-1];const a=await this.makeRequest(n,e,s,1),u=Math.ceil(a.total/s);return((c=[],d)=>c.map(d).reduce((k,nt)=>[...k,...nt],[]))([a,...await(async(c=[],d)=>Promise.all(c.map(d)))(Q(1,u),async c=>this.makeRequest(n,e,s,c+1))],c=>Object.values(c.data[r]))}post(t,e){let r=`/${t}`;return this.throttle("post",r,e)}put(t,e){let r=`/${t}`;return this.throttle("put",r,e)}delete(t,e){let r=`/${t}`;return this.throttle("delete",r,e)}getStories(t){return this.get("cdn/stories",t)}getStory(t,e){return this.get(`cdn/stories/${t}`,e)}setToken(t){this.accessToken=t}getToken(){return this.accessToken}_cleanCopy(t){return JSON.parse(JSON.stringify(t))}_insertLinks(t,e){const r=t[e];r&&r.fieldtype=="multilink"&&r.linktype=="story"&&typeof r.id=="string"&&this.links[r.id]?r.story=this._cleanCopy(this.links[r.id]):r&&r.linktype==="story"&&typeof r.uuid=="string"&&this.links[r.uuid]&&(r.story=this._cleanCopy(this.links[r.uuid]))}_insertRelations(t,e,r){if(r.indexOf(t.component+"."+e)>-1){if(typeof t[e]=="string")this.relations[t[e]]&&(t[e]=this._cleanCopy(this.relations[t[e]]));else if(t[e].constructor===Array){let s=[];t[e].forEach(n=>{this.relations[n]&&s.push(this._cleanCopy(this.relations[n]))}),t[e]=s}}}_insertAssetsRelations(t,e){e.forEach(r=>{t.id===r.id&&(t.original=r,t.original.filename=t.filename,t.original.filename=t.original.filename.includes("https://s3.amazonaws.com/")?t.original.filename:t.original.filename.replace("https://","https://s3.amazonaws.com/"),delete t.original.s3_filename)})}iterateTree(t,e){let r=s=>{if(s!=null){if(s.constructor===Array)for(let n=0;n<s.length;n++)r(s[n]);else if(s.constructor===Object){if(s._stopResolving)return;for(let n in s)s.component&&s._uid||s.type==="link"?(this._insertRelations(s,n,e),this._insertLinks(s,n)):s.fieldtype==="asset"&&this._insertAssetsRelations(s,e),r(s[n])}}};r(t.content)}async resolveLinks(t,e){let r=[];if(t.link_uuids){const s=t.link_uuids.length;let n=[];const i=50;for(let a=0;a<s;a+=i){const u=Math.min(s,a+i);n.push(t.link_uuids.slice(a,u))}for(let a=0;a<n.length;a++)(await this.getStories({per_page:i,language:e.language,version:e.version,by_uuids:n[a].join(",")})).data.stories.forEach(u=>{r.push(u)})}else r=t.links;r.forEach(s=>{this.links[s.uuid]=_(g({},s),{_stopResolving:!0})})}async resolveRelations(t,e){let r=[];if(t.rel_uuids){const s=t.rel_uuids.length;let n=[];const i=50;for(let a=0;a<s;a+=i){const u=Math.min(s,a+i);n.push(t.rel_uuids.slice(a,u))}for(let a=0;a<n.length;a++)(await this.getStories({per_page:i,language:e.language,version:e.version,by_uuids:n[a].join(",")})).data.stories.forEach(u=>{r.push(u)})}else r=t.rels;r.forEach(s=>{this.relations[s.uuid]=_(g({},s),{_stopResolving:!0})})}async resolveStories(t,e){let r=[];if(e.resolve_relations!==void 0&&e.resolve_relations.length>0&&(r=e.resolve_relations.split(","),await this.resolveRelations(t,e)),["1","story","url"].indexOf(e.resolve_links)>-1&&await this.resolveLinks(t,e),this.resolveNestedRelations)for(const s in this.relations)this.iterateTree(this.relations[s],r);t.story?this.iterateTree(t.story,r):t.stories.forEach(s=>{this.iterateTree(s,r)})}resolveAssetsRelations(t){const{assets:e,stories:r,story:s}=t;if(r)for(const n of r)this.iterateTree(n,e);else this.iterateTree(s,e)}cacheResponse(t,e,r){return r===void 0&&(r=0),new Promise(async(s,n)=>{let i=w({url:t,params:e}),a=this.cacheProvider();if(this.cache.clear==="auto"&&e.version==="draft"&&await this.flushCache(),e.version==="published"&&t!="/cdn/spaces/me"){const c=await a.get(i);if(c)return s(c)}try{let c=await this.throttle("get",t,{params:e,paramsSerializer:k=>w(k)}),d={data:c.data,headers:c.headers};if(d.data.assets&&d.data.assets.length&&this.resolveAssetsRelations(d.data),c.headers["per-page"]&&(d=Object.assign({},d,{perPage:parseInt(c.headers["per-page"]),total:parseInt(c.headers.total)})),c.status!=200)return n(c);(d.data.story||d.data.stories)&&await this.resolveStories(d.data,e),e.version==="published"&&t!="/cdn/spaces/me"&&a.set(i,d),d.data.cv&&(e.version=="draft"&&y[e.token]!=d.data.cv&&this.flushCache(),y[e.token]=d.data.cv),s(d)}catch(c){if(c.response&&c.response.status===429&&(r+=1)<this.maxRetries)return console.log(`Hit rate limit. Retrying in ${r} seconds.`),await(u=1e3*r,new Promise(d=>setTimeout(d,u))),this.cacheResponse(t,e,r).then(s).catch(n);n(c)}var u})}throttledRequest(t,e,r){return this.client[t](e,r)}cacheVersions(){return y}cacheVersion(){return y[this.accessToken]}setCacheVersion(t){this.accessToken&&(y[this.accessToken]=t)}cacheProvider(){return this.cache.type==="memory"?{get:t=>b[t],getAll:()=>b,set(t,e){b[t]=e},flush(){b={}}}:{get(){},getAll(){},set(){},flush(){}}}async flushCache(){return await this.cacheProvider().flush(),this}}var X=(o={})=>{const{apiOptions:t}=o;if(!t.accessToken){console.error("You need to provide an access token to interact with Storyblok API. Read https://www.storyblok.com/docs/api/content-delivery#topics/authentication");return}return{storyblokApi:new W(t)}},Z=o=>{if(typeof o!="object"||typeof o._editable=="undefined")return{};const t=JSON.parse(o._editable.replace(/^<!--#storyblok#/,"").replace(/-->$/,""));return{"data-blok-c":JSON.stringify(t),"data-blok-uid":t.id+"-"+t.uid}};const K="https://app.storyblok.com/f/storyblok-v2-latest.js",T=(o,t,e={})=>{if(typeof window!="undefined"){if(typeof window.storyblokRegisterEvent=="undefined"){console.error("Storyblok Bridge is disabled. Please enable it to use it. Read https://github.com/storyblok/storyblok-js");return}if(!o){console.warn("Story ID is not defined. Please provide a valid ID.");return}window.storyblokRegisterEvent(()=>{new window.StoryblokBridge(e).on(["input","published","change"],s=>{s.action=="input"&&s.story.id===o?t(s.story):window.location.reload()})})}},tt=(o={})=>{const{bridge:t,accessToken:e,use:r=[],apiOptions:s={}}=o;s.accessToken=s.accessToken||e;const n={bridge:t,apiOptions:s};let i={};return r.forEach(a=>{i=g(g({},i),a(n))}),t!==!1&&Y(K),i},et=e=>{var r=e,{blok:o}=r,t=B(r,["blok"]);if(!o)return console.error("Please provide a 'blok' property to the StoryblokComponent"),S.default.createElement("div",null,"Please provide a blok property to the StoryblokComponent");const s=I(o.component);return s?S.default.createElement(s,q({blok:o},t)):""},rt=(o,t={},e={})=>{let[r,s]=h.useState({});return m?(T(r.id,n=>s(n),e),h.useEffect(async()=>{const{data:n}=await m.get(`cdn/stories/${o}`,t);s(n.story)},[]),r):(console.error("You can't use useStoryblok if you're not loading apiPlugin."),null)},st=(o={},t={})=>{let[e,r]=h.useState(o);return T(e.id,s=>r(s),t),h.useEffect(()=>{r(o)},[o]),e};let m=null;const C=()=>(m||console.error("You can't use getStoryblokApi if you're not loading apiPlugin."),m);let R={};const I=o=>R[o]?R[o]:(console.error(`Component ${o} doesn't exist.`),!1),ot=(o={})=>{const{storyblokApi:t}=tt(o);m=t,R=o.components};l.StoryblokComponent=et,l.apiPlugin=X,l.getComponent=I,l.getStoryblokApi=C,l.storyblokEditable=Z,l.storyblokInit=ot,l.useStoryblok=rt,l.useStoryblokApi=C,l.useStoryblokBridge=T,l.useStoryblokState=st,Object.defineProperties(l,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
|
package/dist/storyblok-react.mjs
CHANGED
|
@@ -27,7 +27,7 @@ var __objRest = (source, exclude) => {
|
|
|
27
27
|
return target;
|
|
28
28
|
};
|
|
29
29
|
import React, { useState, useEffect } from "react";
|
|
30
|
-
import
|
|
30
|
+
import e from "axios";
|
|
31
31
|
var __defProp2 = Object.defineProperty;
|
|
32
32
|
var __defProps = Object.defineProperties;
|
|
33
33
|
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
@@ -79,313 +79,326 @@ const loadBridge = (src) => {
|
|
|
79
79
|
});
|
|
80
80
|
};
|
|
81
81
|
/*!
|
|
82
|
-
* storyblok-js-client
|
|
82
|
+
* storyblok-js-client v4.5.2
|
|
83
83
|
* Universal JavaScript SDK for Storyblok's API
|
|
84
84
|
* (c) 2020-2022 Stobylok Team
|
|
85
85
|
*/
|
|
86
|
-
function
|
|
87
|
-
return typeof
|
|
86
|
+
function t(e2) {
|
|
87
|
+
return typeof e2 == "number" && (e2 == e2 && e2 !== 1 / 0 && e2 !== -1 / 0);
|
|
88
88
|
}
|
|
89
|
-
function
|
|
90
|
-
if (!
|
|
89
|
+
function s(e2, s2, r2) {
|
|
90
|
+
if (!t(s2))
|
|
91
91
|
throw new TypeError("Expected `limit` to be a finite number");
|
|
92
|
-
if (!
|
|
92
|
+
if (!t(r2))
|
|
93
93
|
throw new TypeError("Expected `interval` to be a finite number");
|
|
94
|
-
var
|
|
94
|
+
var i2 = [], n2 = [], o2 = 0, a2 = function() {
|
|
95
95
|
o2++;
|
|
96
|
-
var
|
|
97
|
-
o2--,
|
|
98
|
-
return
|
|
96
|
+
var t2 = setTimeout(function() {
|
|
97
|
+
o2--, i2.length > 0 && a2(), n2 = n2.filter(function(e3) {
|
|
98
|
+
return e3 !== t2;
|
|
99
99
|
});
|
|
100
|
-
},
|
|
101
|
-
|
|
102
|
-
var
|
|
103
|
-
|
|
100
|
+
}, r2);
|
|
101
|
+
n2.indexOf(t2) < 0 && n2.push(t2);
|
|
102
|
+
var s3 = i2.shift();
|
|
103
|
+
s3.resolve(e2.apply(s3.self, s3.args));
|
|
104
104
|
}, l2 = function() {
|
|
105
|
-
var
|
|
106
|
-
return new Promise(function(
|
|
107
|
-
|
|
105
|
+
var e3 = arguments, t2 = this;
|
|
106
|
+
return new Promise(function(r3, n3) {
|
|
107
|
+
i2.push({ resolve: r3, reject: n3, args: e3, self: t2 }), o2 < s2 && a2();
|
|
108
108
|
});
|
|
109
109
|
};
|
|
110
110
|
return l2.abort = function() {
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
}),
|
|
111
|
+
n2.forEach(clearTimeout), n2 = [], i2.forEach(function(e3) {
|
|
112
|
+
e3.reject(new throttle.AbortError());
|
|
113
|
+
}), i2.length = 0;
|
|
114
114
|
}, l2;
|
|
115
115
|
}
|
|
116
|
-
|
|
116
|
+
s.AbortError = function() {
|
|
117
117
|
Error.call(this, "Throttled function aborted"), this.name = "AbortError";
|
|
118
118
|
};
|
|
119
|
-
const
|
|
120
|
-
if (!
|
|
119
|
+
const r = function(e2, t2) {
|
|
120
|
+
if (!e2)
|
|
121
121
|
return null;
|
|
122
|
-
let
|
|
123
|
-
for (let
|
|
124
|
-
let
|
|
125
|
-
|
|
122
|
+
let s2 = {};
|
|
123
|
+
for (let r2 in e2) {
|
|
124
|
+
let i2 = e2[r2];
|
|
125
|
+
t2.indexOf(r2) > -1 && i2 !== null && (s2[r2] = i2);
|
|
126
126
|
}
|
|
127
|
-
return
|
|
127
|
+
return s2;
|
|
128
128
|
};
|
|
129
|
-
var
|
|
130
|
-
const
|
|
131
|
-
return
|
|
132
|
-
}, styled: (
|
|
133
|
-
class
|
|
134
|
-
constructor(
|
|
135
|
-
|
|
136
|
-
}
|
|
137
|
-
addNode(
|
|
138
|
-
this.nodes[
|
|
139
|
-
}
|
|
140
|
-
addMark(
|
|
141
|
-
this.marks[
|
|
142
|
-
}
|
|
143
|
-
render(
|
|
144
|
-
if (
|
|
145
|
-
let
|
|
146
|
-
return
|
|
147
|
-
|
|
148
|
-
}),
|
|
129
|
+
var i = { nodes: { horizontal_rule: () => ({ singleTag: "hr" }), blockquote: () => ({ tag: "blockquote" }), bullet_list: () => ({ tag: "ul" }), code_block: (e2) => ({ tag: ["pre", { tag: "code", attrs: e2.attrs }] }), hard_break: () => ({ singleTag: "br" }), heading: (e2) => ({ tag: `h${e2.attrs.level}` }), image: (e2) => ({ singleTag: [{ tag: "img", attrs: r(e2.attrs, ["src", "alt", "title"]) }] }), list_item: () => ({ tag: "li" }), ordered_list: () => ({ tag: "ol" }), paragraph: () => ({ tag: "p" }) }, marks: { bold: () => ({ tag: "b" }), strike: () => ({ tag: "strike" }), underline: () => ({ tag: "u" }), strong: () => ({ tag: "strong" }), code: () => ({ tag: "code" }), italic: () => ({ tag: "i" }), link(e2) {
|
|
130
|
+
const t2 = __spreadValues2({}, e2.attrs), { linktype: s2 = "url" } = e2.attrs;
|
|
131
|
+
return s2 === "email" && (t2.href = `mailto:${t2.href}`), t2.anchor && (t2.href = `${t2.href}#${t2.anchor}`, delete t2.anchor), { tag: [{ tag: "a", attrs: t2 }] };
|
|
132
|
+
}, styled: (e2) => ({ tag: [{ tag: "span", attrs: e2.attrs }] }) } };
|
|
133
|
+
class n {
|
|
134
|
+
constructor(e2) {
|
|
135
|
+
e2 || (e2 = i), this.marks = e2.marks || [], this.nodes = e2.nodes || [];
|
|
136
|
+
}
|
|
137
|
+
addNode(e2, t2) {
|
|
138
|
+
this.nodes[e2] = t2;
|
|
139
|
+
}
|
|
140
|
+
addMark(e2, t2) {
|
|
141
|
+
this.marks[e2] = t2;
|
|
142
|
+
}
|
|
143
|
+
render(e2 = {}) {
|
|
144
|
+
if (e2.content && Array.isArray(e2.content)) {
|
|
145
|
+
let t2 = "";
|
|
146
|
+
return e2.content.forEach((e3) => {
|
|
147
|
+
t2 += this.renderNode(e3);
|
|
148
|
+
}), t2;
|
|
149
149
|
}
|
|
150
150
|
return console.warn("The render method must receive an object with a content field, which is an array"), "";
|
|
151
151
|
}
|
|
152
|
-
renderNode(
|
|
153
|
-
let
|
|
154
|
-
|
|
155
|
-
const
|
|
156
|
-
|
|
152
|
+
renderNode(e2) {
|
|
153
|
+
let t2 = [];
|
|
154
|
+
e2.marks && e2.marks.forEach((e3) => {
|
|
155
|
+
const s3 = this.getMatchingMark(e3);
|
|
156
|
+
s3 && t2.push(this.renderOpeningTag(s3.tag));
|
|
157
157
|
});
|
|
158
|
-
const
|
|
159
|
-
return
|
|
160
|
-
|
|
161
|
-
}) :
|
|
162
|
-
const
|
|
163
|
-
return
|
|
164
|
-
}(
|
|
165
|
-
const
|
|
166
|
-
|
|
167
|
-
}),
|
|
168
|
-
}
|
|
169
|
-
renderTag(
|
|
170
|
-
if (
|
|
171
|
-
return `<${
|
|
172
|
-
return
|
|
173
|
-
if (
|
|
174
|
-
return `<${
|
|
158
|
+
const s2 = this.getMatchingNode(e2);
|
|
159
|
+
return s2 && s2.tag && t2.push(this.renderOpeningTag(s2.tag)), e2.content ? e2.content.forEach((e3) => {
|
|
160
|
+
t2.push(this.renderNode(e3));
|
|
161
|
+
}) : e2.text ? t2.push(function(e3) {
|
|
162
|
+
const t3 = { "&": "&", "<": "<", ">": ">", '"': """, "'": "'" }, s3 = /[&<>"']/g, r2 = RegExp(s3.source);
|
|
163
|
+
return e3 && r2.test(e3) ? e3.replace(s3, (e4) => t3[e4]) : e3;
|
|
164
|
+
}(e2.text)) : s2 && s2.singleTag ? t2.push(this.renderTag(s2.singleTag, " /")) : s2 && s2.html && t2.push(s2.html), s2 && s2.tag && t2.push(this.renderClosingTag(s2.tag)), e2.marks && e2.marks.slice(0).reverse().forEach((e3) => {
|
|
165
|
+
const s3 = this.getMatchingMark(e3);
|
|
166
|
+
s3 && t2.push(this.renderClosingTag(s3.tag));
|
|
167
|
+
}), t2.join("");
|
|
168
|
+
}
|
|
169
|
+
renderTag(e2, t2) {
|
|
170
|
+
if (e2.constructor === String)
|
|
171
|
+
return `<${e2}${t2}>`;
|
|
172
|
+
return e2.map((e3) => {
|
|
173
|
+
if (e3.constructor === String)
|
|
174
|
+
return `<${e3}${t2}>`;
|
|
175
175
|
{
|
|
176
|
-
let
|
|
177
|
-
if (
|
|
178
|
-
for (let
|
|
179
|
-
let
|
|
180
|
-
|
|
176
|
+
let s2 = `<${e3.tag}`;
|
|
177
|
+
if (e3.attrs)
|
|
178
|
+
for (let t3 in e3.attrs) {
|
|
179
|
+
let r2 = e3.attrs[t3];
|
|
180
|
+
r2 !== null && (s2 += ` ${t3}="${r2}"`);
|
|
181
181
|
}
|
|
182
|
-
return `${
|
|
182
|
+
return `${s2}${t2}>`;
|
|
183
183
|
}
|
|
184
184
|
}).join("");
|
|
185
185
|
}
|
|
186
|
-
renderOpeningTag(
|
|
187
|
-
return this.renderTag(
|
|
186
|
+
renderOpeningTag(e2) {
|
|
187
|
+
return this.renderTag(e2, "");
|
|
188
188
|
}
|
|
189
|
-
renderClosingTag(
|
|
190
|
-
if (
|
|
191
|
-
return `</${
|
|
192
|
-
return
|
|
189
|
+
renderClosingTag(e2) {
|
|
190
|
+
if (e2.constructor === String)
|
|
191
|
+
return `</${e2}>`;
|
|
192
|
+
return e2.slice(0).reverse().map((e3) => e3.constructor === String ? `</${e3}>` : `</${e3.tag}>`).join("");
|
|
193
193
|
}
|
|
194
|
-
getMatchingNode(
|
|
195
|
-
if (typeof this.nodes[
|
|
196
|
-
return this.nodes[
|
|
194
|
+
getMatchingNode(e2) {
|
|
195
|
+
if (typeof this.nodes[e2.type] == "function")
|
|
196
|
+
return this.nodes[e2.type](e2);
|
|
197
197
|
}
|
|
198
|
-
getMatchingMark(
|
|
199
|
-
if (typeof this.marks[
|
|
200
|
-
return this.marks[
|
|
198
|
+
getMatchingMark(e2) {
|
|
199
|
+
if (typeof this.marks[e2.type] == "function")
|
|
200
|
+
return this.marks[e2.type](e2);
|
|
201
201
|
}
|
|
202
202
|
}
|
|
203
|
-
const o = (
|
|
204
|
-
const
|
|
205
|
-
return ((
|
|
206
|
-
}, a = (
|
|
207
|
-
const
|
|
208
|
-
for (const
|
|
209
|
-
if (!Object.prototype.hasOwnProperty.call(
|
|
203
|
+
const o = (e2 = 0, t2 = e2) => {
|
|
204
|
+
const s2 = Math.abs(t2 - e2) || 0, r2 = e2 < t2 ? 1 : -1;
|
|
205
|
+
return ((e3 = 0, t3) => [...Array(e3)].map(t3))(s2, (t3, s3) => s3 * r2 + e2);
|
|
206
|
+
}, a = (e2, t2, s2) => {
|
|
207
|
+
const r2 = [];
|
|
208
|
+
for (const i2 in e2) {
|
|
209
|
+
if (!Object.prototype.hasOwnProperty.call(e2, i2))
|
|
210
210
|
continue;
|
|
211
|
-
const
|
|
211
|
+
const n2 = e2[i2], o2 = s2 ? "" : encodeURIComponent(i2);
|
|
212
212
|
let l2;
|
|
213
|
-
l2 = typeof
|
|
213
|
+
l2 = typeof n2 == "object" ? a(n2, t2 ? t2 + encodeURIComponent("[" + o2 + "]") : o2, Array.isArray(n2)) : (t2 ? t2 + encodeURIComponent("[" + o2 + "]") : o2) + "=" + encodeURIComponent(n2), r2.push(l2);
|
|
214
214
|
}
|
|
215
|
-
return
|
|
215
|
+
return r2.join("&");
|
|
216
216
|
};
|
|
217
217
|
let l = {}, c = {};
|
|
218
|
-
class
|
|
219
|
-
constructor(
|
|
220
|
-
if (!
|
|
221
|
-
let
|
|
222
|
-
|
|
218
|
+
class h {
|
|
219
|
+
constructor(t2, r2) {
|
|
220
|
+
if (!r2) {
|
|
221
|
+
let e2 = t2.region ? `-${t2.region}` : "", s2 = t2.https === false ? "http" : "https";
|
|
222
|
+
r2 = t2.oauthToken === void 0 ? `${s2}://api${e2}.storyblok.com/v2` : `${s2}://api${e2}.storyblok.com/v1`;
|
|
223
223
|
}
|
|
224
|
-
let
|
|
225
|
-
|
|
226
|
-
}
|
|
227
|
-
setComponentResolver(
|
|
228
|
-
this.richTextResolver.addNode("blok", (
|
|
229
|
-
let
|
|
230
|
-
return
|
|
231
|
-
|
|
232
|
-
}), { html:
|
|
224
|
+
let i2 = Object.assign({}, t2.headers), o2 = 5;
|
|
225
|
+
t2.oauthToken !== void 0 && (i2.Authorization = t2.oauthToken, o2 = 3), t2.rateLimit !== void 0 && (o2 = t2.rateLimit), this.richTextResolver = new n(t2.richTextSchema), typeof t2.componentResolver == "function" && this.setComponentResolver(t2.componentResolver), this.maxRetries = t2.maxRetries || 5, this.throttle = s(this.throttledRequest, o2, 1e3), this.accessToken = t2.accessToken, this.relations = {}, this.links = {}, this.cache = t2.cache || { clear: "manual" }, this.client = e.create({ baseURL: r2, timeout: t2.timeout || 0, headers: i2, proxy: t2.proxy || false }), t2.responseInterceptor && this.client.interceptors.response.use((e2) => t2.responseInterceptor(e2)), this.resolveNestedRelations = t2.resolveNestedRelations || true;
|
|
226
|
+
}
|
|
227
|
+
setComponentResolver(e2) {
|
|
228
|
+
this.richTextResolver.addNode("blok", (t2) => {
|
|
229
|
+
let s2 = "";
|
|
230
|
+
return t2.attrs.body.forEach((t3) => {
|
|
231
|
+
s2 += e2(t3.component, t3);
|
|
232
|
+
}), { html: s2 };
|
|
233
233
|
});
|
|
234
234
|
}
|
|
235
|
-
parseParams(
|
|
236
|
-
return
|
|
235
|
+
parseParams(e2 = {}) {
|
|
236
|
+
return e2.version || (e2.version = "published"), e2.token || (e2.token = this.getToken()), e2.cv || (e2.cv = c[e2.token]), Array.isArray(e2.resolve_relations) && (e2.resolve_relations = e2.resolve_relations.join(",")), e2;
|
|
237
237
|
}
|
|
238
|
-
factoryParamOptions(
|
|
239
|
-
return ((
|
|
238
|
+
factoryParamOptions(e2, t2 = {}) {
|
|
239
|
+
return ((e3 = "") => e3.indexOf("/cdn/") > -1)(e2) ? this.parseParams(t2) : t2;
|
|
240
240
|
}
|
|
241
|
-
makeRequest(t2,
|
|
242
|
-
const
|
|
243
|
-
return this.cacheResponse(
|
|
241
|
+
makeRequest(e2, t2, s2, r2) {
|
|
242
|
+
const i2 = this.factoryParamOptions(e2, ((e3 = {}, t3 = 25, s3 = 1) => __spreadProps(__spreadValues2({}, e3), { per_page: t3, page: s3 }))(t2, s2, r2));
|
|
243
|
+
return this.cacheResponse(e2, i2);
|
|
244
244
|
}
|
|
245
|
-
get(
|
|
246
|
-
let
|
|
247
|
-
const
|
|
248
|
-
return this.cacheResponse(
|
|
245
|
+
get(e2, t2) {
|
|
246
|
+
let s2 = `/${e2}`;
|
|
247
|
+
const r2 = this.factoryParamOptions(s2, t2);
|
|
248
|
+
return this.cacheResponse(s2, r2);
|
|
249
249
|
}
|
|
250
|
-
async getAll(
|
|
251
|
-
const
|
|
252
|
-
|
|
253
|
-
const a2 = await this.makeRequest(
|
|
254
|
-
return ((
|
|
250
|
+
async getAll(e2, t2 = {}, s2) {
|
|
251
|
+
const r2 = t2.per_page || 25, i2 = `/${e2}`, n2 = i2.split("/");
|
|
252
|
+
s2 = s2 || n2[n2.length - 1];
|
|
253
|
+
const a2 = await this.makeRequest(i2, t2, r2, 1), l2 = Math.ceil(a2.total / r2);
|
|
254
|
+
return ((e3 = [], t3) => e3.map(t3).reduce((e4, t4) => [...e4, ...t4], []))([a2, ...await (async (e3 = [], t3) => Promise.all(e3.map(t3)))(o(1, l2), async (e3) => this.makeRequest(i2, t2, r2, e3 + 1))], (e3) => Object.values(e3.data[s2]));
|
|
255
255
|
}
|
|
256
|
-
post(
|
|
257
|
-
let
|
|
258
|
-
return this.throttle("post",
|
|
256
|
+
post(e2, t2) {
|
|
257
|
+
let s2 = `/${e2}`;
|
|
258
|
+
return this.throttle("post", s2, t2);
|
|
259
259
|
}
|
|
260
|
-
put(
|
|
261
|
-
let
|
|
262
|
-
return this.throttle("put",
|
|
260
|
+
put(e2, t2) {
|
|
261
|
+
let s2 = `/${e2}`;
|
|
262
|
+
return this.throttle("put", s2, t2);
|
|
263
263
|
}
|
|
264
|
-
delete(
|
|
265
|
-
let
|
|
266
|
-
return this.throttle("delete",
|
|
264
|
+
delete(e2, t2) {
|
|
265
|
+
let s2 = `/${e2}`;
|
|
266
|
+
return this.throttle("delete", s2, t2);
|
|
267
267
|
}
|
|
268
|
-
getStories(
|
|
269
|
-
return this.get("cdn/stories",
|
|
268
|
+
getStories(e2) {
|
|
269
|
+
return this.get("cdn/stories", e2);
|
|
270
270
|
}
|
|
271
|
-
getStory(
|
|
272
|
-
return this.get(
|
|
271
|
+
getStory(e2, t2) {
|
|
272
|
+
return this.get(`cdn/stories/${e2}`, t2);
|
|
273
273
|
}
|
|
274
|
-
setToken(
|
|
275
|
-
this.accessToken =
|
|
274
|
+
setToken(e2) {
|
|
275
|
+
this.accessToken = e2;
|
|
276
276
|
}
|
|
277
277
|
getToken() {
|
|
278
278
|
return this.accessToken;
|
|
279
279
|
}
|
|
280
|
-
_cleanCopy(
|
|
281
|
-
return JSON.parse(JSON.stringify(
|
|
282
|
-
}
|
|
283
|
-
_insertLinks(
|
|
284
|
-
const
|
|
285
|
-
|
|
286
|
-
}
|
|
287
|
-
_insertRelations(
|
|
288
|
-
if (
|
|
289
|
-
if (typeof t2
|
|
290
|
-
this.relations[t2
|
|
291
|
-
else if (t2
|
|
292
|
-
let
|
|
293
|
-
t2
|
|
294
|
-
this.relations[
|
|
295
|
-
}), t2
|
|
280
|
+
_cleanCopy(e2) {
|
|
281
|
+
return JSON.parse(JSON.stringify(e2));
|
|
282
|
+
}
|
|
283
|
+
_insertLinks(e2, t2) {
|
|
284
|
+
const s2 = e2[t2];
|
|
285
|
+
s2 && s2.fieldtype == "multilink" && s2.linktype == "story" && typeof s2.id == "string" && this.links[s2.id] ? s2.story = this._cleanCopy(this.links[s2.id]) : s2 && s2.linktype === "story" && typeof s2.uuid == "string" && this.links[s2.uuid] && (s2.story = this._cleanCopy(this.links[s2.uuid]));
|
|
286
|
+
}
|
|
287
|
+
_insertRelations(e2, t2, s2) {
|
|
288
|
+
if (s2.indexOf(e2.component + "." + t2) > -1) {
|
|
289
|
+
if (typeof e2[t2] == "string")
|
|
290
|
+
this.relations[e2[t2]] && (e2[t2] = this._cleanCopy(this.relations[e2[t2]]));
|
|
291
|
+
else if (e2[t2].constructor === Array) {
|
|
292
|
+
let s3 = [];
|
|
293
|
+
e2[t2].forEach((e3) => {
|
|
294
|
+
this.relations[e3] && s3.push(this._cleanCopy(this.relations[e3]));
|
|
295
|
+
}), e2[t2] = s3;
|
|
296
296
|
}
|
|
297
297
|
}
|
|
298
298
|
}
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
299
|
+
_insertAssetsRelations(e2, t2) {
|
|
300
|
+
t2.forEach((t3) => {
|
|
301
|
+
e2.id === t3.id && (e2.original = t3, e2.original.filename = e2.filename, e2.original.filename = e2.original.filename.includes("https://s3.amazonaws.com/") ? e2.original.filename : e2.original.filename.replace("https://", "https://s3.amazonaws.com/"), delete e2.original.s3_filename);
|
|
302
|
+
});
|
|
303
|
+
}
|
|
304
|
+
iterateTree(e2, t2) {
|
|
305
|
+
let s2 = (e3) => {
|
|
306
|
+
if (e3 != null) {
|
|
307
|
+
if (e3.constructor === Array)
|
|
308
|
+
for (let t3 = 0; t3 < e3.length; t3++)
|
|
309
|
+
s2(e3[t3]);
|
|
310
|
+
else if (e3.constructor === Object) {
|
|
311
|
+
if (e3._stopResolving)
|
|
307
312
|
return;
|
|
308
|
-
for (let
|
|
309
|
-
|
|
313
|
+
for (let r2 in e3)
|
|
314
|
+
e3.component && e3._uid || e3.type === "link" ? (this._insertRelations(e3, r2, t2), this._insertLinks(e3, r2)) : e3.fieldtype === "asset" && this._insertAssetsRelations(e3, t2), s2(e3[r2]);
|
|
310
315
|
}
|
|
311
316
|
}
|
|
312
317
|
};
|
|
313
|
-
|
|
314
|
-
}
|
|
315
|
-
async resolveLinks(
|
|
316
|
-
let
|
|
317
|
-
if (
|
|
318
|
-
const
|
|
319
|
-
let
|
|
320
|
-
const
|
|
321
|
-
for (let
|
|
322
|
-
const
|
|
323
|
-
|
|
318
|
+
s2(e2.content);
|
|
319
|
+
}
|
|
320
|
+
async resolveLinks(e2, t2) {
|
|
321
|
+
let s2 = [];
|
|
322
|
+
if (e2.link_uuids) {
|
|
323
|
+
const r2 = e2.link_uuids.length;
|
|
324
|
+
let i2 = [];
|
|
325
|
+
const n2 = 50;
|
|
326
|
+
for (let t3 = 0; t3 < r2; t3 += n2) {
|
|
327
|
+
const s3 = Math.min(r2, t3 + n2);
|
|
328
|
+
i2.push(e2.link_uuids.slice(t3, s3));
|
|
324
329
|
}
|
|
325
|
-
for (let
|
|
326
|
-
(await this.getStories({ per_page:
|
|
327
|
-
|
|
330
|
+
for (let e3 = 0; e3 < i2.length; e3++) {
|
|
331
|
+
(await this.getStories({ per_page: n2, language: t2.language, version: t2.version, by_uuids: i2[e3].join(",") })).data.stories.forEach((e4) => {
|
|
332
|
+
s2.push(e4);
|
|
328
333
|
});
|
|
329
334
|
}
|
|
330
335
|
} else
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
this.links[
|
|
336
|
+
s2 = e2.links;
|
|
337
|
+
s2.forEach((e3) => {
|
|
338
|
+
this.links[e3.uuid] = __spreadProps(__spreadValues2({}, e3), { _stopResolving: true });
|
|
334
339
|
});
|
|
335
340
|
}
|
|
336
|
-
async resolveRelations(
|
|
337
|
-
let
|
|
338
|
-
if (
|
|
339
|
-
const
|
|
340
|
-
let
|
|
341
|
-
const
|
|
342
|
-
for (let
|
|
343
|
-
const
|
|
344
|
-
|
|
341
|
+
async resolveRelations(e2, t2) {
|
|
342
|
+
let s2 = [];
|
|
343
|
+
if (e2.rel_uuids) {
|
|
344
|
+
const r2 = e2.rel_uuids.length;
|
|
345
|
+
let i2 = [];
|
|
346
|
+
const n2 = 50;
|
|
347
|
+
for (let t3 = 0; t3 < r2; t3 += n2) {
|
|
348
|
+
const s3 = Math.min(r2, t3 + n2);
|
|
349
|
+
i2.push(e2.rel_uuids.slice(t3, s3));
|
|
345
350
|
}
|
|
346
|
-
for (let
|
|
347
|
-
(await this.getStories({ per_page:
|
|
348
|
-
|
|
351
|
+
for (let e3 = 0; e3 < i2.length; e3++) {
|
|
352
|
+
(await this.getStories({ per_page: n2, language: t2.language, version: t2.version, by_uuids: i2[e3].join(",") })).data.stories.forEach((e4) => {
|
|
353
|
+
s2.push(e4);
|
|
349
354
|
});
|
|
350
355
|
}
|
|
351
356
|
} else
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
this.relations[
|
|
357
|
+
s2 = e2.rels;
|
|
358
|
+
s2.forEach((e3) => {
|
|
359
|
+
this.relations[e3.uuid] = __spreadProps(__spreadValues2({}, e3), { _stopResolving: true });
|
|
355
360
|
});
|
|
356
361
|
}
|
|
357
|
-
async resolveStories(
|
|
358
|
-
let
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
this.iterateTree(
|
|
362
|
+
async resolveStories(e2, t2) {
|
|
363
|
+
let s2 = [];
|
|
364
|
+
if (t2.resolve_relations !== void 0 && t2.resolve_relations.length > 0 && (s2 = t2.resolve_relations.split(","), await this.resolveRelations(e2, t2)), ["1", "story", "url"].indexOf(t2.resolve_links) > -1 && await this.resolveLinks(e2, t2), this.resolveNestedRelations)
|
|
365
|
+
for (const e3 in this.relations)
|
|
366
|
+
this.iterateTree(this.relations[e3], s2);
|
|
367
|
+
e2.story ? this.iterateTree(e2.story, s2) : e2.stories.forEach((e3) => {
|
|
368
|
+
this.iterateTree(e3, s2);
|
|
364
369
|
});
|
|
365
370
|
}
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
371
|
+
resolveAssetsRelations(e2) {
|
|
372
|
+
const { assets: t2, stories: s2, story: r2 } = e2;
|
|
373
|
+
if (s2)
|
|
374
|
+
for (const e3 of s2)
|
|
375
|
+
this.iterateTree(e3, t2);
|
|
376
|
+
else
|
|
377
|
+
this.iterateTree(r2, t2);
|
|
378
|
+
}
|
|
379
|
+
cacheResponse(e2, t2, s2) {
|
|
380
|
+
return s2 === void 0 && (s2 = 0), new Promise(async (r2, i2) => {
|
|
381
|
+
let n2 = a({ url: e2, params: t2 }), o2 = this.cacheProvider();
|
|
382
|
+
if (this.cache.clear === "auto" && t2.version === "draft" && await this.flushCache(), t2.version === "published" && e2 != "/cdn/spaces/me") {
|
|
383
|
+
const e3 = await o2.get(n2);
|
|
384
|
+
if (e3)
|
|
385
|
+
return r2(e3);
|
|
373
386
|
}
|
|
374
387
|
try {
|
|
375
|
-
let
|
|
376
|
-
if (
|
|
377
|
-
return
|
|
378
|
-
(l3.data.story || l3.data.stories) && await this.resolveStories(l3.data,
|
|
379
|
-
} catch (
|
|
380
|
-
if (
|
|
381
|
-
return console.log(`Hit rate limit. Retrying in ${
|
|
382
|
-
|
|
388
|
+
let s3 = await this.throttle("get", e2, { params: t2, paramsSerializer: (e3) => a(e3) }), l3 = { data: s3.data, headers: s3.headers };
|
|
389
|
+
if (l3.data.assets && l3.data.assets.length && this.resolveAssetsRelations(l3.data), s3.headers["per-page"] && (l3 = Object.assign({}, l3, { perPage: parseInt(s3.headers["per-page"]), total: parseInt(s3.headers.total) })), s3.status != 200)
|
|
390
|
+
return i2(s3);
|
|
391
|
+
(l3.data.story || l3.data.stories) && await this.resolveStories(l3.data, t2), t2.version === "published" && e2 != "/cdn/spaces/me" && o2.set(n2, l3), l3.data.cv && (t2.version == "draft" && c[t2.token] != l3.data.cv && this.flushCache(), c[t2.token] = l3.data.cv), r2(l3);
|
|
392
|
+
} catch (n3) {
|
|
393
|
+
if (n3.response && n3.response.status === 429 && (s2 += 1) < this.maxRetries)
|
|
394
|
+
return console.log(`Hit rate limit. Retrying in ${s2} seconds.`), await (l2 = 1e3 * s2, new Promise((e3) => setTimeout(e3, l2))), this.cacheResponse(e2, t2, s2).then(r2).catch(i2);
|
|
395
|
+
i2(n3);
|
|
383
396
|
}
|
|
384
397
|
var l2;
|
|
385
398
|
});
|
|
386
399
|
}
|
|
387
|
-
throttledRequest(
|
|
388
|
-
return this.client[
|
|
400
|
+
throttledRequest(e2, t2, s2) {
|
|
401
|
+
return this.client[e2](t2, s2);
|
|
389
402
|
}
|
|
390
403
|
cacheVersions() {
|
|
391
404
|
return c;
|
|
@@ -393,24 +406,19 @@ class StoryblokClient {
|
|
|
393
406
|
cacheVersion() {
|
|
394
407
|
return c[this.accessToken];
|
|
395
408
|
}
|
|
396
|
-
setCacheVersion(
|
|
397
|
-
this.accessToken && (c[this.accessToken] =
|
|
409
|
+
setCacheVersion(e2) {
|
|
410
|
+
this.accessToken && (c[this.accessToken] = e2);
|
|
398
411
|
}
|
|
399
412
|
cacheProvider() {
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
}, getAll() {
|
|
410
|
-
}, set() {
|
|
411
|
-
}, flush() {
|
|
412
|
-
} };
|
|
413
|
-
}
|
|
413
|
+
return this.cache.type === "memory" ? { get: (e2) => l[e2], getAll: () => l, set(e2, t2) {
|
|
414
|
+
l[e2] = t2;
|
|
415
|
+
}, flush() {
|
|
416
|
+
l = {};
|
|
417
|
+
} } : { get() {
|
|
418
|
+
}, getAll() {
|
|
419
|
+
}, set() {
|
|
420
|
+
}, flush() {
|
|
421
|
+
} };
|
|
414
422
|
}
|
|
415
423
|
async flushCache() {
|
|
416
424
|
return await this.cacheProvider().flush(), this;
|
|
@@ -422,7 +430,7 @@ var api = (options = {}) => {
|
|
|
422
430
|
console.error("You need to provide an access token to interact with Storyblok API. Read https://www.storyblok.com/docs/api/content-delivery#topics/authentication");
|
|
423
431
|
return;
|
|
424
432
|
}
|
|
425
|
-
const storyblokApi = new
|
|
433
|
+
const storyblokApi = new h(apiOptions);
|
|
426
434
|
return { storyblokApi };
|
|
427
435
|
};
|
|
428
436
|
var editable = (blok) => {
|
|
@@ -435,6 +443,7 @@ var editable = (blok) => {
|
|
|
435
443
|
"data-blok-uid": options.id + "-" + options.uid
|
|
436
444
|
};
|
|
437
445
|
};
|
|
446
|
+
const bridgeLatest = "https://app.storyblok.com/f/storyblok-v2-latest.js";
|
|
438
447
|
const useStoryblokBridge = (id, cb, options = {}) => {
|
|
439
448
|
if (typeof window === "undefined") {
|
|
440
449
|
return;
|
|
@@ -467,7 +476,7 @@ const storyblokInit$1 = (pluginOptions = {}) => {
|
|
|
467
476
|
result = __spreadValues2(__spreadValues2({}, result), pluginFactory(options));
|
|
468
477
|
});
|
|
469
478
|
if (bridge !== false) {
|
|
470
|
-
loadBridge(
|
|
479
|
+
loadBridge(bridgeLatest);
|
|
471
480
|
}
|
|
472
481
|
return result;
|
|
473
482
|
};
|
|
@@ -509,7 +518,7 @@ const useStoryblokState = (initialStory = {}, bridgeOptions = {}) => {
|
|
|
509
518
|
let storyblokApiInstance = null;
|
|
510
519
|
const useStoryblokApi = () => {
|
|
511
520
|
if (!storyblokApiInstance) {
|
|
512
|
-
console.error("You can't use
|
|
521
|
+
console.error("You can't use getStoryblokApi if you're not loading apiPlugin.");
|
|
513
522
|
}
|
|
514
523
|
return storyblokApiInstance;
|
|
515
524
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@storyblok/react",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.6",
|
|
4
4
|
"description": "SDK to integrate Storyblok into your project using React.",
|
|
5
5
|
"main": "./dist/storyblok-react.js",
|
|
6
6
|
"module": "./dist/storyblok-react.mjs",
|
|
@@ -23,21 +23,21 @@
|
|
|
23
23
|
"prepublishOnly": "npm run build && cp ../README.md ./"
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
|
-
"@storyblok/js": "^1.
|
|
26
|
+
"@storyblok/js": "^1.2.1"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
|
-
"@babel/core": "^7.
|
|
30
|
-
"@babel/preset-env": "^7.
|
|
29
|
+
"@babel/core": "^7.18.2",
|
|
30
|
+
"@babel/preset-env": "^7.18.2",
|
|
31
31
|
"@cypress/react": "^5.12.3",
|
|
32
|
-
"@cypress/vite-dev-server": "^2.2.
|
|
33
|
-
"@vitejs/plugin-react": "^1.
|
|
34
|
-
"babel-jest": "^
|
|
35
|
-
"cypress": "^9.
|
|
32
|
+
"@cypress/vite-dev-server": "^2.2.3",
|
|
33
|
+
"@vitejs/plugin-react": "^1.3.2",
|
|
34
|
+
"babel-jest": "^28.1.0",
|
|
35
|
+
"cypress": "^9.7.0",
|
|
36
36
|
"eslint-plugin-cypress": "^2.12.1",
|
|
37
|
-
"eslint-plugin-jest": "^26.
|
|
38
|
-
"jest": "^
|
|
37
|
+
"eslint-plugin-jest": "^26.4.2",
|
|
38
|
+
"jest": "^28.1.0",
|
|
39
39
|
"react": "17.0.2",
|
|
40
|
-
"vite": "^2.
|
|
40
|
+
"vite": "^2.9.9"
|
|
41
41
|
},
|
|
42
42
|
"babel": {
|
|
43
43
|
"presets": [
|