@storyblok/astro 2.3.4 → 2.4.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
@@ -256,9 +256,10 @@ If you want to deploy a dedicated preview environment with the Bridge enabled, a
256
256
 
257
257
  ### Rendering Rich Text
258
258
 
259
- You can easily render rich text by using the `renderRichText` function that comes with `@storyblok/astro`. Then you can use the [`set:html` directive](https://docs.astro.build/en/reference/directives-reference/#sethtml):
259
+ You can easily render rich text by using either the `renderRichText` function or the `<RichTextRenderer />` component, both of which are included in `@storyblok/astro`.
260
+ Use `renderRichText`, which only supports parsing and returning native HTML tags, if you are not embedding `bloks` in your rich text. Then you can use the [`set:html` directive](https://docs.astro.build/en/reference/directives-reference/#sethtml):
260
261
 
261
- ```html
262
+ ```jsx
262
263
  ---
263
264
  import { renderRichText } from '@storyblok/astro';
264
265
 
@@ -270,6 +271,18 @@ const renderedRichText = renderRichText(blok.text)
270
271
  <div set:html="{renderedRichText}"></div>
271
272
  ```
272
273
 
274
+ Use the `<RichTextRenderer />` component if you are embedding `bloks` in your rich text:
275
+
276
+ ```jsx
277
+ ---
278
+ import { renderRichText, RichTextRenderer } from '@storyblok/astro';
279
+
280
+ const { blok } = Astro.props
281
+ ---
282
+
283
+ <RichTextRenderer richTextData="{blok.richtext}" />
284
+ ```
285
+
273
286
  You can also set a **custom Schema and component resolver** by passing the options as the second parameter of the `renderRichText` function:
274
287
 
275
288
  ```js
@@ -296,6 +309,37 @@ const renderedRichText = renderRichText(blok.text, {
296
309
  });
297
310
  ```
298
311
 
312
+ The same can be done with the `<RichTextRenderer />` component by passing along the options via the `richTextOptions` prop:
313
+
314
+ ```js
315
+ ---
316
+ import { RichTextSchema, renderRichText, RichTextRenderer } from "@storyblok/astro";
317
+ import cloneDeep from "clone-deep";
318
+
319
+ const mySchema = cloneDeep(RichTextSchema); // you can make a copy of the default RichTextSchema
320
+ // ... and edit the nodes and marks, or add your own.
321
+ // Check the base RichTextSchema source here https://github.com/storyblok/storyblok-js-client/blob/v4/source/schema.js
322
+
323
+ const { blok } = Astro.props;
324
+
325
+ const options = {
326
+ schema: mySchema,
327
+ resolver: (component, blok) => {
328
+ switch (component) {
329
+ case "my-custom-component":
330
+ return `<div class="my-component-class">${blok.text}</div>`;
331
+ break;
332
+ default:
333
+ return `Component ${component} not found`;
334
+ }
335
+ },
336
+ };
337
+ ---
338
+
339
+ <RichTextRenderer richTextData="{blok.richtext}" richTextOptions="{options}" />
340
+
341
+ ```
342
+
299
343
  ## API
300
344
 
301
345
  ### useStoryblokApi()
@@ -0,0 +1,32 @@
1
+ ---
2
+ import { renderRichText } from ".";
3
+ import type { ISbRichtext, SbBlokData, SbRichTextOptions } from "./dist/types";
4
+
5
+ import StoryblokComponent from "./StoryblokComponent.astro";
6
+
7
+ export interface Props {
8
+ richTextData?: ISbRichtext;
9
+ richTextOptions?: SbRichTextOptions;
10
+ }
11
+
12
+ const { richTextData, richTextOptions } = Astro.props;
13
+ ---
14
+
15
+ {
16
+ richTextData?.content?.map((richTextNode: ISbRichtext) => {
17
+ if (richTextNode.type === "blok") {
18
+ return richTextNode.attrs.body.map((blok: SbBlokData) => (
19
+ <StoryblokComponent blok={blok} />
20
+ ));
21
+ } else {
22
+ return (
23
+ <Fragment
24
+ set:html={renderRichText(
25
+ { type: richTextNode.type, content: [richTextNode] },
26
+ richTextOptions
27
+ )}
28
+ />
29
+ );
30
+ }
31
+ })
32
+ }
@@ -1,4 +1,4 @@
1
- (function(g,p){typeof exports=="object"&&typeof module<"u"?p(exports):typeof define=="function"&&define.amd?define(["exports"],p):(g=typeof globalThis<"u"?globalThis:g||self,p(g.storyblokAstro={}))})(this,function(g){"use strict";function p(r,e,t){const o="virtual:storyblok-init",a="\0"+o;return{name:"vite-plugin-storyblok-init",async resolveId(s){if(s===o)return a},async load(s){if(s===a)return`
1
+ (function(u,h){typeof exports=="object"&&typeof module<"u"?h(exports):typeof define=="function"&&define.amd?define(["exports"],h):(u=typeof globalThis<"u"?globalThis:u||self,h(u.storyblokAstro={}))})(this,function(u){"use strict";function h(r,e,t){const o="virtual:storyblok-init",n="\0"+o;return{name:"vite-plugin-storyblok-init",async resolveId(s){if(s===o)return n},async load(s){if(s===n)return`
2
2
  import { storyblokInit, apiPlugin } from "@storyblok/js";
3
3
  const { storyblokApi } = storyblokInit({
4
4
  accessToken: "${r}",
@@ -6,7 +6,7 @@
6
6
  apiOptions: ${JSON.stringify(t)},
7
7
  });
8
8
  export const storyblokApiInstance = storyblokApi;
9
- `}}}const j=/[\p{Lu}]/u,R=/[\p{Ll}]/u,k=/^[\p{Lu}](?![\p{Lu}])/gu,$=/([\p{Alpha}\p{N}_]|$)/u,b=/[_.\- ]+/,N=new RegExp("^"+b.source),v=new RegExp(b.source+$.source,"gu"),I=new RegExp("\\d+"+$.source,"gu"),O=(r,e,t,o)=>{let a=!1,s=!1,n=!1,f=!1;for(let i=0;i<r.length;i++){const l=r[i];f=i>2?r[i-3]==="-":!0,a&&j.test(l)?(r=r.slice(0,i)+"-"+r.slice(i),a=!1,n=s,s=!0,i++):s&&n&&R.test(l)&&(!f||o)?(r=r.slice(0,i-1)+"-"+r.slice(i-1),n=s,s=!1,a=!0):(a=e(l)===l&&t(l)!==l,n=s,s=t(l)===l&&e(l)!==l)}return r},L=(r,e)=>(k.lastIndex=0,r.replace(k,t=>e(t))),M=(r,e)=>(v.lastIndex=0,I.lastIndex=0,r.replace(v,(t,o)=>e(o)).replace(I,t=>e(t)));function T(r,e){if(!(typeof r=="string"||Array.isArray(r)))throw new TypeError("Expected the input to be `string | string[]`");if(e={pascalCase:!1,preserveConsecutiveUppercase:!1,...e},Array.isArray(r)?r=r.map(s=>s.trim()).filter(s=>s.length).join("-"):r=r.trim(),r.length===0)return"";const t=e.locale===!1?s=>s.toLowerCase():s=>s.toLocaleLowerCase(e.locale),o=e.locale===!1?s=>s.toUpperCase():s=>s.toLocaleUpperCase(e.locale);return r.length===1?b.test(r)?"":e.pascalCase?o(r):t(r):(r!==t(r)&&(r=O(r,t,o,e.preserveConsecutiveUppercase)),r=r.replace(N,""),r=e.preserveConsecutiveUppercase?L(r,t):t(r),e.pascalCase&&(r=o(r.charAt(0))+r.slice(1)),M(r,o))}function P(r,e,t,o){const a="virtual:storyblok-components",s="\0"+a;return{name:"vite-plugin-storyblok-components",async resolveId(n){if(n===a)return s},async load(n){if(n===s){const f=[],i=[];for await(const[c,d]of Object.entries(e)){const h=await this.resolve("/"+r+"/"+d+".astro");if(h)f.push(`import ${T(c)} from "${h.id}"`);else if(t)i.push(c);else throw new Error(`Component could not be found for blok "${c}"! Does "${"/"+r+"/"+d}.astro" exist?`)}let l="";if(t)if(l=",FallbackComponent",o){const c=await this.resolve("/"+r+"/"+o+".astro");if(!c)throw new Error(`Custom fallback component could not be found. Does "${"/"+r+"/"+o}.astro" exist?`);f.push(`import FallbackComponent from "${c.id}"`)}else f.push("import FallbackComponent from '@storyblok/astro/FallbackComponent.astro';");return`${f.join(";")};export default {${Object.keys(e).filter(c=>!i.includes(c)).map(c=>T(c)).join(",")}${l}}`}}}}function _(r){const e="virtual:storyblok-options",t="\0"+e;return{name:"vite-plugin-storyblok-options",async resolveId(o){if(o===e)return t},async load(o){if(o===t)return`export default ${JSON.stringify(r)}`}}}let w=!1;const E=[],z=r=>new Promise((e,t)=>{if(typeof window>"u"||(window.storyblokRegisterEvent=a=>{if(window.location===window.parent.location){console.warn("You are not in Draft Mode or in the Visual Editor.");return}w?a():E.push(a)},document.getElementById("storyblok-javascript-bridge")))return;const o=document.createElement("script");o.async=!0,o.src=r,o.id="storyblok-javascript-bridge",o.onerror=a=>t(a),o.onload=a=>{E.forEach(s=>s()),w=!0,e(a)},document.getElementsByTagName("head")[0].appendChild(o)});var D=Object.defineProperty,U=(r,e,t)=>e in r?D(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,A=(r,e,t)=>(U(r,typeof e!="symbol"?e+"":e,t),t);const F=function(r,e){const t={};for(const o in r){const a=r[o];e.indexOf(o)>-1&&a!==null&&(t[o]=a)}return t},q=r=>r==="email",B=()=>({singleTag:"hr"}),J=()=>({tag:"blockquote"}),K=()=>({tag:"ul"}),V=r=>({tag:["pre",{tag:"code",attrs:r.attrs}]}),G=()=>({singleTag:"br"}),W=r=>({tag:`h${r.attrs.level}`}),H=r=>({singleTag:[{tag:"img",attrs:F(r.attrs,["src","alt","title"])}]}),Y=()=>({tag:"li"}),Q=()=>({tag:"ol"}),X=()=>({tag:"p"}),Z=r=>({tag:[{tag:"span",attrs:{["data-type"]:"emoji",["data-name"]:r.attrs.name,emoji:r.attrs.emoji}}]}),ee=()=>({tag:"b"}),te=()=>({tag:"strike"}),re=()=>({tag:"u"}),oe=()=>({tag:"strong"}),se=()=>({tag:"code"}),ae=()=>({tag:"i"}),ne=r=>{const e={...r.attrs},{linktype:t="url"}=r.attrs;if(q(t)&&(e.href=`mailto:${e.href}`),e.anchor&&(e.href=`${e.href}#${e.anchor}`,delete e.anchor),e.custom){for(const o in e.custom)e[o]=e.custom[o];delete e.custom}return{tag:[{tag:"a",attrs:e}]}},ie=r=>({tag:[{tag:"span",attrs:r.attrs}]}),le=()=>({tag:"sub"}),ce=()=>({tag:"sup"}),ge=r=>({tag:[{tag:"span",attrs:r.attrs}]}),ue=r=>{var e;return(e=r.attrs)!=null&&e.color?{tag:[{tag:"span",attrs:{style:`background-color:${r.attrs.color};`}}]}:{tag:""}},fe=r=>{var e;return(e=r.attrs)!=null&&e.color?{tag:[{tag:"span",attrs:{style:`color:${r.attrs.color}`}}]}:{tag:""}},C={nodes:{horizontal_rule:B,blockquote:J,bullet_list:K,code_block:V,hard_break:G,heading:W,image:H,list_item:Y,ordered_list:Q,paragraph:X,emoji:Z},marks:{bold:ee,strike:te,underline:re,strong:oe,code:se,italic:ae,link:ne,styled:ie,subscript:le,superscript:ce,anchor:ge,highlight:ue,textStyle:fe}},de=function(r){const e={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"},t=/[&<>"']/g,o=RegExp(t.source);return r&&o.test(r)?r.replace(t,a=>e[a]):r};class x{constructor(e){A(this,"marks"),A(this,"nodes"),e||(e=C),this.marks=e.marks||[],this.nodes=e.nodes||[]}addNode(e,t){this.nodes[e]=t}addMark(e,t){this.marks[e]=t}render(e,t={optimizeImages:!1}){if(e&&e.content&&Array.isArray(e.content)){let o="";return e.content.forEach(a=>{o+=this.renderNode(a)}),t.optimizeImages?this.optimizeImages(o,t.optimizeImages):o}return console.warn(`The render method must receive an Object with a "content" field.
9
+ `}}}const x=/[\p{Lu}]/u,R=/[\p{Ll}]/u,k=/^[\p{Lu}](?![\p{Lu}])/gu,v=/([\p{Alpha}\p{N}_]|$)/u,b=/[_.\- ]+/,N=new RegExp("^"+b.source),$=new RegExp(b.source+v.source,"gu"),I=new RegExp("\\d+"+v.source,"gu"),O=(r,e,t,o)=>{let n=!1,s=!1,a=!1,f=!1;for(let l=0;l<r.length;l++){const i=r[l];f=l>2?r[l-3]==="-":!0,n&&x.test(i)?(r=r.slice(0,l)+"-"+r.slice(l),n=!1,a=s,s=!0,l++):s&&a&&R.test(i)&&(!f||o)?(r=r.slice(0,l-1)+"-"+r.slice(l-1),a=s,s=!1,n=!0):(n=e(i)===i&&t(i)!==i,a=s,s=t(i)===i&&e(i)!==i)}return r},L=(r,e)=>(k.lastIndex=0,r.replace(k,t=>e(t))),M=(r,e)=>($.lastIndex=0,I.lastIndex=0,r.replace($,(t,o)=>e(o)).replace(I,t=>e(t)));function T(r,e){if(!(typeof r=="string"||Array.isArray(r)))throw new TypeError("Expected the input to be `string | string[]`");if(e={pascalCase:!1,preserveConsecutiveUppercase:!1,...e},Array.isArray(r)?r=r.map(s=>s.trim()).filter(s=>s.length).join("-"):r=r.trim(),r.length===0)return"";const t=e.locale===!1?s=>s.toLowerCase():s=>s.toLocaleLowerCase(e.locale),o=e.locale===!1?s=>s.toUpperCase():s=>s.toLocaleUpperCase(e.locale);return r.length===1?b.test(r)?"":e.pascalCase?o(r):t(r):(r!==t(r)&&(r=O(r,t,o,e.preserveConsecutiveUppercase)),r=r.replace(N,""),r=e.preserveConsecutiveUppercase?L(r,t):t(r),e.pascalCase&&(r=o(r.charAt(0))+r.slice(1)),M(r,o))}function P(r,e,t,o){const n="virtual:storyblok-components",s="\0"+n;return{name:"vite-plugin-storyblok-components",async resolveId(a){if(a===n)return s},async load(a){if(a===s){const f=[],l=[];for await(const[c,d]of Object.entries(e)){const p=await this.resolve("/"+r+"/"+d+".astro");if(p)f.push(`import ${T(c)} from "${p.id}"`);else if(t)l.push(c);else throw new Error(`Component could not be found for blok "${c}"! Does "${"/"+r+"/"+d}.astro" exist?`)}let i="";if(t)if(i=",FallbackComponent",o){const c=await this.resolve("/"+r+"/"+o+".astro");if(!c)throw new Error(`Custom fallback component could not be found. Does "${"/"+r+"/"+o}.astro" exist?`);f.push(`import FallbackComponent from "${c.id}"`)}else f.push("import FallbackComponent from '@storyblok/astro/FallbackComponent.astro';");return`${f.join(";")};export default {${Object.keys(e).filter(c=>!l.includes(c)).map(c=>T(c)).join(",")}${i}}`}}}}function _(r){const e="virtual:storyblok-options",t="\0"+e;return{name:"vite-plugin-storyblok-options",async resolveId(o){if(o===e)return t},async load(o){if(o===t)return`export default ${JSON.stringify(r)}`}}}let w=!1;const E=[],z=r=>new Promise((e,t)=>{if(typeof window>"u"||(window.storyblokRegisterEvent=n=>{if(window.location===window.parent.location){console.warn("You are not in Draft Mode or in the Visual Editor.");return}w?n():E.push(n)},document.getElementById("storyblok-javascript-bridge")))return;const o=document.createElement("script");o.async=!0,o.src=r,o.id="storyblok-javascript-bridge",o.onerror=n=>t(n),o.onload=n=>{E.forEach(s=>s()),w=!0,e(n)},document.getElementsByTagName("head")[0].appendChild(o)});var D=Object.defineProperty,U=(r,e,t)=>e in r?D(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,A=(r,e,t)=>(U(r,typeof e!="symbol"?e+"":e,t),t);const q=function(r,e){const t={};for(const o in r){const n=r[o];e.indexOf(o)>-1&&n!==null&&(t[o]=n)}return t},B=r=>r==="email",F=()=>({singleTag:"hr"}),J=()=>({tag:"blockquote"}),K=()=>({tag:"ul"}),V=r=>({tag:["pre",{tag:"code",attrs:r.attrs}]}),G=()=>({singleTag:"br"}),W=r=>({tag:`h${r.attrs.level}`}),H=r=>({singleTag:[{tag:"img",attrs:q(r.attrs,["src","alt","title"])}]}),Y=()=>({tag:"li"}),Q=()=>({tag:"ol"}),X=()=>({tag:"p"}),Z=r=>({tag:[{tag:"span",attrs:{["data-type"]:"emoji",["data-name"]:r.attrs.name,emoji:r.attrs.emoji}}]}),ee=()=>({tag:"b"}),te=()=>({tag:"strike"}),re=()=>({tag:"u"}),oe=()=>({tag:"strong"}),se=()=>({tag:"code"}),ne=()=>({tag:"i"}),ae=r=>{const e={...r.attrs},{linktype:t="url"}=r.attrs;if(B(t)&&(e.href=`mailto:${e.href}`),e.anchor&&(e.href=`${e.href}#${e.anchor}`,delete e.anchor),e.custom){for(const o in e.custom)e[o]=e.custom[o];delete e.custom}return{tag:[{tag:"a",attrs:e}]}},le=r=>({tag:[{tag:"span",attrs:r.attrs}]}),ie=()=>({tag:"sub"}),ce=()=>({tag:"sup"}),ue=r=>({tag:[{tag:"span",attrs:r.attrs}]}),ge=r=>{var e;return(e=r.attrs)!=null&&e.color?{tag:[{tag:"span",attrs:{style:`background-color:${r.attrs.color};`}}]}:{tag:""}},fe=r=>{var e;return(e=r.attrs)!=null&&e.color?{tag:[{tag:"span",attrs:{style:`color:${r.attrs.color}`}}]}:{tag:""}},C={nodes:{horizontal_rule:F,blockquote:J,bullet_list:K,code_block:V,hard_break:G,heading:W,image:H,list_item:Y,ordered_list:Q,paragraph:X,emoji:Z},marks:{bold:ee,strike:te,underline:re,strong:oe,code:se,italic:ne,link:ae,styled:le,subscript:ie,superscript:ce,anchor:ue,highlight:ge,textStyle:fe}},de=function(r){const e={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"},t=/[&<>"']/g,o=RegExp(t.source);return r&&o.test(r)?r.replace(t,n=>e[n]):r};class S{constructor(e){A(this,"marks"),A(this,"nodes"),e||(e=C),this.marks=e.marks||[],this.nodes=e.nodes||[]}addNode(e,t){this.nodes[e]=t}addMark(e,t){this.marks[e]=t}render(e,t={optimizeImages:!1}){if(e&&e.content&&Array.isArray(e.content)){let o="";return e.content.forEach(n=>{o+=this.renderNode(n)}),t.optimizeImages?this.optimizeImages(o,t.optimizeImages):o}return console.warn(`The render method must receive an Object with a "content" field.
10
10
  The "content" field must be an array of nodes as the type ISbRichtext.
11
11
  ISbRichtext:
12
12
  content?: ISbRichtext[]
@@ -29,9 +29,7 @@
29
29
  }
30
30
  ],
31
31
  type: 'doc'
32
- }`),""}optimizeImages(e,t){let o=0,a=0,s="",n="";typeof t!="boolean"&&(typeof t.width=="number"&&t.width>0&&(s+=`width="${t.width}" `,o=t.width),typeof t.height=="number"&&t.height>0&&(s+=`height="${t.height}" `,a=t.height),(t.loading==="lazy"||t.loading==="eager")&&(s+=`loading="${t.loading}" `),typeof t.class=="string"&&t.class.length>0&&(s+=`class="${t.class}" `),t.filters&&(typeof t.filters.blur=="number"&&t.filters.blur>=0&&t.filters.blur<=100&&(n+=`:blur(${t.filters.blur})`),typeof t.filters.brightness=="number"&&t.filters.brightness>=-100&&t.filters.brightness<=100&&(n+=`:brightness(${t.filters.brightness})`),t.filters.fill&&(t.filters.fill.match(/[0-9A-Fa-f]{6}/g)||t.filters.fill==="transparent")&&(n+=`:fill(${t.filters.fill})`),t.filters.format&&["webp","png","jpeg"].includes(t.filters.format)&&(n+=`:format(${t.filters.format})`),typeof t.filters.grayscale=="boolean"&&t.filters.grayscale&&(n+=":grayscale()"),typeof t.filters.quality=="number"&&t.filters.quality>=0&&t.filters.quality<=100&&(n+=`:quality(${t.filters.quality})`),t.filters.rotate&&[90,180,270].includes(t.filters.rotate)&&(n+=`:rotate(${t.filters.rotate})`),n.length>0&&(n="/filters"+n))),s.length>0&&(e=e.replace(/<img/g,`<img ${s.trim()}`));const f=o>0||a>0||n.length>0?`${o}x${a}${n}`:"";return e=e.replace(/a.storyblok.com\/f\/(\d+)\/([^.]+)\.(gif|jpg|jpeg|png|tif|tiff|bmp)/g,`a.storyblok.com/f/$1/$2.$3/m/${f}`),typeof t!="boolean"&&(t.sizes||t.srcset)&&(e=e.replace(/<img.*?src=["|'](.*?)["|']/g,i=>{var l,c;const d=i.match(/a.storyblok.com\/f\/(\d+)\/([^.]+)\.(gif|jpg|jpeg|png|tif|tiff|bmp)/g);if(d&&d.length>0){const h={srcset:(l=t.srcset)==null?void 0:l.map(u=>{if(typeof u=="number")return`//${d}/m/${u}x0${n} ${u}w`;if(typeof u=="object"&&u.length===2){let y=0,S=0;return typeof u[0]=="number"&&(y=u[0]),typeof u[1]=="number"&&(S=u[1]),`//${d}/m/${y}x${S}${n} ${y}w`}}).join(", "),sizes:(c=t.sizes)==null?void 0:c.map(u=>u).join(", ")};let m="";return h.srcset&&(m+=`srcset="${h.srcset}" `),h.sizes&&(m+=`sizes="${h.sizes}" `),i.replace(/<img/g,`<img ${m.trim()}`)}return i})),e}renderNode(e){const t=[];e.marks&&e.marks.forEach(a=>{const s=this.getMatchingMark(a);s&&s.tag!==""&&t.push(this.renderOpeningTag(s.tag))});const o=this.getMatchingNode(e);return o&&o.tag&&t.push(this.renderOpeningTag(o.tag)),e.content?e.content.forEach(a=>{t.push(this.renderNode(a))}):e.text?t.push(de(e.text)):o&&o.singleTag?t.push(this.renderTag(o.singleTag," /")):o&&o.html?t.push(o.html):e.type==="emoji"&&t.push(this.renderEmoji(e)),o&&o.tag&&t.push(this.renderClosingTag(o.tag)),e.marks&&e.marks.slice(0).reverse().forEach(a=>{const s=this.getMatchingMark(a);s&&s.tag!==""&&t.push(this.renderClosingTag(s.tag))}),t.join("")}renderTag(e,t){return e.constructor===String?`<${e}${t}>`:e.map(o=>{if(o.constructor===String)return`<${o}${t}>`;{let a=`<${o.tag}`;if(o.attrs)for(const s in o.attrs){const n=o.attrs[s];n!==null&&(a+=` ${s}="${n}"`)}return`${a}${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){const t=this.nodes[e.type];if(typeof t=="function")return t(e)}getMatchingMark(e){const t=this.marks[e.type];if(typeof t=="function")return t(e)}renderEmoji(e){if(e.attrs.emoji)return e.attrs.emoji;const t=[{tag:"img",attrs:{src:e.attrs.fallbackImage,draggable:"false",loading:"lazy",align:"absmiddle"}}];return this.renderTag(t," /")}}const he=r=>{if(typeof r!="object"||typeof r._editable>"u")return{};const e=JSON.parse(r._editable.replace(/^<!--#storyblok#/,"").replace(/-->$/,""));return{"data-blok-c":JSON.stringify(e),"data-blok-uid":e.id+"-"+e.uid}};let pe;const be="https://app.storyblok.com/f/storyblok-v2-latest.js",me=(r,e)=>{r.addNode("blok",t=>{let o="";return t.attrs.body.forEach(a=>{o+=e(a.component,a)}),{html:o}})},ye=(r,e,t)=>{let o=t||pe;if(!o){console.error("Please initialize the Storyblok SDK before calling the renderRichText function");return}return r===""?"":r?(e&&(o=new x(e.schema),e.resolver&&me(o,e.resolver)),o.render(r)):(console.warn(`${r} is not a valid Richtext object. This might be because the value of the richtext field is empty.
33
-
34
- For more info about the richtext object check https://github.com/storyblok/storyblok-js#rendering-rich-text`),"")},ke=()=>z(be);function $e(){return globalThis.storyblokApiInstance||console.error("storyblokApiInstance has not been initialized correctly"),globalThis.storyblokApiInstance}function ve(r,e){const t=globalThis.storyblokApiInstance.richTextResolver;if(!t){console.error("Please initialize the Storyblok SDK before calling the renderRichText function");return}return ye(r,e,t)}function Ie(r){const e={useCustomApi:!1,bridge:!0,componentsDir:"src",enableFallbackComponent:!1,...r};return{name:"@storyblok/astro",hooks:{"astro:config:setup":({injectScript:t,updateConfig:o})=>{o({vite:{plugins:[p(e.accessToken,e.useCustomApi,e.apiOptions),P(e.componentsDir,e.components,e.enableFallbackComponent,e.customFallbackComponent),_(e)]}}),t("page-ssr",`
32
+ }`),""}optimizeImages(e,t){let o=0,n=0,s="",a="";typeof t!="boolean"&&(typeof t.width=="number"&&t.width>0&&(s+=`width="${t.width}" `,o=t.width),typeof t.height=="number"&&t.height>0&&(s+=`height="${t.height}" `,n=t.height),(t.loading==="lazy"||t.loading==="eager")&&(s+=`loading="${t.loading}" `),typeof t.class=="string"&&t.class.length>0&&(s+=`class="${t.class}" `),t.filters&&(typeof t.filters.blur=="number"&&t.filters.blur>=0&&t.filters.blur<=100&&(a+=`:blur(${t.filters.blur})`),typeof t.filters.brightness=="number"&&t.filters.brightness>=-100&&t.filters.brightness<=100&&(a+=`:brightness(${t.filters.brightness})`),t.filters.fill&&(t.filters.fill.match(/[0-9A-Fa-f]{6}/g)||t.filters.fill==="transparent")&&(a+=`:fill(${t.filters.fill})`),t.filters.format&&["webp","png","jpeg"].includes(t.filters.format)&&(a+=`:format(${t.filters.format})`),typeof t.filters.grayscale=="boolean"&&t.filters.grayscale&&(a+=":grayscale()"),typeof t.filters.quality=="number"&&t.filters.quality>=0&&t.filters.quality<=100&&(a+=`:quality(${t.filters.quality})`),t.filters.rotate&&[90,180,270].includes(t.filters.rotate)&&(a+=`:rotate(${t.filters.rotate})`),a.length>0&&(a="/filters"+a))),s.length>0&&(e=e.replace(/<img/g,`<img ${s.trim()}`));const f=o>0||n>0||a.length>0?`${o}x${n}${a}`:"";return e=e.replace(/a.storyblok.com\/f\/(\d+)\/([^.]+)\.(gif|jpg|jpeg|png|tif|tiff|bmp)/g,`a.storyblok.com/f/$1/$2.$3/m/${f}`),typeof t!="boolean"&&(t.sizes||t.srcset)&&(e=e.replace(/<img.*?src=["|'](.*?)["|']/g,l=>{var i,c;const d=l.match(/a.storyblok.com\/f\/(\d+)\/([^.]+)\.(gif|jpg|jpeg|png|tif|tiff|bmp)/g);if(d&&d.length>0){const p={srcset:(i=t.srcset)==null?void 0:i.map(g=>{if(typeof g=="number")return`//${d}/m/${g}x0${a} ${g}w`;if(typeof g=="object"&&g.length===2){let y=0,j=0;return typeof g[0]=="number"&&(y=g[0]),typeof g[1]=="number"&&(j=g[1]),`//${d}/m/${y}x${j}${a} ${y}w`}}).join(", "),sizes:(c=t.sizes)==null?void 0:c.map(g=>g).join(", ")};let m="";return p.srcset&&(m+=`srcset="${p.srcset}" `),p.sizes&&(m+=`sizes="${p.sizes}" `),l.replace(/<img/g,`<img ${m.trim()}`)}return l})),e}renderNode(e){const t=[];e.marks&&e.marks.forEach(n=>{const s=this.getMatchingMark(n);s&&s.tag!==""&&t.push(this.renderOpeningTag(s.tag))});const o=this.getMatchingNode(e);return o&&o.tag&&t.push(this.renderOpeningTag(o.tag)),e.content?e.content.forEach(n=>{t.push(this.renderNode(n))}):e.text?t.push(de(e.text)):o&&o.singleTag?t.push(this.renderTag(o.singleTag," /")):o&&o.html?t.push(o.html):e.type==="emoji"&&t.push(this.renderEmoji(e)),o&&o.tag&&t.push(this.renderClosingTag(o.tag)),e.marks&&e.marks.slice(0).reverse().forEach(n=>{const s=this.getMatchingMark(n);s&&s.tag!==""&&t.push(this.renderClosingTag(s.tag))}),t.join("")}renderTag(e,t){return e.constructor===String?`<${e}${t}>`:e.map(o=>{if(o.constructor===String)return`<${o}${t}>`;{let n=`<${o.tag}`;if(o.attrs)for(const s in o.attrs){const a=o.attrs[s];a!==null&&(n+=` ${s}="${a}"`)}return`${n}${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){const t=this.nodes[e.type];if(typeof t=="function")return t(e)}getMatchingMark(e){const t=this.marks[e.type];if(typeof t=="function")return t(e)}renderEmoji(e){if(e.attrs.emoji)return e.attrs.emoji;const t=[{tag:"img",attrs:{src:e.attrs.fallbackImage,draggable:"false",loading:"lazy",align:"absmiddle"}}];return this.renderTag(t," /")}}const pe=r=>{if(typeof r!="object"||typeof r._editable>"u")return{};const e=JSON.parse(r._editable.replace(/^<!--#storyblok#/,"").replace(/-->$/,""));return{"data-blok-c":JSON.stringify(e),"data-blok-uid":e.id+"-"+e.uid}};let he;const be="https://app.storyblok.com/f/storyblok-v2-latest.js",me=(r,e)=>{r.addNode("blok",t=>{let o="";return t.attrs.body.forEach(n=>{o+=e(n.component,n)}),{html:o}})},ye=r=>{var e,t;return!r||((e=r==null?void 0:r.content)==null?void 0:e[0].type)!=="blok"&&!((t=r==null?void 0:r.content)!=null&&t[0].content)},ke=(r,e,t)=>{let o=t||he;if(!o){console.error("Please initialize the Storyblok SDK before calling the renderRichText function");return}return ye(r)?"":(e&&(o=new S(e.schema),e.resolver&&me(o,e.resolver)),o.render(r))},ve=()=>z(be);function $e(){return globalThis.storyblokApiInstance||console.error("storyblokApiInstance has not been initialized correctly"),globalThis.storyblokApiInstance}function Ie(r,e){const t=globalThis.storyblokApiInstance.richTextResolver;if(!t){console.error("Please initialize the Storyblok SDK before calling the renderRichText function");return}return ke(r,e,t)}function Te(r){const e={useCustomApi:!1,bridge:!0,componentsDir:"src",enableFallbackComponent:!1,...r};return{name:"@storyblok/astro",hooks:{"astro:config:setup":({injectScript:t,updateConfig:o})=>{o({vite:{plugins:[h(e.accessToken,e.useCustomApi,e.apiOptions),P(e.componentsDir,e.components,e.enableFallbackComponent,e.customFallbackComponent),_(e)]}}),t("page-ssr",`
35
33
  import { storyblokApiInstance } from "virtual:storyblok-init";
36
34
  globalThis.storyblokApiInstance = storyblokApiInstance;
37
35
  `),e.bridge&&t("page",`
@@ -46,4 +44,4 @@
46
44
  }
47
45
  });
48
46
  });
49
- `)}}}}g.RichTextResolver=x,g.RichTextSchema=C,g.default=Ie,g.loadStoryblokBridge=ke,g.renderRichText=ve,g.storyblokEditable=he,g.useStoryblokApi=$e,Object.defineProperties(g,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
47
+ `)}}}}u.RichTextResolver=S,u.RichTextSchema=C,u.default=Te,u.loadStoryblokBridge=ve,u.renderRichText=Ie,u.storyblokEditable=pe,u.useStoryblokApi=$e,Object.defineProperties(u,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
@@ -1,13 +1,13 @@
1
1
  function T(r, e, t) {
2
- const o = "virtual:storyblok-init", a = "\0" + o;
2
+ const s = "virtual:storyblok-init", a = "\0" + s;
3
3
  return {
4
4
  name: "vite-plugin-storyblok-init",
5
- async resolveId(s) {
6
- if (s === o)
5
+ async resolveId(o) {
6
+ if (o === s)
7
7
  return a;
8
8
  },
9
- async load(s) {
10
- if (s === a)
9
+ async load(o) {
10
+ if (o === a)
11
11
  return `
12
12
  import { storyblokInit, apiPlugin } from "@storyblok/js";
13
13
  const { storyblokApi } = storyblokInit({
@@ -20,14 +20,14 @@ function T(r, e, t) {
20
20
  }
21
21
  };
22
22
  }
23
- const C = /[\p{Lu}]/u, A = /[\p{Ll}]/u, y = /^[\p{Lu}](?![\p{Lu}])/gu, E = /([\p{Alpha}\p{N}_]|$)/u, b = /[_.\- ]+/, j = new RegExp("^" + b.source), k = new RegExp(b.source + E.source, "gu"), $ = new RegExp("\\d+" + E.source, "gu"), S = (r, e, t, o) => {
24
- let a = !1, s = !1, n = !1, u = !1;
23
+ const x = /[\p{Lu}]/u, A = /[\p{Ll}]/u, y = /^[\p{Lu}](?![\p{Lu}])/gu, C = /([\p{Alpha}\p{N}_]|$)/u, m = /[_.\- ]+/, S = new RegExp("^" + m.source), k = new RegExp(m.source + C.source, "gu"), $ = new RegExp("\\d+" + C.source, "gu"), j = (r, e, t, s) => {
24
+ let a = !1, o = !1, n = !1, u = !1;
25
25
  for (let l = 0; l < r.length; l++) {
26
26
  const i = r[l];
27
- u = l > 2 ? r[l - 3] === "-" : !0, a && C.test(i) ? (r = r.slice(0, l) + "-" + r.slice(l), a = !1, n = s, s = !0, l++) : s && n && A.test(i) && (!u || o) ? (r = r.slice(0, l - 1) + "-" + r.slice(l - 1), n = s, s = !1, a = !0) : (a = e(i) === i && t(i) !== i, n = s, s = t(i) === i && e(i) !== i);
27
+ u = l > 2 ? r[l - 3] === "-" : !0, a && x.test(i) ? (r = r.slice(0, l) + "-" + r.slice(l), a = !1, n = o, o = !0, l++) : o && n && A.test(i) && (!u || s) ? (r = r.slice(0, l - 1) + "-" + r.slice(l - 1), n = o, o = !1, a = !0) : (a = e(i) === i && t(i) !== i, n = o, o = t(i) === i && e(i) !== i);
28
28
  }
29
29
  return r;
30
- }, R = (r, e) => (y.lastIndex = 0, r.replace(y, (t) => e(t))), N = (r, e) => (k.lastIndex = 0, $.lastIndex = 0, r.replace(k, (t, o) => e(o)).replace($, (t) => e(t)));
30
+ }, R = (r, e) => (y.lastIndex = 0, r.replace(y, (t) => e(t))), N = (r, e) => (k.lastIndex = 0, $.lastIndex = 0, r.replace(k, (t, s) => e(s)).replace($, (t) => e(t)));
31
31
  function v(r, e) {
32
32
  if (!(typeof r == "string" || Array.isArray(r)))
33
33
  throw new TypeError("Expected the input to be `string | string[]`");
@@ -35,28 +35,28 @@ function v(r, e) {
35
35
  pascalCase: !1,
36
36
  preserveConsecutiveUppercase: !1,
37
37
  ...e
38
- }, Array.isArray(r) ? r = r.map((s) => s.trim()).filter((s) => s.length).join("-") : r = r.trim(), r.length === 0)
38
+ }, Array.isArray(r) ? r = r.map((o) => o.trim()).filter((o) => o.length).join("-") : r = r.trim(), r.length === 0)
39
39
  return "";
40
- const t = e.locale === !1 ? (s) => s.toLowerCase() : (s) => s.toLocaleLowerCase(e.locale), o = e.locale === !1 ? (s) => s.toUpperCase() : (s) => s.toLocaleUpperCase(e.locale);
41
- return r.length === 1 ? b.test(r) ? "" : e.pascalCase ? o(r) : t(r) : (r !== t(r) && (r = S(r, t, o, e.preserveConsecutiveUppercase)), r = r.replace(j, ""), r = e.preserveConsecutiveUppercase ? R(r, t) : t(r), e.pascalCase && (r = o(r.charAt(0)) + r.slice(1)), N(r, o));
40
+ const t = e.locale === !1 ? (o) => o.toLowerCase() : (o) => o.toLocaleLowerCase(e.locale), s = e.locale === !1 ? (o) => o.toUpperCase() : (o) => o.toLocaleUpperCase(e.locale);
41
+ return r.length === 1 ? m.test(r) ? "" : e.pascalCase ? s(r) : t(r) : (r !== t(r) && (r = j(r, t, s, e.preserveConsecutiveUppercase)), r = r.replace(S, ""), r = e.preserveConsecutiveUppercase ? R(r, t) : t(r), e.pascalCase && (r = s(r.charAt(0)) + r.slice(1)), N(r, s));
42
42
  }
43
- function O(r, e, t, o) {
44
- const a = "virtual:storyblok-components", s = "\0" + a;
43
+ function O(r, e, t, s) {
44
+ const a = "virtual:storyblok-components", o = "\0" + a;
45
45
  return {
46
46
  name: "vite-plugin-storyblok-components",
47
47
  async resolveId(n) {
48
48
  if (n === a)
49
- return s;
49
+ return o;
50
50
  },
51
51
  async load(n) {
52
- if (n === s) {
52
+ if (n === o) {
53
53
  const u = [], l = [];
54
54
  for await (const [c, f] of Object.entries(e)) {
55
- const d = await this.resolve(
55
+ const p = await this.resolve(
56
56
  "/" + r + "/" + f + ".astro"
57
57
  );
58
- if (d)
59
- u.push(`import ${v(c)} from "${d.id}"`);
58
+ if (p)
59
+ u.push(`import ${v(c)} from "${p.id}"`);
60
60
  else if (t)
61
61
  l.push(c);
62
62
  else
@@ -66,13 +66,13 @@ function O(r, e, t, o) {
66
66
  }
67
67
  let i = "";
68
68
  if (t)
69
- if (i = ",FallbackComponent", o) {
69
+ if (i = ",FallbackComponent", s) {
70
70
  const c = await this.resolve(
71
- "/" + r + "/" + o + ".astro"
71
+ "/" + r + "/" + s + ".astro"
72
72
  );
73
73
  if (!c)
74
74
  throw new Error(
75
- `Custom fallback component could not be found. Does "${"/" + r + "/" + o}.astro" exist?`
75
+ `Custom fallback component could not be found. Does "${"/" + r + "/" + s}.astro" exist?`
76
76
  );
77
77
  u.push(
78
78
  `import FallbackComponent from "${c.id}"`
@@ -90,12 +90,12 @@ function L(r) {
90
90
  const e = "virtual:storyblok-options", t = "\0" + e;
91
91
  return {
92
92
  name: "vite-plugin-storyblok-options",
93
- async resolveId(o) {
94
- if (o === e)
93
+ async resolveId(s) {
94
+ if (s === e)
95
95
  return t;
96
96
  },
97
- async load(o) {
98
- if (o === t)
97
+ async load(s) {
98
+ if (s === t)
99
99
  return `export default ${JSON.stringify(r)}`;
100
100
  }
101
101
  };
@@ -110,26 +110,26 @@ const w = [], z = (r) => new Promise((e, t) => {
110
110
  I ? a() : w.push(a);
111
111
  }, document.getElementById("storyblok-javascript-bridge")))
112
112
  return;
113
- const o = document.createElement("script");
114
- o.async = !0, o.src = r, o.id = "storyblok-javascript-bridge", o.onerror = (a) => t(a), o.onload = (a) => {
115
- w.forEach((s) => s()), I = !0, e(a);
116
- }, document.getElementsByTagName("head")[0].appendChild(o);
113
+ const s = document.createElement("script");
114
+ s.async = !0, s.src = r, s.id = "storyblok-javascript-bridge", s.onerror = (a) => t(a), s.onload = (a) => {
115
+ w.forEach((o) => o()), I = !0, e(a);
116
+ }, document.getElementsByTagName("head")[0].appendChild(s);
117
117
  });
118
- var M = Object.defineProperty, P = (r, e, t) => e in r ? M(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, x = (r, e, t) => (P(r, typeof e != "symbol" ? e + "" : e, t), t);
118
+ var M = Object.defineProperty, P = (r, e, t) => e in r ? M(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, E = (r, e, t) => (P(r, typeof e != "symbol" ? e + "" : e, t), t);
119
119
  const _ = function(r, e) {
120
120
  const t = {};
121
- for (const o in r) {
122
- const a = r[o];
123
- e.indexOf(o) > -1 && a !== null && (t[o] = a);
121
+ for (const s in r) {
122
+ const a = r[s];
123
+ e.indexOf(s) > -1 && a !== null && (t[s] = a);
124
124
  }
125
125
  return t;
126
126
  }, D = (r) => r === "email", U = () => ({
127
127
  singleTag: "hr"
128
- }), F = () => ({
129
- tag: "blockquote"
130
128
  }), q = () => ({
129
+ tag: "blockquote"
130
+ }), B = () => ({
131
131
  tag: "ul"
132
- }), B = (r) => ({
132
+ }), F = (r) => ({
133
133
  tag: [
134
134
  "pre",
135
135
  {
@@ -177,11 +177,11 @@ const _ = function(r, e) {
177
177
  tag: "code"
178
178
  }), re = () => ({
179
179
  tag: "i"
180
- }), oe = (r) => {
180
+ }), se = (r) => {
181
181
  const e = { ...r.attrs }, { linktype: t = "url" } = r.attrs;
182
182
  if (D(t) && (e.href = `mailto:${e.href}`), e.anchor && (e.href = `${e.href}#${e.anchor}`, delete e.anchor), e.custom) {
183
- for (const o in e.custom)
184
- e[o] = e.custom[o];
183
+ for (const s in e.custom)
184
+ e[s] = e.custom[s];
185
185
  delete e.custom;
186
186
  }
187
187
  return {
@@ -192,7 +192,7 @@ const _ = function(r, e) {
192
192
  }
193
193
  ]
194
194
  };
195
- }, se = (r) => ({
195
+ }, oe = (r) => ({
196
196
  tag: [
197
197
  {
198
198
  tag: "span",
@@ -241,9 +241,9 @@ const _ = function(r, e) {
241
241
  }, ge = {
242
242
  nodes: {
243
243
  horizontal_rule: U,
244
- blockquote: F,
245
- bullet_list: q,
246
- code_block: B,
244
+ blockquote: q,
245
+ bullet_list: B,
246
+ code_block: F,
247
247
  hard_break: J,
248
248
  heading: K,
249
249
  image: V,
@@ -259,8 +259,8 @@ const _ = function(r, e) {
259
259
  strong: ee,
260
260
  code: te,
261
261
  italic: re,
262
- link: oe,
263
- styled: se,
262
+ link: se,
263
+ styled: oe,
264
264
  subscript: ae,
265
265
  superscript: ne,
266
266
  anchor: le,
@@ -274,12 +274,12 @@ const _ = function(r, e) {
274
274
  ">": "&gt;",
275
275
  '"': "&quot;",
276
276
  "'": "&#39;"
277
- }, t = /[&<>"']/g, o = RegExp(t.source);
278
- return r && o.test(r) ? r.replace(t, (a) => e[a]) : r;
277
+ }, t = /[&<>"']/g, s = RegExp(t.source);
278
+ return r && s.test(r) ? r.replace(t, (a) => e[a]) : r;
279
279
  };
280
280
  class fe {
281
281
  constructor(e) {
282
- x(this, "marks"), x(this, "nodes"), e || (e = ge), this.marks = e.marks || [], this.nodes = e.nodes || [];
282
+ E(this, "marks"), E(this, "nodes"), e || (e = ge), this.marks = e.marks || [], this.nodes = e.nodes || [];
283
283
  }
284
284
  addNode(e, t) {
285
285
  this.nodes[e] = t;
@@ -289,10 +289,10 @@ class fe {
289
289
  }
290
290
  render(e, t = { optimizeImages: !1 }) {
291
291
  if (e && e.content && Array.isArray(e.content)) {
292
- let o = "";
292
+ let s = "";
293
293
  return e.content.forEach((a) => {
294
- o += this.renderNode(a);
295
- }), t.optimizeImages ? this.optimizeImages(o, t.optimizeImages) : o;
294
+ s += this.renderNode(a);
295
+ }), t.optimizeImages ? this.optimizeImages(s, t.optimizeImages) : s;
296
296
  }
297
297
  return console.warn(
298
298
  `The render method must receive an Object with a "content" field.
@@ -322,9 +322,9 @@ class fe {
322
322
  ), "";
323
323
  }
324
324
  optimizeImages(e, t) {
325
- let o = 0, a = 0, s = "", n = "";
326
- typeof t != "boolean" && (typeof t.width == "number" && t.width > 0 && (s += `width="${t.width}" `, o = t.width), typeof t.height == "number" && t.height > 0 && (s += `height="${t.height}" `, a = t.height), (t.loading === "lazy" || t.loading === "eager") && (s += `loading="${t.loading}" `), typeof t.class == "string" && t.class.length > 0 && (s += `class="${t.class}" `), t.filters && (typeof t.filters.blur == "number" && t.filters.blur >= 0 && t.filters.blur <= 100 && (n += `:blur(${t.filters.blur})`), typeof t.filters.brightness == "number" && t.filters.brightness >= -100 && t.filters.brightness <= 100 && (n += `:brightness(${t.filters.brightness})`), t.filters.fill && (t.filters.fill.match(/[0-9A-Fa-f]{6}/g) || t.filters.fill === "transparent") && (n += `:fill(${t.filters.fill})`), t.filters.format && ["webp", "png", "jpeg"].includes(t.filters.format) && (n += `:format(${t.filters.format})`), typeof t.filters.grayscale == "boolean" && t.filters.grayscale && (n += ":grayscale()"), typeof t.filters.quality == "number" && t.filters.quality >= 0 && t.filters.quality <= 100 && (n += `:quality(${t.filters.quality})`), t.filters.rotate && [90, 180, 270].includes(t.filters.rotate) && (n += `:rotate(${t.filters.rotate})`), n.length > 0 && (n = "/filters" + n))), s.length > 0 && (e = e.replace(/<img/g, `<img ${s.trim()}`));
327
- const u = o > 0 || a > 0 || n.length > 0 ? `${o}x${a}${n}` : "";
325
+ let s = 0, a = 0, o = "", n = "";
326
+ typeof t != "boolean" && (typeof t.width == "number" && t.width > 0 && (o += `width="${t.width}" `, s = t.width), typeof t.height == "number" && t.height > 0 && (o += `height="${t.height}" `, a = t.height), (t.loading === "lazy" || t.loading === "eager") && (o += `loading="${t.loading}" `), typeof t.class == "string" && t.class.length > 0 && (o += `class="${t.class}" `), t.filters && (typeof t.filters.blur == "number" && t.filters.blur >= 0 && t.filters.blur <= 100 && (n += `:blur(${t.filters.blur})`), typeof t.filters.brightness == "number" && t.filters.brightness >= -100 && t.filters.brightness <= 100 && (n += `:brightness(${t.filters.brightness})`), t.filters.fill && (t.filters.fill.match(/[0-9A-Fa-f]{6}/g) || t.filters.fill === "transparent") && (n += `:fill(${t.filters.fill})`), t.filters.format && ["webp", "png", "jpeg"].includes(t.filters.format) && (n += `:format(${t.filters.format})`), typeof t.filters.grayscale == "boolean" && t.filters.grayscale && (n += ":grayscale()"), typeof t.filters.quality == "number" && t.filters.quality >= 0 && t.filters.quality <= 100 && (n += `:quality(${t.filters.quality})`), t.filters.rotate && [90, 180, 270].includes(t.filters.rotate) && (n += `:rotate(${t.filters.rotate})`), n.length > 0 && (n = "/filters" + n))), o.length > 0 && (e = e.replace(/<img/g, `<img ${o.trim()}`));
327
+ const u = s > 0 || a > 0 || n.length > 0 ? `${s}x${a}${n}` : "";
328
328
  return e = e.replace(
329
329
  /a.storyblok.com\/f\/(\d+)\/([^.]+)\.(gif|jpg|jpeg|png|tif|tiff|bmp)/g,
330
330
  `a.storyblok.com/f/$1/$2.$3/m/${u}`
@@ -334,19 +334,19 @@ class fe {
334
334
  /a.storyblok.com\/f\/(\d+)\/([^.]+)\.(gif|jpg|jpeg|png|tif|tiff|bmp)/g
335
335
  );
336
336
  if (f && f.length > 0) {
337
- const d = {
337
+ const p = {
338
338
  srcset: (i = t.srcset) == null ? void 0 : i.map((g) => {
339
339
  if (typeof g == "number")
340
340
  return `//${f}/m/${g}x0${n} ${g}w`;
341
341
  if (typeof g == "object" && g.length === 2) {
342
- let h = 0, m = 0;
343
- return typeof g[0] == "number" && (h = g[0]), typeof g[1] == "number" && (m = g[1]), `//${f}/m/${h}x${m}${n} ${h}w`;
342
+ let h = 0, b = 0;
343
+ return typeof g[0] == "number" && (h = g[0]), typeof g[1] == "number" && (b = g[1]), `//${f}/m/${h}x${b}${n} ${h}w`;
344
344
  }
345
345
  }).join(", "),
346
346
  sizes: (c = t.sizes) == null ? void 0 : c.map((g) => g).join(", ")
347
347
  };
348
- let p = "";
349
- return d.srcset && (p += `srcset="${d.srcset}" `), d.sizes && (p += `sizes="${d.sizes}" `), l.replace(/<img/g, `<img ${p.trim()}`);
348
+ let d = "";
349
+ return p.srcset && (d += `srcset="${p.srcset}" `), p.sizes && (d += `sizes="${p.sizes}" `), l.replace(/<img/g, `<img ${d.trim()}`);
350
350
  }
351
351
  return l;
352
352
  })), e;
@@ -354,27 +354,27 @@ class fe {
354
354
  renderNode(e) {
355
355
  const t = [];
356
356
  e.marks && e.marks.forEach((a) => {
357
- const s = this.getMatchingMark(a);
358
- s && s.tag !== "" && t.push(this.renderOpeningTag(s.tag));
357
+ const o = this.getMatchingMark(a);
358
+ o && o.tag !== "" && t.push(this.renderOpeningTag(o.tag));
359
359
  });
360
- const o = this.getMatchingNode(e);
361
- return o && o.tag && t.push(this.renderOpeningTag(o.tag)), e.content ? e.content.forEach((a) => {
360
+ const s = this.getMatchingNode(e);
361
+ return s && s.tag && t.push(this.renderOpeningTag(s.tag)), e.content ? e.content.forEach((a) => {
362
362
  t.push(this.renderNode(a));
363
- }) : e.text ? t.push(ue(e.text)) : o && o.singleTag ? t.push(this.renderTag(o.singleTag, " /")) : o && o.html ? t.push(o.html) : e.type === "emoji" && t.push(this.renderEmoji(e)), o && o.tag && t.push(this.renderClosingTag(o.tag)), e.marks && e.marks.slice(0).reverse().forEach((a) => {
364
- const s = this.getMatchingMark(a);
365
- s && s.tag !== "" && t.push(this.renderClosingTag(s.tag));
363
+ }) : e.text ? t.push(ue(e.text)) : s && s.singleTag ? t.push(this.renderTag(s.singleTag, " /")) : s && s.html ? t.push(s.html) : e.type === "emoji" && t.push(this.renderEmoji(e)), s && s.tag && t.push(this.renderClosingTag(s.tag)), e.marks && e.marks.slice(0).reverse().forEach((a) => {
364
+ const o = this.getMatchingMark(a);
365
+ o && o.tag !== "" && t.push(this.renderClosingTag(o.tag));
366
366
  }), t.join("");
367
367
  }
368
368
  renderTag(e, t) {
369
- return e.constructor === String ? `<${e}${t}>` : e.map((o) => {
370
- if (o.constructor === String)
371
- return `<${o}${t}>`;
369
+ return e.constructor === String ? `<${e}${t}>` : e.map((s) => {
370
+ if (s.constructor === String)
371
+ return `<${s}${t}>`;
372
372
  {
373
- let a = `<${o.tag}`;
374
- if (o.attrs)
375
- for (const s in o.attrs) {
376
- const n = o.attrs[s];
377
- n !== null && (a += ` ${s}="${n}"`);
373
+ let a = `<${s.tag}`;
374
+ if (s.attrs)
375
+ for (const o in s.attrs) {
376
+ const n = s.attrs[o];
377
+ n !== null && (a += ` ${o}="${n}"`);
378
378
  }
379
379
  return `${a}${t}>`;
380
380
  }
@@ -413,7 +413,7 @@ class fe {
413
413
  return this.renderTag(t, " /");
414
414
  }
415
415
  }
416
- const me = (r) => {
416
+ const ye = (r) => {
417
417
  if (typeof r != "object" || typeof r._editable > "u")
418
418
  return {};
419
419
  const e = JSON.parse(
@@ -424,32 +424,33 @@ const me = (r) => {
424
424
  "data-blok-uid": e.id + "-" + e.uid
425
425
  };
426
426
  };
427
- let de;
428
- const pe = "https://app.storyblok.com/f/storyblok-v2-latest.js", he = (r, e) => {
427
+ let pe;
428
+ const de = "https://app.storyblok.com/f/storyblok-v2-latest.js", he = (r, e) => {
429
429
  r.addNode("blok", (t) => {
430
- let o = "";
430
+ let s = "";
431
431
  return t.attrs.body.forEach((a) => {
432
- o += e(a.component, a);
432
+ s += e(a.component, a);
433
433
  }), {
434
- html: o
434
+ html: s
435
435
  };
436
436
  });
437
+ }, me = (r) => {
438
+ var e, t;
439
+ return !r || ((e = r == null ? void 0 : r.content) == null ? void 0 : e[0].type) !== "blok" && !((t = r == null ? void 0 : r.content) != null && t[0].content);
437
440
  }, be = (r, e, t) => {
438
- let o = t || de;
439
- if (!o) {
441
+ let s = t || pe;
442
+ if (!s) {
440
443
  console.error(
441
444
  "Please initialize the Storyblok SDK before calling the renderRichText function"
442
445
  );
443
446
  return;
444
447
  }
445
- return r === "" ? "" : r ? (e && (o = new fe(e.schema), e.resolver && he(o, e.resolver)), o.render(r)) : (console.warn(`${r} is not a valid Richtext object. This might be because the value of the richtext field is empty.
446
-
447
- For more info about the richtext object check https://github.com/storyblok/storyblok-js#rendering-rich-text`), "");
448
- }, ye = () => z(pe);
449
- function ke() {
448
+ return me(r) ? "" : (e && (s = new fe(e.schema), e.resolver && he(s, e.resolver)), s.render(r));
449
+ }, ke = () => z(de);
450
+ function $e() {
450
451
  return globalThis.storyblokApiInstance || console.error("storyblokApiInstance has not been initialized correctly"), globalThis.storyblokApiInstance;
451
452
  }
452
- function $e(r, e) {
453
+ function ve(r, e) {
453
454
  const t = globalThis.storyblokApiInstance.richTextResolver;
454
455
  if (!t) {
455
456
  console.error(
@@ -459,7 +460,7 @@ function $e(r, e) {
459
460
  }
460
461
  return be(r, e, t);
461
462
  }
462
- function ve(r) {
463
+ function Ie(r) {
463
464
  const e = {
464
465
  useCustomApi: !1,
465
466
  bridge: !0,
@@ -470,8 +471,8 @@ function ve(r) {
470
471
  return {
471
472
  name: "@storyblok/astro",
472
473
  hooks: {
473
- "astro:config:setup": ({ injectScript: t, updateConfig: o }) => {
474
- o({
474
+ "astro:config:setup": ({ injectScript: t, updateConfig: s }) => {
475
+ s({
475
476
  vite: {
476
477
  plugins: [
477
478
  T(
@@ -517,9 +518,9 @@ function ve(r) {
517
518
  export {
518
519
  fe as RichTextResolver,
519
520
  ge as RichTextSchema,
520
- ve as default,
521
- ye as loadStoryblokBridge,
522
- $e as renderRichText,
523
- me as storyblokEditable,
524
- ke as useStoryblokApi
521
+ Ie as default,
522
+ ke as loadStoryblokBridge,
523
+ ve as renderRichText,
524
+ ye as storyblokEditable,
525
+ $e as useStoryblokApi
525
526
  };
@@ -3,7 +3,7 @@ import type { AstroIntegration } from "astro";
3
3
  import type { ISbConfig, ISbRichtext, SbRichTextOptions } from "./types";
4
4
  export { storyblokEditable, loadStoryblokBridge, RichTextResolver, RichTextSchema, } from "@storyblok/js";
5
5
  export declare function useStoryblokApi(): StoryblokClient;
6
- export declare function renderRichText(data: ISbRichtext, options?: SbRichTextOptions): string;
6
+ export declare function renderRichText(data?: ISbRichtext, options?: SbRichTextOptions): string;
7
7
  export type IntegrationOptions = {
8
8
  /**
9
9
  * The access token from your space.
package/package.json CHANGED
@@ -1,13 +1,14 @@
1
1
  {
2
2
  "name": "@storyblok/astro",
3
- "version": "2.3.4",
3
+ "version": "2.4.0",
4
4
  "description": "Official Astro integration for the Storyblok Headless CMS",
5
5
  "main": "./dist/storyblok-astro.js",
6
6
  "module": "./dist/storyblok-astro.mjs",
7
7
  "files": [
8
8
  "dist",
9
9
  "StoryblokComponent.astro",
10
- "FallbackComponent.astro"
10
+ "FallbackComponent.astro",
11
+ "RichTextRenderer.astro"
11
12
  ],
12
13
  "exports": {
13
14
  ".": {
@@ -16,7 +17,8 @@
16
17
  "require": "./dist/storyblok-astro.js"
17
18
  },
18
19
  "./StoryblokComponent.astro": "./StoryblokComponent.astro",
19
- "./FallbackComponent.astro": "./FallbackComponent.astro"
20
+ "./FallbackComponent.astro": "./FallbackComponent.astro",
21
+ "./RichTextRenderer.astro": "./RichTextRenderer.astro"
20
22
  },
21
23
  "types": "./dist/types/index.d.ts",
22
24
  "scripts": {
@@ -31,19 +33,19 @@
31
33
  "prepublishOnly": "npm run build && cp ../README.md ./"
32
34
  },
33
35
  "dependencies": {
34
- "@storyblok/js": "^2.1.6",
36
+ "@storyblok/js": "^2.2.0",
35
37
  "camelcase": "^7.0.1"
36
38
  },
37
39
  "devDependencies": {
38
40
  "@cypress/vite-dev-server": "^5.0.5",
39
41
  "@rollup/plugin-dynamic-import-vars": "^2.0.3",
40
- "@types/node": "20.2.3",
41
- "astro": "2.5.5",
42
- "cypress": "^12.12.0",
42
+ "@types/node": "20.3.1",
43
+ "astro": "2.6.4",
44
+ "cypress": "^12.14.0",
43
45
  "eslint-plugin-cypress": "^2.13.3",
44
46
  "start-server-and-test": "^2.0.0",
45
- "typescript": "5.0.4",
46
- "vite": "^4.3.8",
47
+ "typescript": "5.1.3",
48
+ "vite": "^4.3.9",
47
49
  "vite-plugin-dts": "^2.3.0"
48
50
  },
49
51
  "repository": {