@storyblok/vue 8.1.6 → 8.1.7

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/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2024 Storyblok GmbH
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md CHANGED
@@ -128,161 +128,6 @@ The simplest way is by using the `useStoryblok` one-liner composable. Where you
128
128
 
129
129
  Check the available [apiOptions](https://www.storyblok.com/docs/api/content-delivery/v2#core-resources/stories/retrieve-one-story?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-vue) in our API docs and [bridgeOptions](https://www.storyblok.com/docs/Guides/storyblok-latest-js?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-vue) passed to the Storyblok Bridge.
130
130
 
131
- ### Rendering Rich Text
132
-
133
- You can render rich-text fields by using the `StoryblokRichText` component:
134
-
135
- ```html
136
- <script setup>
137
- import { StoryblokRichText } from "@storyblok/vue";
138
- </script>
139
-
140
- <template>
141
- <StoryblokRichText :doc="blok.articleContent" />
142
- </template>
143
- ```
144
-
145
- #### Overriding the default resolvers
146
-
147
- You can override the default resolvers by passing a `resolver` prop to the `StoryblokRichText` component, for example, to use vue-router links or add a custom codeblok component: :
148
-
149
- ```html
150
- <script setup>
151
- import { type VNode, h } from "vue";
152
- import { StoryblokRichText, BlockTypes, MarkTypes, type StoryblokRichTextNode } from "@storyblok/vue";
153
- import { RouterLink } from "vue-router";
154
- import CodeBlok from "./components/CodeBlok.vue";
155
-
156
- const resolvers = {
157
- // RouterLink example:
158
- [MarkTypes.LINK]: (node: StoryblokRichTextNode<VNode>) => {
159
- return node.attrs?.linktype === 'STORY'
160
- ? h(RouterLink, {
161
- to: node.attrs?.href,
162
- target: node.attrs?.target,
163
- }, node.text)
164
- : h('a', {
165
- href: node.attrs?.href,
166
- target: node.attrs?.target,
167
- }, node.text)
168
- },
169
- // Custom code block component example:
170
- [BlockTypes.CODE_BLOCK]: (node: Node) => {
171
- return h(CodeBlock, {
172
- class: node?.attrs?.class,
173
- }, node.children)
174
- },
175
- }
176
- </script>
177
-
178
- <template>
179
- <StoryblokRichText :doc="blok.articleContent" :resolvers="resolvers" />
180
- </template>
181
- ```
182
-
183
- Or you can have more control by using the `useStoryblokRichText` composable:
184
-
185
- ```html
186
- <script setup>
187
- import { type VNode, h } from "vue";
188
- import { useStoryblokRichText, BlockTypes, MarkTypes, type StoryblokRichTextNode } from "@storyblok/vue";
189
- import { RouterLink } from "vue-router";
190
-
191
- const resolvers = {
192
- // RouterLink example:
193
- [MarkTypes.LINK]: (node: StoryblokRichTextNode<VNode>) => {
194
- return node.attrs?.linktype === 'STORY'
195
- ? h(RouterLink, {
196
- to: node.attrs?.href,
197
- target: node.attrs?.target,
198
- }, node.text)
199
- : h('a', {
200
- href: node.attrs?.href,
201
- target: node.attrs?.target,
202
- }, node.text)
203
- },
204
- }
205
-
206
- const { render } = useStoryblokRichText({
207
- resolvers,
208
- })
209
-
210
- const html = render(blok.articleContent);
211
- </script>
212
-
213
- <template>
214
- <div v-html="html"></div>
215
- </template>
216
- ```
217
-
218
- For more incredible options you can pass to the `useStoryblokRichtext, please consult the [Full options](https://github.com/storyblok/richtext?tab=readme-ov-file#options) documentation.
219
-
220
- ### Legacy Rich Text Resolver
221
-
222
- > [!WARNING]
223
- > The legacy `richTextResolver` is soon to be deprecated. We recommend migrating to the new `useRichText` composable described above instead.
224
-
225
- You can easily render rich text by using the `renderRichText` function that comes with `@storyblok/vue` and a Vue computed property:
226
-
227
- ```html
228
- <template>
229
- <div v-html="articleContent"></div>
230
- </template>
231
-
232
- <script setup>
233
- import { computed } from "vue";
234
- import { renderRichText } from "@storyblok/vue";
235
-
236
- const articleContent = computed(() => renderRichText(blok.articleContent));
237
- </script>
238
- ```
239
-
240
- You can set a **custom Schema and component resolver globally** at init time by using the `richText` init option:
241
-
242
- ```js
243
- import { RichTextSchema, StoryblokVue } from "@storyblok/vue";
244
- import cloneDeep from "clone-deep";
245
-
246
- const mySchema = cloneDeep(RichTextSchema); // you can make a copy of the default RichTextSchema
247
- // ... and edit the nodes and marks, or add your own.
248
- // Check the base RichTextSchema source here https://github.com/storyblok/storyblok-js-client/blob/master/source/schema.js
249
-
250
- app.use(StoryblokVue, {
251
- accessToken: "YOUR_ACCESS_TOKEN",
252
- use: [apiPlugin],
253
- richText: {
254
- schema: mySchema,
255
- resolver: (component, blok) => {
256
- switch (component) {
257
- case "my-custom-component":
258
- return `<div class="my-component-class">${blok.text}</div>`;
259
- default:
260
- return "Resolver not defined";
261
- }
262
- },
263
- },
264
- });
265
- ```
266
-
267
- You can also set a **custom Schema and component resolver only once** by passing the options as the second parameter to `renderRichText` function:
268
-
269
- ```js
270
- import { renderRichText } from "@storyblok/vue";
271
-
272
- renderRichText(blok.richTextField, {
273
- schema: mySchema,
274
- resolver: (component, blok) => {
275
- switch (component) {
276
- case "my-custom-component":
277
- return `<div class="my-component-class">${blok.text}</div>`;
278
- break;
279
- default:
280
- return `Component ${component} not found`;
281
- }
282
- },
283
- });
284
- ```
285
-
286
131
  ### Long Form
287
132
 
288
133
  #### 1. Fetching Content
@@ -495,6 +340,177 @@ app.use(StoryblokVue, {
495
340
  app.component("MyCustomFallback", MyCustomFallback);
496
341
  ```
497
342
 
343
+ ## Rendering Rich Text
344
+
345
+ You can render rich text fields by using the `StoryblokRichText` component:
346
+
347
+ ```html
348
+ <script setup>
349
+ import { StoryblokRichText } from "@storyblok/vue";
350
+ </script>
351
+
352
+ <template>
353
+ <StoryblokRichText :doc="blok.articleContent" />
354
+ </template>
355
+ ```
356
+
357
+ Or you can have more control by using the `useStoryblokRichText` composable:
358
+
359
+ ```html
360
+ <script setup>
361
+ import { useStoryblokRichText } from "@storyblok/vue";
362
+ const { render } = useStoryblokRichText({
363
+ // options like resolvers
364
+ });
365
+
366
+ const root = () => render(blok.articleContent);
367
+ </script>
368
+
369
+ <template>
370
+ <root />
371
+ </template>
372
+ ```
373
+
374
+ For more incredible options you can pass to the `useStoryblokRichText`, please consult the [Full options](https://github.com/storyblok/richtext?tab=readme-ov-file#options) documentation.
375
+
376
+ ### Overriding the default resolvers
377
+
378
+ You can override the default resolvers by passing a `resolver` prop to the `StoryblokRichText` component, for example, to use vue-router links or add a custom codeblok component: :
379
+
380
+ ```html
381
+ <script setup>
382
+ import { type VNode, h } from "vue";
383
+ import { StoryblokRichText, BlockTypes, MarkTypes, type StoryblokRichTextNode } from "@storyblok/vue";
384
+ import { RouterLink } from "vue-router";
385
+ import CodeBlok from "./components/CodeBlok.vue";
386
+
387
+ const resolvers = {
388
+ // RouterLink example:
389
+ [MarkTypes.LINK]: (node: StoryblokRichTextNode<VNode>) => {
390
+ return node.attrs?.linktype === 'STORY'
391
+ ? h(RouterLink, {
392
+ to: node.attrs?.href,
393
+ target: node.attrs?.target,
394
+ }, node.text)
395
+ : h('a', {
396
+ href: node.attrs?.href,
397
+ target: node.attrs?.target,
398
+ }, node.text)
399
+ },
400
+ // Custom code block component example:
401
+ [BlockTypes.CODE_BLOCK]: (node: Node) => {
402
+ return h(CodeBlock, {
403
+ class: node?.attrs?.class,
404
+ }, node.children)
405
+ },
406
+ }
407
+ </script>
408
+
409
+ <template>
410
+ <StoryblokRichText :doc="blok.articleContent" :resolvers="resolvers" />
411
+ </template>
412
+ ```
413
+
414
+ If you want to use the `useStoryblokRichText` composable, you can pass the `resolvers` via the options object:
415
+
416
+ ```html
417
+ <script setup>
418
+ import { type VNode, h } from "vue";
419
+ import { useStoryblokRichText, BlockTypes, MarkTypes, type StoryblokRichTextNode } from "@storyblok/vue";
420
+ import { RouterLink } from "vue-router";
421
+
422
+ const resolvers = {
423
+ // RouterLink example:
424
+ [MarkTypes.LINK]: (node: StoryblokRichTextNode<VNode>) => {
425
+ return node.attrs?.linktype === 'STORY'
426
+ ? h(RouterLink, {
427
+ to: node.attrs?.href,
428
+ target: node.attrs?.target,
429
+ }, node.text)
430
+ : h('a', {
431
+ href: node.attrs?.href,
432
+ target: node.attrs?.target,
433
+ }, node.text)
434
+ },
435
+ }
436
+
437
+ const { render } = useStoryblokRichText({
438
+ resolvers,
439
+ })
440
+ const root = () => render(blok.articleContent);
441
+ </script>
442
+
443
+ <template>
444
+ <root />
445
+ </template>
446
+ ```
447
+
448
+ ### Legacy Rich Text Resolver
449
+
450
+ > [!WARNING]
451
+ > The legacy `richTextResolver` is soon to be deprecated. We recommend migrating to the new approach described above instead.
452
+
453
+ You can easily render rich text by using the `renderRichText` function that comes with `@storyblok/vue` and a Vue computed property:
454
+
455
+ ```html
456
+ <template>
457
+ <div v-html="articleContent"></div>
458
+ </template>
459
+
460
+ <script setup>
461
+ import { computed } from "vue";
462
+ import { renderRichText } from "@storyblok/vue";
463
+
464
+ const articleContent = computed(() => renderRichText(blok.articleContent));
465
+ </script>
466
+ ```
467
+
468
+ You can set a **custom Schema and component resolver globally** at init time by using the `richText` init option:
469
+
470
+ ```js
471
+ import { RichTextSchema, StoryblokVue } from "@storyblok/vue";
472
+ import cloneDeep from "clone-deep";
473
+
474
+ const mySchema = cloneDeep(RichTextSchema); // you can make a copy of the default RichTextSchema
475
+ // ... and edit the nodes and marks, or add your own.
476
+ // Check the base RichTextSchema source here https://github.com/storyblok/storyblok-js-client/blob/master/source/schema.js
477
+
478
+ app.use(StoryblokVue, {
479
+ accessToken: "YOUR_ACCESS_TOKEN",
480
+ use: [apiPlugin],
481
+ richText: {
482
+ schema: mySchema,
483
+ resolver: (component, blok) => {
484
+ switch (component) {
485
+ case "my-custom-component":
486
+ return `<div class="my-component-class">${blok.text}</div>`;
487
+ default:
488
+ return "Resolver not defined";
489
+ }
490
+ },
491
+ },
492
+ });
493
+ ```
494
+
495
+ You can also set a **custom Schema and component resolver only once** by passing the options as the second parameter to `renderRichText` function:
496
+
497
+ ```js
498
+ import { renderRichText } from "@storyblok/vue";
499
+
500
+ renderRichText(blok.richTextField, {
501
+ schema: mySchema,
502
+ resolver: (component, blok) => {
503
+ switch (component) {
504
+ case "my-custom-component":
505
+ return `<div class="my-component-class">${blok.text}</div>`;
506
+ break;
507
+ default:
508
+ return `Component ${component} not found`;
509
+ }
510
+ },
511
+ });
512
+ ```
513
+
498
514
  ## Compatibility
499
515
 
500
516
  This plugin is for Vue 3. Thus, it supports the [same browsers as Vue 3](https://github.com/vuejs/rfcs/blob/master/active-rfcs/0038-vue3-ie11-support.md). In short: all modern browsers, dropping IE support.
@@ -1,14 +1,20 @@
1
- import { defineComponent as r, openBlock as p, createElementBlock as a, createElementVNode as n, createTextVNode as c, toDisplayString as m } from "vue";
2
- const _ = { class: "fallback-component" }, d = { class: "component" }, f = /* @__PURE__ */ r({
1
+ /**
2
+ * name: @storyblok/vue
3
+ * (c) 2024
4
+ * description: SDK to integrate Storyblok into your project using Vue.
5
+ * author: Storyblok
6
+ */
7
+ import { defineComponent as r, openBlock as p, createElementBlock as a, createElementVNode as n, createTextVNode as c, toDisplayString as d } from "vue";
8
+ const m = { class: "fallback-component" }, _ = { class: "component" }, f = /* @__PURE__ */ r({
3
9
  __name: "FallbackComponent",
4
10
  props: {
5
11
  blok: {}
6
12
  },
7
13
  setup(t) {
8
- return (e, o) => (p(), a("div", _, [
14
+ return (e, o) => (p(), a("div", m, [
9
15
  n("p", null, [
10
16
  o[0] || (o[0] = c(" Component could not be found for blok ")),
11
- n("span", d, m(e.blok.component), 1),
17
+ n("span", _, d(e.blok.component), 1),
12
18
  o[1] || (o[1] = c("! Is it configured correctly? "))
13
19
  ])
14
20
  ]));
@@ -18,7 +24,7 @@ const _ = { class: "fallback-component" }, d = { class: "component" }, f = /* @_
18
24
  for (const [s, l] of e)
19
25
  o[s] = l;
20
26
  return o;
21
- }, u = /* @__PURE__ */ i(f, [["__scopeId", "data-v-93c770c0"]]);
27
+ }, u = /* @__PURE__ */ i(f, [["__scopeId", "data-v-9abcd1f2"]]);
22
28
  export {
23
29
  u as default
24
30
  };
@@ -0,0 +1,6 @@
1
+ import { SbBlokData } from '../types';
2
+ export interface SbComponentProps {
3
+ blok: SbBlokData;
4
+ }
5
+ declare const _default: import('vue').DefineComponent<SbComponentProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<SbComponentProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
6
+ export default _default;
@@ -0,0 +1,5 @@
1
+ import { SbComponentProps } from '../types';
2
+ declare const _default: import('vue').DefineComponent<SbComponentProps, {
3
+ value: import('vue').Ref<any, any>;
4
+ }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<SbComponentProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
5
+ export default _default;
@@ -1,12 +1,3 @@
1
- import type { StoryblokRichTextProps } from "../types";
2
- declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<StoryblokRichTextProps>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<StoryblokRichTextProps>>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
1
+ import { StoryblokRichTextProps } from '../types';
2
+ declare const _default: import('vue').DefineComponent<StoryblokRichTextProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<StoryblokRichTextProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
3
3
  export default _default;
4
- type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
5
- type __VLS_TypePropsToRuntimeProps<T> = {
6
- [K in keyof T]-?: {} extends Pick<T, K> ? {
7
- type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
8
- } : {
9
- type: import('vue').PropType<T[K]>;
10
- required: true;
11
- };
12
- };
@@ -1,9 +1,9 @@
1
- import type { VNode } from "vue";
2
- import type { StoryblokRichTextNode, StoryblokRichTextOptions } from "@storyblok/js";
1
+ import { VNode } from 'vue';
2
+ import { StoryblokRichTextNode, StoryblokRichTextOptions } from '@storyblok/js';
3
3
  export declare function useStoryblokRichText(options: StoryblokRichTextOptions<VNode>): {
4
- render: (node: StoryblokRichTextNode<VNode<import("vue").RendererNode, import("vue").RendererElement, {
4
+ render: (node: StoryblokRichTextNode<VNode<import('vue').RendererNode, import('vue').RendererElement, {
5
5
  [key: string]: any;
6
- }>>) => VNode<import("vue").RendererNode, import("vue").RendererElement, {
6
+ }>>) => VNode<import('vue').RendererNode, import('vue').RendererElement, {
7
7
  [key: string]: any;
8
8
  }>;
9
9
  };
package/dist/index.d.ts CHANGED
@@ -1,14 +1,14 @@
1
- import type { Ref, Plugin } from "vue";
2
- import type { StoryblokClient, StoryblokBridgeConfigV2, ISbStoryData, ISbStoriesParams } from "./types";
3
- export { useStoryblokBridge, apiPlugin, renderRichText, RichTextSchema, RichTextResolver, BlockTypes, MarkTypes, richTextResolver, TextTypes, type StoryblokRichTextOptions, type StoryblokRichTextDocumentNode, type StoryblokRichTextNodeTypes, type StoryblokRichTextNode, type StoryblokRichTextResolvers, type StoryblokRichTextNodeResolver, type StoryblokRichTextImageOptimizationOptions, } from "@storyblok/js";
4
- export { default as StoryblokComponent } from "./StoryblokComponent.vue";
5
- export { default as StoryblokRichText } from "./components/StoryblokRichText.vue";
6
- export * from "./composables/useStoryblokRichText";
1
+ import { Plugin, Ref } from 'vue';
2
+ import { ISbStoriesParams, ISbStoryData, StoryblokBridgeConfigV2, StoryblokClient } from './types';
3
+ export { default as StoryblokComponent } from './components/StoryblokComponent.vue';
4
+ export { default as StoryblokRichText } from './components/StoryblokRichText.vue';
5
+ export * from './composables/useStoryblokRichText';
6
+ export * from './types';
7
+ export { apiPlugin, BlockTypes, MarkTypes, renderRichText, RichTextResolver, richTextResolver, RichTextSchema, type StoryblokRichTextDocumentNode, type StoryblokRichTextImageOptimizationOptions, type StoryblokRichTextNode, type StoryblokRichTextNodeResolver, type StoryblokRichTextNodeTypes, type StoryblokRichTextOptions, type StoryblokRichTextResolvers, TextTypes, useStoryblokBridge, } from '@storyblok/js';
7
8
  export declare const useStoryblokApi: () => StoryblokClient;
8
- export declare const useStoryblok: (url: string, apiOptions?: ISbStoriesParams, bridgeOptions?: StoryblokBridgeConfigV2) => Promise<Ref<ISbStoryData<import("@storyblok/js").StoryblokComponentType<string> & {
9
+ export declare const useStoryblok: (url: string, apiOptions?: ISbStoriesParams, bridgeOptions?: StoryblokBridgeConfigV2) => Promise<Ref<ISbStoryData<import('@storyblok/js').StoryblokComponentType<string> & {
9
10
  [index: string]: any;
10
- }>, ISbStoryData<import("@storyblok/js").StoryblokComponentType<string> & {
11
+ }> | null, ISbStoryData<import('@storyblok/js').StoryblokComponentType<string> & {
11
12
  [index: string]: any;
12
- }>>>;
13
+ }> | null>>;
13
14
  export declare const StoryblokVue: Plugin;
14
- export * from "./types";
@@ -1,3 +1,9 @@
1
+ /**
2
+ * name: @storyblok/vue
3
+ * (c) 2024
4
+ * description: SDK to integrate Storyblok into your project using Vue.
5
+ * author: Storyblok
6
+ */
1
7
  (function(b,p){typeof exports=="object"&&typeof module<"u"?p(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],p):(b=typeof globalThis<"u"?globalThis:b||self,p(b.storyblokVue={},b.Vue))})(this,function(b,p){"use strict";let z=!1;const B=[],te=r=>new Promise((e,t)=>{if(typeof window>"u"||(window.storyblokRegisterEvent=o=>{if(window.location===window.parent.location){console.warn("You are not in Draft Mode or in the Visual Editor.");return}z?o():B.push(o)},document.getElementById("storyblok-javascript-bridge")))return;const s=document.createElement("script");s.async=!0,s.src=r,s.id="storyblok-javascript-bridge",s.onerror=o=>t(o),s.onload=o=>{B.forEach(n=>n()),z=!0,e(o)},document.getElementsByTagName("head")[0].appendChild(s)});var re=Object.defineProperty,se=(r,e,t)=>e in r?re(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,g=(r,e,t)=>se(r,typeof e!="symbol"?e+"":e,t);class oe extends Error{constructor(e){super(e),this.name="AbortError"}}function ne(r,e,t){if(!Number.isFinite(e))throw new TypeError("Expected `limit` to be a finite number");if(!Number.isFinite(t))throw new TypeError("Expected `interval` to be a finite number");const s=[];let o=[],n=0,i=!1;const a=async()=>{n++;const h=s.shift();if(h)try{const d=await r(...h.args);h.resolve(d)}catch(d){h.reject(d)}const u=setTimeout(()=>{n--,s.length>0&&a(),o=o.filter(d=>d!==u)},t);o.includes(u)||o.push(u)},l=(...h)=>i?Promise.reject(new Error("Throttled function is already aborted and not accepting new promises")):new Promise((u,d)=>{s.push({resolve:u,reject:d,args:h}),n<e&&a()});return l.abort=()=>{i=!0,o.forEach(clearTimeout),o=[],s.forEach(h=>h.reject(()=>new oe("Throttle function aborted"))),s.length=0},l}let A=class{constructor(){g(this,"isCDNUrl",(r="")=>r.includes("/cdn/")),g(this,"getOptionsPage",(r,e=25,t=1)=>({...r,per_page:e,page:t})),g(this,"delay",r=>new Promise(e=>setTimeout(e,r))),g(this,"arrayFrom",(r=0,e)=>Array.from({length:r},e)),g(this,"range",(r=0,e=r)=>{const t=Math.abs(e-r)||0,s=r<e?1:-1;return this.arrayFrom(t,(o,n)=>n*s+r)}),g(this,"asyncMap",async(r,e)=>Promise.all(r.map(e))),g(this,"flatMap",(r=[],e)=>r.map(e).reduce((t,s)=>[...t,...s],[])),g(this,"escapeHTML",function(r){const e={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"},t=/[&<>"']/g,s=new RegExp(t.source);return r&&s.test(r)?r.replace(t,o=>e[o]):r})}stringify(r,e,t){const s=[];for(const o in r){if(!Object.prototype.hasOwnProperty.call(r,o))continue;const n=r[o],i=t?"":encodeURIComponent(o);let a;typeof n=="object"?a=this.stringify(n,e?e+encodeURIComponent(`[${i}]`):i,Array.isArray(n)):a=`${e?e+encodeURIComponent(`[${i}]`):i}=${encodeURIComponent(n)}`,s.push(a)}return s.join("&")}getRegionURL(r){const e="api.storyblok.com",t="api-us.storyblok.com",s="app.storyblokchina.cn",o="api-ap.storyblok.com",n="api-ca.storyblok.com";switch(r){case"us":return t;case"cn":return s;case"ap":return o;case"ca":return n;default:return e}}};const ie=function(r,e){const t={};for(const s in r){const o=r[s];e.includes(s)&&o!==null&&(t[s]=o)}return t},ae=r=>r==="email",le=()=>({singleTag:"hr"}),ce=()=>({tag:"blockquote"}),he=()=>({tag:"ul"}),ue=r=>({tag:["pre",{tag:"code",attrs:r.attrs}]}),de=()=>({singleTag:"br"}),pe=r=>({tag:`h${r.attrs.level}`}),ge=r=>({singleTag:[{tag:"img",attrs:ie(r.attrs,["src","alt","title"])}]}),me=()=>({tag:"li"}),fe=()=>({tag:"ol"}),ye=()=>({tag:"p"}),be=r=>({tag:[{tag:"span",attrs:{"data-type":"emoji","data-name":r.attrs.name,emoji:r.attrs.emoji}}]}),ke=()=>({tag:"b"}),ve=()=>({tag:"s"}),$e=()=>({tag:"u"}),Te=()=>({tag:"strong"}),we=()=>({tag:"code"}),Re=()=>({tag:"i"}),_e=r=>{if(!r.attrs)return{tag:""};const e=new A().escapeHTML,t={...r.attrs},{linktype:s="url"}=r.attrs;if(delete t.linktype,t.href&&(t.href=e(r.attrs.href||"")),ae(s)&&(t.href=`mailto:${t.href}`),t.anchor&&(t.href=`${t.href}#${t.anchor}`,delete t.anchor),t.custom){for(const o in t.custom)t[o]=t.custom[o];delete t.custom}return{tag:[{tag:"a",attrs:t}]}},Se=r=>({tag:[{tag:"span",attrs:r.attrs}]}),Ee=()=>({tag:"sub"}),je=()=>({tag:"sup"}),Ce=r=>({tag:[{tag:"span",attrs:r.attrs}]}),Ie=r=>{var e;return(e=r.attrs)!=null&&e.color?{tag:[{tag:"span",attrs:{style:`background-color:${r.attrs.color};`}}]}:{tag:""}},Oe=r=>{var e;return(e=r.attrs)!=null&&e.color?{tag:[{tag:"span",attrs:{style:`color:${r.attrs.color}`}}]}:{tag:""}},F={nodes:{horizontal_rule:le,blockquote:ce,bullet_list:he,code_block:ue,hard_break:de,heading:pe,image:ge,list_item:me,ordered_list:fe,paragraph:ye,emoji:be},marks:{bold:ke,strike:ve,underline:$e,strong:Te,code:we,italic:Re,link:_e,styled:Se,subscript:Ee,superscript:je,anchor:Ce,highlight:Ie,textStyle:Oe}},xe=function(r){const e={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"},t=/[&<>"']/g,s=new RegExp(t.source);return r&&s.test(r)?r.replace(t,o=>e[o]):r};let V=!1;class Ae{constructor(e){g(this,"marks"),g(this,"nodes"),e||(e=F),this.marks=e.marks||[],this.nodes=e.nodes||[]}addNode(e,t){this.nodes[e]=t}addMark(e,t){this.marks[e]=t}render(e,t={optimizeImages:!1},s=!0){if(!V&&s&&(console.warn("Warning ⚠️: The RichTextResolver class is deprecated and will be removed in the next major release. Please use the `@storyblok/richtext` package instead. https://github.com/storyblok/richtext/"),V=!0),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.
2
8
  The "content" field must be an array of nodes as the type ISbRichtext.
3
9
  ISbRichtext:
@@ -21,5 +27,5 @@
21
27
  }
22
28
  ],
23
29
  type: 'doc'
24
- }`),""}optimizeImages(e,t){let s=0,o=0,n="",i="";typeof t!="boolean"&&(typeof t.width=="number"&&t.width>0&&(n+=`width="${t.width}" `,s=t.width),typeof t.height=="number"&&t.height>0&&(n+=`height="${t.height}" `,o=t.height),(t.loading==="lazy"||t.loading==="eager")&&(n+=`loading="${t.loading}" `),typeof t.class=="string"&&t.class.length>0&&(n+=`class="${t.class}" `),t.filters&&(typeof t.filters.blur=="number"&&t.filters.blur>=0&&t.filters.blur<=100&&(i+=`:blur(${t.filters.blur})`),typeof t.filters.brightness=="number"&&t.filters.brightness>=-100&&t.filters.brightness<=100&&(i+=`:brightness(${t.filters.brightness})`),t.filters.fill&&(t.filters.fill.match(/[0-9A-F]{6}/gi)||t.filters.fill==="transparent")&&(i+=`:fill(${t.filters.fill})`),t.filters.format&&["webp","png","jpeg"].includes(t.filters.format)&&(i+=`:format(${t.filters.format})`),typeof t.filters.grayscale=="boolean"&&t.filters.grayscale&&(i+=":grayscale()"),typeof t.filters.quality=="number"&&t.filters.quality>=0&&t.filters.quality<=100&&(i+=`:quality(${t.filters.quality})`),t.filters.rotate&&[90,180,270].includes(t.filters.rotate)&&(i+=`:rotate(${t.filters.rotate})`),i.length>0&&(i=`/filters${i}`))),n.length>0&&(e=e.replace(/<img/g,`<img ${n.trim()}`));const a=s>0||o>0||i.length>0?`${s}x${o}${i}`:"";return e=e.replace(/a.storyblok.com\/f\/(\d+)\/([^.]+)\.(gif|jpg|jpeg|png|tif|bmp)/g,`a.storyblok.com/f/$1/$2.$3/m/${a}`),typeof t!="boolean"&&(t.sizes||t.srcset)&&(e=e.replace(/<img.*?src=["|'](.*?)["|']/g,l=>{var h,u;const d=l.match(/a.storyblok.com\/f\/(\d+)\/([^.]+)\.(gif|jpg|jpeg|png|tif|bmp)/g);if(d&&d.length>0){const m={srcset:(h=t.srcset)==null?void 0:h.map(v=>{if(typeof v=="number")return`//${d}/m/${v}x0${i} ${v}w`;if(typeof v=="object"&&v.length===2){let _=0,L=0;return typeof v[0]=="number"&&(_=v[0]),typeof v[1]=="number"&&(L=v[1]),`//${d}/m/${_}x${L}${i} ${_}w`}return""}).join(", "),sizes:(u=t.sizes)==null?void 0:u.map(v=>v).join(", ")};let S="";return m.srcset&&(S+=`srcset="${m.srcset}" `),m.sizes&&(S+=`sizes="${m.sizes}" `),l.replace(/<img/g,`<img ${S.trim()}`)}return l})),e}renderNode(e){const t=[];e.marks&&e.marks.forEach(o=>{const n=this.getMatchingMark(o);n&&n.tag!==""&&t.push(this.renderOpeningTag(n.tag))});const s=this.getMatchingNode(e);return s&&s.tag&&t.push(this.renderOpeningTag(s.tag)),e.content?e.content.forEach(o=>{t.push(this.renderNode(o))}):e.text?t.push(xe(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(o=>{const n=this.getMatchingMark(o);n&&n.tag!==""&&t.push(this.renderClosingTag(n.tag))}),t.join("")}renderTag(e,t){return e.constructor===String?`<${e}${t}>`:e.map(s=>{if(s.constructor===String)return`<${s}${t}>`;{let o=`<${s.tag}`;if(s.attrs){for(const n in s.attrs)if(Object.prototype.hasOwnProperty.call(s.attrs,n)){const i=s.attrs[n];i!==null&&(o+=` ${n}="${i}"`)}}return`${o}${t}>`}}).join("")}renderOpeningTag(e){return this.renderTag(e,"")}renderClosingTag(e){return e.constructor===String?`</${e}>`:e.slice(0).reverse().map(t=>t.constructor===String?`</${t}>`:`</${t.tag}>`).join("")}getMatchingNode(e){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 I=Ae;class Pe{constructor(e){g(this,"baseURL"),g(this,"timeout"),g(this,"headers"),g(this,"responseInterceptor"),g(this,"fetch"),g(this,"ejectInterceptor"),g(this,"url"),g(this,"parameters"),g(this,"fetchOptions"),this.baseURL=e.baseURL,this.headers=e.headers||new Headers,this.timeout=e!=null&&e.timeout?e.timeout*1e3:0,this.responseInterceptor=e.responseInterceptor,this.fetch=(...t)=>e.fetch?e.fetch(...t):fetch(...t),this.ejectInterceptor=!1,this.url="",this.parameters={},this.fetchOptions={}}get(e,t){return this.url=e,this.parameters=t,this._methodHandler("get")}post(e,t){return this.url=e,this.parameters=t,this._methodHandler("post")}put(e,t){return this.url=e,this.parameters=t,this._methodHandler("put")}delete(e,t){return this.url=e,this.parameters=t,this._methodHandler("delete")}async _responseHandler(e){const t=[],s={data:{},headers:{},status:0,statusText:""};e.status!==204&&await e.json().then(o=>{s.data=o});for(const o of e.headers.entries())t[o[0]]=o[1];return s.headers={...t},s.status=e.status,s.statusText=e.statusText,s}async _methodHandler(e){let t=`${this.baseURL}${this.url}`,s=null;if(e==="get"){const l=new A;t=`${this.baseURL}${this.url}?${l.stringify(this.parameters)}`}else s=JSON.stringify(this.parameters);const o=new URL(t),n=new AbortController,{signal:i}=n;let a;this.timeout&&(a=setTimeout(()=>n.abort(),this.timeout));try{const l=await this.fetch(`${o}`,{method:e,headers:this.headers,body:s,signal:i,...this.fetchOptions});this.timeout&&clearTimeout(a);const h=await this._responseHandler(l);return this.responseInterceptor&&!this.ejectInterceptor?this._statusHandler(this.responseInterceptor(h)):this._statusHandler(h)}catch(l){return{message:l}}}setFetchOptions(e={}){Object.keys(e).length>0&&"method"in e&&delete e.method,this.fetchOptions={...e}}eject(){this.ejectInterceptor=!0}_statusHandler(e){const t=/20[0-6]/g;return new Promise((s,o)=>{if(t.test(`${e.status}`))return s(e);const n={message:e.statusText,status:e.status,response:Array.isArray(e.data)?e.data[0]:e.data.error||e.data.slug};o(n)})}}const Le=Pe,q="SB-Agent",N={defaultAgentName:"SB-JS-CLIENT",defaultAgentVersion:"SB-Agent-Version",packageVersion:"6.0.0"};let P={};const E={};class Ne{constructor(e,t){g(this,"client"),g(this,"maxRetries"),g(this,"retriesDelay"),g(this,"throttle"),g(this,"accessToken"),g(this,"cache"),g(this,"helpers"),g(this,"resolveCounter"),g(this,"relations"),g(this,"links"),g(this,"richTextResolver"),g(this,"resolveNestedRelations"),g(this,"stringifiedStoriesCache");let s=e.endpoint||t;if(!s){const i=new A().getRegionURL,a=e.https===!1?"http":"https";e.oauthToken?s=`${a}://${i(e.region)}/v1`:s=`${a}://${i(e.region)}/v2`}const o=new Headers;o.set("Content-Type","application/json"),o.set("Accept","application/json"),e.headers&&(e.headers.constructor.name==="Headers"?e.headers.entries().toArray():Object.entries(e.headers)).forEach(([i,a])=>{o.set(i,a)}),o.has(q)||(o.set(q,N.defaultAgentName),o.set(N.defaultAgentVersion,N.packageVersion));let n=5;e.oauthToken&&(o.set("Authorization",e.oauthToken),n=3),e.rateLimit&&(n=e.rateLimit),e.richTextSchema?this.richTextResolver=new I(e.richTextSchema):this.richTextResolver=new I,e.componentResolver&&this.setComponentResolver(e.componentResolver),this.maxRetries=e.maxRetries||10,this.retriesDelay=300,this.throttle=ne(this.throttledRequest.bind(this),n,1e3),this.accessToken=e.accessToken||"",this.relations={},this.links={},this.cache=e.cache||{clear:"manual"},this.helpers=new A,this.resolveCounter=0,this.resolveNestedRelations=e.resolveNestedRelations||!0,this.stringifiedStoriesCache={},this.client=new Le({baseURL:s,timeout:e.timeout||0,headers:o,responseInterceptor:e.responseInterceptor,fetch:e.fetch})}setComponentResolver(e){this.richTextResolver.addNode("blok",t=>{let s="";return t.attrs.body&&t.attrs.body.forEach(o=>{s+=e(o.component,o)}),{html:s}})}parseParams(e){return e.token||(e.token=this.getToken()),e.cv||(e.cv=E[e.token]),Array.isArray(e.resolve_relations)&&(e.resolve_relations=e.resolve_relations.join(",")),typeof e.resolve_relations<"u"&&(e.resolve_level=2),e}factoryParamOptions(e,t){return this.helpers.isCDNUrl(e)?this.parseParams(t):t}makeRequest(e,t,s,o,n){const i=this.factoryParamOptions(e,this.helpers.getOptionsPage(t,s,o));return this.cacheResponse(e,i,void 0,n)}get(e,t,s){t||(t={});const o=`/${e}`,n=this.factoryParamOptions(o,t);return this.cacheResponse(o,n,void 0,s)}async getAll(e,t,s,o){const n=(t==null?void 0:t.per_page)||25,i=`/${e}`.replace(/\/$/,""),a=s??i.substring(i.lastIndexOf("/")+1),l=1,h=await this.makeRequest(i,t,n,l,o),u=h.total?Math.ceil(h.total/n):1,d=await this.helpers.asyncMap(this.helpers.range(l,u),m=>this.makeRequest(i,t,n,m+1,o));return this.helpers.flatMap([h,...d],m=>Object.values(m.data[a]))}post(e,t,s){const o=`/${e}`;return Promise.resolve(this.throttle("post",o,t,s))}put(e,t,s){const o=`/${e}`;return Promise.resolve(this.throttle("put",o,t,s))}delete(e,t,s){const o=`/${e}`;return Promise.resolve(this.throttle("delete",o,t,s))}getStories(e,t){return this._addResolveLevel(e),this.get("cdn/stories",e,t)}getStory(e,t,s){return this._addResolveLevel(t),this.get(`cdn/stories/${e}`,t,s)}getToken(){return this.accessToken}ejectInterceptor(){this.client.eject()}_addResolveLevel(e){typeof e.resolve_relations<"u"&&(e.resolve_level=2)}_cleanCopy(e){return JSON.parse(JSON.stringify(e))}_insertLinks(e,t,s){const o=e[t];o&&o.fieldtype==="multilink"&&o.linktype==="story"&&typeof o.id=="string"&&this.links[s][o.id]?o.story=this._cleanCopy(this.links[s][o.id]):o&&o.linktype==="story"&&typeof o.uuid=="string"&&this.links[s][o.uuid]&&(o.story=this._cleanCopy(this.links[s][o.uuid]))}getStoryReference(e,t){return this.relations[e][t]?(this.stringifiedStoriesCache[t]||(this.stringifiedStoriesCache[t]=JSON.stringify(this.relations[e][t])),JSON.parse(this.stringifiedStoriesCache[t])):t}_insertRelations(e,t,s,o){s.includes(`${e.component}.${t}`)&&(typeof e[t]=="string"?e[t]=this.getStoryReference(o,e[t]):Array.isArray(e[t])&&(e[t]=e[t].map(n=>this.getStoryReference(o,n)).filter(Boolean)))}iterateTree(e,t,s){const o=n=>{if(n!=null){if(n.constructor===Array)for(let i=0;i<n.length;i++)o(n[i]);else if(n.constructor===Object){if(n._stopResolving)return;for(const i in n)(n.component&&n._uid||n.type==="link")&&(this._insertRelations(n,i,t,s),this._insertLinks(n,i,s)),o(n[i])}}};o(e.content)}async resolveLinks(e,t,s){let o=[];if(e.link_uuids){const n=e.link_uuids.length,i=[],a=50;for(let l=0;l<n;l+=a){const h=Math.min(n,l+a);i.push(e.link_uuids.slice(l,h))}for(let l=0;l<i.length;l++)(await this.getStories({per_page:a,language:t.language,version:t.version,by_uuids:i[l].join(",")})).data.stories.forEach(h=>{o.push(h)})}else o=e.links;o.forEach(n=>{this.links[s][n.uuid]={...n,_stopResolving:!0}})}async resolveRelations(e,t,s){let o=[];if(e.rel_uuids){const n=e.rel_uuids.length,i=[],a=50;for(let l=0;l<n;l+=a){const h=Math.min(n,l+a);i.push(e.rel_uuids.slice(l,h))}for(let l=0;l<i.length;l++)(await this.getStories({per_page:a,language:t.language,version:t.version,by_uuids:i[l].join(","),excluding_fields:t.excluding_fields})).data.stories.forEach(h=>{o.push(h)})}else o=e.rels;o&&o.length>0&&o.forEach(n=>{this.relations[s][n.uuid]={...n,_stopResolving:!0}})}async resolveStories(e,t,s){var o,n;let i=[];if(this.links[s]={},this.relations[s]={},typeof t.resolve_relations<"u"&&t.resolve_relations.length>0&&(typeof t.resolve_relations=="string"&&(i=t.resolve_relations.split(",")),await this.resolveRelations(e,t,s)),t.resolve_links&&["1","story","url","link"].includes(t.resolve_links)&&((o=e.links)!=null&&o.length||(n=e.link_uuids)!=null&&n.length)&&await this.resolveLinks(e,t,s),this.resolveNestedRelations)for(const a in this.relations[s])this.iterateTree(this.relations[s][a],i,s);e.story?this.iterateTree(e.story,i,s):e.stories.forEach(a=>{this.iterateTree(a,i,s)}),this.stringifiedStoriesCache={},delete this.links[s],delete this.relations[s]}async cacheResponse(e,t,s,o){const n=this.helpers.stringify({url:e,params:t}),i=this.cacheProvider();if(this.cache.clear==="auto"&&t.version==="draft"&&await this.flushCache(),t.version==="published"&&e!=="/cdn/spaces/me"){const a=await i.get(n);if(a)return Promise.resolve(a)}return new Promise(async(a,l)=>{var h;try{const u=await this.throttle("get",e,t,o);if(u.status!==200)return l(u);let d={data:u.data,headers:u.headers};if((h=u.headers)!=null&&h["per-page"]&&(d=Object.assign({},d,{perPage:u.headers["per-page"]?Number.parseInt(u.headers["per-page"]):0,total:u.headers["per-page"]?Number.parseInt(u.headers.total):0})),d.data.story||d.data.stories){const m=this.resolveCounter=++this.resolveCounter%1e3;await this.resolveStories(d.data,t,`${m}`)}return t.version==="published"&&e!=="/cdn/spaces/me"&&await i.set(n,d),d.data.cv&&t.token&&E[t.token]!==d.data.cv&&(await this.flushCache(),E[t.token]=d.data.cv),a(d)}catch(u){if(u.response&&u.status===429&&(s=typeof s>"u"?0:s+1,s<this.maxRetries))return console.log(`Hit rate limit. Retrying in ${this.retriesDelay/1e3} seconds.`),await this.helpers.delay(this.retriesDelay),this.cacheResponse(e,t,s).then(a).catch(l);l(u)}})}throttledRequest(e,t,s,o){return this.client.setFetchOptions(o),this.client[e](t,s)}cacheVersions(){return E}cacheVersion(){return E[this.accessToken]}setCacheVersion(e){this.accessToken&&(E[this.accessToken]=e)}clearCacheVersion(){this.accessToken&&(E[this.accessToken]=0)}cacheProvider(){switch(this.cache.type){case"memory":return{get(e){return Promise.resolve(P[e])},getAll(){return Promise.resolve(P)},set(e,t){return P[e]=t,Promise.resolve(void 0)},flush(){return P={},Promise.resolve(void 0)}};case"custom":if(this.cache.custom)return this.cache.custom;default:return{get(){return Promise.resolve()},getAll(){return Promise.resolve(void 0)},set(){return Promise.resolve(void 0)},flush(){return Promise.resolve(void 0)}}}}async flushCache(){return await this.cacheProvider().flush(),this.clearCacheVersion(),this}}const Me=(r={})=>{const{apiOptions:e}=r;if(!e.accessToken){console.error("You need to provide an access token to interact with Storyblok API. Read https://www.storyblok.com/docs/api/content-delivery#topics/authentication");return}return{storyblokApi:new Ne(e)}},De=r=>{if(typeof r!="object"||typeof r._editable>"u")return{};try{const e=JSON.parse(r._editable.replace(/^<!--#storyblok#/,"").replace(/-->$/,""));return e?{"data-blok-c":JSON.stringify(e),"data-blok-uid":e.id+"-"+e.uid}:{}}catch{return{}}};function He(r,e){if(!e)return{src:r,attrs:{}};let t=0,s=0;const o={},n=[];function i(l,h,u,d,m){typeof l!="number"||l<=h||l>=u?console.warn(`[StoryblokRichText] - ${d.charAt(0).toUpperCase()+d.slice(1)} value must be a number between ${h} and ${u} (inclusive)`):m.push(`${d}(${l})`)}if(typeof e=="object"){if(typeof e.width=="number"&&e.width>0?(o.width=e.width,t=e.width):console.warn("[StoryblokRichText] - Width value must be a number greater than 0"),e.height&&typeof e.height=="number"&&e.height>0?(o.height=e.height,s=e.height):console.warn("[StoryblokRichText] - Height value must be a number greater than 0"),e.loading&&["lazy","eager"].includes(e.loading)&&(o.loading=e.loading),e.class&&(o.class=e.class),e.filters){const{filters:l}=e||{},{blur:h,brightness:u,fill:d,format:m,grayscale:S,quality:v,rotate:_}=l||{};h&&i(h,0,100,"blur",n),v&&i(v,0,100,"quality",n),u&&i(u,0,100,"brightness",n),d&&n.push(`fill(${d})`),S&&n.push("grayscale()"),_&&[0,90,180,270].includes(e.filters.rotate||0)&&n.push(`rotate(${_})`),m&&["webp","png","jpeg"].includes(m)&&n.push(`format(${m})`)}e.srcset&&(o.srcset=e.srcset.map(l=>{if(typeof l=="number")return`${r}/m/${l}x0/${n.length>0?`filters:${n.join(":")}`:""} ${l}w`;if(Array.isArray(l)&&l.length===2){const[h,u]=l;return`${r}/m/${h}x${u}/${n.length>0?`filters:${n.join(":")}`:""} ${h}w`}else{console.warn("[StoryblokRichText] - srcset entry must be a number or a tuple of two numbers");return}}).join(", ")),e.sizes&&(o.sizes=e.sizes.join(", "))}let a=`${r}/m/`;return t>0&&s>0&&(a=`${a}${t}x${s}/`),n.length>0&&(a=`${a}filters:${n.join(":")}`),{src:a,attrs:o}}var k=(r=>(r.DOCUMENT="doc",r.HEADING="heading",r.PARAGRAPH="paragraph",r.QUOTE="blockquote",r.OL_LIST="ordered_list",r.UL_LIST="bullet_list",r.LIST_ITEM="list_item",r.CODE_BLOCK="code_block",r.HR="horizontal_rule",r.BR="hard_break",r.IMAGE="image",r.EMOJI="emoji",r.COMPONENT="blok",r))(k||{}),T=(r=>(r.BOLD="bold",r.STRONG="strong",r.STRIKE="strike",r.UNDERLINE="underline",r.ITALIC="italic",r.CODE="code",r.LINK="link",r.ANCHOR="anchor",r.STYLED="styled",r.SUPERSCRIPT="superscript",r.SUBSCRIPT="subscript",r.TEXT_STYLE="textStyle",r.HIGHLIGHT="highlight",r))(T||{}),M=(r=>(r.TEXT="text",r))(M||{}),O=(r=>(r.URL="url",r.STORY="story",r.ASSET="asset",r.EMAIL="email",r))(O||{});const Ue=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],ze=(r={})=>Object.keys(r).map(e=>`${e}="${r[e]}"`).join(" "),Be=(r={})=>Object.keys(r).map(e=>`${e}: ${r[e]}`).join("; ");function Fe(r){return r.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#039;")}const G=r=>Object.fromEntries(Object.entries(r).filter(([e,t])=>t!==void 0));function Ve(r,e={},t){const s=ze(e),o=s?`${r} ${s}`:r;return Ue.includes(r)?`<${o}>`:`<${o}>${Array.isArray(t)?t.join(""):t||""}</${r}>`}function K(r={}){let e=0;const{renderFn:t=Ve,textFn:s=Fe,resolvers:o={},optimizeImages:n=!1,keyedResolvers:i=!1}=r,a=c=>f=>{const y=f.attrs||{};return i&&(y.key=`${c}-${e}`),t(c,y,f.children||null)},l=c=>{const{src:f,alt:y,title:$,srcset:R,sizes:w}=c.attrs||{};let j=f,C={};if(n){const{src:ot,attrs:nt}=He(f,n);j=ot,C=nt}i&&(C={...C,key:`img-${e}`});const st={src:j,alt:y,title:$,srcset:R,sizes:w,...C};return t("img",G(st))},h=c=>{const{level:f,...y}=c.attrs||{},$={...y};return i&&($.key=`h${f}-${e}`),t(`h${f}`,$,c.children)},u=c=>{var f,y,$,R;const w=t("img",{src:(f=c.attrs)==null?void 0:f.fallbackImage,alt:(y=c.attrs)==null?void 0:y.alt,style:"width: 1.25em; height: 1.25em; vertical-align: text-top",draggable:"false",loading:"lazy"}),j={"data-type":"emoji","data-name":($=c.attrs)==null?void 0:$.name,"data-emoji":(R=c.attrs)==null?void 0:R.emoji};return i&&(j.key=`emoji-${e}`),t("span",j,w)},d=c=>t("pre",{...c.attrs,key:`code-${e}`},t("code",{key:`code-${e}`},c.children||"")),m=(c,f=!1)=>({text:y,attrs:$})=>{const{class:R,id:w,...j}=$||{},C=f?{class:R,id:w,style:Be(j)||void 0}:$||{};return i&&(C.key=`${c}-${e}`),t(c,G(C),y)},S=c=>U(c),v=c=>{const{marks:f,...y}=c;return"text"in c?f?f.reduce(($,R)=>S({...R,text:$}),S({...y,children:y.children})):s(y.text):""},_=c=>{const{linktype:f,href:y,anchor:$,...R}=c.attrs||{};let w="";switch(f){case O.ASSET:case O.URL:w=y;break;case O.EMAIL:w=`mailto:${y}`;break;case O.STORY:w=y;break}return $&&(w=`${w}#${$}`),t("a",{...R,href:w,key:`a-${e}`},c.text)},L=c=>{var f,y;return console.warn("[StoryblokRichtText] - BLOK resolver is not available for vanilla usage"),t("span",{blok:(f=c==null?void 0:c.attrs)==null?void 0:f.body[0],id:(y=c.attrs)==null?void 0:y.id,key:`component-${e}`,style:"display: none"})},rt=new Map([[k.DOCUMENT,a("div")],[k.HEADING,h],[k.PARAGRAPH,a("p")],[k.UL_LIST,a("ul")],[k.OL_LIST,a("ol")],[k.LIST_ITEM,a("li")],[k.IMAGE,l],[k.EMOJI,u],[k.CODE_BLOCK,d],[k.HR,a("hr")],[k.BR,a("br")],[k.QUOTE,a("blockquote")],[k.COMPONENT,L],[M.TEXT,v],[T.LINK,_],[T.ANCHOR,_],[T.STYLED,m("span",!0)],[T.BOLD,m("strong")],[T.TEXT_STYLE,m("span",!0)],[T.ITALIC,m("em")],[T.UNDERLINE,m("u")],[T.STRIKE,m("s")],[T.CODE,m("code")],[T.SUPERSCRIPT,m("sup")],[T.SUBSCRIPT,m("sub")],[T.HIGHLIGHT,m("mark")],...Object.entries(o).map(([c,f])=>[c,f])]);function ee(c){e+=1;const f=rt.get(c.type);if(!f)return console.error("<Storyblok>",`No resolver found for node type ${c.type}`),"";if(c.type==="text")return f(c);const y=c.content?c.content.map(U):void 0;return f({...c,children:y})}function U(c){return Array.isArray(c)?c.map(ee):ee(c)}return{render:U}}let D,J="https://app.storyblok.com/f/storyblok-v2-latest.js";const Y=(r,e,t={})=>{var s;const o=!(typeof window>"u")&&typeof window.storyblokRegisterEvent<"u",n=+new URL((s=window.location)==null?void 0:s.href).searchParams.get("_storyblok")===r;if(!(!o||!n)){if(!r){console.warn("Story ID is not defined. Please provide a valid ID.");return}window.storyblokRegisterEvent(()=>{new window.StoryblokBridge(t).on(["input","published","change"],i=>{i.action==="input"&&i.story.id===r?e(i.story):(i.action==="change"||i.action==="published")&&i.storyId===r&&window.location.reload()})})}},qe=(r={})=>{var e,t;const{bridge:s,accessToken:o,use:n=[],apiOptions:i={},richText:a={},bridgeUrl:l}=r;i.accessToken=i.accessToken||o;const h={bridge:s,apiOptions:i};let u={};n.forEach(m=>{u={...u,...m(h)}}),l&&(J=l);const d=!(typeof window>"u")&&((t=(e=window.location)==null?void 0:e.search)==null?void 0:t.includes("_storyblok_tk"));return s!==!1&&d&&te(J),D=new I(a.schema),a.resolver&&X(D,a.resolver),u},X=(r,e)=>{r.addNode("blok",t=>{let s="";return t.attrs.body.forEach(o=>{s+=e(o.component,o)}),{html:s}})},Ge=r=>!r||!(r!=null&&r.content.some(e=>e.content||e.type==="blok"||e.type==="horizontal_rule")),Ke=(r,e,t)=>{let s=t||D;if(!s){console.error("Please initialize the Storyblok SDK before calling the renderRichText function");return}return Ge(r)?"":(e&&(s=new I(e.schema),e.resolver&&X(s,e.resolver)),s.render(r,{},!1))},H=p.defineComponent({__name:"StoryblokComponent",props:{blok:{}},setup(r,{expose:e}){const t=r,s=p.ref();e({value:s});const o=typeof p.resolveDynamicComponent(t.blok.component)!="string",n=p.inject("VueSDKOptions"),i=p.ref(t.blok.component);return o||(n.enableFallbackComponent?(i.value=n.customFallbackComponent??"FallbackComponent",typeof p.resolveDynamicComponent(i.value)=="string"&&console.error(`Is the Fallback component "${i.value}" registered properly?`)):console.error(`Component could not be found for blok "${t.blok.component}"! Is it defined in main.ts as "app.component("${t.blok.component}", ${t.blok.component});"?`)),(a,l)=>(p.openBlock(),p.createBlock(p.resolveDynamicComponent(i.value),p.mergeProps({ref_key:"blokRef",ref:s},{...a.$props,...a.$attrs}),null,16))}}),Je=r=>{var e,t;return p.h(H,{blok:(e=r==null?void 0:r.attrs)==null?void 0:e.body[0],id:(t=r.attrs)==null?void 0:t.id},r.children)};function W(r){const e={renderFn:p.h,textFn:p.createTextVNode,keyedResolvers:!0,resolvers:{[k.COMPONENT]:Je,...r.resolvers}};return K(e)}const Q=p.defineComponent({__name:"StoryblokRichText",props:{doc:{},resolvers:{}},setup(r){const e=r,t=p.ref(),s=()=>t.value;return p.watch([e.doc,e.resolvers],([o,n])=>{const{render:i}=W({resolvers:n??{}});t.value=i(o)},{immediate:!0}),(o,n)=>(p.openBlock(),p.createBlock(s))}}),Ye={beforeMount(r,e){if(e.value){const t=De(e.value);Object.keys(t).length>0&&(r.setAttribute("data-blok-c",t["data-blok-c"]),r.setAttribute("data-blok-uid",t["data-blok-uid"]),r.classList.add("storyblok__outline"))}}},Z=r=>{console.error(`You can't use ${r} if you're not loading apiPlugin. Please provide it on StoryblokVue initialization.
25
- `)};let x=null;const Xe=()=>(x||Z("useStoryblokApi"),x),We=async(r,e={},t={})=>{const s=p.ref(null);if(t.resolveRelations=t.resolveRelations??e.resolve_relations,t.resolveLinks=t.resolveLinks??e.resolve_links,p.onMounted(()=>{s.value&&s.value.id&&Y(s.value.id,o=>s.value=o,t)}),x){const{data:o}=await x.get(`cdn/stories/${r}`,e);s.value=o.story}else Z("useStoryblok");return s},Qe={install(r,e={}){r.directive("editable",Ye),r.component("StoryblokComponent",H),r.component("StoryblokRichText",Q),e.enableFallbackComponent&&!e.customFallbackComponent&&r.component("FallbackComponent",p.defineAsyncComponent(()=>Promise.resolve().then(()=>tt)));const{storyblokApi:t}=qe(e);x=t,r.provide("VueSDKOptions",e)}},Ze={class:"fallback-component"},et={class:"component"},tt=Object.freeze(Object.defineProperty({__proto__:null,default:((r,e)=>{const t=r.__vccOpts||r;for(const[s,o]of e)t[s]=o;return t})(p.defineComponent({__name:"FallbackComponent",props:{blok:{}},setup(r){return(e,t)=>(p.openBlock(),p.createElementBlock("div",Ze,[p.createElementVNode("p",null,[t[0]||(t[0]=p.createTextVNode(" Component could not be found for blok ")),p.createElementVNode("span",et,p.toDisplayString(e.blok.component),1),t[1]||(t[1]=p.createTextVNode("! Is it configured correctly? "))])]))}}),[["__scopeId","data-v-93c770c0"]])},Symbol.toStringTag,{value:"Module"}));b.BlockTypes=k,b.MarkTypes=T,b.RichTextResolver=I,b.RichTextSchema=F,b.StoryblokComponent=H,b.StoryblokRichText=Q,b.StoryblokVue=Qe,b.TextTypes=M,b.apiPlugin=Me,b.renderRichText=Ke,b.richTextResolver=K,b.useStoryblok=We,b.useStoryblokApi=Xe,b.useStoryblokBridge=Y,b.useStoryblokRichText=W,Object.defineProperty(b,Symbol.toStringTag,{value:"Module"})});
30
+ }`),""}optimizeImages(e,t){let s=0,o=0,n="",i="";typeof t!="boolean"&&(typeof t.width=="number"&&t.width>0&&(n+=`width="${t.width}" `,s=t.width),typeof t.height=="number"&&t.height>0&&(n+=`height="${t.height}" `,o=t.height),(t.loading==="lazy"||t.loading==="eager")&&(n+=`loading="${t.loading}" `),typeof t.class=="string"&&t.class.length>0&&(n+=`class="${t.class}" `),t.filters&&(typeof t.filters.blur=="number"&&t.filters.blur>=0&&t.filters.blur<=100&&(i+=`:blur(${t.filters.blur})`),typeof t.filters.brightness=="number"&&t.filters.brightness>=-100&&t.filters.brightness<=100&&(i+=`:brightness(${t.filters.brightness})`),t.filters.fill&&(t.filters.fill.match(/[0-9A-F]{6}/gi)||t.filters.fill==="transparent")&&(i+=`:fill(${t.filters.fill})`),t.filters.format&&["webp","png","jpeg"].includes(t.filters.format)&&(i+=`:format(${t.filters.format})`),typeof t.filters.grayscale=="boolean"&&t.filters.grayscale&&(i+=":grayscale()"),typeof t.filters.quality=="number"&&t.filters.quality>=0&&t.filters.quality<=100&&(i+=`:quality(${t.filters.quality})`),t.filters.rotate&&[90,180,270].includes(t.filters.rotate)&&(i+=`:rotate(${t.filters.rotate})`),i.length>0&&(i=`/filters${i}`))),n.length>0&&(e=e.replace(/<img/g,`<img ${n.trim()}`));const a=s>0||o>0||i.length>0?`${s}x${o}${i}`:"";return e=e.replace(/a.storyblok.com\/f\/(\d+)\/([^.]+)\.(gif|jpg|jpeg|png|tif|bmp)/g,`a.storyblok.com/f/$1/$2.$3/m/${a}`),typeof t!="boolean"&&(t.sizes||t.srcset)&&(e=e.replace(/<img.*?src=["|'](.*?)["|']/g,l=>{var h,u;const d=l.match(/a.storyblok.com\/f\/(\d+)\/([^.]+)\.(gif|jpg|jpeg|png|tif|bmp)/g);if(d&&d.length>0){const m={srcset:(h=t.srcset)==null?void 0:h.map(v=>{if(typeof v=="number")return`//${d}/m/${v}x0${i} ${v}w`;if(typeof v=="object"&&v.length===2){let _=0,L=0;return typeof v[0]=="number"&&(_=v[0]),typeof v[1]=="number"&&(L=v[1]),`//${d}/m/${_}x${L}${i} ${_}w`}return""}).join(", "),sizes:(u=t.sizes)==null?void 0:u.map(v=>v).join(", ")};let S="";return m.srcset&&(S+=`srcset="${m.srcset}" `),m.sizes&&(S+=`sizes="${m.sizes}" `),l.replace(/<img/g,`<img ${S.trim()}`)}return l})),e}renderNode(e){const t=[];e.marks&&e.marks.forEach(o=>{const n=this.getMatchingMark(o);n&&n.tag!==""&&t.push(this.renderOpeningTag(n.tag))});const s=this.getMatchingNode(e);return s&&s.tag&&t.push(this.renderOpeningTag(s.tag)),e.content?e.content.forEach(o=>{t.push(this.renderNode(o))}):e.text?t.push(xe(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(o=>{const n=this.getMatchingMark(o);n&&n.tag!==""&&t.push(this.renderClosingTag(n.tag))}),t.join("")}renderTag(e,t){return e.constructor===String?`<${e}${t}>`:e.map(s=>{if(s.constructor===String)return`<${s}${t}>`;{let o=`<${s.tag}`;if(s.attrs){for(const n in s.attrs)if(Object.prototype.hasOwnProperty.call(s.attrs,n)){const i=s.attrs[n];i!==null&&(o+=` ${n}="${i}"`)}}return`${o}${t}>`}}).join("")}renderOpeningTag(e){return this.renderTag(e,"")}renderClosingTag(e){return e.constructor===String?`</${e}>`:e.slice(0).reverse().map(t=>t.constructor===String?`</${t}>`:`</${t.tag}>`).join("")}getMatchingNode(e){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 I=Ae;class Pe{constructor(e){g(this,"baseURL"),g(this,"timeout"),g(this,"headers"),g(this,"responseInterceptor"),g(this,"fetch"),g(this,"ejectInterceptor"),g(this,"url"),g(this,"parameters"),g(this,"fetchOptions"),this.baseURL=e.baseURL,this.headers=e.headers||new Headers,this.timeout=e!=null&&e.timeout?e.timeout*1e3:0,this.responseInterceptor=e.responseInterceptor,this.fetch=(...t)=>e.fetch?e.fetch(...t):fetch(...t),this.ejectInterceptor=!1,this.url="",this.parameters={},this.fetchOptions={}}get(e,t){return this.url=e,this.parameters=t,this._methodHandler("get")}post(e,t){return this.url=e,this.parameters=t,this._methodHandler("post")}put(e,t){return this.url=e,this.parameters=t,this._methodHandler("put")}delete(e,t){return this.url=e,this.parameters=t,this._methodHandler("delete")}async _responseHandler(e){const t=[],s={data:{},headers:{},status:0,statusText:""};e.status!==204&&await e.json().then(o=>{s.data=o});for(const o of e.headers.entries())t[o[0]]=o[1];return s.headers={...t},s.status=e.status,s.statusText=e.statusText,s}async _methodHandler(e){let t=`${this.baseURL}${this.url}`,s=null;if(e==="get"){const l=new A;t=`${this.baseURL}${this.url}?${l.stringify(this.parameters)}`}else s=JSON.stringify(this.parameters);const o=new URL(t),n=new AbortController,{signal:i}=n;let a;this.timeout&&(a=setTimeout(()=>n.abort(),this.timeout));try{const l=await this.fetch(`${o}`,{method:e,headers:this.headers,body:s,signal:i,...this.fetchOptions});this.timeout&&clearTimeout(a);const h=await this._responseHandler(l);return this.responseInterceptor&&!this.ejectInterceptor?this._statusHandler(this.responseInterceptor(h)):this._statusHandler(h)}catch(l){return{message:l}}}setFetchOptions(e={}){Object.keys(e).length>0&&"method"in e&&delete e.method,this.fetchOptions={...e}}eject(){this.ejectInterceptor=!0}_statusHandler(e){const t=/20[0-6]/g;return new Promise((s,o)=>{if(t.test(`${e.status}`))return s(e);const n={message:e.statusText,status:e.status,response:Array.isArray(e.data)?e.data[0]:e.data.error||e.data.slug};o(n)})}}const Le=Pe,q="SB-Agent",N={defaultAgentName:"SB-JS-CLIENT",defaultAgentVersion:"SB-Agent-Version",packageVersion:"6.0.0"};let P={};const E={};class Ne{constructor(e,t){g(this,"client"),g(this,"maxRetries"),g(this,"retriesDelay"),g(this,"throttle"),g(this,"accessToken"),g(this,"cache"),g(this,"helpers"),g(this,"resolveCounter"),g(this,"relations"),g(this,"links"),g(this,"richTextResolver"),g(this,"resolveNestedRelations"),g(this,"stringifiedStoriesCache");let s=e.endpoint||t;if(!s){const i=new A().getRegionURL,a=e.https===!1?"http":"https";e.oauthToken?s=`${a}://${i(e.region)}/v1`:s=`${a}://${i(e.region)}/v2`}const o=new Headers;o.set("Content-Type","application/json"),o.set("Accept","application/json"),e.headers&&(e.headers.constructor.name==="Headers"?e.headers.entries().toArray():Object.entries(e.headers)).forEach(([i,a])=>{o.set(i,a)}),o.has(q)||(o.set(q,N.defaultAgentName),o.set(N.defaultAgentVersion,N.packageVersion));let n=5;e.oauthToken&&(o.set("Authorization",e.oauthToken),n=3),e.rateLimit&&(n=e.rateLimit),e.richTextSchema?this.richTextResolver=new I(e.richTextSchema):this.richTextResolver=new I,e.componentResolver&&this.setComponentResolver(e.componentResolver),this.maxRetries=e.maxRetries||10,this.retriesDelay=300,this.throttle=ne(this.throttledRequest.bind(this),n,1e3),this.accessToken=e.accessToken||"",this.relations={},this.links={},this.cache=e.cache||{clear:"manual"},this.helpers=new A,this.resolveCounter=0,this.resolveNestedRelations=e.resolveNestedRelations||!0,this.stringifiedStoriesCache={},this.client=new Le({baseURL:s,timeout:e.timeout||0,headers:o,responseInterceptor:e.responseInterceptor,fetch:e.fetch})}setComponentResolver(e){this.richTextResolver.addNode("blok",t=>{let s="";return t.attrs.body&&t.attrs.body.forEach(o=>{s+=e(o.component,o)}),{html:s}})}parseParams(e){return e.token||(e.token=this.getToken()),e.cv||(e.cv=E[e.token]),Array.isArray(e.resolve_relations)&&(e.resolve_relations=e.resolve_relations.join(",")),typeof e.resolve_relations<"u"&&(e.resolve_level=2),e}factoryParamOptions(e,t){return this.helpers.isCDNUrl(e)?this.parseParams(t):t}makeRequest(e,t,s,o,n){const i=this.factoryParamOptions(e,this.helpers.getOptionsPage(t,s,o));return this.cacheResponse(e,i,void 0,n)}get(e,t,s){t||(t={});const o=`/${e}`,n=this.factoryParamOptions(o,t);return this.cacheResponse(o,n,void 0,s)}async getAll(e,t,s,o){const n=(t==null?void 0:t.per_page)||25,i=`/${e}`.replace(/\/$/,""),a=s??i.substring(i.lastIndexOf("/")+1),l=1,h=await this.makeRequest(i,t,n,l,o),u=h.total?Math.ceil(h.total/n):1,d=await this.helpers.asyncMap(this.helpers.range(l,u),m=>this.makeRequest(i,t,n,m+1,o));return this.helpers.flatMap([h,...d],m=>Object.values(m.data[a]))}post(e,t,s){const o=`/${e}`;return Promise.resolve(this.throttle("post",o,t,s))}put(e,t,s){const o=`/${e}`;return Promise.resolve(this.throttle("put",o,t,s))}delete(e,t,s){const o=`/${e}`;return Promise.resolve(this.throttle("delete",o,t,s))}getStories(e,t){return this._addResolveLevel(e),this.get("cdn/stories",e,t)}getStory(e,t,s){return this._addResolveLevel(t),this.get(`cdn/stories/${e}`,t,s)}getToken(){return this.accessToken}ejectInterceptor(){this.client.eject()}_addResolveLevel(e){typeof e.resolve_relations<"u"&&(e.resolve_level=2)}_cleanCopy(e){return JSON.parse(JSON.stringify(e))}_insertLinks(e,t,s){const o=e[t];o&&o.fieldtype==="multilink"&&o.linktype==="story"&&typeof o.id=="string"&&this.links[s][o.id]?o.story=this._cleanCopy(this.links[s][o.id]):o&&o.linktype==="story"&&typeof o.uuid=="string"&&this.links[s][o.uuid]&&(o.story=this._cleanCopy(this.links[s][o.uuid]))}getStoryReference(e,t){return this.relations[e][t]?(this.stringifiedStoriesCache[t]||(this.stringifiedStoriesCache[t]=JSON.stringify(this.relations[e][t])),JSON.parse(this.stringifiedStoriesCache[t])):t}_insertRelations(e,t,s,o){s.includes(`${e.component}.${t}`)&&(typeof e[t]=="string"?e[t]=this.getStoryReference(o,e[t]):Array.isArray(e[t])&&(e[t]=e[t].map(n=>this.getStoryReference(o,n)).filter(Boolean)))}iterateTree(e,t,s){const o=n=>{if(n!=null){if(n.constructor===Array)for(let i=0;i<n.length;i++)o(n[i]);else if(n.constructor===Object){if(n._stopResolving)return;for(const i in n)(n.component&&n._uid||n.type==="link")&&(this._insertRelations(n,i,t,s),this._insertLinks(n,i,s)),o(n[i])}}};o(e.content)}async resolveLinks(e,t,s){let o=[];if(e.link_uuids){const n=e.link_uuids.length,i=[],a=50;for(let l=0;l<n;l+=a){const h=Math.min(n,l+a);i.push(e.link_uuids.slice(l,h))}for(let l=0;l<i.length;l++)(await this.getStories({per_page:a,language:t.language,version:t.version,by_uuids:i[l].join(",")})).data.stories.forEach(h=>{o.push(h)})}else o=e.links;o.forEach(n=>{this.links[s][n.uuid]={...n,_stopResolving:!0}})}async resolveRelations(e,t,s){let o=[];if(e.rel_uuids){const n=e.rel_uuids.length,i=[],a=50;for(let l=0;l<n;l+=a){const h=Math.min(n,l+a);i.push(e.rel_uuids.slice(l,h))}for(let l=0;l<i.length;l++)(await this.getStories({per_page:a,language:t.language,version:t.version,by_uuids:i[l].join(","),excluding_fields:t.excluding_fields})).data.stories.forEach(h=>{o.push(h)})}else o=e.rels;o&&o.length>0&&o.forEach(n=>{this.relations[s][n.uuid]={...n,_stopResolving:!0}})}async resolveStories(e,t,s){var o,n;let i=[];if(this.links[s]={},this.relations[s]={},typeof t.resolve_relations<"u"&&t.resolve_relations.length>0&&(typeof t.resolve_relations=="string"&&(i=t.resolve_relations.split(",")),await this.resolveRelations(e,t,s)),t.resolve_links&&["1","story","url","link"].includes(t.resolve_links)&&((o=e.links)!=null&&o.length||(n=e.link_uuids)!=null&&n.length)&&await this.resolveLinks(e,t,s),this.resolveNestedRelations)for(const a in this.relations[s])this.iterateTree(this.relations[s][a],i,s);e.story?this.iterateTree(e.story,i,s):e.stories.forEach(a=>{this.iterateTree(a,i,s)}),this.stringifiedStoriesCache={},delete this.links[s],delete this.relations[s]}async cacheResponse(e,t,s,o){const n=this.helpers.stringify({url:e,params:t}),i=this.cacheProvider();if(this.cache.clear==="auto"&&t.version==="draft"&&await this.flushCache(),t.version==="published"&&e!=="/cdn/spaces/me"){const a=await i.get(n);if(a)return Promise.resolve(a)}return new Promise(async(a,l)=>{var h;try{const u=await this.throttle("get",e,t,o);if(u.status!==200)return l(u);let d={data:u.data,headers:u.headers};if((h=u.headers)!=null&&h["per-page"]&&(d=Object.assign({},d,{perPage:u.headers["per-page"]?Number.parseInt(u.headers["per-page"]):0,total:u.headers["per-page"]?Number.parseInt(u.headers.total):0})),d.data.story||d.data.stories){const m=this.resolveCounter=++this.resolveCounter%1e3;await this.resolveStories(d.data,t,`${m}`)}return t.version==="published"&&e!=="/cdn/spaces/me"&&await i.set(n,d),d.data.cv&&t.token&&E[t.token]!==d.data.cv&&(await this.flushCache(),E[t.token]=d.data.cv),a(d)}catch(u){if(u.response&&u.status===429&&(s=typeof s>"u"?0:s+1,s<this.maxRetries))return console.log(`Hit rate limit. Retrying in ${this.retriesDelay/1e3} seconds.`),await this.helpers.delay(this.retriesDelay),this.cacheResponse(e,t,s).then(a).catch(l);l(u)}})}throttledRequest(e,t,s,o){return this.client.setFetchOptions(o),this.client[e](t,s)}cacheVersions(){return E}cacheVersion(){return E[this.accessToken]}setCacheVersion(e){this.accessToken&&(E[this.accessToken]=e)}clearCacheVersion(){this.accessToken&&(E[this.accessToken]=0)}cacheProvider(){switch(this.cache.type){case"memory":return{get(e){return Promise.resolve(P[e])},getAll(){return Promise.resolve(P)},set(e,t){return P[e]=t,Promise.resolve(void 0)},flush(){return P={},Promise.resolve(void 0)}};case"custom":if(this.cache.custom)return this.cache.custom;default:return{get(){return Promise.resolve()},getAll(){return Promise.resolve(void 0)},set(){return Promise.resolve(void 0)},flush(){return Promise.resolve(void 0)}}}}async flushCache(){return await this.cacheProvider().flush(),this.clearCacheVersion(),this}}const Me=(r={})=>{const{apiOptions:e}=r;if(!e.accessToken){console.error("You need to provide an access token to interact with Storyblok API. Read https://www.storyblok.com/docs/api/content-delivery#topics/authentication");return}return{storyblokApi:new Ne(e)}},De=r=>{if(typeof r!="object"||typeof r._editable>"u")return{};try{const e=JSON.parse(r._editable.replace(/^<!--#storyblok#/,"").replace(/-->$/,""));return e?{"data-blok-c":JSON.stringify(e),"data-blok-uid":e.id+"-"+e.uid}:{}}catch{return{}}};function He(r,e){if(!e)return{src:r,attrs:{}};let t=0,s=0;const o={},n=[];function i(l,h,u,d,m){typeof l!="number"||l<=h||l>=u?console.warn(`[StoryblokRichText] - ${d.charAt(0).toUpperCase()+d.slice(1)} value must be a number between ${h} and ${u} (inclusive)`):m.push(`${d}(${l})`)}if(typeof e=="object"){if(typeof e.width=="number"&&e.width>0?(o.width=e.width,t=e.width):console.warn("[StoryblokRichText] - Width value must be a number greater than 0"),e.height&&typeof e.height=="number"&&e.height>0?(o.height=e.height,s=e.height):console.warn("[StoryblokRichText] - Height value must be a number greater than 0"),e.loading&&["lazy","eager"].includes(e.loading)&&(o.loading=e.loading),e.class&&(o.class=e.class),e.filters){const{filters:l}=e||{},{blur:h,brightness:u,fill:d,format:m,grayscale:S,quality:v,rotate:_}=l||{};h&&i(h,0,100,"blur",n),v&&i(v,0,100,"quality",n),u&&i(u,0,100,"brightness",n),d&&n.push(`fill(${d})`),S&&n.push("grayscale()"),_&&[0,90,180,270].includes(e.filters.rotate||0)&&n.push(`rotate(${_})`),m&&["webp","png","jpeg"].includes(m)&&n.push(`format(${m})`)}e.srcset&&(o.srcset=e.srcset.map(l=>{if(typeof l=="number")return`${r}/m/${l}x0/${n.length>0?`filters:${n.join(":")}`:""} ${l}w`;if(Array.isArray(l)&&l.length===2){const[h,u]=l;return`${r}/m/${h}x${u}/${n.length>0?`filters:${n.join(":")}`:""} ${h}w`}else{console.warn("[StoryblokRichText] - srcset entry must be a number or a tuple of two numbers");return}}).join(", ")),e.sizes&&(o.sizes=e.sizes.join(", "))}let a=`${r}/m/`;return t>0&&s>0&&(a=`${a}${t}x${s}/`),n.length>0&&(a=`${a}filters:${n.join(":")}`),{src:a,attrs:o}}var k=(r=>(r.DOCUMENT="doc",r.HEADING="heading",r.PARAGRAPH="paragraph",r.QUOTE="blockquote",r.OL_LIST="ordered_list",r.UL_LIST="bullet_list",r.LIST_ITEM="list_item",r.CODE_BLOCK="code_block",r.HR="horizontal_rule",r.BR="hard_break",r.IMAGE="image",r.EMOJI="emoji",r.COMPONENT="blok",r))(k||{}),T=(r=>(r.BOLD="bold",r.STRONG="strong",r.STRIKE="strike",r.UNDERLINE="underline",r.ITALIC="italic",r.CODE="code",r.LINK="link",r.ANCHOR="anchor",r.STYLED="styled",r.SUPERSCRIPT="superscript",r.SUBSCRIPT="subscript",r.TEXT_STYLE="textStyle",r.HIGHLIGHT="highlight",r))(T||{}),M=(r=>(r.TEXT="text",r))(M||{}),O=(r=>(r.URL="url",r.STORY="story",r.ASSET="asset",r.EMAIL="email",r))(O||{});const Ue=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],ze=(r={})=>Object.keys(r).map(e=>`${e}="${r[e]}"`).join(" "),Be=(r={})=>Object.keys(r).map(e=>`${e}: ${r[e]}`).join("; ");function Fe(r){return r.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#039;")}const G=r=>Object.fromEntries(Object.entries(r).filter(([e,t])=>t!==void 0));function Ve(r,e={},t){const s=ze(e),o=s?`${r} ${s}`:r;return Ue.includes(r)?`<${o}>`:`<${o}>${Array.isArray(t)?t.join(""):t||""}</${r}>`}function K(r={}){let e=0;const{renderFn:t=Ve,textFn:s=Fe,resolvers:o={},optimizeImages:n=!1,keyedResolvers:i=!1}=r,a=c=>f=>{const y=f.attrs||{};return i&&(y.key=`${c}-${e}`),t(c,y,f.children||null)},l=c=>{const{src:f,alt:y,title:$,srcset:R,sizes:w}=c.attrs||{};let j=f,C={};if(n){const{src:ot,attrs:nt}=He(f,n);j=ot,C=nt}i&&(C={...C,key:`img-${e}`});const st={src:j,alt:y,title:$,srcset:R,sizes:w,...C};return t("img",G(st))},h=c=>{const{level:f,...y}=c.attrs||{},$={...y};return i&&($.key=`h${f}-${e}`),t(`h${f}`,$,c.children)},u=c=>{var f,y,$,R;const w=t("img",{src:(f=c.attrs)==null?void 0:f.fallbackImage,alt:(y=c.attrs)==null?void 0:y.alt,style:"width: 1.25em; height: 1.25em; vertical-align: text-top",draggable:"false",loading:"lazy"}),j={"data-type":"emoji","data-name":($=c.attrs)==null?void 0:$.name,"data-emoji":(R=c.attrs)==null?void 0:R.emoji};return i&&(j.key=`emoji-${e}`),t("span",j,w)},d=c=>t("pre",{...c.attrs,key:`code-${e}`},t("code",{key:`code-${e}`},c.children||"")),m=(c,f=!1)=>({text:y,attrs:$})=>{const{class:R,id:w,...j}=$||{},C=f?{class:R,id:w,style:Be(j)||void 0}:$||{};return i&&(C.key=`${c}-${e}`),t(c,G(C),y)},S=c=>U(c),v=c=>{const{marks:f,...y}=c;return"text"in c?f?f.reduce(($,R)=>S({...R,text:$}),S({...y,children:y.children})):s(y.text):""},_=c=>{const{linktype:f,href:y,anchor:$,...R}=c.attrs||{};let w="";switch(f){case O.ASSET:case O.URL:w=y;break;case O.EMAIL:w=`mailto:${y}`;break;case O.STORY:w=y;break}return $&&(w=`${w}#${$}`),t("a",{...R,href:w,key:`a-${e}`},c.text)},L=c=>{var f,y;return console.warn("[StoryblokRichtText] - BLOK resolver is not available for vanilla usage"),t("span",{blok:(f=c==null?void 0:c.attrs)==null?void 0:f.body[0],id:(y=c.attrs)==null?void 0:y.id,key:`component-${e}`,style:"display: none"})},rt=new Map([[k.DOCUMENT,a("div")],[k.HEADING,h],[k.PARAGRAPH,a("p")],[k.UL_LIST,a("ul")],[k.OL_LIST,a("ol")],[k.LIST_ITEM,a("li")],[k.IMAGE,l],[k.EMOJI,u],[k.CODE_BLOCK,d],[k.HR,a("hr")],[k.BR,a("br")],[k.QUOTE,a("blockquote")],[k.COMPONENT,L],[M.TEXT,v],[T.LINK,_],[T.ANCHOR,_],[T.STYLED,m("span",!0)],[T.BOLD,m("strong")],[T.TEXT_STYLE,m("span",!0)],[T.ITALIC,m("em")],[T.UNDERLINE,m("u")],[T.STRIKE,m("s")],[T.CODE,m("code")],[T.SUPERSCRIPT,m("sup")],[T.SUBSCRIPT,m("sub")],[T.HIGHLIGHT,m("mark")],...Object.entries(o).map(([c,f])=>[c,f])]);function ee(c){e+=1;const f=rt.get(c.type);if(!f)return console.error("<Storyblok>",`No resolver found for node type ${c.type}`),"";if(c.type==="text")return f(c);const y=c.content?c.content.map(U):void 0;return f({...c,children:y})}function U(c){return Array.isArray(c)?c.map(ee):ee(c)}return{render:U}}let D,J="https://app.storyblok.com/f/storyblok-v2-latest.js";const Y=(r,e,t={})=>{var s;const o=!(typeof window>"u")&&typeof window.storyblokRegisterEvent<"u",n=+new URL((s=window.location)==null?void 0:s.href).searchParams.get("_storyblok")===r;if(!(!o||!n)){if(!r){console.warn("Story ID is not defined. Please provide a valid ID.");return}window.storyblokRegisterEvent(()=>{new window.StoryblokBridge(t).on(["input","published","change"],i=>{i.action==="input"&&i.story.id===r?e(i.story):(i.action==="change"||i.action==="published")&&i.storyId===r&&window.location.reload()})})}},qe=(r={})=>{var e,t;const{bridge:s,accessToken:o,use:n=[],apiOptions:i={},richText:a={},bridgeUrl:l}=r;i.accessToken=i.accessToken||o;const h={bridge:s,apiOptions:i};let u={};n.forEach(m=>{u={...u,...m(h)}}),l&&(J=l);const d=!(typeof window>"u")&&((t=(e=window.location)==null?void 0:e.search)==null?void 0:t.includes("_storyblok_tk"));return s!==!1&&d&&te(J),D=new I(a.schema),a.resolver&&X(D,a.resolver),u},X=(r,e)=>{r.addNode("blok",t=>{let s="";return t.attrs.body.forEach(o=>{s+=e(o.component,o)}),{html:s}})},Ge=r=>!r||!(r!=null&&r.content.some(e=>e.content||e.type==="blok"||e.type==="horizontal_rule")),Ke=(r,e,t)=>{let s=t||D;if(!s){console.error("Please initialize the Storyblok SDK before calling the renderRichText function");return}return Ge(r)?"":(e&&(s=new I(e.schema),e.resolver&&X(s,e.resolver)),s.render(r,{},!1))},H=p.defineComponent({__name:"StoryblokComponent",props:{blok:{}},setup(r,{expose:e}){const t=r,s=p.ref();e({value:s});const o=typeof p.resolveDynamicComponent(t.blok.component)!="string",n=p.inject("VueSDKOptions"),i=p.ref(t.blok.component);return!o&&n&&(n.enableFallbackComponent?(i.value=n.customFallbackComponent??"FallbackComponent",typeof p.resolveDynamicComponent(i.value)=="string"&&console.error(`Is the Fallback component "${i.value}" registered properly?`)):console.error(`Component could not be found for blok "${t.blok.component}"! Is it defined in main.ts as "app.component("${t.blok.component}", ${t.blok.component});"?`)),(a,l)=>(p.openBlock(),p.createBlock(p.resolveDynamicComponent(i.value),p.mergeProps({ref_key:"blokRef",ref:s},{...a.$props,...a.$attrs}),null,16))}}),Je=r=>{var e,t;return p.h(H,{blok:(e=r==null?void 0:r.attrs)==null?void 0:e.body[0],id:(t=r.attrs)==null?void 0:t.id},r.children)};function W(r){const e={renderFn:p.h,textFn:p.createTextVNode,keyedResolvers:!0,resolvers:{[k.COMPONENT]:Je,...r.resolvers}};return K(e)}const Q=p.defineComponent({__name:"StoryblokRichText",props:{doc:{},resolvers:{}},setup(r){const e=r,t=p.ref(),s=()=>t.value;return p.watch([e.doc,e.resolvers],([o,n])=>{const{render:i}=W({resolvers:n??{}});t.value=i(o)},{immediate:!0}),(o,n)=>(p.openBlock(),p.createBlock(s))}}),Ye={beforeMount(r,e){if(e.value){const t=De(e.value);Object.keys(t).length>0&&(r.setAttribute("data-blok-c",t["data-blok-c"]),r.setAttribute("data-blok-uid",t["data-blok-uid"]),r.classList.add("storyblok__outline"))}}},Z=r=>{console.error(`You can't use ${r} if you're not loading apiPlugin. Please provide it on StoryblokVue initialization.
31
+ `)};let x=null;const Xe=()=>(x||Z("useStoryblokApi"),x),We=async(r,e={},t={})=>{const s=p.ref(null);if(t.resolveRelations=t.resolveRelations??e.resolve_relations,t.resolveLinks=t.resolveLinks??e.resolve_links,p.onMounted(()=>{s.value&&s.value.id&&Y(s.value.id,o=>s.value=o,t)}),x){const{data:o}=await x.get(`cdn/stories/${r}`,e);s.value=o.story}else Z("useStoryblok");return s},Qe={install(r,e={}){r.directive("editable",Ye),r.component("StoryblokComponent",H),r.component("StoryblokRichText",Q),e.enableFallbackComponent&&!e.customFallbackComponent&&r.component("FallbackComponent",p.defineAsyncComponent(()=>Promise.resolve().then(()=>tt)));const{storyblokApi:t}=qe(e);x=t||null,r.provide("VueSDKOptions",e)}},Ze={class:"fallback-component"},et={class:"component"},tt=Object.freeze(Object.defineProperty({__proto__:null,default:((r,e)=>{const t=r.__vccOpts||r;for(const[s,o]of e)t[s]=o;return t})(p.defineComponent({__name:"FallbackComponent",props:{blok:{}},setup(r){return(e,t)=>(p.openBlock(),p.createElementBlock("div",Ze,[p.createElementVNode("p",null,[t[0]||(t[0]=p.createTextVNode(" Component could not be found for blok ")),p.createElementVNode("span",et,p.toDisplayString(e.blok.component),1),t[1]||(t[1]=p.createTextVNode("! Is it configured correctly? "))])]))}}),[["__scopeId","data-v-9abcd1f2"]])},Symbol.toStringTag,{value:"Module"}));b.BlockTypes=k,b.MarkTypes=T,b.RichTextResolver=I,b.RichTextSchema=F,b.StoryblokComponent=H,b.StoryblokRichText=Q,b.StoryblokVue=Qe,b.TextTypes=M,b.apiPlugin=Me,b.renderRichText=Ke,b.richTextResolver=K,b.useStoryblok=We,b.useStoryblokApi=Xe,b.useStoryblokBridge=Y,b.useStoryblokRichText=W,Object.defineProperty(b,Symbol.toStringTag,{value:"Module"})});
@@ -1,3 +1,9 @@
1
+ /**
2
+ * name: @storyblok/vue
3
+ * (c) 2024
4
+ * description: SDK to integrate Storyblok into your project using Vue.
5
+ * author: Storyblok
6
+ */
1
7
  import { defineComponent as G, ref as O, resolveDynamicComponent as N, inject as oe, openBlock as K, createBlock as J, mergeProps as ne, h as Y, createTextVNode as ie, watch as ae, onMounted as le, defineAsyncComponent as ce } from "vue";
2
8
  let D = !1;
3
9
  const z = [], he = (r) => new Promise((e, t) => {
@@ -1131,7 +1137,7 @@ const tt = (r, e, t = {}) => {
1131
1137
  value: s
1132
1138
  });
1133
1139
  const o = typeof N(t.blok.component) != "string", n = oe("VueSDKOptions"), i = O(t.blok.component);
1134
- return o || (n.enableFallbackComponent ? (i.value = n.customFallbackComponent ?? "FallbackComponent", typeof N(i.value) == "string" && console.error(
1140
+ return !o && n && (n.enableFallbackComponent ? (i.value = n.customFallbackComponent ?? "FallbackComponent", typeof N(i.value) == "string" && console.error(
1135
1141
  `Is the Fallback component "${i.value}" registered properly?`
1136
1142
  )) : console.error(
1137
1143
  `Component could not be found for blok "${t.blok.component}"! Is it defined in main.ts as "app.component("${t.blok.component}", ${t.blok.component});"?`
@@ -1210,16 +1216,17 @@ const ut = () => (I || Z("useStoryblokApi"), I), dt = async (r, e = {}, t = {})
1210
1216
  e
1211
1217
  );
1212
1218
  s.value = o.story;
1213
- } else Z("useStoryblok");
1219
+ } else
1220
+ Z("useStoryblok");
1214
1221
  return s;
1215
1222
  }, pt = {
1216
1223
  install(r, e = {}) {
1217
1224
  r.directive("editable", at), r.component("StoryblokComponent", Q), r.component("StoryblokRichText", it), e.enableFallbackComponent && !e.customFallbackComponent && r.component(
1218
1225
  "FallbackComponent",
1219
- ce(() => import("./FallbackComponent-C2j8Ky5h.mjs"))
1226
+ ce(() => import("./FallbackComponent-U_HRL08c.js"))
1220
1227
  );
1221
1228
  const { storyblokApi: t } = rt(e);
1222
- I = t, r.provide("VueSDKOptions", e);
1229
+ I = t || null, r.provide("VueSDKOptions", e);
1223
1230
  }
1224
1231
  };
1225
1232
  export {
package/dist/types.d.ts CHANGED
@@ -1,13 +1,12 @@
1
- import type { SbBlokData, SbSDKOptions } from "@storyblok/js";
2
- import type StoryblokComponent from "./StoryblokComponent.vue";
3
- import type { StoryblokRichTextDocumentNode, StoryblokRichTextResolvers } from "@storyblok/js";
4
- import type { VNode } from "vue";
5
- declare module "@vue/runtime-core" {
1
+ import { SbBlokData, SbSDKOptions, StoryblokRichTextDocumentNode, StoryblokRichTextResolvers } from '@storyblok/js';
2
+ import { default as StoryblokComponent } from './components/StoryblokComponent.vue';
3
+ import { VNode } from 'vue';
4
+ declare module 'vue' {
6
5
  interface GlobalComponents {
7
6
  StoryblokComponent: typeof StoryblokComponent;
8
7
  }
9
8
  }
10
- export type { ISbConfig, ISbCache, ISbResult, ISbResponse, ISbError, ISbNode, ISbSchema, AsyncFn, ArrayFn, ISbContentMangmntAPI, ISbManagmentApiResult, ISbStories, ISbStory, ISbDimensions, StoryblokComponentType, ISbStoryData, ISbAlternateObject, ISbStoriesParams, ISbStoryParams, SbBlokData, SbBlokKeyDataTypes, SbSDKOptions, StoryblokBridgeConfigV2, StoryblokBridgeV2, StoryblokClient, StoryblokRichTextDocumentNode, StoryblokRichTextNodeTypes, StoryblokRichTextNode, StoryblokRichTextResolvers, StoryblokRichTextNodeResolver, StoryblokRichTextImageOptimizationOptions, } from "@storyblok/js";
9
+ export type { ArrayFn, AsyncFn, ISbAlternateObject, ISbCache, ISbConfig, ISbContentMangmntAPI, ISbDimensions, ISbError, ISbManagmentApiResult, ISbNode, ISbResponse, ISbResult, ISbSchema, ISbStories, ISbStoriesParams, ISbStory, ISbStoryData, ISbStoryParams, SbBlokData, SbBlokKeyDataTypes, SbSDKOptions, StoryblokBridgeConfigV2, StoryblokBridgeV2, StoryblokClient, StoryblokComponentType, StoryblokRichTextDocumentNode, StoryblokRichTextImageOptimizationOptions, StoryblokRichTextNode, StoryblokRichTextNodeResolver, StoryblokRichTextNodeTypes, StoryblokRichTextResolvers, } from '@storyblok/js';
11
10
  export interface SbVueSDKOptions extends SbSDKOptions {
12
11
  /**
13
12
  * Show a fallback component in your frontend if a component is not registered properly.
package/dist/vue.css ADDED
@@ -0,0 +1,7 @@
1
+ /**
2
+ * name: @storyblok/vue
3
+ * (c) 2024
4
+ * description: SDK to integrate Storyblok into your project using Vue.
5
+ * author: Storyblok
6
+ */
7
+ .fallback-component[data-v-9abcd1f2]{display:inline-flex;background-color:#eff1f3;text-align:center;padding:15px 30px;border-radius:5px}span.component[data-v-9abcd1f2]{color:#00b3b0;font-weight:700}
package/package.json CHANGED
@@ -1,94 +1,90 @@
1
1
  {
2
2
  "name": "@storyblok/vue",
3
- "version": "8.1.6",
4
- "description": "Storyblok directive for get editable elements.",
3
+ "type": "module",
4
+ "version": "8.1.7",
5
+ "packageManager": "pnpm@9.12.2",
6
+ "description": "SDK to integrate Storyblok into your project using Vue.",
7
+ "author": "Storyblok",
8
+ "license": "MIT",
9
+ "repository": {
10
+ "type": "git",
11
+ "url": "https://github.com/storyblok/storyblok-vue"
12
+ },
13
+ "bugs": {
14
+ "url": "https://github.com/storyblok/storyblok-vue/issues"
15
+ },
16
+ "exports": {
17
+ ".": {
18
+ "types": "./dist/index.d.ts",
19
+ "import": "./dist/index.mjs",
20
+ "require": "./dist/index.js"
21
+ },
22
+ "./rsc": {
23
+ "types": "./dist/rsc/index.d.ts",
24
+ "import": "./dist/rsc.mjs",
25
+ "require": "./dist/rsc.js"
26
+ }
27
+ },
5
28
  "main": "./dist/storyblok-vue.js",
6
29
  "module": "./dist/storyblok-vue.mjs",
7
30
  "types": "./dist/index.d.ts",
8
31
  "files": [
9
32
  "dist"
10
33
  ],
11
- "exports": {
12
- ".": {
13
- "import": "./dist/storyblok-vue.mjs",
14
- "require": "./dist/storyblok-vue.js",
15
- "types": "./dist/index.d.ts"
16
- }
17
- },
18
34
  "scripts": {
19
35
  "dev": "vite build --watch",
20
- "build": "vite build && vue-tsc --declaration --emitDeclarationOnly",
21
- "test": "npm run test:unit && npm run test:e2e",
22
- "test:unit": "jest __tests__",
23
- "test:e2e": "cypress run --component",
24
- "test:e2e-watch": "cypress open --component",
25
- "prepublishOnly": "npm run build && cp ../README.md ./"
36
+ "playground": "pnpm run --filter ./playground/vue dev",
37
+ "test": "pnpm run cy:components",
38
+ "build": "vite build ",
39
+ "lint": "eslint .",
40
+ "lint:fix": "eslint . --fix",
41
+ "cy:run": "cypress run",
42
+ "cy:open": "cypress open",
43
+ "cy:components": "cypress run-ct"
44
+ },
45
+ "peerDependencies": {
46
+ "vue": ">=3.4"
26
47
  },
27
48
  "dependencies": {
28
- "@storyblok/js": "^3.1.9"
49
+ "@storyblok/js": "3.1.9"
29
50
  },
30
51
  "devDependencies": {
31
- "@babel/core": "^7.26.0",
32
- "@cypress/vite-dev-server": "^5.2.1",
33
- "@cypress/vue": "^6.0.1",
34
- "@vitejs/plugin-vue": "^5.2.0",
35
- "@vue/babel-preset-app": "^5.0.8",
36
- "@vue/test-utils": "2.4.6",
37
- "@vue/tsconfig": "^0.1.3",
38
- "@vue/vue3-jest": "^29.2.6",
39
- "babel-jest": "^29.7.0",
40
- "cypress": "^13.16.0",
41
- "eslint-plugin-cypress": "^2.15.2",
42
- "eslint-plugin-jest": "^28.9.0",
43
- "jest": "^29.7.0",
44
- "typescript": "^4.9.5",
45
- "vite": "^5.4.11",
52
+ "@commitlint/cli": "^19.6.1",
53
+ "@commitlint/config-conventional": "^19.6.0",
54
+ "@rollup/plugin-typescript": "^12.1.2",
55
+ "@storyblok/eslint-config": "^0.3.0",
56
+ "@types/node": "^22.10.2",
57
+ "@typescript-eslint/parser": "^8.18.0",
58
+ "@vitejs/plugin-vue": "^5.2.1",
59
+ "cypress": "^13.17.0",
60
+ "eslint": "^9.17.0",
61
+ "eslint-plugin-vue": "^9.32.0",
62
+ "kolorist": "^1.8.0",
63
+ "pathe": "^1.1.2",
64
+ "typescript": "^5.7.2",
65
+ "vite": "^6.0.3",
66
+ "vite-plugin-banner": "^0.8.0",
67
+ "vite-plugin-dts": "^4.3.0",
68
+ "vitest": "^2.1.8",
46
69
  "vue": "^3.5.13",
47
- "vue-tsc": "^1.8.27"
70
+ "vue-router": "^4.5.0",
71
+ "vue-tsc": "^2.1.10"
48
72
  },
49
- "babel": {
50
- "presets": [
51
- "@vue/babel-preset-app"
73
+ "commitlint": {
74
+ "extends": [
75
+ "@commitlint/config-conventional"
52
76
  ]
53
77
  },
54
- "jest": {
55
- "moduleFileExtensions": [
56
- "js",
57
- "json",
58
- "vue"
59
- ],
60
- "transform": {
61
- "^.+\\.js$": "babel-jest",
62
- "^.+\\.vue$": "@vue/vue3-jest"
63
- }
64
- },
65
- "repository": {
66
- "type": "git",
67
- "url": "https://github.com/storyblok/storyblok-vue"
68
- },
69
- "keywords": [
70
- "vue",
71
- "storyblok"
72
- ],
73
- "author": "Alexander Feiglstorfer",
74
- "bugs": {
75
- "url": "https://github.com/storyblok/storyblok-vue/issues"
76
- },
77
- "homepage": "https://github.com/storyblok/storyblok-vue",
78
78
  "release": {
79
79
  "branches": [
80
- "main",
81
- {
82
- "name": "next",
83
- "prerelease": true
84
- },
85
- {
86
- "name": "beta",
87
- "prerelease": true
88
- }
80
+ "main"
89
81
  ]
90
82
  },
91
83
  "publishConfig": {
92
84
  "access": "public"
85
+ },
86
+ "simple-git-hooks": {
87
+ "pre-commit": "pnpm lint",
88
+ "pre-push": "pnpm commitlint --last --verbose"
93
89
  }
94
90
  }
@@ -1,15 +0,0 @@
1
- import type { SbBlokData } from "./types";
2
- export interface SbComponentProps {
3
- blok: SbBlokData;
4
- }
5
- declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<SbComponentProps>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<SbComponentProps>>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
6
- export default _default;
7
- type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
8
- type __VLS_TypePropsToRuntimeProps<T> = {
9
- [K in keyof T]-?: {} extends Pick<T, K> ? {
10
- type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
11
- } : {
12
- type: import('vue').PropType<T[K]>;
13
- required: true;
14
- };
15
- };
@@ -1,14 +0,0 @@
1
- import type { SbComponentProps } from "./types";
2
- declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<SbComponentProps>>, {
3
- value: import("vue").Ref<any, any>;
4
- }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<SbComponentProps>>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
5
- export default _default;
6
- type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
7
- type __VLS_TypePropsToRuntimeProps<T> = {
8
- [K in keyof T]-?: {} extends Pick<T, K> ? {
9
- type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
10
- } : {
11
- type: import('vue').PropType<T[K]>;
12
- required: true;
13
- };
14
- };
@@ -1,8 +0,0 @@
1
- import { mount } from "cypress/vue";
2
- declare global {
3
- namespace Cypress {
4
- interface Chainable {
5
- mount: typeof mount;
6
- }
7
- }
8
- }
@@ -1 +0,0 @@
1
- import "./commands";
@@ -1,3 +0,0 @@
1
- /// <reference types="cypress" />
2
- declare const _default: Cypress.ConfigOptions<any>;
3
- export default _default;
package/dist/style.css DELETED
@@ -1 +0,0 @@
1
- .fallback-component[data-v-93c770c0]{display:inline-flex;background-color:#eff1f3;text-align:center;padding:15px 30px;border-radius:5px}span.component[data-v-93c770c0]{color:#00b3b0;font-weight:700}