@storyblok/vue 5.0.1 → 6.0.2
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 +78 -57
- package/dist/storyblok-vue.js +3 -10
- package/dist/storyblok-vue.mjs +213 -1269
- package/package.json +15 -22
package/README.md
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
</a>
|
|
5
5
|
<h1 align="center">@storyblok/vue</h1>
|
|
6
6
|
<p align="center">
|
|
7
|
-
The Vue
|
|
7
|
+
The Vue SDK you need to interact with <a href="http://www.storyblok.com?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-vue" target="_blank">Storyblok API</a> and enable the <a href="https://www.storyblok.com/docs/guide/essentials/visual-editor?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-vue" target="_blank">Real-time Visual Editing Experience</a>.
|
|
8
8
|
</p>
|
|
9
9
|
<br />
|
|
10
10
|
</div>
|
|
@@ -30,10 +30,12 @@
|
|
|
30
30
|
</a>
|
|
31
31
|
</p>
|
|
32
32
|
|
|
33
|
-
**Note**: This plugin is for Vue
|
|
33
|
+
**Note**: This plugin is for Vue 3. [Check out the docs for Vue 2 version](https://github.com/storyblok/storyblok-vue-2).
|
|
34
34
|
|
|
35
35
|
## 🚀 Usage
|
|
36
36
|
|
|
37
|
+
Check out the **[Live Demo](https://stackblitz.com/edit/vue-sdk-demo?file=src/main.js&terminal=dev)** on Stackblitz!
|
|
38
|
+
|
|
37
39
|
> If you are first-time user of the Storyblok, read the [Getting Started](https://www.storyblok.com/docs/guide/getting-started?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-vue) guide to get a project ready in less than 5 minutes.
|
|
38
40
|
|
|
39
41
|
### Installation
|
|
@@ -41,48 +43,28 @@
|
|
|
41
43
|
Install `@storyblok/vue`
|
|
42
44
|
|
|
43
45
|
```bash
|
|
44
|
-
npm install
|
|
45
|
-
# yarn add
|
|
46
|
+
npm install @storyblok/vue
|
|
47
|
+
# yarn add @storyblok/vue
|
|
46
48
|
```
|
|
47
49
|
|
|
48
50
|
Register the plugin on your application (usually in `main.js`), add the `apiPlugin` and add the [access token](https://www.storyblok.com/docs/api/content-delivery#topics/authentication?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-vue) of your Storyblok space:
|
|
49
51
|
|
|
50
52
|
```js
|
|
51
|
-
import
|
|
53
|
+
import { createApp } from "vue";
|
|
52
54
|
import { StoryblokVue, apiPlugin } from "@storyblok/vue";
|
|
53
55
|
import App from "./App.vue";
|
|
54
56
|
|
|
55
|
-
|
|
56
|
-
|
|
57
|
+
const app = createApp(App);
|
|
58
|
+
|
|
59
|
+
app.use(StoryblokVue, {
|
|
60
|
+
accessToken: "YOUR_ACCESS_TOKEN",
|
|
57
61
|
use: [apiPlugin],
|
|
58
62
|
});
|
|
59
63
|
```
|
|
60
64
|
|
|
61
65
|
That's it! All the features are enabled for you: the _Api Client_ for interacting with [Storyblok CDN API](https://www.storyblok.com/docs/api/content-delivery#topics/introduction?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-vue), and _Storyblok Bridge_ for [real-time visual editing experience](https://www.storyblok.com/docs/guide/essentials/visual-editor?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-vue).
|
|
62
66
|
|
|
63
|
-
> You can enable/disable some of these features if you don't need them, so you save some KB. Please read the "Features and API" section
|
|
64
|
-
|
|
65
|
-
#### Composition API
|
|
66
|
-
|
|
67
|
-
Install [@vue/composition-api](https://github.com/vuejs/composition-api) and register it in the application:
|
|
68
|
-
|
|
69
|
-
```js
|
|
70
|
-
// main.js
|
|
71
|
-
import VueCompositionAPI from "@vue/composition-api";
|
|
72
|
-
Vue.use(VueCompositionAPI);
|
|
73
|
-
```
|
|
74
|
-
|
|
75
|
-
To use **script setup**, install [unplugin-vue2-script-setup](https://github.com/antfu/unplugin-vue2-script-setup). Depending on your setup, the configuration is different. For example, in Vite:
|
|
76
|
-
|
|
77
|
-
```js
|
|
78
|
-
// vite.config.js
|
|
79
|
-
import { createVuePlugin } from "vite-plugin-vue2";
|
|
80
|
-
import ScriptSetup from "unplugin-vue2-script-setup/vite";
|
|
81
|
-
|
|
82
|
-
export default {
|
|
83
|
-
plugins: [createVuePlugin(), ScriptSetup()],
|
|
84
|
-
};
|
|
85
|
-
```
|
|
67
|
+
> You can enable/disable some of these features if you don't need them, so you save some KB. Please read the "Features and API" section.
|
|
86
68
|
|
|
87
69
|
#### From a CDN
|
|
88
70
|
|
|
@@ -100,7 +82,39 @@ Install the file from the CDN and access the methods via `window.storyblokVue`:
|
|
|
100
82
|
- Loads [Storyblok Bridge](https://www.storyblok.com/docs/Guides/storyblok-latest-js?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-vue) for real-time visual updates
|
|
101
83
|
- Provides a `v-editable` directive to link editable components to the Storyblok Visual Editor
|
|
102
84
|
|
|
103
|
-
####
|
|
85
|
+
#### Short Form
|
|
86
|
+
|
|
87
|
+
Load globally the Vue components you want to link to Storyblok in your _main.js_ file:
|
|
88
|
+
|
|
89
|
+
```js
|
|
90
|
+
import Page from "./components/Page.vue";
|
|
91
|
+
import Teaser from "./components/Teaser.vue";
|
|
92
|
+
|
|
93
|
+
app.use(StoryblokVue, {
|
|
94
|
+
accessToken: "<your-token>",
|
|
95
|
+
use: [apiPlugin],
|
|
96
|
+
});
|
|
97
|
+
|
|
98
|
+
app.component("Page", Page);
|
|
99
|
+
app.component("Teaser", Teaser);
|
|
100
|
+
```
|
|
101
|
+
|
|
102
|
+
Use `useStoryblok` in your pages to fetch Storyblok stories and listen to real-time updates, as well as `StoryblokComponent` to render any component you've loaded before, like in this example:
|
|
103
|
+
|
|
104
|
+
```html
|
|
105
|
+
<script setup>
|
|
106
|
+
import { useStoryblok } from "@storyblok/vue";
|
|
107
|
+
const story = await useStoryblok("path-to-story", { version: "draft" });
|
|
108
|
+
</script>
|
|
109
|
+
|
|
110
|
+
<template>
|
|
111
|
+
<StoryblokComponent v-if="story" :blok="story.content" />
|
|
112
|
+
</template>
|
|
113
|
+
```
|
|
114
|
+
|
|
115
|
+
#### Long Form
|
|
116
|
+
|
|
117
|
+
##### 1. Fetching Content
|
|
104
118
|
|
|
105
119
|
Inject `storyblokApi` when using Composition API:
|
|
106
120
|
|
|
@@ -115,13 +129,13 @@ Inject `storyblokApi` when using Composition API:
|
|
|
115
129
|
import { useStoryblokApi } from "@storyblok/vue";
|
|
116
130
|
|
|
117
131
|
const storyblokApi = useStoryblokApi();
|
|
118
|
-
const { data } = await storyblokApi.get("cdn/stories", { version: "draft" });
|
|
132
|
+
const { data } = await storyblokApi.get("cdn/stories/home", { version: "draft" });
|
|
119
133
|
</script>
|
|
120
134
|
```
|
|
121
135
|
|
|
122
136
|
> Note: you can skip using `apiPlugin` if you prefer your own method or function to fetch your data.
|
|
123
137
|
|
|
124
|
-
|
|
138
|
+
##### 2. Listen to Storyblok Visual Editor events
|
|
125
139
|
|
|
126
140
|
Use `useStoryBridge` to get the new story every time is triggered a `change` event from the Visual Editor. You need to pass the story id as first param, and a callback function as second param to update the new story:
|
|
127
141
|
|
|
@@ -131,7 +145,7 @@ Use `useStoryBridge` to get the new story every time is triggered a `change` eve
|
|
|
131
145
|
import { useStoryblokBridge, useStoryblokApi } from "@storyblok/vue";
|
|
132
146
|
|
|
133
147
|
const storyblokApi = useStoryblokApi();
|
|
134
|
-
const { data } = await storyblokApi.get("cdn/stories", { version: "draft" });
|
|
148
|
+
const { data } = await storyblokApi.get("cdn/stories/home", { version: "draft" });
|
|
135
149
|
const state = reactive({ story: data.story });
|
|
136
150
|
|
|
137
151
|
onMounted(() => {
|
|
@@ -148,7 +162,7 @@ useStoryblokBridge(state.story.id, (story) => (state.story = story), {
|
|
|
148
162
|
});
|
|
149
163
|
```
|
|
150
164
|
|
|
151
|
-
|
|
165
|
+
##### 3. Link your components to Storyblok Visual Editor
|
|
152
166
|
|
|
153
167
|
For every component you've defined in your Storyblok space, add the `v-editable` directive with the blok content:
|
|
154
168
|
|
|
@@ -160,32 +174,39 @@ For every component you've defined in your Storyblok space, add the `v-editable`
|
|
|
160
174
|
|
|
161
175
|
Where `blok` is the actual blok data coming from [Storblok's Content Delivery API](https://www.storyblok.com/docs/api/content-delivery?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-vue).
|
|
162
176
|
|
|
163
|
-
Check out the [playground](/../../tree/
|
|
177
|
+
Check out the [playground](/../../tree/next/playground) for a full example.
|
|
164
178
|
|
|
165
|
-
###
|
|
179
|
+
### Features and API
|
|
166
180
|
|
|
167
|
-
You can use
|
|
181
|
+
You can **choose the features to use** when you initialize the plugin. In that way, you can improve Web Performance by optimizing your page load and save some bytes.
|
|
168
182
|
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
}
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
this.story = data.story;
|
|
179
|
-
},
|
|
180
|
-
mounted() {
|
|
181
|
-
useStoryblokBridge(this.story.id, (evStory) => (this.story = evStory));
|
|
182
|
-
},
|
|
183
|
-
};
|
|
183
|
+
#### useStoryblok(pathToStory, apiOptions = {}, bridgeOptions = {})
|
|
184
|
+
|
|
185
|
+
This example of `useStoryblok`:
|
|
186
|
+
|
|
187
|
+
```html
|
|
188
|
+
<script setup>
|
|
189
|
+
import { useStoryblok } from "@storyblok/vue";
|
|
190
|
+
const story = await useStoryblok("home", { version: "draft" });
|
|
191
|
+
</script>
|
|
184
192
|
```
|
|
185
193
|
|
|
186
|
-
|
|
194
|
+
Is equivalent to the following, using `useStoryblokBridge` and `useStoryblokApi`:
|
|
187
195
|
|
|
188
|
-
|
|
196
|
+
```html
|
|
197
|
+
<script setup>
|
|
198
|
+
import { onMounted } from "vue";
|
|
199
|
+
import { useStoryblokBridge, useStoryblokApi } from "@storyblok/vue";
|
|
200
|
+
|
|
201
|
+
const storyblokApi = useStoryblokApi();
|
|
202
|
+
const { data } = await storyblokApi.get("cdn/stories/home", { version: "draft" });
|
|
203
|
+
const state = reactive({ story: data.story });
|
|
204
|
+
|
|
205
|
+
onMounted(() => {
|
|
206
|
+
useStoryblokBridge(state.story.id, story => (state.story = story));
|
|
207
|
+
});
|
|
208
|
+
</script>
|
|
209
|
+
```
|
|
189
210
|
|
|
190
211
|
#### Storyblok API
|
|
191
212
|
|
|
@@ -195,7 +216,7 @@ You can use an `apiOptions` object. This is passed down to the (storyblok-js-cli
|
|
|
195
216
|
app.use(StoryblokVue, {
|
|
196
217
|
accessToken: "<your-token>",
|
|
197
218
|
apiOptions: {
|
|
198
|
-
//storyblok-js-client config object
|
|
219
|
+
// storyblok-js-client config object
|
|
199
220
|
cache: { type: "memory" },
|
|
200
221
|
},
|
|
201
222
|
use: [apiPlugin],
|
|
@@ -218,7 +239,7 @@ app.use(StoryblokVue, {
|
|
|
218
239
|
});
|
|
219
240
|
```
|
|
220
241
|
|
|
221
|
-
|
|
242
|
+
In case you need it, you have still access to the raw `window.StoryblokBridge`:
|
|
222
243
|
|
|
223
244
|
```js
|
|
224
245
|
const sbBridge = new window.StoryblokBridge(options);
|
package/dist/storyblok-vue.js
CHANGED
|
@@ -1,13 +1,6 @@
|
|
|
1
|
-
(function(
|
|
2
|
-
`),function(u){if(o=u.indexOf(":"),n=V.trim(u.substr(0,o)).toLowerCase(),s=V.trim(u.substr(o+1)),n){if(t[n]&&ct.indexOf(n)>=0)return;n==="set-cookie"?t[n]=(t[n]?t[n]:[]).concat([s]):t[n]=t[n]?t[n]+", "+s:s}}),t},ce=v,ft=ce.isStandardBrowserEnv()?function(){var e=/(msie|trident)/i.test(navigator.userAgent),t=document.createElement("a"),n;function s(o){var a=o;return e&&(t.setAttribute("href",a),a=t.href),t.setAttribute("href",a),{href:t.href,protocol:t.protocol?t.protocol.replace(/:$/,""):"",host:t.host,search:t.search?t.search.replace(/^\?/,""):"",hash:t.hash?t.hash.replace(/^#/,""):"",hostname:t.hostname,port:t.port,pathname:t.pathname.charAt(0)==="/"?t.pathname:"/"+t.pathname}}return n=s(window.location.href),function(a){var u=ce.isString(a)?s(a):a;return u.protocol===n.protocol&&u.host===n.host}}():function(){return function(){return!0}}(),j=v,ht=nt,pt=st,mt=ae,vt=lt,gt=dt,yt=ft,F=le,de=function(e){return new Promise(function(n,s){var o=e.data,a=e.headers,u=e.responseType;j.isFormData(o)&&delete a["Content-Type"];var i=new XMLHttpRequest;if(e.auth){var l=e.auth.username||"",f=e.auth.password?unescape(encodeURIComponent(e.auth.password)):"";a.Authorization="Basic "+btoa(l+":"+f)}var h=vt(e.baseURL,e.url);i.open(e.method.toUpperCase(),mt(h,e.params,e.paramsSerializer),!0),i.timeout=e.timeout;function d(){if(!!i){var k="getAllResponseHeaders"in i?gt(i.getAllResponseHeaders()):null,b=!u||u==="text"||u==="json"?i.responseText:i.response,C={data:b,status:i.status,statusText:i.statusText,headers:k,config:e,request:i};ht(n,s,C),i=null}}if("onloadend"in i?i.onloadend=d:i.onreadystatechange=function(){!i||i.readyState!==4||i.status===0&&!(i.responseURL&&i.responseURL.indexOf("file:")===0)||setTimeout(d)},i.onabort=function(){!i||(s(F("Request aborted",e,"ECONNABORTED",i)),i=null)},i.onerror=function(){s(F("Network Error",e,null,i)),i=null},i.ontimeout=function(){var b="timeout of "+e.timeout+"ms exceeded";e.timeoutErrorMessage&&(b=e.timeoutErrorMessage),s(F(b,e,e.transitional&&e.transitional.clarifyTimeoutError?"ETIMEDOUT":"ECONNABORTED",i)),i=null},j.isStandardBrowserEnv()){var c=(e.withCredentials||yt(h))&&e.xsrfCookieName?pt.read(e.xsrfCookieName):void 0;c&&(a[e.xsrfHeaderName]=c)}"setRequestHeader"in i&&j.forEach(a,function(b,C){typeof o=="undefined"&&C.toLowerCase()==="content-type"?delete a[C]:i.setRequestHeader(C,b)}),j.isUndefined(e.withCredentials)||(i.withCredentials=!!e.withCredentials),u&&u!=="json"&&(i.responseType=e.responseType),typeof e.onDownloadProgress=="function"&&i.addEventListener("progress",e.onDownloadProgress),typeof e.onUploadProgress=="function"&&i.upload&&i.upload.addEventListener("progress",e.onUploadProgress),e.cancelToken&&e.cancelToken.promise.then(function(b){!i||(i.abort(),s(b),i=null)}),o||(o=null),i.send(o)})},p=v,fe=et,bt=ue,wt={"Content-Type":"application/x-www-form-urlencoded"};function he(r,e){!p.isUndefined(r)&&p.isUndefined(r["Content-Type"])&&(r["Content-Type"]=e)}function kt(){var r;return(typeof XMLHttpRequest!="undefined"||typeof process!="undefined"&&Object.prototype.toString.call(process)==="[object process]")&&(r=de),r}function Et(r,e,t){if(p.isString(r))try{return(e||JSON.parse)(r),p.trim(r)}catch(n){if(n.name!=="SyntaxError")throw n}return(t||JSON.stringify)(r)}var $={transitional:{silentJSONParsing:!0,forcedJSONParsing:!0,clarifyTimeoutError:!1},adapter:kt(),transformRequest:[function(e,t){return fe(t,"Accept"),fe(t,"Content-Type"),p.isFormData(e)||p.isArrayBuffer(e)||p.isBuffer(e)||p.isStream(e)||p.isFile(e)||p.isBlob(e)?e:p.isArrayBufferView(e)?e.buffer:p.isURLSearchParams(e)?(he(t,"application/x-www-form-urlencoded;charset=utf-8"),e.toString()):p.isObject(e)||t&&t["Content-Type"]==="application/json"?(he(t,"application/json"),Et(e)):e}],transformResponse:[function(e){var t=this.transitional,n=t&&t.silentJSONParsing,s=t&&t.forcedJSONParsing,o=!n&&this.responseType==="json";if(o||s&&p.isString(e)&&e.length)try{return JSON.parse(e)}catch(a){if(o)throw a.name==="SyntaxError"?bt(a,this,"E_JSON_PARSE"):a}return e}],timeout:0,xsrfCookieName:"XSRF-TOKEN",xsrfHeaderName:"X-XSRF-TOKEN",maxContentLength:-1,maxBodyLength:-1,validateStatus:function(e){return e>=200&&e<300}};$.headers={common:{Accept:"application/json, text/plain, */*"}},p.forEach(["delete","get","head"],function(e){$.headers[e]={}}),p.forEach(["post","put","patch"],function(e){$.headers[e]=p.merge(wt)});var z=$,Tt=v,Rt=z,St=function(e,t,n){var s=this||Rt;return Tt.forEach(n,function(a){e=a.call(s,e,t)}),e},pe=function(e){return!!(e&&e.__CANCEL__)},me=v,K=St,xt=pe,Ot=z;function W(r){r.cancelToken&&r.cancelToken.throwIfRequested()}var Ct=function(e){W(e),e.headers=e.headers||{},e.data=K.call(e,e.data,e.headers,e.transformRequest),e.headers=me.merge(e.headers.common||{},e.headers[e.method]||{},e.headers),me.forEach(["delete","get","head","post","put","patch","common"],function(s){delete e.headers[s]});var t=e.adapter||Ot.adapter;return t(e).then(function(s){return W(e),s.data=K.call(e,s.data,s.headers,e.transformResponse),s},function(s){return xt(s)||(W(e),s&&s.response&&(s.response.data=K.call(e,s.response.data,s.response.headers,e.transformResponse))),Promise.reject(s)})},m=v,ve=function(e,t){t=t||{};var n={},s=["url","method","data"],o=["headers","auth","proxy","params"],a=["baseURL","transformRequest","transformResponse","paramsSerializer","timeout","timeoutMessage","withCredentials","adapter","responseType","xsrfCookieName","xsrfHeaderName","onUploadProgress","onDownloadProgress","decompress","maxContentLength","maxBodyLength","maxRedirects","transport","httpAgent","httpsAgent","cancelToken","socketPath","responseEncoding"],u=["validateStatus"];function i(d,c){return m.isPlainObject(d)&&m.isPlainObject(c)?m.merge(d,c):m.isPlainObject(c)?m.merge({},c):m.isArray(c)?c.slice():c}function l(d){m.isUndefined(t[d])?m.isUndefined(e[d])||(n[d]=i(void 0,e[d])):n[d]=i(e[d],t[d])}m.forEach(s,function(c){m.isUndefined(t[c])||(n[c]=i(void 0,t[c]))}),m.forEach(o,l),m.forEach(a,function(c){m.isUndefined(t[c])?m.isUndefined(e[c])||(n[c]=i(void 0,e[c])):n[c]=i(void 0,t[c])}),m.forEach(u,function(c){c in t?n[c]=i(e[c],t[c]):c in e&&(n[c]=i(void 0,e[c]))});var f=s.concat(o).concat(a).concat(u),h=Object.keys(e).concat(Object.keys(t)).filter(function(c){return f.indexOf(c)===-1});return m.forEach(h,l),n},At={name:"axios",version:"0.21.4",description:"Promise based HTTP client for the browser and node.js",main:"index.js",scripts:{test:"grunt test",start:"node ./sandbox/server.js",build:"NODE_ENV=production grunt build",preversion:"npm test",version:"npm run build && grunt version && git add -A dist && git add CHANGELOG.md bower.json package.json",postversion:"git push && git push --tags",examples:"node ./examples/server.js",coveralls:"cat coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js",fix:"eslint --fix lib/**/*.js"},repository:{type:"git",url:"https://github.com/axios/axios.git"},keywords:["xhr","http","ajax","promise","node"],author:"Matt Zabriskie",license:"MIT",bugs:{url:"https://github.com/axios/axios/issues"},homepage:"https://axios-http.com",devDependencies:{coveralls:"^3.0.0","es6-promise":"^4.2.4",grunt:"^1.3.0","grunt-banner":"^0.6.0","grunt-cli":"^1.2.0","grunt-contrib-clean":"^1.1.0","grunt-contrib-watch":"^1.0.0","grunt-eslint":"^23.0.0","grunt-karma":"^4.0.0","grunt-mocha-test":"^0.13.3","grunt-ts":"^6.0.0-beta.19","grunt-webpack":"^4.0.2","istanbul-instrumenter-loader":"^1.0.0","jasmine-core":"^2.4.1",karma:"^6.3.2","karma-chrome-launcher":"^3.1.0","karma-firefox-launcher":"^2.1.0","karma-jasmine":"^1.1.1","karma-jasmine-ajax":"^0.1.13","karma-safari-launcher":"^1.0.0","karma-sauce-launcher":"^4.3.6","karma-sinon":"^1.0.5","karma-sourcemap-loader":"^0.3.8","karma-webpack":"^4.0.2","load-grunt-tasks":"^3.5.2",minimist:"^1.2.0",mocha:"^8.2.1",sinon:"^4.5.0","terser-webpack-plugin":"^4.2.3",typescript:"^4.0.5","url-search-params":"^0.10.0",webpack:"^4.44.2","webpack-dev-server":"^3.11.0"},browser:{"./lib/adapters/http.js":"./lib/adapters/xhr.js"},jsdelivr:"dist/axios.min.js",unpkg:"dist/axios.min.js",typings:"./index.d.ts",dependencies:{"follow-redirects":"^1.14.0"},bundlesize:[{path:"./dist/axios.min.js",threshold:"5kB"}]},ge=At,X={};["object","boolean","number","function","string","symbol"].forEach(function(r,e){X[r]=function(n){return typeof n===r||"a"+(e<1?"n ":" ")+r}});var ye={},Pt=ge.version.split(".");function be(r,e){for(var t=e?e.split("."):Pt,n=r.split("."),s=0;s<3;s++){if(t[s]>n[s])return!0;if(t[s]<n[s])return!1}return!1}X.transitional=function(e,t,n){var s=t&&be(t);function o(a,u){return"[Axios v"+ge.version+"] Transitional option '"+a+"'"+u+(n?". "+n:"")}return function(a,u,i){if(e===!1)throw new Error(o(u," has been removed in "+t));return s&&!ye[u]&&(ye[u]=!0,console.warn(o(u," has been deprecated since v"+t+" and will be removed in the near future"))),e?e(a,u,i):!0}};function _t(r,e,t){if(typeof r!="object")throw new TypeError("options must be an object");for(var n=Object.keys(r),s=n.length;s-- >0;){var o=n[s],a=e[o];if(a){var u=r[o],i=u===void 0||a(u,o,r);if(i!==!0)throw new TypeError("option "+o+" must be "+i);continue}if(t!==!0)throw Error("Unknown option "+o)}}var jt={isOlderVersion:be,assertOptions:_t,validators:X},we=v,$t=ae,ke=Ze,Ee=Ct,N=ve,Te=jt,R=Te.validators;function O(r){this.defaults=r,this.interceptors={request:new ke,response:new ke}}O.prototype.request=function(e){typeof e=="string"?(e=arguments[1]||{},e.url=arguments[0]):e=e||{},e=N(this.defaults,e),e.method?e.method=e.method.toLowerCase():this.defaults.method?e.method=this.defaults.method.toLowerCase():e.method="get";var t=e.transitional;t!==void 0&&Te.assertOptions(t,{silentJSONParsing:R.transitional(R.boolean,"1.0.0"),forcedJSONParsing:R.transitional(R.boolean,"1.0.0"),clarifyTimeoutError:R.transitional(R.boolean,"1.0.0")},!1);var n=[],s=!0;this.interceptors.request.forEach(function(d){typeof d.runWhen=="function"&&d.runWhen(e)===!1||(s=s&&d.synchronous,n.unshift(d.fulfilled,d.rejected))});var o=[];this.interceptors.response.forEach(function(d){o.push(d.fulfilled,d.rejected)});var a;if(!s){var u=[Ee,void 0];for(Array.prototype.unshift.apply(u,n),u=u.concat(o),a=Promise.resolve(e);u.length;)a=a.then(u.shift(),u.shift());return a}for(var i=e;n.length;){var l=n.shift(),f=n.shift();try{i=l(i)}catch(h){f(h);break}}try{a=Ee(i)}catch(h){return Promise.reject(h)}for(;o.length;)a=a.then(o.shift(),o.shift());return a},O.prototype.getUri=function(e){return e=N(this.defaults,e),$t(e.url,e.params,e.paramsSerializer).replace(/^\?/,"")},we.forEach(["delete","get","head","options"],function(e){O.prototype[e]=function(t,n){return this.request(N(n||{},{method:e,url:t,data:(n||{}).data}))}}),we.forEach(["post","put","patch"],function(e){O.prototype[e]=function(t,n,s){return this.request(N(s||{},{method:e,url:t,data:n}))}});var Nt=O;function Y(r){this.message=r}Y.prototype.toString=function(){return"Cancel"+(this.message?": "+this.message:"")},Y.prototype.__CANCEL__=!0;var Re=Y,Ut=Re;function U(r){if(typeof r!="function")throw new TypeError("executor must be a function.");var e;this.promise=new Promise(function(s){e=s});var t=this;r(function(s){t.reason||(t.reason=new Ut(s),e(t.reason))})}U.prototype.throwIfRequested=function(){if(this.reason)throw this.reason},U.source=function(){var e,t=new U(function(s){e=s});return{token:t,cancel:e}};var Lt=U,Bt=function(e){return function(n){return e.apply(null,n)}},qt=function(e){return typeof e=="object"&&e.isAxiosError===!0},Se=v,Dt=ne,L=Nt,Mt=ve,It=z;function xe(r){var e=new L(r),t=Dt(L.prototype.request,e);return Se.extend(t,L.prototype,e),Se.extend(t,e),t}var g=xe(It);g.Axios=L,g.create=function(e){return xe(Mt(g.defaults,e))},g.Cancel=Re,g.CancelToken=Lt,g.isCancel=pe,g.all=function(e){return Promise.all(e)},g.spread=Bt,g.isAxiosError=qt,D.exports=g,D.exports.default=g;var Ht=D.exports;/*!
|
|
1
|
+
var ee=Object.defineProperty;var C=Object.getOwnPropertySymbols;var te=Object.prototype.hasOwnProperty,re=Object.prototype.propertyIsEnumerable;var $=(u,h,p)=>h in u?ee(u,h,{enumerable:!0,configurable:!0,writable:!0,value:p}):u[h]=p,_=(u,h)=>{for(var p in h||(h={}))te.call(h,p)&&$(u,p,h[p]);if(C)for(var p of C(h))re.call(h,p)&&$(u,p,h[p]);return u};(function(u,h){typeof exports=="object"&&typeof module!="undefined"?h(exports,require("vue"),require("axios")):typeof define=="function"&&define.amd?define(["exports","vue","axios"],h):(u=typeof globalThis!="undefined"?globalThis:u||self,h(u.storyblokVue={},u.Vue,u.t))})(this,function(u,h,p){"use strict";function M(s){return s&&typeof s=="object"&&"default"in s?s:{default:s}}var x=M(p),I=Object.defineProperty,N=Object.defineProperties,B=Object.getOwnPropertyDescriptors,w=Object.getOwnPropertySymbols,q=Object.prototype.hasOwnProperty,V=Object.prototype.propertyIsEnumerable,T=(s,e,t)=>e in s?I(s,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):s[e]=t,f=(s,e)=>{for(var t in e||(e={}))q.call(e,t)&&T(s,t,e[t]);if(w)for(var t of w(e))V.call(e,t)&&T(s,t,e[t]);return s},b=(s,e)=>N(s,B(e));let R=!1;const O=[],L=s=>new Promise((e,t)=>{if(typeof window=="undefined"||(window.storyblokRegisterEvent=o=>{if(window.location===window.parent.location){console.warn("You are not in Draft Mode or in the Visual Editor.");return}R?o():O.push(o)},document.getElementById("storyblok-javascript-bridge")))return;const r=document.createElement("script");r.async=!0,r.src=s,r.id="storyblok-javascript-bridge",r.onerror=o=>t(o),r.onload=o=>{O.forEach(n=>n()),R=!0,e(o)},document.getElementsByTagName("head")[0].appendChild(r)});/*!
|
|
3
2
|
* storyblok-js-client v0.0.0-development
|
|
4
3
|
* Universal JavaScript SDK for Storyblok's API
|
|
5
4
|
* (c) 2020-2022 Stobylok Team
|
|
6
|
-
*/function Oe(r){return typeof r=="number"&&r==r&&r!==1/0&&r!==-1/0}function Ce(r,e,t){if(!Oe(e))throw new TypeError("Expected `limit` to be a finite number");if(!Oe(t))throw new TypeError("Expected `interval` to be a finite number");var n=[],s=[],o=0,a=function(){o++;var i=setTimeout(function(){o--,n.length>0&&a(),s=s.filter(function(f){return f!==i})},t);s.indexOf(i)<0&&s.push(i);var l=n.shift();l.resolve(r.apply(l.self,l.args))},u=function(){var i=arguments,l=this;return new Promise(function(f,h){n.push({resolve:f,reject:h,args:i,self:l}),o<e&&a()})};return u.abort=function(){s.forEach(clearTimeout),s=[],n.forEach(function(i){i.reject(new throttle.AbortError)}),n.length=0},u}Ce.AbortError=function(){Error.call(this,"Throttled function aborted"),this.name="AbortError"};const Jt=function(r,e){if(!r)return null;let t={};for(let n in r){let s=r[n];e.indexOf(n)>-1&&s!==null&&(t[n]=s)}return t};var Vt={nodes:{horizontal_rule:r=>({singleTag:"hr"}),blockquote:r=>({tag:"blockquote"}),bullet_list:r=>({tag:"ul"}),code_block:r=>({tag:["pre",{tag:"code",attrs:r.attrs}]}),hard_break:r=>({singleTag:"br"}),heading:r=>({tag:"h"+r.attrs.level}),image:r=>({singleTag:[{tag:"img",attrs:Jt(r.attrs,["src","alt","title"])}]}),list_item:r=>({tag:"li"}),ordered_list:r=>({tag:"ol"}),paragraph:r=>({tag:"p"})},marks:{bold:()=>({tag:"b"}),strike:()=>({tag:"strike"}),underline:()=>({tag:"u"}),strong:()=>({tag:"strong"}),code:()=>({tag:"code"}),italic:()=>({tag:"i"}),link(r){const e=E({},r.attrs),{linktype:t="url"}=r.attrs;return t==="email"&&(e.href="mailto:"+e.href),e.anchor&&(e.href=`${e.href}#${e.anchor}`,delete e.anchor),{tag:[{tag:"a",attrs:e}]}},styled:r=>({tag:[{tag:"span",attrs:r.attrs}]})}};class Ft{constructor(e){e||(e=Vt),this.marks=e.marks||[],this.nodes=e.nodes||[]}addNode(e,t){this.nodes[e]=t}addMark(e,t){this.marks[e]=t}render(e={}){if(e.content&&Array.isArray(e.content)){let t="";return e.content.forEach(n=>{t+=this.renderNode(n)}),t}return console.warn("The render method must receive an object with a content field, which is an array"),""}renderNode(e){let t=[];e.marks&&e.marks.forEach(s=>{const o=this.getMatchingMark(s);o&&t.push(this.renderOpeningTag(o.tag))});const n=this.getMatchingNode(e);return n&&n.tag&&t.push(this.renderOpeningTag(n.tag)),e.content?e.content.forEach(s=>{t.push(this.renderNode(s))}):e.text?t.push(function(s){const o={"&":"&","<":"<",">":">",'"':""","'":"'"},a=/[&<>"']/g,u=RegExp(a.source);return s&&u.test(s)?s.replace(a,i=>o[i]):s}(e.text)):n&&n.singleTag?t.push(this.renderTag(n.singleTag," /")):n&&n.html&&t.push(n.html),n&&n.tag&&t.push(this.renderClosingTag(n.tag)),e.marks&&e.marks.slice(0).reverse().forEach(s=>{const o=this.getMatchingMark(s);o&&t.push(this.renderClosingTag(o.tag))}),t.join("")}renderTag(e,t){return e.constructor===String?`<${e}${t}>`:e.map(n=>{if(n.constructor===String)return`<${n}${t}>`;{let s="<"+n.tag;if(n.attrs)for(let o in n.attrs){let a=n.attrs[o];a!==null&&(s+=` ${o}="${a}"`)}return`${s}${t}>`}}).join("")}renderOpeningTag(e){return this.renderTag(e,"")}renderClosingTag(e){return e.constructor===String?`</${e}>`:e.slice(0).reverse().map(t=>t.constructor===String?`</${t}>`:`</${t.tag}>`).join("")}getMatchingNode(e){if(typeof this.nodes[e.type]=="function")return this.nodes[e.type](e)}getMatchingMark(e){if(typeof this.marks[e.type]=="function")return this.marks[e.type](e)}}const zt=(r=0,e=r)=>{const t=Math.abs(e-r)||0,n=r<e?1:-1;return((s=0,o)=>[...Array(s)].map(o))(t,(s,o)=>o*n+r)},G=(r,e,t)=>{const n=[];for(const s in r){if(!Object.prototype.hasOwnProperty.call(r,s))continue;const o=r[s],a=t?"":encodeURIComponent(s);let u;u=typeof o=="object"?G(o,e?e+encodeURIComponent("["+a+"]"):a,Array.isArray(o)):(e?e+encodeURIComponent("["+a+"]"):a)+"="+encodeURIComponent(o),n.push(u)}return n.join("&")};let B={},S={};class Kt{constructor(e,t){if(!t){let o=e.region?"-"+e.region:"",a=e.https===!1?"http":"https";t=e.oauthToken===void 0?`${a}://api${o}.storyblok.com/v2`:`${a}://api${o}.storyblok.com/v1`}let n=Object.assign({},e.headers),s=5;e.oauthToken!==void 0&&(n.Authorization=e.oauthToken,s=3),e.rateLimit!==void 0&&(s=e.rateLimit),this.richTextResolver=new Ft(e.richTextSchema),typeof e.componentResolver=="function"&&this.setComponentResolver(e.componentResolver),this.maxRetries=e.maxRetries||5,this.throttle=Ce(this.throttledRequest,s,1e3),this.accessToken=e.accessToken,this.relations={},this.links={},this.cache=e.cache||{clear:"manual"},this.client=Ht.create({baseURL:t,timeout:e.timeout||0,headers:n,proxy:e.proxy||!1}),e.responseInterceptor&&this.client.interceptors.response.use(o=>e.responseInterceptor(o))}setComponentResolver(e){this.richTextResolver.addNode("blok",t=>{let n="";return t.attrs.body.forEach(s=>{n+=e(s.component,s)}),{html:n}})}parseParams(e={}){return e.version||(e.version="published"),e.token||(e.token=this.getToken()),e.cv||(e.cv=S[e.token]),Array.isArray(e.resolve_relations)&&(e.resolve_relations=e.resolve_relations.join(",")),e}factoryParamOptions(e,t={}){return((n="")=>n.indexOf("/cdn/")>-1)(e)?this.parseParams(t):t}makeRequest(e,t,n,s){const o=this.factoryParamOptions(e,((a={},u=25,i=1)=>q(E({},a),{per_page:u,page:i}))(t,n,s));return this.cacheResponse(e,o)}get(e,t){let n="/"+e;const s=this.factoryParamOptions(n,t);return this.cacheResponse(n,s)}async getAll(e,t={},n){const s=t.per_page||25,o="/"+e,a=o.split("/");n=n||a[a.length-1];const u=await this.makeRequest(o,t,s,1),i=Math.ceil(u.total/s);return((l=[],f)=>l.map(f).reduce((h,d)=>[...h,...d],[]))([u,...await(async(l=[],f)=>Promise.all(l.map(f)))(zt(1,i),async l=>this.makeRequest(o,t,s,l+1))],l=>Object.values(l.data[n]))}post(e,t){let n="/"+e;return this.throttle("post",n,t)}put(e,t){let n="/"+e;return this.throttle("put",n,t)}delete(e,t){let n="/"+e;return this.throttle("delete",n,t)}getStories(e){return this.get("cdn/stories",e)}getStory(e,t){return this.get("cdn/stories/"+e,t)}setToken(e){this.accessToken=e}getToken(){return this.accessToken}_cleanCopy(e){return JSON.parse(JSON.stringify(e))}_insertLinks(e,t){const n=e[t];n&&n.fieldtype=="multilink"&&n.linktype=="story"&&typeof n.id=="string"&&this.links[n.id]?n.story=this._cleanCopy(this.links[n.id]):n&&n.linktype==="story"&&typeof n.uuid=="string"&&this.links[n.uuid]&&(n.story=this._cleanCopy(this.links[n.uuid]))}_insertRelations(e,t,n){if(n.indexOf(e.component+"."+t)>-1){if(typeof e[t]=="string")this.relations[e[t]]&&(e[t]=this._cleanCopy(this.relations[e[t]]));else if(e[t].constructor===Array){let s=[];e[t].forEach(o=>{this.relations[o]&&s.push(this._cleanCopy(this.relations[o]))}),e[t]=s}}}iterateTree(e,t){let n=s=>{if(s!=null){if(s.constructor===Array)for(let o=0;o<s.length;o++)n(s[o]);else if(s.constructor===Object){if(s._stopResolving)return;for(let o in s)(s.component&&s._uid||s.type==="link")&&(this._insertRelations(s,o,t),this._insertLinks(s,o)),n(s[o])}}};n(e.content)}async resolveLinks(e,t){let n=[];if(e.link_uuids){const s=e.link_uuids.length;let o=[];const a=50;for(let u=0;u<s;u+=a){const i=Math.min(s,u+a);o.push(e.link_uuids.slice(u,i))}for(let u=0;u<o.length;u++)(await this.getStories({per_page:a,language:t.language,version:t.version,by_uuids:o[u].join(",")})).data.stories.forEach(i=>{n.push(i)})}else n=e.links;n.forEach(s=>{this.links[s.uuid]=q(E({},s),{_stopResolving:!0})})}async resolveRelations(e,t){let n=[];if(e.rel_uuids){const s=e.rel_uuids.length;let o=[];const a=50;for(let u=0;u<s;u+=a){const i=Math.min(s,u+a);o.push(e.rel_uuids.slice(u,i))}for(let u=0;u<o.length;u++)(await this.getStories({per_page:a,language:t.language,version:t.version,by_uuids:o[u].join(",")})).data.stories.forEach(i=>{n.push(i)})}else n=e.rels;n.forEach(s=>{this.relations[s.uuid]=q(E({},s),{_stopResolving:!0})})}async resolveStories(e,t){let n=[];t.resolve_relations!==void 0&&t.resolve_relations.length>0&&(n=t.resolve_relations.split(","),await this.resolveRelations(e,t)),["1","story","url"].indexOf(t.resolve_links)>-1&&await this.resolveLinks(e,t);for(const s in this.relations)this.iterateTree(this.relations[s],n);e.story?this.iterateTree(e.story,n):e.stories.forEach(s=>{this.iterateTree(s,n)})}cacheResponse(e,t,n){return n===void 0&&(n=0),new Promise(async(s,o)=>{let a=G({url:e,params:t}),u=this.cacheProvider();if(this.cache.clear==="auto"&&t.version==="draft"&&await this.flushCache(),t.version==="published"&&e!="/cdn/spaces/me"){const l=await u.get(a);if(l)return s(l)}try{let l=await this.throttle("get",e,{params:t,paramsSerializer:h=>G(h)}),f={data:l.data,headers:l.headers};if(l.headers["per-page"]&&(f=Object.assign({},f,{perPage:parseInt(l.headers["per-page"]),total:parseInt(l.headers.total)})),l.status!=200)return o(l);(f.data.story||f.data.stories)&&await this.resolveStories(f.data,t),t.version==="published"&&e!="/cdn/spaces/me"&&u.set(a,f),f.data.cv&&(t.version=="draft"&&S[t.token]!=f.data.cv&&this.flushCache(),S[t.token]=f.data.cv),s(f)}catch(l){if(l.response&&l.response.status===429&&(n+=1)<this.maxRetries)return console.log(`Hit rate limit. Retrying in ${n} seconds.`),await(i=1e3*n,new Promise(f=>setTimeout(f,i))),this.cacheResponse(e,t,n).then(s).catch(o);o(l)}var i})}throttledRequest(e,t,n){return this.client[e](t,n)}cacheVersions(){return S}cacheVersion(){return S[this.accessToken]}setCacheVersion(e){this.accessToken&&(S[this.accessToken]=e)}cacheProvider(){switch(this.cache.type){case"memory":return{get:e=>B[e],getAll:()=>B,set(e,t){B[e]=t},flush(){B={}}};default:return{get(){},getAll(){},set(){},flush(){}}}}async flushCache(){return await this.cacheProvider().flush(),this}}var Wt=(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 Kt(e)}},Xt=r=>{if(typeof r!="object"||typeof r._editable=="undefined")return{};const e=JSON.parse(r._editable.replace(/^<!--#storyblok#/,"").replace(/-->$/,""));return{"data-blok-c":JSON.stringify(e),"data-blok-uid":e.id+"-"+e.uid}};const Yt=(r,e,t={})=>{if(typeof window!="undefined"){if(typeof window.storyblokRegisterEvent=="undefined"){console.error("Storyblok Bridge is disabled. Please enable it to use it. Read https://github.com/storyblok/storyblok-js");return}window.storyblokRegisterEvent(()=>{new window.StoryblokBridge(t).on(["input","published","change"],s=>{s.action=="input"&&s.story.id===r?e(s.story):window.location.reload()})})}},Gt=(r={})=>{const{bridge:e,accessToken:t,use:n=[],apiOptions:s={}}=r;s.accessToken=s.accessToken||t;const o={bridge:e,apiOptions:s};let a={};return n.forEach(u=>{a=E(E({},a),u(o))}),e!==!1&&Ne("https://app.storyblok.com/f/storyblok-v2-latest.js"),a},Zt={bind(r,e){if(e.value){const t=Xt(e.value);r.setAttribute("data-blok-c",t["data-blok-c"]),r.setAttribute("data-blok-uid",t["data-blok-uid"]),r.classList.add("storyblok__outline")}}};let Z=null;const Qt=()=>(Z||console.error(`You can't use useStoryblokApi if you're not loading apiPlugin. Please enable it like in this example:
|
|
7
|
-
|
|
8
|
-
import { StoryblokVue, apiPlugin } from "@storyblok/vue";
|
|
9
|
-
app.use(StoryblokVue, {
|
|
10
|
-
accessToken: "<your-token>",
|
|
11
|
-
use: [apiPlugin], // use it only if you need it
|
|
12
|
-
});
|
|
13
|
-
`),Z),Ae={install(r,e={}){r.directive("editable",Zt);const{storyblokApi:t}=Gt(e);Z=t,r.prototype.$storyblokApi=t}};typeof window!="undefined"&&window.Vue&&window.Vue.use(Ae),y.StoryblokVue=Ae,y.apiPlugin=Wt,y.useStoryblokApi=Qt,y.useStoryblokBridge=Yt,Object.defineProperty(y,"__esModule",{value:!0}),y[Symbol.toStringTag]="Module"});
|
|
5
|
+
*/function S(s){return typeof s=="number"&&s==s&&s!==1/0&&s!==-1/0}function E(s,e,t){if(!S(e))throw new TypeError("Expected `limit` to be a finite number");if(!S(t))throw new TypeError("Expected `interval` to be a finite number");var r=[],o=[],n=0,i=function(){n++;var c=setTimeout(function(){n--,r.length>0&&i(),o=o.filter(function(d){return d!==c})},t);o.indexOf(c)<0&&o.push(c);var l=r.shift();l.resolve(s.apply(l.self,l.args))},a=function(){var c=arguments,l=this;return new Promise(function(d,k){r.push({resolve:d,reject:k,args:c,self:l}),n<e&&i()})};return a.abort=function(){o.forEach(clearTimeout),o=[],r.forEach(function(c){c.reject(new throttle.AbortError)}),r.length=0},a}E.AbortError=function(){Error.call(this,"Throttled function aborted"),this.name="AbortError"};const D=function(s,e){if(!s)return null;let t={};for(let r in s){let o=s[r];e.indexOf(r)>-1&&o!==null&&(t[r]=o)}return t};var z={nodes:{horizontal_rule:s=>({singleTag:"hr"}),blockquote:s=>({tag:"blockquote"}),bullet_list:s=>({tag:"ul"}),code_block:s=>({tag:["pre",{tag:"code",attrs:s.attrs}]}),hard_break:s=>({singleTag:"br"}),heading:s=>({tag:"h"+s.attrs.level}),image:s=>({singleTag:[{tag:"img",attrs:D(s.attrs,["src","alt","title"])}]}),list_item:s=>({tag:"li"}),ordered_list:s=>({tag:"ol"}),paragraph:s=>({tag:"p"})},marks:{bold:()=>({tag:"b"}),strike:()=>({tag:"strike"}),underline:()=>({tag:"u"}),strong:()=>({tag:"strong"}),code:()=>({tag:"code"}),italic:()=>({tag:"i"}),link(s){const e=f({},s.attrs),{linktype:t="url"}=s.attrs;return t==="email"&&(e.href="mailto:"+e.href),e.anchor&&(e.href=`${e.href}#${e.anchor}`,delete e.anchor),{tag:[{tag:"a",attrs:e}]}},styled:s=>({tag:[{tag:"span",attrs:s.attrs}]})}};class U{constructor(e){e||(e=z),this.marks=e.marks||[],this.nodes=e.nodes||[]}addNode(e,t){this.nodes[e]=t}addMark(e,t){this.marks[e]=t}render(e={}){if(e.content&&Array.isArray(e.content)){let t="";return e.content.forEach(r=>{t+=this.renderNode(r)}),t}return console.warn("The render method must receive an object with a content field, which is an array"),""}renderNode(e){let t=[];e.marks&&e.marks.forEach(o=>{const n=this.getMatchingMark(o);n&&t.push(this.renderOpeningTag(n.tag))});const r=this.getMatchingNode(e);return r&&r.tag&&t.push(this.renderOpeningTag(r.tag)),e.content?e.content.forEach(o=>{t.push(this.renderNode(o))}):e.text?t.push(function(o){const n={"&":"&","<":"<",">":">",'"':""","'":"'"},i=/[&<>"']/g,a=RegExp(i.source);return o&&a.test(o)?o.replace(i,c=>n[c]):o}(e.text)):r&&r.singleTag?t.push(this.renderTag(r.singleTag," /")):r&&r.html&&t.push(r.html),r&&r.tag&&t.push(this.renderClosingTag(r.tag)),e.marks&&e.marks.slice(0).reverse().forEach(o=>{const n=this.getMatchingMark(o);n&&t.push(this.renderClosingTag(n.tag))}),t.join("")}renderTag(e,t){return e.constructor===String?`<${e}${t}>`:e.map(r=>{if(r.constructor===String)return`<${r}${t}>`;{let o="<"+r.tag;if(r.attrs)for(let n in r.attrs){let i=r.attrs[n];i!==null&&(o+=` ${n}="${i}"`)}return`${o}${t}>`}}).join("")}renderOpeningTag(e){return this.renderTag(e,"")}renderClosingTag(e){return e.constructor===String?`</${e}>`:e.slice(0).reverse().map(t=>t.constructor===String?`</${t}>`:`</${t.tag}>`).join("")}getMatchingNode(e){if(typeof this.nodes[e.type]=="function")return this.nodes[e.type](e)}getMatchingMark(e){if(typeof this.marks[e.type]=="function")return this.marks[e.type](e)}}const J=(s=0,e=s)=>{const t=Math.abs(e-s)||0,r=s<e?1:-1;return((o=0,n)=>[...Array(o)].map(n))(t,(o,n)=>n*r+s)},v=(s,e,t)=>{const r=[];for(const o in s){if(!Object.prototype.hasOwnProperty.call(s,o))continue;const n=s[o],i=t?"":encodeURIComponent(o);let a;a=typeof n=="object"?v(n,e?e+encodeURIComponent("["+i+"]"):i,Array.isArray(n)):(e?e+encodeURIComponent("["+i+"]"):i)+"="+encodeURIComponent(n),r.push(a)}return r.join("&")};let m={},g={};class Y{constructor(e,t){if(!t){let n=e.region?"-"+e.region:"",i=e.https===!1?"http":"https";t=e.oauthToken===void 0?`${i}://api${n}.storyblok.com/v2`:`${i}://api${n}.storyblok.com/v1`}let r=Object.assign({},e.headers),o=5;e.oauthToken!==void 0&&(r.Authorization=e.oauthToken,o=3),e.rateLimit!==void 0&&(o=e.rateLimit),this.richTextResolver=new U(e.richTextSchema),typeof e.componentResolver=="function"&&this.setComponentResolver(e.componentResolver),this.maxRetries=e.maxRetries||5,this.throttle=E(this.throttledRequest,o,1e3),this.accessToken=e.accessToken,this.relations={},this.links={},this.cache=e.cache||{clear:"manual"},this.client=x.default.create({baseURL:t,timeout:e.timeout||0,headers:r,proxy:e.proxy||!1}),e.responseInterceptor&&this.client.interceptors.response.use(n=>e.responseInterceptor(n))}setComponentResolver(e){this.richTextResolver.addNode("blok",t=>{let r="";return t.attrs.body.forEach(o=>{r+=e(o.component,o)}),{html:r}})}parseParams(e={}){return e.version||(e.version="published"),e.token||(e.token=this.getToken()),e.cv||(e.cv=g[e.token]),Array.isArray(e.resolve_relations)&&(e.resolve_relations=e.resolve_relations.join(",")),e}factoryParamOptions(e,t={}){return((r="")=>r.indexOf("/cdn/")>-1)(e)?this.parseParams(t):t}makeRequest(e,t,r,o){const n=this.factoryParamOptions(e,((i={},a=25,c=1)=>b(f({},i),{per_page:a,page:c}))(t,r,o));return this.cacheResponse(e,n)}get(e,t){let r="/"+e;const o=this.factoryParamOptions(r,t);return this.cacheResponse(r,o)}async getAll(e,t={},r){const o=t.per_page||25,n="/"+e,i=n.split("/");r=r||i[i.length-1];const a=await this.makeRequest(n,t,o,1),c=Math.ceil(a.total/o);return((l=[],d)=>l.map(d).reduce((k,Z)=>[...k,...Z],[]))([a,...await(async(l=[],d)=>Promise.all(l.map(d)))(J(1,c),async l=>this.makeRequest(n,t,o,l+1))],l=>Object.values(l.data[r]))}post(e,t){let r="/"+e;return this.throttle("post",r,t)}put(e,t){let r="/"+e;return this.throttle("put",r,t)}delete(e,t){let r="/"+e;return this.throttle("delete",r,t)}getStories(e){return this.get("cdn/stories",e)}getStory(e,t){return this.get("cdn/stories/"+e,t)}setToken(e){this.accessToken=e}getToken(){return this.accessToken}_cleanCopy(e){return JSON.parse(JSON.stringify(e))}_insertLinks(e,t){const r=e[t];r&&r.fieldtype=="multilink"&&r.linktype=="story"&&typeof r.id=="string"&&this.links[r.id]?r.story=this._cleanCopy(this.links[r.id]):r&&r.linktype==="story"&&typeof r.uuid=="string"&&this.links[r.uuid]&&(r.story=this._cleanCopy(this.links[r.uuid]))}_insertRelations(e,t,r){if(r.indexOf(e.component+"."+t)>-1){if(typeof e[t]=="string")this.relations[e[t]]&&(e[t]=this._cleanCopy(this.relations[e[t]]));else if(e[t].constructor===Array){let o=[];e[t].forEach(n=>{this.relations[n]&&o.push(this._cleanCopy(this.relations[n]))}),e[t]=o}}}iterateTree(e,t){let r=o=>{if(o!=null){if(o.constructor===Array)for(let n=0;n<o.length;n++)r(o[n]);else if(o.constructor===Object){if(o._stopResolving)return;for(let n in o)(o.component&&o._uid||o.type==="link")&&(this._insertRelations(o,n,t),this._insertLinks(o,n)),r(o[n])}}};r(e.content)}async resolveLinks(e,t){let r=[];if(e.link_uuids){const o=e.link_uuids.length;let n=[];const i=50;for(let a=0;a<o;a+=i){const c=Math.min(o,a+i);n.push(e.link_uuids.slice(a,c))}for(let a=0;a<n.length;a++)(await this.getStories({per_page:i,language:t.language,version:t.version,by_uuids:n[a].join(",")})).data.stories.forEach(c=>{r.push(c)})}else r=e.links;r.forEach(o=>{this.links[o.uuid]=b(f({},o),{_stopResolving:!0})})}async resolveRelations(e,t){let r=[];if(e.rel_uuids){const o=e.rel_uuids.length;let n=[];const i=50;for(let a=0;a<o;a+=i){const c=Math.min(o,a+i);n.push(e.rel_uuids.slice(a,c))}for(let a=0;a<n.length;a++)(await this.getStories({per_page:i,language:t.language,version:t.version,by_uuids:n[a].join(",")})).data.stories.forEach(c=>{r.push(c)})}else r=e.rels;r.forEach(o=>{this.relations[o.uuid]=b(f({},o),{_stopResolving:!0})})}async resolveStories(e,t){let r=[];t.resolve_relations!==void 0&&t.resolve_relations.length>0&&(r=t.resolve_relations.split(","),await this.resolveRelations(e,t)),["1","story","url"].indexOf(t.resolve_links)>-1&&await this.resolveLinks(e,t);for(const o in this.relations)this.iterateTree(this.relations[o],r);e.story?this.iterateTree(e.story,r):e.stories.forEach(o=>{this.iterateTree(o,r)})}cacheResponse(e,t,r){return r===void 0&&(r=0),new Promise(async(o,n)=>{let i=v({url:e,params:t}),a=this.cacheProvider();if(this.cache.clear==="auto"&&t.version==="draft"&&await this.flushCache(),t.version==="published"&&e!="/cdn/spaces/me"){const l=await a.get(i);if(l)return o(l)}try{let l=await this.throttle("get",e,{params:t,paramsSerializer:k=>v(k)}),d={data:l.data,headers:l.headers};if(l.headers["per-page"]&&(d=Object.assign({},d,{perPage:parseInt(l.headers["per-page"]),total:parseInt(l.headers.total)})),l.status!=200)return n(l);(d.data.story||d.data.stories)&&await this.resolveStories(d.data,t),t.version==="published"&&e!="/cdn/spaces/me"&&a.set(i,d),d.data.cv&&(t.version=="draft"&&g[t.token]!=d.data.cv&&this.flushCache(),g[t.token]=d.data.cv),o(d)}catch(l){if(l.response&&l.response.status===429&&(r+=1)<this.maxRetries)return console.log(`Hit rate limit. Retrying in ${r} seconds.`),await(c=1e3*r,new Promise(d=>setTimeout(d,c))),this.cacheResponse(e,t,r).then(o).catch(n);n(l)}var c})}throttledRequest(e,t,r){return this.client[e](t,r)}cacheVersions(){return g}cacheVersion(){return g[this.accessToken]}setCacheVersion(e){this.accessToken&&(g[this.accessToken]=e)}cacheProvider(){switch(this.cache.type){case"memory":return{get:e=>m[e],getAll:()=>m,set(e,t){m[e]=t},flush(){m={}}};default:return{get(){},getAll(){},set(){},flush(){}}}}async flushCache(){return await this.cacheProvider().flush(),this}}var H=(s={})=>{const{apiOptions:e}=s;if(!e.accessToken){console.error("You need to provide an access token to interact with Storyblok API. Read https://www.storyblok.com/docs/api/content-delivery#topics/authentication");return}return{storyblokApi:new Y(e)}},F=s=>{if(typeof s!="object"||typeof s._editable=="undefined")return{};const e=JSON.parse(s._editable.replace(/^<!--#storyblok#/,"").replace(/-->$/,""));return{"data-blok-c":JSON.stringify(e),"data-blok-uid":e.id+"-"+e.uid}};const P=(s,e,t={})=>{if(typeof window!="undefined"){if(typeof window.storyblokRegisterEvent=="undefined"){console.error("Storyblok Bridge is disabled. Please enable it to use it. Read https://github.com/storyblok/storyblok-js");return}window.storyblokRegisterEvent(()=>{new window.StoryblokBridge(t).on(["input","published","change"],o=>{o.action=="input"&&o.story.id===s?e(o.story):window.location.reload()})})}},G=(s={})=>{const{bridge:e,accessToken:t,use:r=[],apiOptions:o={}}=s;o.accessToken=o.accessToken||t;const n={bridge:e,apiOptions:o};let i={};return r.forEach(a=>{i=f(f({},i),a(n))}),e!==!1&&L("https://app.storyblok.com/f/storyblok-v2-latest.js"),i},j={props:{blok:Object},setup(s){return(e,t)=>(h.openBlock(),h.createBlock(h.resolveDynamicComponent(s.blok.component),h.normalizeProps(h.guardReactiveProps(_(_({},e.$props),e.$attrs))),null,16))}},K={beforeMount(s,e){if(e.value){const t=F(e.value);s.setAttribute("data-blok-c",t["data-blok-c"]),s.setAttribute("data-blok-uid",t["data-blok-uid"]),s.classList.add("storyblok__outline")}}},A=s=>{console.error(`You can't use ${s} if you're not loading apiPlugin. Please provide it on StoryblokVue initialization.
|
|
6
|
+
`)};let y=null;const Q=()=>(y||A("useStoryblokApi"),y),W=async(s,e={},t={})=>{const r=h.ref(null);if(h.onMounted(()=>{r.value&&r.value.id&&P(r.value.id,o=>r.value=o,t)}),y){const{data:o}=await y.get(`cdn/stories/${s}`,e);r.value=o.story}else A("useStoryblok");return r},X={install(s,e={}){s.directive("editable",K),s.component("StoryblokComponent",j);const{storyblokApi:t}=G(e);y=t}};u.StoryblokComponent=j,u.StoryblokVue=X,u.apiPlugin=H,u.useStoryblok=W,u.useStoryblokApi=Q,u.useStoryblokBridge=P,Object.defineProperty(u,"__esModule",{value:!0}),u[Symbol.toStringTag]="Module"});
|