@storyblok/svelte 2.1.5 → 2.3.0

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 CHANGED
@@ -199,6 +199,66 @@ sbBridge.on(["input", "published", "change"], (event) => {
199
199
 
200
200
  For background information on the [Storyblok JS Bridge](https://www.storyblok.com/docs/Guides/storyblok-latest-js?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-svelte), please check out documentation.
201
201
 
202
+ ### Rendering Rich Text
203
+
204
+ You can easily render rich text by using the `renderRichText`function that comes with `@storyblok/svelte`and Sveltes `{@html htmlstring}`directive.
205
+
206
+ ```html
207
+ <script>
208
+ import { renderRichText } from "@storyblok/svelte";
209
+
210
+ export let blok;
211
+ $: articleHTML = renderRichText(blok.article);
212
+ </script>
213
+
214
+ <div>{@html articleHTML}</div>
215
+ ```
216
+
217
+ You can set a **custom Schema and component resolver globally** at init time by using the `richText` init option:
218
+
219
+ ```js
220
+ import { RichTextSchema, storyblokInit } from "@storyblok/svelte";
221
+ import cloneDeep from "clone-deep";
222
+
223
+ const mySchema = cloneDeep(RichTextSchema); // you can make a copy of the default RichTextSchema
224
+ // ... and edit the nodes and marks, or add your own.
225
+ // Check the base RichTextSchema source here https://github.com/storyblok/storyblok-js-client/blob/master/source/schema.js
226
+
227
+ storyblokInit({
228
+ accessToken: "<your-token>",
229
+ richText: {
230
+ schema: mySchema,
231
+ resolver: (component, blok) => {
232
+ switch (component) {
233
+ case "my-custom-component":
234
+ return `<div class="my-component-class">${blok.text}</div>`;
235
+ default:
236
+ return "Resolver not defined";
237
+ }
238
+ },
239
+ },
240
+ });
241
+ ```
242
+
243
+ You can also set a **custom Schema and component resolver only once** by passing the options as the second parameter to `renderRichText` function:
244
+
245
+ ```js
246
+ import { renderRichText } from "@storyblok/svelte";
247
+
248
+ renderRichText(blok.richTextField, {
249
+ schema: mySchema,
250
+ resolver: (component, blok) => {
251
+ switch (component) {
252
+ case "my-custom-component":
253
+ return `<div class="my-component-class">${blok.text}</div>`;
254
+ break;
255
+ default:
256
+ return `Component ${component} not found`;
257
+ }
258
+ },
259
+ });
260
+ ```
261
+
202
262
  ### Compatibility
203
263
 
204
264
  This plugin is for Svelte. Thus, it supports the [same browsers as Svelte 3](https://github.com/sveltejs/svelte/issues/558). In short: all modern browsers and IE10+.
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  /// <reference types="svelte/types/runtime/ambient" />
2
- export { useStoryblokBridge, apiPlugin } from "@storyblok/js";
2
+ export { useStoryblokBridge, apiPlugin, renderRichText, RichTextSchema, } from "@storyblok/js";
3
3
  import type { SbSvelteSDKOptions, StoryblokClient, SbBlokData } from "./types";
4
4
  export declare const storyblokEditable: (node: HTMLElement, value: SbBlokData) => {
5
5
  update(newValue: SbBlokData): void;
@@ -1,12 +1,14 @@
1
- (function(f,m){typeof exports=="object"&&typeof module!="undefined"?m(exports,require("axios")):typeof define=="function"&&define.amd?define(["exports","axios"],m):(f=typeof globalThis!="undefined"?globalThis:f||self,m(f.storyblokSvelte={},f.e))})(this,function(f,m){"use strict";function rt(n){return n&&typeof n=="object"&&"default"in n?n:{default:n}}var ot=rt(m),st=Object.defineProperty,it=Object.defineProperties,at=Object.getOwnPropertyDescriptors,M=Object.getOwnPropertySymbols,lt=Object.prototype.hasOwnProperty,ct=Object.prototype.propertyIsEnumerable,B=(n,t,e)=>t in n?st(n,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):n[t]=e,p=(n,t)=>{for(var e in t||(t={}))lt.call(t,e)&&B(n,e,t[e]);if(M)for(var e of M(t))ct.call(t,e)&&B(n,e,t[e]);return n},R=(n,t)=>it(n,at(t));let L=!1;const q=[],ut=n=>new Promise((t,e)=>{if(typeof window=="undefined"||(window.storyblokRegisterEvent=o=>{if(window.location===window.parent.location){console.warn("You are not in Draft Mode or in the Visual Editor.");return}L?o():q.push(o)},document.getElementById("storyblok-javascript-bridge")))return;const r=document.createElement("script");r.async=!0,r.src=n,r.id="storyblok-javascript-bridge",r.onerror=o=>e(o),r.onload=o=>{q.forEach(s=>s()),L=!0,t(o)},document.getElementsByTagName("head")[0].appendChild(r)});/*!
1
+ (function(h,m){typeof exports=="object"&&typeof module!="undefined"?m(exports,require("axios")):typeof define=="function"&&define.amd?define(["exports","axios"],m):(h=typeof globalThis!="undefined"?globalThis:h||self,m(h.storyblokSvelte={},h.e))})(this,function(h,m){"use strict";function at(r){return r&&typeof r=="object"&&"default"in r?r:{default:r}}var lt=at(m),ct=Object.defineProperty,ut=Object.defineProperties,ht=Object.getOwnPropertyDescriptors,q=Object.getOwnPropertySymbols,ft=Object.prototype.hasOwnProperty,dt=Object.prototype.propertyIsEnumerable,L=(r,t,e)=>t in r?ct(r,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):r[t]=e,d=(r,t)=>{for(var e in t||(t={}))ft.call(t,e)&&L(r,e,t[e]);if(q)for(var e of q(t))dt.call(t,e)&&L(r,e,t[e]);return r},E=(r,t)=>ut(r,ht(t));let B=!1;const z=[],pt=r=>new Promise((t,e)=>{if(typeof window=="undefined"||(window.storyblokRegisterEvent=o=>{if(window.location===window.parent.location){console.warn("You are not in Draft Mode or in the Visual Editor.");return}B?o():z.push(o)},document.getElementById("storyblok-javascript-bridge")))return;const n=document.createElement("script");n.async=!0,n.src=r,n.id="storyblok-javascript-bridge",n.onerror=o=>e(o),n.onload=o=>{z.forEach(s=>s()),B=!0,t(o)},document.getElementsByTagName("head")[0].appendChild(n)}),gt=function(r,t){if(!r)return null;let e={};for(let n in r){let o=r[n];t.indexOf(n)>-1&&o!==null&&(e[n]=o)}return e},mt=r=>r==="email";var D={nodes:{horizontal_rule(){return{singleTag:"hr"}},blockquote(){return{tag:"blockquote"}},bullet_list(){return{tag:"ul"}},code_block(r){return{tag:["pre",{tag:"code",attrs:r.attrs}]}},hard_break(){return{singleTag:"br"}},heading(r){return{tag:`h${r.attrs.level}`}},image(r){return{singleTag:[{tag:"img",attrs:gt(r.attrs,["src","alt","title"])}]}},list_item(){return{tag:"li"}},ordered_list(){return{tag:"ol"}},paragraph(){return{tag:"p"}}},marks:{bold(){return{tag:"b"}},strike(){return{tag:"strike"}},underline(){return{tag:"u"}},strong(){return{tag:"strong"}},code(){return{tag:"code"}},italic(){return{tag:"i"}},link(r){const t=d({},r.attrs),{linktype:e="url"}=r.attrs;return mt(e)&&(t.href=`mailto:${t.href}`),t.anchor&&(t.href=`${t.href}#${t.anchor}`,delete t.anchor),{tag:[{tag:"a",attrs:t}]}},styled(r){return{tag:[{tag:"span",attrs:r.attrs}]}}}};const yt=function(r){const t={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"},e=/[&<>"']/g,n=RegExp(e.source);return r&&n.test(r)?r.replace(e,o=>t[o]):r};class U{constructor(t){t||(t=D),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(n=>{e+=this.renderNode(n)}),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(o=>{const s=this.getMatchingMark(o);s&&e.push(this.renderOpeningTag(s.tag))});const n=this.getMatchingNode(t);return n&&n.tag&&e.push(this.renderOpeningTag(n.tag)),t.content?t.content.forEach(o=>{e.push(this.renderNode(o))}):t.text?e.push(yt(t.text)):n&&n.singleTag?e.push(this.renderTag(n.singleTag," /")):n&&n.html&&e.push(n.html),n&&n.tag&&e.push(this.renderClosingTag(n.tag)),t.marks&&t.marks.slice(0).reverse().forEach(o=>{const s=this.getMatchingMark(o);s&&e.push(this.renderClosingTag(s.tag))}),e.join("")}renderTag(t,e){return t.constructor===String?`<${t}${e}>`:t.map(o=>{if(o.constructor===String)return`<${o}${e}>`;{let s=`<${o.tag}`;if(o.attrs)for(let a in o.attrs){let i=o.attrs[a];i!==null&&(s+=` ${a}="${i}"`)}return`${s}${e}>`}}).join("")}renderOpeningTag(t){return this.renderTag(t,"")}renderClosingTag(t){return t.constructor===String?`</${t}>`:t.slice(0).reverse().map(n=>n.constructor===String?`</${n}>`:`</${n.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)}}/*!
2
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 D(n){return typeof n=="number"&&n==n&&n!==1/0&&n!==-1/0}function z(n,t,e){if(!D(t))throw new TypeError("Expected `limit` to be a finite number");if(!D(e))throw new TypeError("Expected `interval` to be a finite number");var r=[],o=[],s=0,a=function(){s++;var l=setTimeout(function(){s--,r.length>0&&a(),o=o.filter(function(u){return u!==l})},e);o.indexOf(l)<0&&o.push(l);var c=r.shift();c.resolve(n.apply(c.self,c.args))},i=function(){var l=arguments,c=this;return new Promise(function(u,d){r.push({resolve:u,reject:d,args:l,self:c}),s<t&&a()})};return i.abort=function(){o.forEach(clearTimeout),o=[],r.forEach(function(l){l.reject(new throttle.AbortError)}),r.length=0},i}z.AbortError=function(){Error.call(this,"Throttled function aborted"),this.name="AbortError"};const ft=function(n,t){if(!n)return null;let e={};for(let r in n){let o=n[r];t.indexOf(r)>-1&&o!==null&&(e[r]=o)}return e};var dt={nodes:{horizontal_rule:()=>({singleTag:"hr"}),blockquote:()=>({tag:"blockquote"}),bullet_list:()=>({tag:"ul"}),code_block:n=>({tag:["pre",{tag:"code",attrs:n.attrs}]}),hard_break:()=>({singleTag:"br"}),heading:n=>({tag:`h${n.attrs.level}`}),image:n=>({singleTag:[{tag:"img",attrs:ft(n.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(n){const t=p({},n.attrs),{linktype:e="url"}=n.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:n=>({tag:[{tag:"span",attrs:n.attrs}]})}};class ht{constructor(t){t||(t=dt),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(o=>{const s=this.getMatchingMark(o);s&&e.push(this.renderOpeningTag(s.tag))});const r=this.getMatchingNode(t);return r&&r.tag&&e.push(this.renderOpeningTag(r.tag)),t.content?t.content.forEach(o=>{e.push(this.renderNode(o))}):t.text?e.push(function(o){const s={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"},a=/[&<>"']/g,i=RegExp(a.source);return o&&i.test(o)?o.replace(a,l=>s[l]):o}(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(o=>{const s=this.getMatchingMark(o);s&&e.push(this.renderClosingTag(s.tag))}),e.join("")}renderTag(t,e){return t.constructor===String?`<${t}${e}>`:t.map(r=>{if(r.constructor===String)return`<${r}${e}>`;{let o=`<${r.tag}`;if(r.attrs)for(let s in r.attrs){let a=r.attrs[s];a!==null&&(o+=` ${s}="${a}"`)}return`${o}${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 pt=(n=0,t=n)=>{const e=Math.abs(t-n)||0,r=n<t?1:-1;return((o=0,s)=>[...Array(o)].map(s))(e,(o,s)=>s*r+n)},E=(n,t,e)=>{const r=[];for(const o in n){if(!Object.prototype.hasOwnProperty.call(n,o))continue;const s=n[o],a=e?"":encodeURIComponent(o);let i;i=typeof s=="object"?E(s,t?t+encodeURIComponent("["+a+"]"):a,Array.isArray(s)):(t?t+encodeURIComponent("["+a+"]"):a)+"="+encodeURIComponent(s),r.push(i)}return r.join("&")};let b={},g={};class gt{constructor(t,e){if(!e){let s=t.region?`-${t.region}`:"",a=t.https===!1?"http":"https";e=t.oauthToken===void 0?`${a}://api${s}.storyblok.com/v2`:`${a}://api${s}.storyblok.com/v1`}let r=Object.assign({},t.headers),o=5;t.oauthToken!==void 0&&(r.Authorization=t.oauthToken,o=3),t.rateLimit!==void 0&&(o=t.rateLimit),this.richTextResolver=new ht(t.richTextSchema),typeof t.componentResolver=="function"&&this.setComponentResolver(t.componentResolver),this.maxRetries=t.maxRetries||5,this.throttle=z(this.throttledRequest,o,1e3),this.accessToken=t.accessToken,this.relations={},this.links={},this.cache=t.cache||{clear:"manual"},this.client=ot.default.create({baseURL:e,timeout:t.timeout||0,headers:r,proxy:t.proxy||!1}),t.responseInterceptor&&this.client.interceptors.response.use(s=>t.responseInterceptor(s)),this.resolveNestedRelations=t.resolveNestedRelations||!0}setComponentResolver(t){this.richTextResolver.addNode("blok",e=>{let r="";return e.attrs.body.forEach(o=>{r+=t(o.component,o)}),{html:r}})}parseParams(t={}){return t.version||(t.version="published"),t.token||(t.token=this.getToken()),t.cv||(t.cv=g[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,o){const s=this.factoryParamOptions(t,((a={},i=25,l=1)=>R(p({},a),{per_page:i,page:l}))(e,r,o));return this.cacheResponse(t,s)}get(t,e){let r=`/${t}`;const o=this.factoryParamOptions(r,e);return this.cacheResponse(r,o)}async getAll(t,e={},r){const o=e.per_page||25,s=`/${t}`,a=s.split("/");r=r||a[a.length-1];const i=await this.makeRequest(s,e,o,1),l=Math.ceil(i.total/o);return((c=[],u)=>c.map(u).reduce((d,T)=>[...d,...T],[]))([i,...await(async(c=[],u)=>Promise.all(c.map(u)))(pt(1,l),async c=>this.makeRequest(s,e,o,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 o=[];t[e].forEach(s=>{this.relations[s]&&o.push(this._cleanCopy(this.relations[s]))}),t[e]=o}}}_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=o=>{if(o!=null){if(o.constructor===Array)for(let s=0;s<o.length;s++)r(o[s]);else if(o.constructor===Object){if(o._stopResolving)return;for(let s in o)o.component&&o._uid||o.type==="link"?(this._insertRelations(o,s,e),this._insertLinks(o,s)):o.fieldtype==="asset"&&this._insertAssetsRelations(o,e),r(o[s])}}};r(t.content)}async resolveLinks(t,e){let r=[];if(t.link_uuids){const o=t.link_uuids.length;let s=[];const a=50;for(let i=0;i<o;i+=a){const l=Math.min(o,i+a);s.push(t.link_uuids.slice(i,l))}for(let i=0;i<s.length;i++)(await this.getStories({per_page:a,language:e.language,version:e.version,by_uuids:s[i].join(",")})).data.stories.forEach(l=>{r.push(l)})}else r=t.links;r.forEach(o=>{this.links[o.uuid]=R(p({},o),{_stopResolving:!0})})}async resolveRelations(t,e){let r=[];if(t.rel_uuids){const o=t.rel_uuids.length;let s=[];const a=50;for(let i=0;i<o;i+=a){const l=Math.min(o,i+a);s.push(t.rel_uuids.slice(i,l))}for(let i=0;i<s.length;i++)(await this.getStories({per_page:a,language:e.language,version:e.version,by_uuids:s[i].join(",")})).data.stories.forEach(l=>{r.push(l)})}else r=t.rels;r.forEach(o=>{this.relations[o.uuid]=R(p({},o),{_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 o in this.relations)this.iterateTree(this.relations[o],r);t.story?this.iterateTree(t.story,r):t.stories.forEach(o=>{this.iterateTree(o,r)})}resolveAssetsRelations(t){const{assets:e,stories:r,story:o}=t;if(r)for(const s of r)this.iterateTree(s,e);else this.iterateTree(o,e)}cacheResponse(t,e,r){return r===void 0&&(r=0),new Promise(async(o,s)=>{let a=E({url:t,params:e}),i=this.cacheProvider();if(this.cache.clear==="auto"&&e.version==="draft"&&await this.flushCache(),e.version==="published"&&t!="/cdn/spaces/me"){const c=await i.get(a);if(c)return o(c)}try{let c=await this.throttle("get",t,{params:e,paramsSerializer:d=>E(d)}),u={data:c.data,headers:c.headers};if(u.data.assets&&u.data.assets.length&&this.resolveAssetsRelations(u.data),c.headers["per-page"]&&(u=Object.assign({},u,{perPage:parseInt(c.headers["per-page"]),total:parseInt(c.headers.total)})),c.status!=200)return s(c);(u.data.story||u.data.stories)&&await this.resolveStories(u.data,e),e.version==="published"&&t!="/cdn/spaces/me"&&i.set(a,u),u.data.cv&&(e.version=="draft"&&g[e.token]!=u.data.cv&&this.flushCache(),g[e.token]=u.data.cv),o(u)}catch(c){if(c.response&&c.response.status===429&&(r+=1)<this.maxRetries)return console.log(`Hit rate limit. Retrying in ${r} seconds.`),await(l=1e3*r,new Promise(u=>setTimeout(u,l))),this.cacheResponse(t,e,r).then(o).catch(s);s(c)}var l})}throttledRequest(t,e,r){return this.client[t](e,r)}cacheVersions(){return g}cacheVersion(){return g[this.accessToken]}setCacheVersion(t){this.accessToken&&(g[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}}const mt=(n={})=>{const{apiOptions:t}=n;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 gt(t)}};var yt=n=>{if(typeof n!="object"||typeof n._editable=="undefined")return{};const t=JSON.parse(n._editable.replace(/^<!--#storyblok#/,"").replace(/-->$/,""));return{"data-blok-c":JSON.stringify(t),"data-blok-uid":t.id+"-"+t.uid}};const _t="https://app.storyblok.com/f/storyblok-v2-latest.js",kt=(n,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(!n){console.warn("Story ID is not defined. Please provide a valid ID.");return}window.storyblokRegisterEvent(()=>{new window.StoryblokBridge(e).on(["input","published","change"],o=>{o.action=="input"&&o.story.id===n?t(o.story):window.location.reload()})})}},bt=(n={})=>{const{bridge:t,accessToken:e,use:r=[],apiOptions:o={}}=n;o.accessToken=o.accessToken||e;const s={bridge:t,apiOptions:o};let a={};return r.forEach(i=>{a=p(p({},a),i(s))}),t!==!1&&ut(_t),a};function U(){}function O(n,t){for(const e in t)n[e]=t[e];return n}function V(n){return n()}function J(){return Object.create(null)}function y(n){n.forEach(V)}function vt(n){return typeof n=="function"}function wt(n,t){return n!=n?t==t:n!==t||n&&typeof n=="object"||typeof n=="function"}function $t(n){return Object.keys(n).length===0}function Tt(n){const t={};for(const e in n)e[0]!=="$"&&(t[e]=n[e]);return t}function Y(n,t){const e={};t=new Set(t);for(const r in n)!t.has(r)&&r[0]!=="$"&&(e[r]=n[r]);return e}function Rt(n,t,e){n.insertBefore(t,e||null)}function F(n){n.parentNode.removeChild(n)}function Et(n){return document.createTextNode(n)}function Ot(){return Et("")}function St(n){return Array.from(n.childNodes)}let S;function _(n){S=n}const k=[],H=[],v=[],G=[],Pt=Promise.resolve();let P=!1;function jt(){P||(P=!0,Pt.then(K))}function j(n){v.push(n)}const A=new Set;let w=0;function K(){const n=S;do{for(;w<k.length;){const t=k[w];w++,_(t),At(t.$$)}for(_(null),k.length=0,w=0;H.length;)H.pop()();for(let t=0;t<v.length;t+=1){const e=v[t];A.has(e)||(A.add(e),e())}v.length=0}while(k.length);for(;G.length;)G.pop()();P=!1,A.clear(),_(n)}function At(n){if(n.fragment!==null){n.update(),y(n.before_update);const t=n.dirty;n.dirty=[-1],n.fragment&&n.fragment.p(n.ctx,t),n.after_update.forEach(j)}}const $=new Set;let h;function xt(){h={r:0,c:[],p:h}}function Ct(){h.r||y(h.c),h=h.p}function x(n,t){n&&n.i&&($.delete(n),n.i(t))}function Q(n,t,e,r){if(n&&n.o){if($.has(n))return;$.add(n),h.c.push(()=>{$.delete(n),r&&(e&&n.d(1),r())}),n.o(t)}}function It(n,t){const e={},r={},o={$$scope:1};let s=n.length;for(;s--;){const a=n[s],i=t[s];if(i){for(const l in a)l in i||(r[l]=1);for(const l in i)o[l]||(e[l]=i[l],o[l]=1);n[s]=i}else for(const l in a)o[l]=1}for(const a in r)a in e||(e[a]=void 0);return e}function Nt(n){return typeof n=="object"&&n!==null?n:{}}function W(n){n&&n.c()}function C(n,t,e,r){const{fragment:o,on_mount:s,on_destroy:a,after_update:i}=n.$$;o&&o.m(t,e),r||j(()=>{const l=s.map(V).filter(vt);a?a.push(...l):y(l),n.$$.on_mount=[]}),i.forEach(j)}function I(n,t){const e=n.$$;e.fragment!==null&&(y(e.on_destroy),e.fragment&&e.fragment.d(t),e.on_destroy=e.fragment=null,e.ctx=[])}function Mt(n,t){n.$$.dirty[0]===-1&&(k.push(n),jt(),n.$$.dirty.fill(0)),n.$$.dirty[t/31|0]|=1<<t%31}function Bt(n,t,e,r,o,s,a,i=[-1]){const l=S;_(n);const c=n.$$={fragment:null,ctx:null,props:s,update:U,not_equal:o,bound:J(),on_mount:[],on_destroy:[],on_disconnect:[],before_update:[],after_update:[],context:new Map(t.context||(l?l.$$.context:[])),callbacks:J(),dirty:i,skip_bound:!1,root:t.target||l.$$.root};a&&a(c.root);let u=!1;if(c.ctx=e?e(n,t.props||{},(d,T,...et)=>{const nt=et.length?et[0]:T;return c.ctx&&o(c.ctx[d],c.ctx[d]=nt)&&(!c.skip_bound&&c.bound[d]&&c.bound[d](nt),u&&Mt(n,d)),T}):[],c.update(),u=!0,y(c.before_update),c.fragment=r?r(c.ctx):!1,t.target){if(t.hydrate){const d=St(t.target);c.fragment&&c.fragment.l(d),d.forEach(F)}else c.fragment&&c.fragment.c();t.intro&&x(n.$$.fragment),C(n,t.target,t.anchor,t.customElement),K()}_(l)}class Lt{$destroy(){I(this,1),this.$destroy=U}$on(t,e){const r=this.$$.callbacks[t]||(this.$$.callbacks[t]=[]);return r.push(e),()=>{const o=r.indexOf(e);o!==-1&&r.splice(o,1)}}$set(t){this.$$set&&!$t(t)&&(this.$$.skip_bound=!0,this.$$set(t),this.$$.skip_bound=!1)}}function qt(n){let t,e,r;const o=[{blok:n[0]},n[2]];var s=n[1];function a(i){let l={};for(let c=0;c<o.length;c+=1)l=O(l,o[c]);return{props:l}}return s&&(t=new s(a())),{c(){t&&W(t.$$.fragment),e=Ot()},m(i,l){t&&C(t,i,l),Rt(i,e,l),r=!0},p(i,[l]){const c=l&5?It(o,[l&1&&{blok:i[0]},l&4&&Nt(i[2])]):{};if(s!==(s=i[1])){if(t){xt();const u=t;Q(u.$$.fragment,1,0,()=>{I(u,1)}),Ct()}s?(t=new s(a()),W(t.$$.fragment),x(t.$$.fragment,1),C(t,e.parentNode,e)):t=null}else s&&t.$set(c)},i(i){r||(t&&x(t.$$.fragment,i),r=!0)},o(i){t&&Q(t.$$.fragment,i),r=!1},d(i){i&&F(e),t&&I(t,i)}}}function Dt(n,t,e){const r=["blok"];let o=Y(t,r),s,{blok:a}=t;return a?s=tt(a.component):console.error("Please provide a 'blok' property to the StoryblokComponent"),n.$$set=i=>{t=O(O({},t),Tt(i)),e(2,o=Y(t,r)),"blok"in i&&e(0,a=i.blok)},[a,s,o]}class zt extends Lt{constructor(t){super(),Bt(this,t,Dt,qt,wt,{blok:0})}}const Ut=(n,t)=>{const e=r=>{const o=yt(r);o["data-blok-c"]&&(n.setAttribute("data-blok-c",o["data-blok-c"]),n.setAttribute("data-blok-uid",o["data-blok-uid"]),n.classList.add("storyblok__outline"))};return e(t),{update(r){e(r)}}};let N=null;const X=()=>(N||console.log("You can't use getStoryblokApi if you're not loading apiPlugin."),N);let Z=null;const Vt=n=>{const{storyblokApi:t}=bt(n);N=t,Z=n.components||{}},tt=n=>{const t=Z[n];return t||console.error(`You didn't load the ${n} component. Please load it in storyblokInit. For example:
5
+ */function H(r){return typeof r=="number"&&r==r&&r!==1/0&&r!==-1/0}function V(r,t,e){if(!H(t))throw new TypeError("Expected `limit` to be a finite number");if(!H(e))throw new TypeError("Expected `interval` to be a finite number");var n=[],o=[],s=0,a=function(){s++;var l=setTimeout(function(){s--,n.length>0&&a(),o=o.filter(function(u){return u!==l})},e);o.indexOf(l)<0&&o.push(l);var c=n.shift();c.resolve(r.apply(c.self,c.args))},i=function(){var l=arguments,c=this;return new Promise(function(u,f){n.push({resolve:u,reject:f,args:l,self:c}),s<t&&a()})};return i.abort=function(){o.forEach(clearTimeout),o=[],n.forEach(function(l){l.reject(new throttle.AbortError)}),n.length=0},i}V.AbortError=function(){Error.call(this,"Throttled function aborted"),this.name="AbortError"};const kt=function(r,t){if(!r)return null;let e={};for(let n in r){let o=r[n];t.indexOf(n)>-1&&o!==null&&(e[n]=o)}return e};var _t={nodes:{horizontal_rule:()=>({singleTag:"hr"}),blockquote:()=>({tag:"blockquote"}),bullet_list:()=>({tag:"ul"}),code_block:r=>({tag:["pre",{tag:"code",attrs:r.attrs}]}),hard_break:()=>({singleTag:"br"}),heading:r=>({tag:`h${r.attrs.level}`}),image:r=>({singleTag:[{tag:"img",attrs:kt(r.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(r){const t=d({},r.attrs),{linktype:e="url"}=r.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:r=>({tag:[{tag:"span",attrs:r.attrs}]})}};class bt{constructor(t){t||(t=_t),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(n=>{e+=this.renderNode(n)}),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(o=>{const s=this.getMatchingMark(o);s&&e.push(this.renderOpeningTag(s.tag))});const n=this.getMatchingNode(t);return n&&n.tag&&e.push(this.renderOpeningTag(n.tag)),t.content?t.content.forEach(o=>{e.push(this.renderNode(o))}):t.text?e.push(function(o){const s={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"},a=/[&<>"']/g,i=RegExp(a.source);return o&&i.test(o)?o.replace(a,l=>s[l]):o}(t.text)):n&&n.singleTag?e.push(this.renderTag(n.singleTag," /")):n&&n.html&&e.push(n.html),n&&n.tag&&e.push(this.renderClosingTag(n.tag)),t.marks&&t.marks.slice(0).reverse().forEach(o=>{const s=this.getMatchingMark(o);s&&e.push(this.renderClosingTag(s.tag))}),e.join("")}renderTag(t,e){return t.constructor===String?`<${t}${e}>`:t.map(n=>{if(n.constructor===String)return`<${n}${e}>`;{let o=`<${n.tag}`;if(n.attrs)for(let s in n.attrs){let a=n.attrs[s];a!==null&&(o+=` ${s}="${a}"`)}return`${o}${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 vt=(r=0,t=r)=>{const e=Math.abs(t-r)||0,n=r<t?1:-1;return((o=0,s)=>[...Array(o)].map(s))(e,(o,s)=>s*n+r)},S=(r,t,e)=>{const n=[];for(const o in r){if(!Object.prototype.hasOwnProperty.call(r,o))continue;const s=r[o],a=e?"":encodeURIComponent(o);let i;i=typeof s=="object"?S(s,t?t+encodeURIComponent("["+a+"]"):a,Array.isArray(s)):(t?t+encodeURIComponent("["+a+"]"):a)+"="+encodeURIComponent(s),n.push(i)}return n.join("&")};let b={},g={};class wt{constructor(t,e){if(!e){let s=t.region?`-${t.region}`:"",a=t.https===!1?"http":"https";e=t.oauthToken===void 0?`${a}://api${s}.storyblok.com/v2`:`${a}://api${s}.storyblok.com/v1`}let n=Object.assign({},t.headers),o=5;t.oauthToken!==void 0&&(n.Authorization=t.oauthToken,o=3),t.rateLimit!==void 0&&(o=t.rateLimit),this.richTextResolver=new bt(t.richTextSchema),typeof t.componentResolver=="function"&&this.setComponentResolver(t.componentResolver),this.maxRetries=t.maxRetries||5,this.throttle=V(this.throttledRequest,o,1e3),this.accessToken=t.accessToken,this.relations={},this.links={},this.cache=t.cache||{clear:"manual"},this.client=lt.default.create({baseURL:e,timeout:t.timeout||0,headers:n,proxy:t.proxy||!1}),t.responseInterceptor&&this.client.interceptors.response.use(s=>t.responseInterceptor(s)),this.resolveNestedRelations=t.resolveNestedRelations||!0}setComponentResolver(t){this.richTextResolver.addNode("blok",e=>{let n="";return e.attrs.body.forEach(o=>{n+=t(o.component,o)}),{html:n}})}parseParams(t={}){return t.version||(t.version="published"),t.token||(t.token=this.getToken()),t.cv||(t.cv=g[t.token]),Array.isArray(t.resolve_relations)&&(t.resolve_relations=t.resolve_relations.join(",")),t}factoryParamOptions(t,e={}){return((n="")=>n.indexOf("/cdn/")>-1)(t)?this.parseParams(e):e}makeRequest(t,e,n,o){const s=this.factoryParamOptions(t,((a={},i=25,l=1)=>E(d({},a),{per_page:i,page:l}))(e,n,o));return this.cacheResponse(t,s)}get(t,e){let n=`/${t}`;const o=this.factoryParamOptions(n,e);return this.cacheResponse(n,o)}async getAll(t,e={},n){const o=e.per_page||25,s=`/${t}`,a=s.split("/");n=n||a[a.length-1];const i=await this.makeRequest(s,e,o,1),l=Math.ceil(i.total/o);return((c=[],u)=>c.map(u).reduce((f,R)=>[...f,...R],[]))([i,...await(async(c=[],u)=>Promise.all(c.map(u)))(vt(1,l),async c=>this.makeRequest(s,e,o,c+1))],c=>Object.values(c.data[n]))}post(t,e){let n=`/${t}`;return this.throttle("post",n,e)}put(t,e){let n=`/${t}`;return this.throttle("put",n,e)}delete(t,e){let n=`/${t}`;return this.throttle("delete",n,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 n=t[e];n&&n.fieldtype=="multilink"&&n.linktype=="story"&&typeof n.id=="string"&&this.links[n.id]?n.story=this._cleanCopy(this.links[n.id]):n&&n.linktype==="story"&&typeof n.uuid=="string"&&this.links[n.uuid]&&(n.story=this._cleanCopy(this.links[n.uuid]))}_insertRelations(t,e,n){if(n.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 o=[];t[e].forEach(s=>{this.relations[s]&&o.push(this._cleanCopy(this.relations[s]))}),t[e]=o}}}_insertAssetsRelations(t,e){e.forEach(n=>{t.id===n.id&&(t.original=n,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 n=o=>{if(o!=null){if(o.constructor===Array)for(let s=0;s<o.length;s++)n(o[s]);else if(o.constructor===Object){if(o._stopResolving)return;for(let s in o)o.component&&o._uid||o.type==="link"?(this._insertRelations(o,s,e),this._insertLinks(o,s)):"id"in o&&o.fieldtype==="asset"&&this._insertAssetsRelations(o,e),n(o[s])}}};n(t.content)}async resolveLinks(t,e){let n=[];if(t.link_uuids){const o=t.link_uuids.length;let s=[];const a=50;for(let i=0;i<o;i+=a){const l=Math.min(o,i+a);s.push(t.link_uuids.slice(i,l))}for(let i=0;i<s.length;i++)(await this.getStories({per_page:a,language:e.language,version:e.version,by_uuids:s[i].join(",")})).data.stories.forEach(l=>{n.push(l)})}else n=t.links;n.forEach(o=>{this.links[o.uuid]=E(d({},o),{_stopResolving:!0})})}async resolveRelations(t,e){let n=[];if(t.rel_uuids){const o=t.rel_uuids.length;let s=[];const a=50;for(let i=0;i<o;i+=a){const l=Math.min(o,i+a);s.push(t.rel_uuids.slice(i,l))}for(let i=0;i<s.length;i++)(await this.getStories({per_page:a,language:e.language,version:e.version,by_uuids:s[i].join(",")})).data.stories.forEach(l=>{n.push(l)})}else n=t.rels;n.forEach(o=>{this.relations[o.uuid]=E(d({},o),{_stopResolving:!0})})}async resolveStories(t,e){let n=[];if(e.resolve_relations!==void 0&&e.resolve_relations.length>0&&(t.rels||t.rel_uuids)&&(n=e.resolve_relations.split(","),await this.resolveRelations(t,e)),["1","story","url"].indexOf(e.resolve_links)>-1&&(t.links||t.link_uuids)&&await this.resolveLinks(t,e),this.resolveNestedRelations)for(const o in this.relations)this.iterateTree(this.relations[o],n);t.story?this.iterateTree(t.story,n):t.stories.forEach(o=>{this.iterateTree(o,n)})}resolveAssetsRelations(t){const{assets:e,stories:n,story:o}=t;if(n)for(const s of n)this.iterateTree(s,e);else{if(!o)return t;this.iterateTree(o,e)}}cacheResponse(t,e,n){return n===void 0&&(n=0),new Promise(async(o,s)=>{let a=S({url:t,params:e}),i=this.cacheProvider();if(this.cache.clear==="auto"&&e.version==="draft"&&await this.flushCache(),e.version==="published"&&t!="/cdn/spaces/me"){const c=await i.get(a);if(c)return o(c)}try{let c=await this.throttle("get",t,{params:e,paramsSerializer:f=>S(f)}),u={data:c.data,headers:c.headers};if(u.data.assets&&u.data.assets.length&&this.resolveAssetsRelations(u.data),c.headers["per-page"]&&(u=Object.assign({},u,{perPage:parseInt(c.headers["per-page"]),total:parseInt(c.headers.total)})),c.status!=200)return s(c);(u.data.story||u.data.stories)&&await this.resolveStories(u.data,e),e.version==="published"&&t!="/cdn/spaces/me"&&i.set(a,u),u.data.cv&&(e.version=="draft"&&g[e.token]!=u.data.cv&&this.flushCache(),g[e.token]=u.data.cv),o(u)}catch(c){if(c.response&&c.response.status===429&&(n+=1)<this.maxRetries)return console.log(`Hit rate limit. Retrying in ${n} seconds.`),await(l=1e3*n,new Promise(u=>setTimeout(u,l))),this.cacheResponse(t,e,n).then(o).catch(s);s(c)}var l})}throttledRequest(t,e,n){return this.client[t](e,n)}cacheVersions(){return g}cacheVersion(){return g[this.accessToken]}setCacheVersion(t){this.accessToken&&(g[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}}const Tt=(r={})=>{const{apiOptions:t}=r;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 wt(t)}};var $t=r=>{if(typeof r!="object"||typeof r._editable=="undefined")return{};const t=JSON.parse(r._editable.replace(/^<!--#storyblok#/,"").replace(/-->$/,""));return{"data-blok-c":JSON.stringify(t),"data-blok-uid":t.id+"-"+t.uid}};let v;const Rt="https://app.storyblok.com/f/storyblok-v2-latest.js",Et=(r,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(!r){console.warn("Story ID is not defined. Please provide a valid ID.");return}window.storyblokRegisterEvent(()=>{new window.StoryblokBridge(e).on(["input","published","change"],o=>{o.story.id===r&&(o.action==="input"?t(o.story):window.location.reload())})})}},St=(r={})=>{const{bridge:t,accessToken:e,use:n=[],apiOptions:o={},richText:s={}}=r;o.accessToken=o.accessToken||e;const a={bridge:t,apiOptions:o};let i={};return n.forEach(l=>{i=d(d({},i),l(a))}),t!==!1&&pt(Rt),v=new U(s.schema),s.resolver&&J(v,s.resolver),i},J=(r,t)=>{r.addNode("blok",e=>{let n="";return e.attrs.body.forEach(o=>{n+=t(o.component,o)}),{html:n}})},xt=(r,t)=>{if(!v){console.error("Please initialize the Storyblok SDK before calling the renderRichText function");return}if(r==="")return"";if(!r)return console.warn(`${r} is not a valid Richtext object. This might be because the value of the richtext field is empty.
6
+
7
+ For more info about the richtext object check https://github.com/storyblok/storyblok-js#rendering-rich-text`),"";let e=v;return t&&(e=new U(t.schema),t.resolver&&J(e,t.resolver)),e.render(r)};function Y(){}function x(r,t){for(const e in t)r[e]=t[e];return r}function F(r){return r()}function K(){return Object.create(null)}function y(r){r.forEach(F)}function Ot(r){return typeof r=="function"}function jt(r,t){return r!=r?t==t:r!==t||r&&typeof r=="object"||typeof r=="function"}function Pt(r){return Object.keys(r).length===0}function At(r){const t={};for(const e in r)e[0]!=="$"&&(t[e]=r[e]);return t}function G(r,t){const e={};t=new Set(t);for(const n in r)!t.has(n)&&n[0]!=="$"&&(e[n]=r[n]);return e}function Ct(r,t,e){r.insertBefore(t,e||null)}function Q(r){r.parentNode.removeChild(r)}function Mt(r){return document.createTextNode(r)}function Nt(){return Mt("")}function It(r){return Array.from(r.childNodes)}let O;function k(r){O=r}const _=[],W=[],w=[],X=[],qt=Promise.resolve();let j=!1;function Lt(){j||(j=!0,qt.then(Z))}function P(r){w.push(r)}const A=new Set;let T=0;function Z(){const r=O;do{for(;T<_.length;){const t=_[T];T++,k(t),Bt(t.$$)}for(k(null),_.length=0,T=0;W.length;)W.pop()();for(let t=0;t<w.length;t+=1){const e=w[t];A.has(e)||(A.add(e),e())}w.length=0}while(_.length);for(;X.length;)X.pop()();j=!1,A.clear(),k(r)}function Bt(r){if(r.fragment!==null){r.update(),y(r.before_update);const t=r.dirty;r.dirty=[-1],r.fragment&&r.fragment.p(r.ctx,t),r.after_update.forEach(P)}}const $=new Set;let p;function zt(){p={r:0,c:[],p}}function Dt(){p.r||y(p.c),p=p.p}function C(r,t){r&&r.i&&($.delete(r),r.i(t))}function tt(r,t,e,n){if(r&&r.o){if($.has(r))return;$.add(r),p.c.push(()=>{$.delete(r),n&&(e&&r.d(1),n())}),r.o(t)}else n&&n()}function Ut(r,t){const e={},n={},o={$$scope:1};let s=r.length;for(;s--;){const a=r[s],i=t[s];if(i){for(const l in a)l in i||(n[l]=1);for(const l in i)o[l]||(e[l]=i[l],o[l]=1);r[s]=i}else for(const l in a)o[l]=1}for(const a in n)a in e||(e[a]=void 0);return e}function Ht(r){return typeof r=="object"&&r!==null?r:{}}function et(r){r&&r.c()}function M(r,t,e,n){const{fragment:o,on_mount:s,on_destroy:a,after_update:i}=r.$$;o&&o.m(t,e),n||P(()=>{const l=s.map(F).filter(Ot);a?a.push(...l):y(l),r.$$.on_mount=[]}),i.forEach(P)}function N(r,t){const e=r.$$;e.fragment!==null&&(y(e.on_destroy),e.fragment&&e.fragment.d(t),e.on_destroy=e.fragment=null,e.ctx=[])}function Vt(r,t){r.$$.dirty[0]===-1&&(_.push(r),Lt(),r.$$.dirty.fill(0)),r.$$.dirty[t/31|0]|=1<<t%31}function Jt(r,t,e,n,o,s,a,i=[-1]){const l=O;k(r);const c=r.$$={fragment:null,ctx:null,props:s,update:Y,not_equal:o,bound:K(),on_mount:[],on_destroy:[],on_disconnect:[],before_update:[],after_update:[],context:new Map(t.context||(l?l.$$.context:[])),callbacks:K(),dirty:i,skip_bound:!1,root:t.target||l.$$.root};a&&a(c.root);let u=!1;if(c.ctx=e?e(r,t.props||{},(f,R,...st)=>{const it=st.length?st[0]:R;return c.ctx&&o(c.ctx[f],c.ctx[f]=it)&&(!c.skip_bound&&c.bound[f]&&c.bound[f](it),u&&Vt(r,f)),R}):[],c.update(),u=!0,y(c.before_update),c.fragment=n?n(c.ctx):!1,t.target){if(t.hydrate){const f=It(t.target);c.fragment&&c.fragment.l(f),f.forEach(Q)}else c.fragment&&c.fragment.c();t.intro&&C(r.$$.fragment),M(r,t.target,t.anchor,t.customElement),Z()}k(l)}class Yt{$destroy(){N(this,1),this.$destroy=Y}$on(t,e){const n=this.$$.callbacks[t]||(this.$$.callbacks[t]=[]);return n.push(e),()=>{const o=n.indexOf(e);o!==-1&&n.splice(o,1)}}$set(t){this.$$set&&!Pt(t)&&(this.$$.skip_bound=!0,this.$$set(t),this.$$.skip_bound=!1)}}function Ft(r){let t,e,n;const o=[{blok:r[0]},r[2]];var s=r[1];function a(i){let l={};for(let c=0;c<o.length;c+=1)l=x(l,o[c]);return{props:l}}return s&&(t=new s(a())),{c(){t&&et(t.$$.fragment),e=Nt()},m(i,l){t&&M(t,i,l),Ct(i,e,l),n=!0},p(i,[l]){const c=l&5?Ut(o,[l&1&&{blok:i[0]},l&4&&Ht(i[2])]):{};if(s!==(s=i[1])){if(t){zt();const u=t;tt(u.$$.fragment,1,0,()=>{N(u,1)}),Dt()}s?(t=new s(a()),et(t.$$.fragment),C(t.$$.fragment,1),M(t,e.parentNode,e)):t=null}else s&&t.$set(c)},i(i){n||(t&&C(t.$$.fragment,i),n=!0)},o(i){t&&tt(t.$$.fragment,i),n=!1},d(i){i&&Q(e),t&&N(t,i)}}}function Kt(r,t,e){const n=["blok"];let o=G(t,n),s,{blok:a}=t;return a?s=ot(a.component):console.error("Please provide a 'blok' property to the StoryblokComponent"),r.$$set=i=>{t=x(x({},t),At(i)),e(2,o=G(t,n)),"blok"in i&&e(0,a=i.blok)},[a,s,o]}class Gt extends Yt{constructor(t){super(),Jt(this,t,Kt,Ft,jt,{blok:0})}}const Qt=(r,t)=>{const e=n=>{const o=$t(n);o["data-blok-c"]&&(r.setAttribute("data-blok-c",o["data-blok-c"]),r.setAttribute("data-blok-uid",o["data-blok-uid"]),r.classList.add("storyblok__outline"))};return e(t),{update(n){e(n)}}};let I=null;const rt=()=>(I||console.log("You can't use getStoryblokApi if you're not loading apiPlugin."),I);let nt=null;const Wt=r=>{const{storyblokApi:t}=St(r);I=t,nt=r.components||{}},ot=r=>{const t=nt[r];return t||console.error(`You didn't load the ${r} component. Please load it in storyblokInit. For example:
6
8
  storyblokInit({
7
9
  accessToken: "<your-token>",
8
10
  components: {
9
11
  "teaser": Teaser
10
12
  }
11
13
  })
12
- `),t};f.StoryblokComponent=zt,f.apiPlugin=mt,f.getComponent=tt,f.getStoryblokApi=X,f.storyblokEditable=Ut,f.storyblokInit=Vt,f.useStoryblokApi=X,f.useStoryblokBridge=kt,Object.defineProperties(f,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
14
+ `),t};h.RichTextSchema=D,h.StoryblokComponent=Gt,h.apiPlugin=Tt,h.getComponent=ot,h.getStoryblokApi=rt,h.renderRichText=xt,h.storyblokEditable=Qt,h.storyblokInit=Wt,h.useStoryblokApi=rt,h.useStoryblokBridge=Et,Object.defineProperties(h,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
@@ -49,6 +49,272 @@ const loadBridge = (src) => {
49
49
  document.getElementsByTagName("head")[0].appendChild(script);
50
50
  });
51
51
  };
52
+ const pick = function(attrs, allowed) {
53
+ if (!attrs) {
54
+ return null;
55
+ }
56
+ let h2 = {};
57
+ for (let key in attrs) {
58
+ let value = attrs[key];
59
+ if (allowed.indexOf(key) > -1 && value !== null) {
60
+ h2[key] = value;
61
+ }
62
+ }
63
+ return h2;
64
+ };
65
+ const isEmailLinkType = (type) => type === "email";
66
+ var defaultHtmlSerializer = {
67
+ nodes: {
68
+ horizontal_rule() {
69
+ return {
70
+ singleTag: "hr"
71
+ };
72
+ },
73
+ blockquote() {
74
+ return {
75
+ tag: "blockquote"
76
+ };
77
+ },
78
+ bullet_list() {
79
+ return {
80
+ tag: "ul"
81
+ };
82
+ },
83
+ code_block(node) {
84
+ return {
85
+ tag: [
86
+ "pre",
87
+ {
88
+ tag: "code",
89
+ attrs: node.attrs
90
+ }
91
+ ]
92
+ };
93
+ },
94
+ hard_break() {
95
+ return {
96
+ singleTag: "br"
97
+ };
98
+ },
99
+ heading(node) {
100
+ return {
101
+ tag: `h${node.attrs.level}`
102
+ };
103
+ },
104
+ image(node) {
105
+ return {
106
+ singleTag: [
107
+ {
108
+ tag: "img",
109
+ attrs: pick(node.attrs, ["src", "alt", "title"])
110
+ }
111
+ ]
112
+ };
113
+ },
114
+ list_item() {
115
+ return {
116
+ tag: "li"
117
+ };
118
+ },
119
+ ordered_list() {
120
+ return {
121
+ tag: "ol"
122
+ };
123
+ },
124
+ paragraph() {
125
+ return {
126
+ tag: "p"
127
+ };
128
+ }
129
+ },
130
+ marks: {
131
+ bold() {
132
+ return {
133
+ tag: "b"
134
+ };
135
+ },
136
+ strike() {
137
+ return {
138
+ tag: "strike"
139
+ };
140
+ },
141
+ underline() {
142
+ return {
143
+ tag: "u"
144
+ };
145
+ },
146
+ strong() {
147
+ return {
148
+ tag: "strong"
149
+ };
150
+ },
151
+ code() {
152
+ return {
153
+ tag: "code"
154
+ };
155
+ },
156
+ italic() {
157
+ return {
158
+ tag: "i"
159
+ };
160
+ },
161
+ link(node) {
162
+ const attrs = __spreadValues({}, node.attrs);
163
+ const { linktype = "url" } = node.attrs;
164
+ if (isEmailLinkType(linktype)) {
165
+ attrs.href = `mailto:${attrs.href}`;
166
+ }
167
+ if (attrs.anchor) {
168
+ attrs.href = `${attrs.href}#${attrs.anchor}`;
169
+ delete attrs.anchor;
170
+ }
171
+ return {
172
+ tag: [
173
+ {
174
+ tag: "a",
175
+ attrs
176
+ }
177
+ ]
178
+ };
179
+ },
180
+ styled(node) {
181
+ return {
182
+ tag: [
183
+ {
184
+ tag: "span",
185
+ attrs: node.attrs
186
+ }
187
+ ]
188
+ };
189
+ }
190
+ }
191
+ };
192
+ const escapeHTML = function(string) {
193
+ const htmlEscapes = {
194
+ "&": "&amp;",
195
+ "<": "&lt;",
196
+ ">": "&gt;",
197
+ '"': "&quot;",
198
+ "'": "&#39;"
199
+ };
200
+ const reUnescapedHtml = /[&<>"']/g;
201
+ const reHasUnescapedHtml = RegExp(reUnescapedHtml.source);
202
+ return string && reHasUnescapedHtml.test(string) ? string.replace(reUnescapedHtml, (chr) => htmlEscapes[chr]) : string;
203
+ };
204
+ class RichTextResolver {
205
+ constructor(schema) {
206
+ if (!schema) {
207
+ schema = defaultHtmlSerializer;
208
+ }
209
+ this.marks = schema.marks || [];
210
+ this.nodes = schema.nodes || [];
211
+ }
212
+ addNode(key, schema) {
213
+ this.nodes[key] = schema;
214
+ }
215
+ addMark(key, schema) {
216
+ this.marks[key] = schema;
217
+ }
218
+ render(data = {}) {
219
+ if (data.content && Array.isArray(data.content)) {
220
+ let html = "";
221
+ data.content.forEach((node) => {
222
+ html += this.renderNode(node);
223
+ });
224
+ return html;
225
+ }
226
+ console.warn("The render method must receive an object with a content field, which is an array");
227
+ return "";
228
+ }
229
+ renderNode(item) {
230
+ let html = [];
231
+ if (item.marks) {
232
+ item.marks.forEach((m) => {
233
+ const mark = this.getMatchingMark(m);
234
+ if (mark) {
235
+ html.push(this.renderOpeningTag(mark.tag));
236
+ }
237
+ });
238
+ }
239
+ const node = this.getMatchingNode(item);
240
+ if (node && node.tag) {
241
+ html.push(this.renderOpeningTag(node.tag));
242
+ }
243
+ if (item.content) {
244
+ item.content.forEach((content) => {
245
+ html.push(this.renderNode(content));
246
+ });
247
+ } else if (item.text) {
248
+ html.push(escapeHTML(item.text));
249
+ } else if (node && node.singleTag) {
250
+ html.push(this.renderTag(node.singleTag, " /"));
251
+ } else if (node && node.html) {
252
+ html.push(node.html);
253
+ }
254
+ if (node && node.tag) {
255
+ html.push(this.renderClosingTag(node.tag));
256
+ }
257
+ if (item.marks) {
258
+ item.marks.slice(0).reverse().forEach((m) => {
259
+ const mark = this.getMatchingMark(m);
260
+ if (mark) {
261
+ html.push(this.renderClosingTag(mark.tag));
262
+ }
263
+ });
264
+ }
265
+ return html.join("");
266
+ }
267
+ renderTag(tags, ending) {
268
+ if (tags.constructor === String) {
269
+ return `<${tags}${ending}>`;
270
+ }
271
+ const all = tags.map((tag) => {
272
+ if (tag.constructor === String) {
273
+ return `<${tag}${ending}>`;
274
+ } else {
275
+ let h2 = `<${tag.tag}`;
276
+ if (tag.attrs) {
277
+ for (let key in tag.attrs) {
278
+ let value = tag.attrs[key];
279
+ if (value !== null) {
280
+ h2 += ` ${key}="${value}"`;
281
+ }
282
+ }
283
+ }
284
+ return `${h2}${ending}>`;
285
+ }
286
+ });
287
+ return all.join("");
288
+ }
289
+ renderOpeningTag(tags) {
290
+ return this.renderTag(tags, "");
291
+ }
292
+ renderClosingTag(tags) {
293
+ if (tags.constructor === String) {
294
+ return `</${tags}>`;
295
+ }
296
+ const all = tags.slice(0).reverse().map((tag) => {
297
+ if (tag.constructor === String) {
298
+ return `</${tag}>`;
299
+ } else {
300
+ return `</${tag.tag}>`;
301
+ }
302
+ });
303
+ return all.join("");
304
+ }
305
+ getMatchingNode(item) {
306
+ if (typeof this.nodes[item.type] !== "function") {
307
+ return;
308
+ }
309
+ return this.nodes[item.type](item);
310
+ }
311
+ getMatchingMark(item) {
312
+ if (typeof this.marks[item.type] !== "function") {
313
+ return;
314
+ }
315
+ return this.marks[item.type](item);
316
+ }
317
+ }
52
318
  /*!
53
319
  * storyblok-js-client v4.5.2
54
320
  * Universal JavaScript SDK for Storyblok's API
@@ -282,7 +548,7 @@ class h {
282
548
  if (e3._stopResolving)
283
549
  return;
284
550
  for (let r2 in e3)
285
- 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]);
551
+ e3.component && e3._uid || e3.type === "link" ? (this._insertRelations(e3, r2, t2), this._insertLinks(e3, r2)) : "id" in e3 && e3.fieldtype === "asset" && this._insertAssetsRelations(e3, t2), s2(e3[r2]);
286
552
  }
287
553
  }
288
554
  };
@@ -332,7 +598,7 @@ class h {
332
598
  }
333
599
  async resolveStories(e2, t2) {
334
600
  let s2 = [];
335
- 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)
601
+ if (t2.resolve_relations !== void 0 && t2.resolve_relations.length > 0 && (e2.rels || e2.rel_uuids) && (s2 = t2.resolve_relations.split(","), await this.resolveRelations(e2, t2)), ["1", "story", "url"].indexOf(t2.resolve_links) > -1 && (e2.links || e2.link_uuids) && await this.resolveLinks(e2, t2), this.resolveNestedRelations)
336
602
  for (const e3 in this.relations)
337
603
  this.iterateTree(this.relations[e3], s2);
338
604
  e2.story ? this.iterateTree(e2.story, s2) : e2.stories.forEach((e3) => {
@@ -344,8 +610,11 @@ class h {
344
610
  if (s2)
345
611
  for (const e3 of s2)
346
612
  this.iterateTree(e3, t2);
347
- else
613
+ else {
614
+ if (!r2)
615
+ return e2;
348
616
  this.iterateTree(r2, t2);
617
+ }
349
618
  }
350
619
  cacheResponse(e2, t2, s2) {
351
620
  return s2 === void 0 && (s2 = 0), new Promise(async (r2, i2) => {
@@ -414,6 +683,7 @@ var editable = (blok) => {
414
683
  "data-blok-uid": options.id + "-" + options.uid
415
684
  };
416
685
  };
686
+ let richTextResolver;
417
687
  const bridgeLatest = "https://app.storyblok.com/f/storyblok-v2-latest.js";
418
688
  const useStoryblokBridge = (id, cb, options = {}) => {
419
689
  if (typeof window === "undefined") {
@@ -430,16 +700,23 @@ const useStoryblokBridge = (id, cb, options = {}) => {
430
700
  window.storyblokRegisterEvent(() => {
431
701
  const sbBridge = new window.StoryblokBridge(options);
432
702
  sbBridge.on(["input", "published", "change"], (event) => {
433
- if (event.action == "input" && event.story.id === id) {
434
- cb(event.story);
435
- } else {
436
- window.location.reload();
703
+ if (event.story.id === id) {
704
+ if (event.action === "input")
705
+ cb(event.story);
706
+ else
707
+ window.location.reload();
437
708
  }
438
709
  });
439
710
  });
440
711
  };
441
712
  const storyblokInit$1 = (pluginOptions = {}) => {
442
- const { bridge, accessToken, use = [], apiOptions = {} } = pluginOptions;
713
+ const {
714
+ bridge,
715
+ accessToken,
716
+ use = [],
717
+ apiOptions = {},
718
+ richText = {}
719
+ } = pluginOptions;
443
720
  apiOptions.accessToken = apiOptions.accessToken || accessToken;
444
721
  const options = { bridge, apiOptions };
445
722
  let result = {};
@@ -449,8 +726,45 @@ const storyblokInit$1 = (pluginOptions = {}) => {
449
726
  if (bridge !== false) {
450
727
  loadBridge(bridgeLatest);
451
728
  }
729
+ richTextResolver = new RichTextResolver(richText.schema);
730
+ if (richText.resolver) {
731
+ setComponentResolver(richTextResolver, richText.resolver);
732
+ }
452
733
  return result;
453
734
  };
735
+ const setComponentResolver = (resolver, resolveFn) => {
736
+ resolver.addNode("blok", (node) => {
737
+ let html = "";
738
+ node.attrs.body.forEach((blok) => {
739
+ html += resolveFn(blok.component, blok);
740
+ });
741
+ return {
742
+ html
743
+ };
744
+ });
745
+ };
746
+ const renderRichText = (data, options) => {
747
+ if (!richTextResolver) {
748
+ console.error("Please initialize the Storyblok SDK before calling the renderRichText function");
749
+ return;
750
+ }
751
+ if (data === "") {
752
+ return "";
753
+ } else if (!data) {
754
+ console.warn(`${data} is not a valid Richtext object. This might be because the value of the richtext field is empty.
755
+
756
+ For more info about the richtext object check https://github.com/storyblok/storyblok-js#rendering-rich-text`);
757
+ return "";
758
+ }
759
+ let localResolver = richTextResolver;
760
+ if (options) {
761
+ localResolver = new RichTextResolver(options.schema);
762
+ if (options.resolver) {
763
+ setComponentResolver(localResolver, options.resolver);
764
+ }
765
+ }
766
+ return localResolver.render(data);
767
+ };
454
768
  function noop() {
455
769
  }
456
770
  function assign(tar, src) {
@@ -602,6 +916,8 @@ function transition_out(block, local, detach2, callback) {
602
916
  }
603
917
  });
604
918
  block.o(local);
919
+ } else if (callback) {
920
+ callback();
605
921
  }
606
922
  }
607
923
  function get_spread_update(levels, updates) {
@@ -867,7 +1183,9 @@ const storyblokEditable = (node, value) => {
867
1183
  let storyblokApiInstance = null;
868
1184
  const useStoryblokApi = () => {
869
1185
  if (!storyblokApiInstance) {
870
- console.log(`You can't use getStoryblokApi if you're not loading apiPlugin.`);
1186
+ console.log(
1187
+ `You can't use getStoryblokApi if you're not loading apiPlugin.`
1188
+ );
871
1189
  }
872
1190
  return storyblokApiInstance;
873
1191
  };
@@ -891,4 +1209,4 @@ storyblokInit({
891
1209
  }
892
1210
  return component;
893
1211
  };
894
- export { StoryblokComponent, apiFactory as apiPlugin, getComponent, useStoryblokApi as getStoryblokApi, storyblokEditable, storyblokInit, useStoryblokApi, useStoryblokBridge };
1212
+ export { defaultHtmlSerializer as RichTextSchema, StoryblokComponent, apiFactory as apiPlugin, getComponent, useStoryblokApi as getStoryblokApi, renderRichText, storyblokEditable, storyblokInit, useStoryblokApi, useStoryblokBridge };
package/index.ts CHANGED
@@ -2,7 +2,12 @@ import {
2
2
  storyblokEditable as sbEdit,
3
3
  storyblokInit as sbInit,
4
4
  } from "@storyblok/js";
5
- export { useStoryblokBridge, apiPlugin } from "@storyblok/js";
5
+ export {
6
+ useStoryblokBridge,
7
+ apiPlugin,
8
+ renderRichText,
9
+ RichTextSchema,
10
+ } from "@storyblok/js";
6
11
 
7
12
  import type {
8
13
  SbSvelteSDKOptions,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@storyblok/svelte",
3
- "version": "2.1.5",
3
+ "version": "2.3.0",
4
4
  "description": "Storyblok SDK to connect Storyblok with Svelte",
5
5
  "main": "./dist/storyblok-svelte.js",
6
6
  "module": "./dist/storyblok-svelte.mjs",
@@ -28,20 +28,20 @@
28
28
  "prepublishOnly": "npm run build && cp ../README.md ./"
29
29
  },
30
30
  "dependencies": {
31
- "@storyblok/js": "^1.6.1"
31
+ "@storyblok/js": "^1.8.0"
32
32
  },
33
33
  "devDependencies": {
34
- "@babel/core": "^7.18.6",
34
+ "@babel/core": "^7.18.13",
35
35
  "@cypress/vite-dev-server": "^2.2.3",
36
36
  "@tsconfig/svelte": "^3.0.0",
37
- "babel-jest": "^27.5.1",
37
+ "babel-jest": "^28.1.3",
38
38
  "cypress": "^9.6.0",
39
39
  "cypress-svelte-unit-test": "^3.3.4",
40
40
  "eslint-plugin-cypress": "^2.12.1",
41
- "eslint-plugin-jest": "^26.1.5",
42
- "jest": "^27.5.1",
41
+ "eslint-plugin-jest": "^26.8.7",
42
+ "jest": "^29.0.2",
43
43
  "svelte-preprocess": "^4.10.7",
44
- "typescript": "^4.7.3",
44
+ "typescript": "^4.7.4",
45
45
  "vite": "^2.9.13"
46
46
  },
47
47
  "eslintConfig": {