@storyblok/nuxt 3.0.4 → 4.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +47 -75
- package/package.json +23 -19
- package/src/module.js +44 -0
- package/src/runtime/plugin.js +7 -0
- package/dist/storyblok-nuxt.js +0 -6
- package/dist/storyblok-nuxt.mjs +0 -567
- package/module/index.js +0 -34
- package/module/plugin.js +0 -29
package/README.md
CHANGED
|
@@ -3,15 +3,15 @@
|
|
|
3
3
|
<img src="https://a.storyblok.com/f/88751/1776x360/b8979e5c96/sb-nuxt.png" alt="Storyblok Logo">
|
|
4
4
|
</a>
|
|
5
5
|
<h1 align="center">@storyblok/nuxt</h1>
|
|
6
|
-
<p align="center">Nuxt
|
|
6
|
+
<p align="center">Nuxt 3 module for the <a href="http://www.storyblok.com?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-nuxt" target="_blank">Storyblok</a>, Headless CMS.</p> <br />
|
|
7
7
|
</div>
|
|
8
8
|
|
|
9
9
|
<p align="center">
|
|
10
|
-
<a href="https://npmjs.com/package/@storyblok/nuxt">
|
|
11
|
-
<img src="https://img.shields.io/npm/v/@storyblok/nuxt/latest.svg?style=flat-square" alt="Storyblok JS Client" />
|
|
10
|
+
<a href="https://npmjs.com/package/@storyblok/nuxt-2">
|
|
11
|
+
<img src="https://img.shields.io/npm/v/@storyblok/nuxt-2/latest.svg?style=flat-square" alt="Storyblok JS Client" />
|
|
12
12
|
</a>
|
|
13
|
-
<a href="https://npmjs.com/package/@storyblok/nuxt" rel="nofollow">
|
|
14
|
-
<img src="https://img.shields.io/npm/dt/@storyblok/nuxt.svg?style=flat-square" alt="npm">
|
|
13
|
+
<a href="https://npmjs.com/package/@storyblok/nuxt-2" rel="nofollow">
|
|
14
|
+
<img src="https://img.shields.io/npm/dt/@storyblok/nuxt-2.svg?style=flat-square" alt="npm">
|
|
15
15
|
</a>
|
|
16
16
|
</p>
|
|
17
17
|
|
|
@@ -27,11 +27,13 @@
|
|
|
27
27
|
</a>
|
|
28
28
|
</p>
|
|
29
29
|
|
|
30
|
-
|
|
30
|
+
### Live Demo
|
|
31
|
+
|
|
32
|
+
If you are in a hurry, check out our official **[live demo](https://stackblitz.com/edit/nuxt-3-sdk-demo?file=pages/index.vue)** on Stackblitz.
|
|
31
33
|
|
|
32
34
|
## 🚀 Usage
|
|
33
35
|
|
|
34
|
-
_Note: This module is for Nuxt
|
|
36
|
+
_Note: This module is for Nuxt 3. [Check out `@storyblok/nuxt-2` for Nuxt 2](https://github.com/storyblok/storyblok-nuxt-2)_.
|
|
35
37
|
|
|
36
38
|
> 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-nuxt) guide to get a project ready in less than 5 minutes.
|
|
37
39
|
|
|
@@ -44,15 +46,30 @@ npm install @storyblok/nuxt
|
|
|
44
46
|
# yarn add @storyblok/nuxt
|
|
45
47
|
```
|
|
46
48
|
|
|
47
|
-
|
|
49
|
+
Add following code to buildModules section of `nuxt.config.js` and replace the accessToken with API token from Storyblok space.
|
|
48
50
|
|
|
49
51
|
```js
|
|
50
|
-
{
|
|
52
|
+
import { defineNuxtConfig } from "nuxt";
|
|
53
|
+
|
|
54
|
+
export default defineNuxtConfig({
|
|
51
55
|
buildModules: [
|
|
56
|
+
["@storyblok/nuxt", { accessToken: "<your-access-token>" }]
|
|
52
57
|
// ...
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
58
|
+
]
|
|
59
|
+
});
|
|
60
|
+
```
|
|
61
|
+
|
|
62
|
+
You can also use the `storyblok` config if you prefer:
|
|
63
|
+
|
|
64
|
+
```js
|
|
65
|
+
import { defineNuxtConfig } from "nuxt";
|
|
66
|
+
|
|
67
|
+
export default defineNuxtConfig({
|
|
68
|
+
buildModules: ["@storyblok/nuxt"],
|
|
69
|
+
storyblok: {
|
|
70
|
+
accessToken: "<your-access-token>"
|
|
71
|
+
}
|
|
72
|
+
});
|
|
56
73
|
```
|
|
57
74
|
|
|
58
75
|
#### Options
|
|
@@ -61,7 +78,7 @@ When you initialize the module, you can pass all [_@storyblok/vue_ options](http
|
|
|
61
78
|
|
|
62
79
|
```js
|
|
63
80
|
// Defaults
|
|
64
|
-
["@storyblok/nuxt
|
|
81
|
+
["@storyblok/nuxt", {
|
|
65
82
|
{
|
|
66
83
|
accessToken: "<your-access-token>",
|
|
67
84
|
bridge: true,
|
|
@@ -71,13 +88,13 @@ When you initialize the module, you can pass all [_@storyblok/vue_ options](http
|
|
|
71
88
|
}]
|
|
72
89
|
```
|
|
73
90
|
|
|
74
|
-
|
|
91
|
+
### Getting started
|
|
75
92
|
|
|
76
93
|
### 1. Creating and linking your components to Storyblok Visual Editor
|
|
77
94
|
|
|
78
95
|
To link your Vue components to their equivalent you created in Storyblok:
|
|
79
96
|
|
|
80
|
-
- First, you need to load them globally.
|
|
97
|
+
- First, you need to load them globally. You can just place them on the `~/storyblok` directory and will be discovered automagically, otherwise you set another directory can load them manually (for example, by [using a Nuxt plugin](https://stackoverflow.com/questions/43040692/global-components-in-vue-nuxt)).
|
|
81
98
|
|
|
82
99
|
- For each components, use the `v-editable` directive on its root element, passing the `blok` property that they receive:
|
|
83
100
|
|
|
@@ -88,7 +105,7 @@ To link your Vue components to their equivalent you created in Storyblok:
|
|
|
88
105
|
- Finally, use `<StoryblokComponent>` which available globally in the Nuxt app:
|
|
89
106
|
|
|
90
107
|
```html
|
|
91
|
-
<StoryblokComponent blok="blok" />
|
|
108
|
+
<StoryblokComponent :blok="blok" />
|
|
92
109
|
```
|
|
93
110
|
|
|
94
111
|
> The `blok` is the actual blok data coming from [Storblok's Content Delivery API](https://www.storyblok.com/docs/api/content-delivery/v2?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-nuxt).
|
|
@@ -97,14 +114,11 @@ To link your Vue components to their equivalent you created in Storyblok:
|
|
|
97
114
|
|
|
98
115
|
#### Composition API
|
|
99
116
|
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
The simplest way is by using the `useStoryblok` one-liner composable, which uses the [useFetch from @nuxtjs/composition-api](https://composition-api.nuxtjs.org/lifecycle/useFetch) under the hood:
|
|
117
|
+
The simplest way is by using the `useStoryblok` one-liner composable (it's autoimported):
|
|
103
118
|
|
|
104
119
|
```html
|
|
105
120
|
<script setup>
|
|
106
|
-
|
|
107
|
-
const { story, fetchState } = useStoryblok("vue", { version: "draft" });
|
|
121
|
+
const story = await useStoryblok("vue", { version: "draft" });
|
|
108
122
|
</script>
|
|
109
123
|
|
|
110
124
|
<template>
|
|
@@ -116,23 +130,15 @@ Which is the short-hand equivalent to using `useStoryblokApi` and `useStoryblokB
|
|
|
116
130
|
|
|
117
131
|
```html
|
|
118
132
|
<script setup>
|
|
119
|
-
import { onMounted, ref, useFetch } from "@nuxtjs/composition-api";
|
|
120
|
-
import { useStoryblokBridge, useStoryblokApi } from "@storyblok/nuxt";
|
|
121
|
-
|
|
122
133
|
const story = ref(null);
|
|
123
|
-
|
|
124
|
-
const {
|
|
125
|
-
|
|
126
|
-
const { data } = await storyblokApi.get(`cdn/stories/vue/test`, {
|
|
127
|
-
version: "draft",
|
|
128
|
-
});
|
|
129
|
-
story.value = data.story;
|
|
134
|
+
const storyblokApi = useStoryblokApi();
|
|
135
|
+
const { data } = await storyblokApi.get("cdn/stories/vue", {
|
|
136
|
+
version: "draft"
|
|
130
137
|
});
|
|
131
|
-
|
|
138
|
+
story.value = data.story;
|
|
132
139
|
|
|
133
|
-
onMounted(
|
|
134
|
-
|
|
135
|
-
useStoryblokBridge(story.value.id, (evStory) => (story.value = evStory));
|
|
140
|
+
onMounted(() => {
|
|
141
|
+
useStoryblokBridge(story.value.id, (evStory) => (story.value = evStory));
|
|
136
142
|
});
|
|
137
143
|
</script>
|
|
138
144
|
|
|
@@ -141,42 +147,11 @@ Which is the short-hand equivalent to using `useStoryblokApi` and `useStoryblokB
|
|
|
141
147
|
</template>
|
|
142
148
|
```
|
|
143
149
|
|
|
144
|
-
#### Options API
|
|
145
|
-
|
|
146
|
-
You can still use the `useStoryblokApi` and `useStoryblokBridge` as follows:
|
|
147
|
-
|
|
148
|
-
```html
|
|
149
|
-
<script>
|
|
150
|
-
import { useStoryblokBridge, useStoryblokApi } from "@storyblok/nuxt";
|
|
151
|
-
|
|
152
|
-
export default {
|
|
153
|
-
asyncData: async ({ app }) => {
|
|
154
|
-
const storyblokApi = useStoryblokApi();
|
|
155
|
-
const { data } = await storyblokApi.get("cdn/stories/vue", {
|
|
156
|
-
version: "draft",
|
|
157
|
-
});
|
|
158
|
-
// OR: const { data } = await app.$storyapi.get("cdn/stories/vue", { version: "draft" });
|
|
159
|
-
|
|
160
|
-
return { story: data.story };
|
|
161
|
-
},
|
|
162
|
-
mounted() {
|
|
163
|
-
useStoryblokBridge(this.story.id, (newStory) => (this.story = newStory));
|
|
164
|
-
},
|
|
165
|
-
};
|
|
166
|
-
</script>
|
|
167
|
-
|
|
168
|
-
<template>
|
|
169
|
-
<StoryblokComponent v-if="story" :blok="story.content" />
|
|
170
|
-
</template>
|
|
171
|
-
```
|
|
172
|
-
|
|
173
|
-
> _As you see in the comment, you can also use `app.$storyapi` if that's more comfortable for you. It's injected into Nuxt context and available in the components instance via `this.$storyapi` as well._
|
|
174
|
-
|
|
175
150
|
### API
|
|
176
151
|
|
|
177
152
|
#### useStoryblok(slug, apiOptions, bridgeOptions)
|
|
178
153
|
|
|
179
|
-
Check the available [apiOptions](https://github.com/storyblok/storyblok-js-client#class-storyblok) (passed to `storyblok-js-client`) and [bridgeOptions](https://www.storyblok.com/docs/Guides/storyblok-latest-js?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-nuxt) (passed to the Storyblok Bridge).
|
|
154
|
+
Check the available [apiOptions](https://github.com/storyblok/storyblok-js-client#class-storyblok) (passed to `storyblok-js-client`) and [bridgeOptions](https://www.storyblok.com/docs/Guides/storyblok-latest-js?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-nuxt-beta) (passed to the Storyblok Bridge).
|
|
180
155
|
|
|
181
156
|
#### useStoryblokApi()
|
|
182
157
|
|
|
@@ -186,15 +161,11 @@ Returns the instance of the `storyblok-js-client`.
|
|
|
186
161
|
|
|
187
162
|
Use this one-line function to cover the most common use case: updating the story when any kind of change happens on Storyblok Visual Editor.
|
|
188
163
|
|
|
189
|
-
#### $storyapi
|
|
190
|
-
|
|
191
|
-
Equivalent to the client that `useStoryblokApi` returns, but accessible in the Nuxt context and components instance.
|
|
192
|
-
|
|
193
164
|
## 🔗 Related Links
|
|
194
165
|
|
|
195
|
-
- **[Live Demo on Stackblitz](https://stackblitz.com/edit/nuxt-
|
|
196
|
-
- **[Nuxt.js Hub](https://www.storyblok.com/tc/nuxtjs?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-nuxt)**: Learn how to develop your own Nuxt.js applications that use Storyblok APIs to retrieve and manage content
|
|
197
|
-
- **[Storyblok & Nuxt.js on GitHub](https://github.com/search?q=org%3Astoryblok+topic%3Anuxt)**: Check all of our Nuxt.js open source repos
|
|
166
|
+
- **[Live Demo on Stackblitz](https://stackblitz.com/edit/nuxt-3-sdk-demo?file=pages%2Findex.vue&terminal=dev)**
|
|
167
|
+
- **[Nuxt.js Hub](https://www.storyblok.com/tc/nuxtjs?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-nuxt-beta)**: Learn how to develop your own Nuxt.js applications that use Storyblok APIs to retrieve and manage content;
|
|
168
|
+
- **[Storyblok & Nuxt.js on GitHub](https://github.com/search?q=org%3Astoryblok+topic%3Anuxt)**: Check all of our Nuxt.js open source repos;
|
|
198
169
|
- **[Storyblok CLI](https://github.com/storyblok/storyblok)**: A simple CLI for scaffolding Storyblok projects and fieldtypes.
|
|
199
170
|
|
|
200
171
|
## ℹ️ More Resources
|
|
@@ -202,9 +173,10 @@ Equivalent to the client that `useStoryblokApi` returns, but accessible in the N
|
|
|
202
173
|
### Support
|
|
203
174
|
|
|
204
175
|
- Bugs or Feature Requests? [Submit an issue](/../../issues/new);
|
|
176
|
+
|
|
205
177
|
- Do you have questions about Storyblok or you need help? [Join our Discord Community](https://discord.gg/jKrbAMz).
|
|
206
178
|
|
|
207
179
|
### Contributing
|
|
208
180
|
|
|
209
|
-
Please see our [contributing guidelines](https://github.com/storyblok/.github/blob/master/contributing.md) and our [code of conduct](https://www.storyblok.com/trust-center#code-of-conduct?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-nuxt).
|
|
181
|
+
Please see our [contributing guidelines](https://github.com/storyblok/.github/blob/master/contributing.md) and our [code of conduct](https://www.storyblok.com/trust-center#code-of-conduct?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-nuxt-beta).
|
|
210
182
|
This project use [semantic-release](https://semantic-release.gitbook.io/semantic-release/) for generate new versions by using commit messages and we use the Angular Convention to naming the commits. Check [this question](https://semantic-release.gitbook.io/semantic-release/support/faq#how-can-i-change-the-type-of-commits-that-trigger-a-release) about it in semantic-release FAQ.
|
package/package.json
CHANGED
|
@@ -1,51 +1,55 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@storyblok/nuxt",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "4.0.0",
|
|
4
4
|
"description": "Storyblok Nuxt.js module",
|
|
5
|
+
"main": "./src/module.js",
|
|
6
|
+
"module": "./src/module.js",
|
|
5
7
|
"exports": {
|
|
6
8
|
".": {
|
|
7
|
-
"import": "./
|
|
8
|
-
"require": "./
|
|
9
|
-
}
|
|
10
|
-
"./module": "./module/index.js"
|
|
9
|
+
"import": "./src/module.js",
|
|
10
|
+
"require": "./src/module.js"
|
|
11
|
+
}
|
|
11
12
|
},
|
|
12
|
-
"main": "./dist/storyblok-nuxt.js",
|
|
13
|
-
"module": "./dist/storyblok-nuxt.mjs",
|
|
14
13
|
"files": [
|
|
15
|
-
"
|
|
16
|
-
"module"
|
|
14
|
+
"src"
|
|
17
15
|
],
|
|
16
|
+
"repository": "https://github.com/storyblok/storyblok-nuxt",
|
|
18
17
|
"scripts": {
|
|
19
|
-
"
|
|
18
|
+
"test": "npm run test:unit && npm run test:e2e",
|
|
19
|
+
"build": "nuxt-module-build && cp ../README.md ./",
|
|
20
|
+
"test:unit": "jest __tests__",
|
|
20
21
|
"cy:open": "cypress open",
|
|
21
22
|
"cy:run": "cypress run",
|
|
22
23
|
"playground:run": "cd ../playground && npm run start",
|
|
23
24
|
"pretest:e2e": "cd ../playground && npm run build",
|
|
24
25
|
"test:e2e": "start-server-and-test playground:run http://localhost:3000 cy:run",
|
|
25
|
-
"test:e2e-watch": "start-server-and-test playground:run http://localhost:3000 cy:open"
|
|
26
|
-
"prepublishOnly": "cp ../README.md ./"
|
|
26
|
+
"test:e2e-watch": "start-server-and-test playground:run http://localhost:3000 cy:open"
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
|
-
"@
|
|
29
|
+
"@nuxt/kit": "^3.0.0-rc.2",
|
|
30
|
+
"@storyblok/vue": "^6.0.3"
|
|
30
31
|
},
|
|
31
32
|
"devDependencies": {
|
|
32
|
-
"@babel/core": "^7.
|
|
33
|
-
"
|
|
33
|
+
"@babel/core": "^7.15.0",
|
|
34
|
+
"@nuxt/module-builder": "latest",
|
|
35
|
+
"babel-jest": "^26.6.3",
|
|
34
36
|
"cypress": "^8.3.0",
|
|
35
37
|
"eslint-plugin-cypress": "^2.12.1",
|
|
36
|
-
"jest": "^
|
|
38
|
+
"jest": "^26.6.3",
|
|
37
39
|
"start-server-and-test": "^1.14.0",
|
|
38
|
-
"vite": "^2.
|
|
40
|
+
"vite": "^2.7.6"
|
|
39
41
|
},
|
|
40
42
|
"release": {
|
|
41
43
|
"branches": [
|
|
42
44
|
"main"
|
|
43
45
|
]
|
|
44
46
|
},
|
|
45
|
-
"repository": "https://github.com/storyblok/storyblok-nuxt",
|
|
46
47
|
"contributors": [
|
|
47
48
|
{
|
|
48
49
|
"name": "Alexander Feiglstorfer <delooks@gmail.com>"
|
|
49
50
|
}
|
|
50
|
-
]
|
|
51
|
+
],
|
|
52
|
+
"publishConfig": {
|
|
53
|
+
"access": "public"
|
|
54
|
+
}
|
|
51
55
|
}
|
package/src/module.js
ADDED
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { resolve } from "path";
|
|
2
|
+
import { fileURLToPath } from "url";
|
|
3
|
+
|
|
4
|
+
import {
|
|
5
|
+
defineNuxtModule,
|
|
6
|
+
addPlugin,
|
|
7
|
+
addComponentsDir,
|
|
8
|
+
addAutoImport
|
|
9
|
+
} from "@nuxt/kit";
|
|
10
|
+
|
|
11
|
+
export default defineNuxtModule({
|
|
12
|
+
meta: {
|
|
13
|
+
name: "@storyblok/nuxt-beta",
|
|
14
|
+
configKey: "storyblok"
|
|
15
|
+
},
|
|
16
|
+
defaults: {},
|
|
17
|
+
setup(options, nuxt) {
|
|
18
|
+
const axiosIndex = nuxt.options.build.transpile.indexOf("axios");
|
|
19
|
+
if (axiosIndex !== -1) {
|
|
20
|
+
nuxt.options.build.transpile.splice(axiosIndex, 1);
|
|
21
|
+
}
|
|
22
|
+
nuxt.options.vite.optimizeDeps.include =
|
|
23
|
+
nuxt.options.vite.optimizeDeps.include || [];
|
|
24
|
+
nuxt.options.vite.optimizeDeps.include.push("axios");
|
|
25
|
+
|
|
26
|
+
// Enable dirs
|
|
27
|
+
// nuxt.options.components.dirs = ["~/components/storyblok"];
|
|
28
|
+
addComponentsDir({ path: "~/storyblok", global: true, pathPrefix: false });
|
|
29
|
+
|
|
30
|
+
const runtimeDir = fileURLToPath(new URL("./runtime", import.meta.url));
|
|
31
|
+
nuxt.options.build.transpile.push(runtimeDir);
|
|
32
|
+
// nuxt.options.build.transpile.push("@storyblok/vue");
|
|
33
|
+
|
|
34
|
+
// Add plugin
|
|
35
|
+
nuxt.options.runtimeConfig.public.storyblok = options;
|
|
36
|
+
addPlugin(resolve(__dirname, "runtime", `./plugin`));
|
|
37
|
+
|
|
38
|
+
// Autoimports
|
|
39
|
+
const names = ["useStoryblok", "useStoryblokApi", "useStoryblokBridge"];
|
|
40
|
+
names.forEach((name) =>
|
|
41
|
+
addAutoImport({ name, as: name, from: "@storyblok/vue" })
|
|
42
|
+
);
|
|
43
|
+
}
|
|
44
|
+
});
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { StoryblokVue, apiPlugin } from "@storyblok/vue";
|
|
2
|
+
import { defineNuxtPlugin, useRuntimeConfig } from "#app";
|
|
3
|
+
|
|
4
|
+
export default defineNuxtPlugin(({ vueApp }) => {
|
|
5
|
+
const { storyblok } = useRuntimeConfig();
|
|
6
|
+
vueApp.use(StoryblokVue, { ...storyblok, use: [apiPlugin] });
|
|
7
|
+
});
|
package/dist/storyblok-nuxt.js
DELETED
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
(function(h,y){typeof exports=="object"&&typeof module!="undefined"?y(exports,require("axios"),require("@vue/composition-api"),require("@nuxtjs/composition-api")):typeof define=="function"&&define.amd?define(["exports","axios","@vue/composition-api","@nuxtjs/composition-api"],y):(h=typeof globalThis!="undefined"?globalThis:h||self,y(h.storyblokNuxt={},h.t,h.VueCompositionAPI,h.NuxtCompositionAPI))})(this,function(h,y,ie,k){"use strict";function M(s){return s&&typeof s=="object"&&"default"in s?s:{default:s}}var N=M(y),x=Object.defineProperty,I=Object.defineProperties,V=Object.getOwnPropertyDescriptors,w=Object.getOwnPropertySymbols,q=Object.prototype.hasOwnProperty,B=Object.prototype.propertyIsEnumerable,T=(s,e,t)=>e in s?x(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))B.call(e,t)&&T(s,t,e[t]);return s},v=(s,e)=>I(s,V(e));let R=!1;const S=[],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():S.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=>{S.forEach(n=>n()),R=!0,e(o)},document.getElementsByTagName("head")[0].appendChild(r)});/*!
|
|
2
|
-
* storyblok-js-client v0.0.0-development
|
|
3
|
-
* Universal JavaScript SDK for Storyblok's API
|
|
4
|
-
* (c) 2020-2022 Stobylok Team
|
|
5
|
-
*/function O(s){return typeof s=="number"&&s==s&&s!==1/0&&s!==-1/0}function E(s,e,t){if(!O(e))throw new TypeError("Expected `limit` to be a finite number");if(!O(t))throw new TypeError("Expected `interval` to be a finite number");var r=[],o=[],n=0,i=function(){n++;var l=setTimeout(function(){n--,r.length>0&&i(),o=o.filter(function(u){return u!==l})},t);o.indexOf(l)<0&&o.push(l);var c=r.shift();c.resolve(s.apply(c.self,c.args))},a=function(){var l=arguments,c=this;return new Promise(function(u,p){r.push({resolve:u,reject:p,args:l,self:c}),n<e&&i()})};return a.abort=function(){o.forEach(clearTimeout),o=[],r.forEach(function(l){l.reject(new throttle.AbortError)}),r.length=0},a}E.AbortError=function(){Error.call(this,"Throttled function aborted"),this.name="AbortError"};const U=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:U(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 D{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,l=>n[l]):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)},b=(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"?b(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 F{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 D(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=N.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,l=1)=>v(f({},i),{per_page:a,page:l}))(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),l=Math.ceil(a.total/o);return((c=[],u)=>c.map(u).reduce((p,d)=>[...p,...d],[]))([a,...await(async(c=[],u)=>Promise.all(c.map(u)))(J(1,l),async c=>this.makeRequest(n,t,o,c+1))],c=>Object.values(c.data[r]))}post(e,t){let r="/"+e;return this.throttle("post",r,t)}put(e,t){let r="/"+e;return this.throttle("put",r,t)}delete(e,t){let r="/"+e;return this.throttle("delete",r,t)}getStories(e){return this.get("cdn/stories",e)}getStory(e,t){return this.get("cdn/stories/"+e,t)}setToken(e){this.accessToken=e}getToken(){return this.accessToken}_cleanCopy(e){return JSON.parse(JSON.stringify(e))}_insertLinks(e,t){const r=e[t];r&&r.fieldtype=="multilink"&&r.linktype=="story"&&typeof r.id=="string"&&this.links[r.id]?r.story=this._cleanCopy(this.links[r.id]):r&&r.linktype==="story"&&typeof r.uuid=="string"&&this.links[r.uuid]&&(r.story=this._cleanCopy(this.links[r.uuid]))}_insertRelations(e,t,r){if(r.indexOf(e.component+"."+t)>-1){if(typeof e[t]=="string")this.relations[e[t]]&&(e[t]=this._cleanCopy(this.relations[e[t]]));else if(e[t].constructor===Array){let o=[];e[t].forEach(n=>{this.relations[n]&&o.push(this._cleanCopy(this.relations[n]))}),e[t]=o}}}iterateTree(e,t){let r=o=>{if(o!=null){if(o.constructor===Array)for(let n=0;n<o.length;n++)r(o[n]);else if(o.constructor===Object){if(o._stopResolving)return;for(let n in o)(o.component&&o._uid||o.type==="link")&&(this._insertRelations(o,n,t),this._insertLinks(o,n)),r(o[n])}}};r(e.content)}async resolveLinks(e,t){let r=[];if(e.link_uuids){const o=e.link_uuids.length;let n=[];const i=50;for(let a=0;a<o;a+=i){const l=Math.min(o,a+i);n.push(e.link_uuids.slice(a,l))}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(l=>{r.push(l)})}else r=e.links;r.forEach(o=>{this.links[o.uuid]=v(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 l=Math.min(o,a+i);n.push(e.rel_uuids.slice(a,l))}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(l=>{r.push(l)})}else r=e.rels;r.forEach(o=>{this.relations[o.uuid]=v(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=b({url:e,params:t}),a=this.cacheProvider();if(this.cache.clear==="auto"&&t.version==="draft"&&await this.flushCache(),t.version==="published"&&e!="/cdn/spaces/me"){const c=await a.get(i);if(c)return o(c)}try{let c=await this.throttle("get",e,{params:t,paramsSerializer:p=>b(p)}),u={data:c.data,headers:c.headers};if(c.headers["per-page"]&&(u=Object.assign({},u,{perPage:parseInt(c.headers["per-page"]),total:parseInt(c.headers.total)})),c.status!=200)return n(c);(u.data.story||u.data.stories)&&await this.resolveStories(u.data,t),t.version==="published"&&e!="/cdn/spaces/me"&&a.set(i,u),u.data.cv&&(t.version=="draft"&&g[t.token]!=u.data.cv&&this.flushCache(),g[t.token]=u.data.cv),o(u)}catch(c){if(c.response&&c.response.status===429&&(r+=1)<this.maxRetries)return console.log(`Hit rate limit. Retrying in ${r} seconds.`),await(l=1e3*r,new Promise(u=>setTimeout(u,l))),this.cacheResponse(e,t,r).then(o).catch(n);n(c)}var l})}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 Y=(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 F(e)}},X=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()})})}},H=(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};var W=function(){var s=this,e=s.$createElement,t=s._self._c||e;return t(s.blok.component,s._g(s._b({tag:"component"},"component",Object.assign({},s.$props,s.$attrs),!1),s.$listeners))},G=[];function K(s,e,t,r,o,n,i,a){var l=typeof s=="function"?s.options:s;e&&(l.render=e,l.staticRenderFns=t,l._compiled=!0),r&&(l.functional=!0),n&&(l._scopeId="data-v-"+n);var c;if(i?(c=function(d){d=d||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,!d&&typeof __VUE_SSR_CONTEXT__!="undefined"&&(d=__VUE_SSR_CONTEXT__),o&&o.call(this,d),d&&d._registeredComponents&&d._registeredComponents.add(i)},l._ssrRegister=c):o&&(c=a?function(){o.call(this,(l.functional?this.parent:this).$root.$options.shadowRoot)}:o),c)if(l.functional){l._injectStyles=c;var u=l.render;l.render=function(ne,A){return c.call(A),u(ne,A)}}else{var p=l.beforeCreate;l.beforeCreate=p?[].concat(p,c):[c]}return{exports:s,options:l}}const Q={props:{blok:{type:Object}}},C={};var Z=K(Q,W,G,!1,ee,null,null,null);function ee(s){for(let e in C)this[e]=C[e]}var te=function(){return Z.exports}();const re=s=>{console.error(`You can't use ${s} if you're not loading apiPlugin. Please provide it on StoryblokVue initialization.
|
|
6
|
-
`)},oe={bind(s,e){if(e.value){const t=X(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")}}};let _=null;const $=()=>(_||re("useStoryblokApi"),_),j={install(s,e={}){s.directive("editable",oe),s.component("StoryblokComponent",te);const{storyblokApi:t}=H(e);_=t,s.prototype.$storyblokApi=t}};typeof window!="undefined"&&window.Vue&&window.Vue.use(j);const se=(s,e={},t={})=>{const r=$();if(!r)return console.error("useStoryblok cannot be used if you disabled useApiClient when adding @storyblok/nuxt-beta to your nuxt.config.js");const o=k.ref(null);k.onMounted(()=>{o.value&&o.value.id&&P(o.value.id,a=>o.value=a,t)});const{fetch:n,fetchState:i}=k.useFetch(async()=>{const{data:a}=await r.get(`cdn/stories/${s}`,e);o.value=a.story},s);return n(),{story:o,fetchState:i}};h.StoryblokVue=j,h.apiPlugin=Y,h.useStoryblok=se,h.useStoryblokApi=$,h.useStoryblokBridge=P,Object.defineProperty(h,"__esModule",{value:!0}),h[Symbol.toStringTag]="Module"});
|
package/dist/storyblok-nuxt.mjs
DELETED
|
@@ -1,567 +0,0 @@
|
|
|
1
|
-
import t from "axios";
|
|
2
|
-
import "@vue/composition-api";
|
|
3
|
-
import { ref, onMounted, useFetch } from "@nuxtjs/composition-api";
|
|
4
|
-
var __defProp = Object.defineProperty;
|
|
5
|
-
var __defProps = Object.defineProperties;
|
|
6
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
7
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
8
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
9
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
10
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
11
|
-
var __spreadValues = (a2, b) => {
|
|
12
|
-
for (var prop in b || (b = {}))
|
|
13
|
-
if (__hasOwnProp.call(b, prop))
|
|
14
|
-
__defNormalProp(a2, prop, b[prop]);
|
|
15
|
-
if (__getOwnPropSymbols)
|
|
16
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
17
|
-
if (__propIsEnum.call(b, prop))
|
|
18
|
-
__defNormalProp(a2, prop, b[prop]);
|
|
19
|
-
}
|
|
20
|
-
return a2;
|
|
21
|
-
};
|
|
22
|
-
var __spreadProps = (a2, b) => __defProps(a2, __getOwnPropDescs(b));
|
|
23
|
-
let loaded = false;
|
|
24
|
-
const callbacks = [];
|
|
25
|
-
const loadBridge = (src) => {
|
|
26
|
-
return new Promise((resolve, reject) => {
|
|
27
|
-
if (typeof window === "undefined")
|
|
28
|
-
return;
|
|
29
|
-
window.storyblokRegisterEvent = (cb) => {
|
|
30
|
-
if (window.location === window.parent.location) {
|
|
31
|
-
console.warn("You are not in Draft Mode or in the Visual Editor.");
|
|
32
|
-
return;
|
|
33
|
-
}
|
|
34
|
-
if (!loaded)
|
|
35
|
-
callbacks.push(cb);
|
|
36
|
-
else
|
|
37
|
-
cb();
|
|
38
|
-
};
|
|
39
|
-
if (document.getElementById("storyblok-javascript-bridge"))
|
|
40
|
-
return;
|
|
41
|
-
const script = document.createElement("script");
|
|
42
|
-
script.async = true;
|
|
43
|
-
script.src = src;
|
|
44
|
-
script.id = "storyblok-javascript-bridge";
|
|
45
|
-
script.onerror = (error) => reject(error);
|
|
46
|
-
script.onload = (ev) => {
|
|
47
|
-
callbacks.forEach((cb) => cb());
|
|
48
|
-
loaded = true;
|
|
49
|
-
resolve(ev);
|
|
50
|
-
};
|
|
51
|
-
document.getElementsByTagName("head")[0].appendChild(script);
|
|
52
|
-
});
|
|
53
|
-
};
|
|
54
|
-
/*!
|
|
55
|
-
* storyblok-js-client v0.0.0-development
|
|
56
|
-
* Universal JavaScript SDK for Storyblok's API
|
|
57
|
-
* (c) 2020-2022 Stobylok Team
|
|
58
|
-
*/
|
|
59
|
-
function e(t2) {
|
|
60
|
-
return typeof t2 == "number" && (t2 == t2 && t2 !== 1 / 0 && t2 !== -1 / 0);
|
|
61
|
-
}
|
|
62
|
-
function r(t2, r2, s2) {
|
|
63
|
-
if (!e(r2))
|
|
64
|
-
throw new TypeError("Expected `limit` to be a finite number");
|
|
65
|
-
if (!e(s2))
|
|
66
|
-
throw new TypeError("Expected `interval` to be a finite number");
|
|
67
|
-
var n2 = [], i2 = [], o2 = 0, a2 = function() {
|
|
68
|
-
o2++;
|
|
69
|
-
var e2 = setTimeout(function() {
|
|
70
|
-
o2--, n2.length > 0 && a2(), i2 = i2.filter(function(t3) {
|
|
71
|
-
return t3 !== e2;
|
|
72
|
-
});
|
|
73
|
-
}, s2);
|
|
74
|
-
i2.indexOf(e2) < 0 && i2.push(e2);
|
|
75
|
-
var r3 = n2.shift();
|
|
76
|
-
r3.resolve(t2.apply(r3.self, r3.args));
|
|
77
|
-
}, l2 = function() {
|
|
78
|
-
var t3 = arguments, e2 = this;
|
|
79
|
-
return new Promise(function(s3, i3) {
|
|
80
|
-
n2.push({ resolve: s3, reject: i3, args: t3, self: e2 }), o2 < r2 && a2();
|
|
81
|
-
});
|
|
82
|
-
};
|
|
83
|
-
return l2.abort = function() {
|
|
84
|
-
i2.forEach(clearTimeout), i2 = [], n2.forEach(function(t3) {
|
|
85
|
-
t3.reject(new throttle.AbortError());
|
|
86
|
-
}), n2.length = 0;
|
|
87
|
-
}, l2;
|
|
88
|
-
}
|
|
89
|
-
r.AbortError = function() {
|
|
90
|
-
Error.call(this, "Throttled function aborted"), this.name = "AbortError";
|
|
91
|
-
};
|
|
92
|
-
const s = function(t2, e2) {
|
|
93
|
-
if (!t2)
|
|
94
|
-
return null;
|
|
95
|
-
let r2 = {};
|
|
96
|
-
for (let s2 in t2) {
|
|
97
|
-
let n2 = t2[s2];
|
|
98
|
-
e2.indexOf(s2) > -1 && n2 !== null && (r2[s2] = n2);
|
|
99
|
-
}
|
|
100
|
-
return r2;
|
|
101
|
-
};
|
|
102
|
-
var n = { nodes: { horizontal_rule: (t2) => ({ singleTag: "hr" }), blockquote: (t2) => ({ tag: "blockquote" }), bullet_list: (t2) => ({ tag: "ul" }), code_block: (t2) => ({ tag: ["pre", { tag: "code", attrs: t2.attrs }] }), hard_break: (t2) => ({ singleTag: "br" }), heading: (t2) => ({ tag: "h" + t2.attrs.level }), image: (t2) => ({ singleTag: [{ tag: "img", attrs: s(t2.attrs, ["src", "alt", "title"]) }] }), list_item: (t2) => ({ tag: "li" }), ordered_list: (t2) => ({ tag: "ol" }), paragraph: (t2) => ({ tag: "p" }) }, marks: { bold: () => ({ tag: "b" }), strike: () => ({ tag: "strike" }), underline: () => ({ tag: "u" }), strong: () => ({ tag: "strong" }), code: () => ({ tag: "code" }), italic: () => ({ tag: "i" }), link(t2) {
|
|
103
|
-
const e2 = __spreadValues({}, t2.attrs), { linktype: r2 = "url" } = t2.attrs;
|
|
104
|
-
return r2 === "email" && (e2.href = "mailto:" + e2.href), e2.anchor && (e2.href = `${e2.href}#${e2.anchor}`, delete e2.anchor), { tag: [{ tag: "a", attrs: e2 }] };
|
|
105
|
-
}, styled: (t2) => ({ tag: [{ tag: "span", attrs: t2.attrs }] }) } };
|
|
106
|
-
class i {
|
|
107
|
-
constructor(t2) {
|
|
108
|
-
t2 || (t2 = n), this.marks = t2.marks || [], this.nodes = t2.nodes || [];
|
|
109
|
-
}
|
|
110
|
-
addNode(t2, e2) {
|
|
111
|
-
this.nodes[t2] = e2;
|
|
112
|
-
}
|
|
113
|
-
addMark(t2, e2) {
|
|
114
|
-
this.marks[t2] = e2;
|
|
115
|
-
}
|
|
116
|
-
render(t2 = {}) {
|
|
117
|
-
if (t2.content && Array.isArray(t2.content)) {
|
|
118
|
-
let e2 = "";
|
|
119
|
-
return t2.content.forEach((t3) => {
|
|
120
|
-
e2 += this.renderNode(t3);
|
|
121
|
-
}), e2;
|
|
122
|
-
}
|
|
123
|
-
return console.warn("The render method must receive an object with a content field, which is an array"), "";
|
|
124
|
-
}
|
|
125
|
-
renderNode(t2) {
|
|
126
|
-
let e2 = [];
|
|
127
|
-
t2.marks && t2.marks.forEach((t3) => {
|
|
128
|
-
const r3 = this.getMatchingMark(t3);
|
|
129
|
-
r3 && e2.push(this.renderOpeningTag(r3.tag));
|
|
130
|
-
});
|
|
131
|
-
const r2 = this.getMatchingNode(t2);
|
|
132
|
-
return r2 && r2.tag && e2.push(this.renderOpeningTag(r2.tag)), t2.content ? t2.content.forEach((t3) => {
|
|
133
|
-
e2.push(this.renderNode(t3));
|
|
134
|
-
}) : t2.text ? e2.push(function(t3) {
|
|
135
|
-
const e3 = { "&": "&", "<": "<", ">": ">", '"': """, "'": "'" }, r3 = /[&<>"']/g, s2 = RegExp(r3.source);
|
|
136
|
-
return t3 && s2.test(t3) ? t3.replace(r3, (t4) => e3[t4]) : t3;
|
|
137
|
-
}(t2.text)) : r2 && r2.singleTag ? e2.push(this.renderTag(r2.singleTag, " /")) : r2 && r2.html && e2.push(r2.html), r2 && r2.tag && e2.push(this.renderClosingTag(r2.tag)), t2.marks && t2.marks.slice(0).reverse().forEach((t3) => {
|
|
138
|
-
const r3 = this.getMatchingMark(t3);
|
|
139
|
-
r3 && e2.push(this.renderClosingTag(r3.tag));
|
|
140
|
-
}), e2.join("");
|
|
141
|
-
}
|
|
142
|
-
renderTag(t2, e2) {
|
|
143
|
-
if (t2.constructor === String)
|
|
144
|
-
return `<${t2}${e2}>`;
|
|
145
|
-
return t2.map((t3) => {
|
|
146
|
-
if (t3.constructor === String)
|
|
147
|
-
return `<${t3}${e2}>`;
|
|
148
|
-
{
|
|
149
|
-
let r2 = "<" + t3.tag;
|
|
150
|
-
if (t3.attrs)
|
|
151
|
-
for (let e3 in t3.attrs) {
|
|
152
|
-
let s2 = t3.attrs[e3];
|
|
153
|
-
s2 !== null && (r2 += ` ${e3}="${s2}"`);
|
|
154
|
-
}
|
|
155
|
-
return `${r2}${e2}>`;
|
|
156
|
-
}
|
|
157
|
-
}).join("");
|
|
158
|
-
}
|
|
159
|
-
renderOpeningTag(t2) {
|
|
160
|
-
return this.renderTag(t2, "");
|
|
161
|
-
}
|
|
162
|
-
renderClosingTag(t2) {
|
|
163
|
-
if (t2.constructor === String)
|
|
164
|
-
return `</${t2}>`;
|
|
165
|
-
return t2.slice(0).reverse().map((t3) => t3.constructor === String ? `</${t3}>` : `</${t3.tag}>`).join("");
|
|
166
|
-
}
|
|
167
|
-
getMatchingNode(t2) {
|
|
168
|
-
if (typeof this.nodes[t2.type] == "function")
|
|
169
|
-
return this.nodes[t2.type](t2);
|
|
170
|
-
}
|
|
171
|
-
getMatchingMark(t2) {
|
|
172
|
-
if (typeof this.marks[t2.type] == "function")
|
|
173
|
-
return this.marks[t2.type](t2);
|
|
174
|
-
}
|
|
175
|
-
}
|
|
176
|
-
const o = (t2 = 0, e2 = t2) => {
|
|
177
|
-
const r2 = Math.abs(e2 - t2) || 0, s2 = t2 < e2 ? 1 : -1;
|
|
178
|
-
return ((t3 = 0, e3) => [...Array(t3)].map(e3))(r2, (e3, r3) => r3 * s2 + t2);
|
|
179
|
-
}, a = (t2, e2, r2) => {
|
|
180
|
-
const s2 = [];
|
|
181
|
-
for (const n2 in t2) {
|
|
182
|
-
if (!Object.prototype.hasOwnProperty.call(t2, n2))
|
|
183
|
-
continue;
|
|
184
|
-
const i2 = t2[n2], o2 = r2 ? "" : encodeURIComponent(n2);
|
|
185
|
-
let l2;
|
|
186
|
-
l2 = typeof i2 == "object" ? a(i2, e2 ? e2 + encodeURIComponent("[" + o2 + "]") : o2, Array.isArray(i2)) : (e2 ? e2 + encodeURIComponent("[" + o2 + "]") : o2) + "=" + encodeURIComponent(i2), s2.push(l2);
|
|
187
|
-
}
|
|
188
|
-
return s2.join("&");
|
|
189
|
-
};
|
|
190
|
-
let l = {}, c = {};
|
|
191
|
-
class StoryblokClient {
|
|
192
|
-
constructor(e2, s2) {
|
|
193
|
-
if (!s2) {
|
|
194
|
-
let t2 = e2.region ? "-" + e2.region : "", r2 = e2.https === false ? "http" : "https";
|
|
195
|
-
s2 = e2.oauthToken === void 0 ? `${r2}://api${t2}.storyblok.com/v2` : `${r2}://api${t2}.storyblok.com/v1`;
|
|
196
|
-
}
|
|
197
|
-
let n2 = Object.assign({}, e2.headers), o2 = 5;
|
|
198
|
-
e2.oauthToken !== void 0 && (n2.Authorization = e2.oauthToken, o2 = 3), e2.rateLimit !== void 0 && (o2 = e2.rateLimit), this.richTextResolver = new i(e2.richTextSchema), typeof e2.componentResolver == "function" && this.setComponentResolver(e2.componentResolver), this.maxRetries = e2.maxRetries || 5, this.throttle = r(this.throttledRequest, o2, 1e3), this.accessToken = e2.accessToken, this.relations = {}, this.links = {}, this.cache = e2.cache || { clear: "manual" }, this.client = t.create({ baseURL: s2, timeout: e2.timeout || 0, headers: n2, proxy: e2.proxy || false }), e2.responseInterceptor && this.client.interceptors.response.use((t2) => e2.responseInterceptor(t2));
|
|
199
|
-
}
|
|
200
|
-
setComponentResolver(t2) {
|
|
201
|
-
this.richTextResolver.addNode("blok", (e2) => {
|
|
202
|
-
let r2 = "";
|
|
203
|
-
return e2.attrs.body.forEach((e3) => {
|
|
204
|
-
r2 += t2(e3.component, e3);
|
|
205
|
-
}), { html: r2 };
|
|
206
|
-
});
|
|
207
|
-
}
|
|
208
|
-
parseParams(t2 = {}) {
|
|
209
|
-
return t2.version || (t2.version = "published"), t2.token || (t2.token = this.getToken()), t2.cv || (t2.cv = c[t2.token]), Array.isArray(t2.resolve_relations) && (t2.resolve_relations = t2.resolve_relations.join(",")), t2;
|
|
210
|
-
}
|
|
211
|
-
factoryParamOptions(t2, e2 = {}) {
|
|
212
|
-
return ((t3 = "") => t3.indexOf("/cdn/") > -1)(t2) ? this.parseParams(e2) : e2;
|
|
213
|
-
}
|
|
214
|
-
makeRequest(t2, e2, r2, s2) {
|
|
215
|
-
const n2 = this.factoryParamOptions(t2, ((t3 = {}, e3 = 25, r3 = 1) => __spreadProps(__spreadValues({}, t3), { per_page: e3, page: r3 }))(e2, r2, s2));
|
|
216
|
-
return this.cacheResponse(t2, n2);
|
|
217
|
-
}
|
|
218
|
-
get(t2, e2) {
|
|
219
|
-
let r2 = "/" + t2;
|
|
220
|
-
const s2 = this.factoryParamOptions(r2, e2);
|
|
221
|
-
return this.cacheResponse(r2, s2);
|
|
222
|
-
}
|
|
223
|
-
async getAll(t2, e2 = {}, r2) {
|
|
224
|
-
const s2 = e2.per_page || 25, n2 = "/" + t2, i2 = n2.split("/");
|
|
225
|
-
r2 = r2 || i2[i2.length - 1];
|
|
226
|
-
const a2 = await this.makeRequest(n2, e2, s2, 1), l2 = Math.ceil(a2.total / s2);
|
|
227
|
-
return ((t3 = [], e3) => t3.map(e3).reduce((t4, e4) => [...t4, ...e4], []))([a2, ...await (async (t3 = [], e3) => Promise.all(t3.map(e3)))(o(1, l2), async (t3) => this.makeRequest(n2, e2, s2, t3 + 1))], (t3) => Object.values(t3.data[r2]));
|
|
228
|
-
}
|
|
229
|
-
post(t2, e2) {
|
|
230
|
-
let r2 = "/" + t2;
|
|
231
|
-
return this.throttle("post", r2, e2);
|
|
232
|
-
}
|
|
233
|
-
put(t2, e2) {
|
|
234
|
-
let r2 = "/" + t2;
|
|
235
|
-
return this.throttle("put", r2, e2);
|
|
236
|
-
}
|
|
237
|
-
delete(t2, e2) {
|
|
238
|
-
let r2 = "/" + t2;
|
|
239
|
-
return this.throttle("delete", r2, e2);
|
|
240
|
-
}
|
|
241
|
-
getStories(t2) {
|
|
242
|
-
return this.get("cdn/stories", t2);
|
|
243
|
-
}
|
|
244
|
-
getStory(t2, e2) {
|
|
245
|
-
return this.get("cdn/stories/" + t2, e2);
|
|
246
|
-
}
|
|
247
|
-
setToken(t2) {
|
|
248
|
-
this.accessToken = t2;
|
|
249
|
-
}
|
|
250
|
-
getToken() {
|
|
251
|
-
return this.accessToken;
|
|
252
|
-
}
|
|
253
|
-
_cleanCopy(t2) {
|
|
254
|
-
return JSON.parse(JSON.stringify(t2));
|
|
255
|
-
}
|
|
256
|
-
_insertLinks(t2, e2) {
|
|
257
|
-
const r2 = t2[e2];
|
|
258
|
-
r2 && r2.fieldtype == "multilink" && r2.linktype == "story" && typeof r2.id == "string" && this.links[r2.id] ? r2.story = this._cleanCopy(this.links[r2.id]) : r2 && r2.linktype === "story" && typeof r2.uuid == "string" && this.links[r2.uuid] && (r2.story = this._cleanCopy(this.links[r2.uuid]));
|
|
259
|
-
}
|
|
260
|
-
_insertRelations(t2, e2, r2) {
|
|
261
|
-
if (r2.indexOf(t2.component + "." + e2) > -1) {
|
|
262
|
-
if (typeof t2[e2] == "string")
|
|
263
|
-
this.relations[t2[e2]] && (t2[e2] = this._cleanCopy(this.relations[t2[e2]]));
|
|
264
|
-
else if (t2[e2].constructor === Array) {
|
|
265
|
-
let r3 = [];
|
|
266
|
-
t2[e2].forEach((t3) => {
|
|
267
|
-
this.relations[t3] && r3.push(this._cleanCopy(this.relations[t3]));
|
|
268
|
-
}), t2[e2] = r3;
|
|
269
|
-
}
|
|
270
|
-
}
|
|
271
|
-
}
|
|
272
|
-
iterateTree(t2, e2) {
|
|
273
|
-
let r2 = (t3) => {
|
|
274
|
-
if (t3 != null) {
|
|
275
|
-
if (t3.constructor === Array)
|
|
276
|
-
for (let e3 = 0; e3 < t3.length; e3++)
|
|
277
|
-
r2(t3[e3]);
|
|
278
|
-
else if (t3.constructor === Object) {
|
|
279
|
-
if (t3._stopResolving)
|
|
280
|
-
return;
|
|
281
|
-
for (let s2 in t3)
|
|
282
|
-
(t3.component && t3._uid || t3.type === "link") && (this._insertRelations(t3, s2, e2), this._insertLinks(t3, s2)), r2(t3[s2]);
|
|
283
|
-
}
|
|
284
|
-
}
|
|
285
|
-
};
|
|
286
|
-
r2(t2.content);
|
|
287
|
-
}
|
|
288
|
-
async resolveLinks(t2, e2) {
|
|
289
|
-
let r2 = [];
|
|
290
|
-
if (t2.link_uuids) {
|
|
291
|
-
const s2 = t2.link_uuids.length;
|
|
292
|
-
let n2 = [];
|
|
293
|
-
const i2 = 50;
|
|
294
|
-
for (let e3 = 0; e3 < s2; e3 += i2) {
|
|
295
|
-
const r3 = Math.min(s2, e3 + i2);
|
|
296
|
-
n2.push(t2.link_uuids.slice(e3, r3));
|
|
297
|
-
}
|
|
298
|
-
for (let t3 = 0; t3 < n2.length; t3++) {
|
|
299
|
-
(await this.getStories({ per_page: i2, language: e2.language, version: e2.version, by_uuids: n2[t3].join(",") })).data.stories.forEach((t4) => {
|
|
300
|
-
r2.push(t4);
|
|
301
|
-
});
|
|
302
|
-
}
|
|
303
|
-
} else
|
|
304
|
-
r2 = t2.links;
|
|
305
|
-
r2.forEach((t3) => {
|
|
306
|
-
this.links[t3.uuid] = __spreadProps(__spreadValues({}, t3), { _stopResolving: true });
|
|
307
|
-
});
|
|
308
|
-
}
|
|
309
|
-
async resolveRelations(t2, e2) {
|
|
310
|
-
let r2 = [];
|
|
311
|
-
if (t2.rel_uuids) {
|
|
312
|
-
const s2 = t2.rel_uuids.length;
|
|
313
|
-
let n2 = [];
|
|
314
|
-
const i2 = 50;
|
|
315
|
-
for (let e3 = 0; e3 < s2; e3 += i2) {
|
|
316
|
-
const r3 = Math.min(s2, e3 + i2);
|
|
317
|
-
n2.push(t2.rel_uuids.slice(e3, r3));
|
|
318
|
-
}
|
|
319
|
-
for (let t3 = 0; t3 < n2.length; t3++) {
|
|
320
|
-
(await this.getStories({ per_page: i2, language: e2.language, version: e2.version, by_uuids: n2[t3].join(",") })).data.stories.forEach((t4) => {
|
|
321
|
-
r2.push(t4);
|
|
322
|
-
});
|
|
323
|
-
}
|
|
324
|
-
} else
|
|
325
|
-
r2 = t2.rels;
|
|
326
|
-
r2.forEach((t3) => {
|
|
327
|
-
this.relations[t3.uuid] = __spreadProps(__spreadValues({}, t3), { _stopResolving: true });
|
|
328
|
-
});
|
|
329
|
-
}
|
|
330
|
-
async resolveStories(t2, e2) {
|
|
331
|
-
let r2 = [];
|
|
332
|
-
e2.resolve_relations !== void 0 && e2.resolve_relations.length > 0 && (r2 = e2.resolve_relations.split(","), await this.resolveRelations(t2, e2)), ["1", "story", "url"].indexOf(e2.resolve_links) > -1 && await this.resolveLinks(t2, e2);
|
|
333
|
-
for (const t3 in this.relations)
|
|
334
|
-
this.iterateTree(this.relations[t3], r2);
|
|
335
|
-
t2.story ? this.iterateTree(t2.story, r2) : t2.stories.forEach((t3) => {
|
|
336
|
-
this.iterateTree(t3, r2);
|
|
337
|
-
});
|
|
338
|
-
}
|
|
339
|
-
cacheResponse(t2, e2, r2) {
|
|
340
|
-
return r2 === void 0 && (r2 = 0), new Promise(async (s2, n2) => {
|
|
341
|
-
let i2 = a({ url: t2, params: e2 }), o2 = this.cacheProvider();
|
|
342
|
-
if (this.cache.clear === "auto" && e2.version === "draft" && await this.flushCache(), e2.version === "published" && t2 != "/cdn/spaces/me") {
|
|
343
|
-
const t3 = await o2.get(i2);
|
|
344
|
-
if (t3)
|
|
345
|
-
return s2(t3);
|
|
346
|
-
}
|
|
347
|
-
try {
|
|
348
|
-
let r3 = await this.throttle("get", t2, { params: e2, paramsSerializer: (t3) => a(t3) }), l3 = { data: r3.data, headers: r3.headers };
|
|
349
|
-
if (r3.headers["per-page"] && (l3 = Object.assign({}, l3, { perPage: parseInt(r3.headers["per-page"]), total: parseInt(r3.headers.total) })), r3.status != 200)
|
|
350
|
-
return n2(r3);
|
|
351
|
-
(l3.data.story || l3.data.stories) && await this.resolveStories(l3.data, e2), e2.version === "published" && t2 != "/cdn/spaces/me" && o2.set(i2, l3), l3.data.cv && (e2.version == "draft" && c[e2.token] != l3.data.cv && this.flushCache(), c[e2.token] = l3.data.cv), s2(l3);
|
|
352
|
-
} catch (i3) {
|
|
353
|
-
if (i3.response && i3.response.status === 429 && (r2 += 1) < this.maxRetries)
|
|
354
|
-
return console.log(`Hit rate limit. Retrying in ${r2} seconds.`), await (l2 = 1e3 * r2, new Promise((t3) => setTimeout(t3, l2))), this.cacheResponse(t2, e2, r2).then(s2).catch(n2);
|
|
355
|
-
n2(i3);
|
|
356
|
-
}
|
|
357
|
-
var l2;
|
|
358
|
-
});
|
|
359
|
-
}
|
|
360
|
-
throttledRequest(t2, e2, r2) {
|
|
361
|
-
return this.client[t2](e2, r2);
|
|
362
|
-
}
|
|
363
|
-
cacheVersions() {
|
|
364
|
-
return c;
|
|
365
|
-
}
|
|
366
|
-
cacheVersion() {
|
|
367
|
-
return c[this.accessToken];
|
|
368
|
-
}
|
|
369
|
-
setCacheVersion(t2) {
|
|
370
|
-
this.accessToken && (c[this.accessToken] = t2);
|
|
371
|
-
}
|
|
372
|
-
cacheProvider() {
|
|
373
|
-
switch (this.cache.type) {
|
|
374
|
-
case "memory":
|
|
375
|
-
return { get: (t2) => l[t2], getAll: () => l, set(t2, e2) {
|
|
376
|
-
l[t2] = e2;
|
|
377
|
-
}, flush() {
|
|
378
|
-
l = {};
|
|
379
|
-
} };
|
|
380
|
-
default:
|
|
381
|
-
return { get() {
|
|
382
|
-
}, getAll() {
|
|
383
|
-
}, set() {
|
|
384
|
-
}, flush() {
|
|
385
|
-
} };
|
|
386
|
-
}
|
|
387
|
-
}
|
|
388
|
-
async flushCache() {
|
|
389
|
-
return await this.cacheProvider().flush(), this;
|
|
390
|
-
}
|
|
391
|
-
}
|
|
392
|
-
var api = (options = {}) => {
|
|
393
|
-
const { apiOptions } = options;
|
|
394
|
-
if (!apiOptions.accessToken) {
|
|
395
|
-
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");
|
|
396
|
-
return;
|
|
397
|
-
}
|
|
398
|
-
const storyblokApi = new StoryblokClient(apiOptions);
|
|
399
|
-
return { storyblokApi };
|
|
400
|
-
};
|
|
401
|
-
var editable = (blok) => {
|
|
402
|
-
if (typeof blok !== "object" || typeof blok._editable === "undefined") {
|
|
403
|
-
return {};
|
|
404
|
-
}
|
|
405
|
-
const options = JSON.parse(blok._editable.replace(/^<!--#storyblok#/, "").replace(/-->$/, ""));
|
|
406
|
-
return {
|
|
407
|
-
"data-blok-c": JSON.stringify(options),
|
|
408
|
-
"data-blok-uid": options.id + "-" + options.uid
|
|
409
|
-
};
|
|
410
|
-
};
|
|
411
|
-
const useStoryblokBridge = (id, cb, options = {}) => {
|
|
412
|
-
if (typeof window === "undefined") {
|
|
413
|
-
return;
|
|
414
|
-
}
|
|
415
|
-
if (typeof window.storyblokRegisterEvent === "undefined") {
|
|
416
|
-
console.error("Storyblok Bridge is disabled. Please enable it to use it. Read https://github.com/storyblok/storyblok-js");
|
|
417
|
-
return;
|
|
418
|
-
}
|
|
419
|
-
window.storyblokRegisterEvent(() => {
|
|
420
|
-
const sbBridge = new window.StoryblokBridge(options);
|
|
421
|
-
sbBridge.on(["input", "published", "change"], (event) => {
|
|
422
|
-
if (event.action == "input" && event.story.id === id) {
|
|
423
|
-
cb(event.story);
|
|
424
|
-
} else {
|
|
425
|
-
window.location.reload();
|
|
426
|
-
}
|
|
427
|
-
});
|
|
428
|
-
});
|
|
429
|
-
};
|
|
430
|
-
const storyblokInit = (pluginOptions = {}) => {
|
|
431
|
-
const { bridge, accessToken, use = [], apiOptions = {} } = pluginOptions;
|
|
432
|
-
apiOptions.accessToken = apiOptions.accessToken || accessToken;
|
|
433
|
-
const options = { bridge, apiOptions };
|
|
434
|
-
let result = {};
|
|
435
|
-
use.forEach((pluginFactory) => {
|
|
436
|
-
result = __spreadValues(__spreadValues({}, result), pluginFactory(options));
|
|
437
|
-
});
|
|
438
|
-
if (bridge !== false) {
|
|
439
|
-
loadBridge("https://app.storyblok.com/f/storyblok-v2-latest.js");
|
|
440
|
-
}
|
|
441
|
-
return result;
|
|
442
|
-
};
|
|
443
|
-
var render = function() {
|
|
444
|
-
var _vm = this;
|
|
445
|
-
var _h = _vm.$createElement;
|
|
446
|
-
var _c = _vm._self._c || _h;
|
|
447
|
-
return _c(_vm.blok.component, _vm._g(_vm._b({ tag: "component" }, "component", Object.assign({}, _vm.$props, _vm.$attrs), false), _vm.$listeners));
|
|
448
|
-
};
|
|
449
|
-
var staticRenderFns = [];
|
|
450
|
-
function normalizeComponent(scriptExports, render2, staticRenderFns2, functionalTemplate, injectStyles, scopeId, moduleIdentifier, shadowMode) {
|
|
451
|
-
var options = typeof scriptExports === "function" ? scriptExports.options : scriptExports;
|
|
452
|
-
if (render2) {
|
|
453
|
-
options.render = render2;
|
|
454
|
-
options.staticRenderFns = staticRenderFns2;
|
|
455
|
-
options._compiled = true;
|
|
456
|
-
}
|
|
457
|
-
if (functionalTemplate) {
|
|
458
|
-
options.functional = true;
|
|
459
|
-
}
|
|
460
|
-
if (scopeId) {
|
|
461
|
-
options._scopeId = "data-v-" + scopeId;
|
|
462
|
-
}
|
|
463
|
-
var hook;
|
|
464
|
-
if (moduleIdentifier) {
|
|
465
|
-
hook = function(context) {
|
|
466
|
-
context = context || this.$vnode && this.$vnode.ssrContext || this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext;
|
|
467
|
-
if (!context && typeof __VUE_SSR_CONTEXT__ !== "undefined") {
|
|
468
|
-
context = __VUE_SSR_CONTEXT__;
|
|
469
|
-
}
|
|
470
|
-
if (injectStyles) {
|
|
471
|
-
injectStyles.call(this, context);
|
|
472
|
-
}
|
|
473
|
-
if (context && context._registeredComponents) {
|
|
474
|
-
context._registeredComponents.add(moduleIdentifier);
|
|
475
|
-
}
|
|
476
|
-
};
|
|
477
|
-
options._ssrRegister = hook;
|
|
478
|
-
} else if (injectStyles) {
|
|
479
|
-
hook = shadowMode ? function() {
|
|
480
|
-
injectStyles.call(this, (options.functional ? this.parent : this).$root.$options.shadowRoot);
|
|
481
|
-
} : injectStyles;
|
|
482
|
-
}
|
|
483
|
-
if (hook) {
|
|
484
|
-
if (options.functional) {
|
|
485
|
-
options._injectStyles = hook;
|
|
486
|
-
var originalRender = options.render;
|
|
487
|
-
options.render = function renderWithStyleInjection(h, context) {
|
|
488
|
-
hook.call(context);
|
|
489
|
-
return originalRender(h, context);
|
|
490
|
-
};
|
|
491
|
-
} else {
|
|
492
|
-
var existing = options.beforeCreate;
|
|
493
|
-
options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
|
|
494
|
-
}
|
|
495
|
-
}
|
|
496
|
-
return {
|
|
497
|
-
exports: scriptExports,
|
|
498
|
-
options
|
|
499
|
-
};
|
|
500
|
-
}
|
|
501
|
-
const __vue2_script = {
|
|
502
|
-
props: {
|
|
503
|
-
blok: {
|
|
504
|
-
type: Object
|
|
505
|
-
}
|
|
506
|
-
}
|
|
507
|
-
};
|
|
508
|
-
const __cssModules = {};
|
|
509
|
-
var __component__ = /* @__PURE__ */ normalizeComponent(__vue2_script, render, staticRenderFns, false, __vue2_injectStyles, null, null, null);
|
|
510
|
-
function __vue2_injectStyles(context) {
|
|
511
|
-
for (let o2 in __cssModules) {
|
|
512
|
-
this[o2] = __cssModules[o2];
|
|
513
|
-
}
|
|
514
|
-
}
|
|
515
|
-
var StoryblokComponent = /* @__PURE__ */ function() {
|
|
516
|
-
return __component__.exports;
|
|
517
|
-
}();
|
|
518
|
-
const printError = (fnName) => {
|
|
519
|
-
console.error(`You can't use ${fnName} if you're not loading apiPlugin. Please provide it on StoryblokVue initialization.
|
|
520
|
-
`);
|
|
521
|
-
};
|
|
522
|
-
const vEditableDirective = {
|
|
523
|
-
bind(el, binding) {
|
|
524
|
-
if (binding.value) {
|
|
525
|
-
const options = editable(binding.value);
|
|
526
|
-
el.setAttribute("data-blok-c", options["data-blok-c"]);
|
|
527
|
-
el.setAttribute("data-blok-uid", options["data-blok-uid"]);
|
|
528
|
-
el.classList.add("storyblok__outline");
|
|
529
|
-
}
|
|
530
|
-
}
|
|
531
|
-
};
|
|
532
|
-
let storyblokApiInstance = null;
|
|
533
|
-
const useStoryblokApi = () => {
|
|
534
|
-
if (!storyblokApiInstance)
|
|
535
|
-
printError("useStoryblokApi");
|
|
536
|
-
return storyblokApiInstance;
|
|
537
|
-
};
|
|
538
|
-
const StoryblokVue = {
|
|
539
|
-
install(app, pluginOptions = {}) {
|
|
540
|
-
app.directive("editable", vEditableDirective);
|
|
541
|
-
app.component("StoryblokComponent", StoryblokComponent);
|
|
542
|
-
const { storyblokApi } = storyblokInit(pluginOptions);
|
|
543
|
-
storyblokApiInstance = storyblokApi;
|
|
544
|
-
app.prototype.$storyblokApi = storyblokApi;
|
|
545
|
-
}
|
|
546
|
-
};
|
|
547
|
-
if (typeof window !== "undefined" && window.Vue) {
|
|
548
|
-
window.Vue.use(StoryblokVue);
|
|
549
|
-
}
|
|
550
|
-
const useStoryblok = (slug, apiOptions = {}, bridgeOptions = {}) => {
|
|
551
|
-
const storyblokApi = useStoryblokApi();
|
|
552
|
-
if (!storyblokApi)
|
|
553
|
-
return console.error("useStoryblok cannot be used if you disabled useApiClient when adding @storyblok/nuxt-beta to your nuxt.config.js");
|
|
554
|
-
const story = ref(null);
|
|
555
|
-
onMounted(() => {
|
|
556
|
-
if (story.value && story.value.id) {
|
|
557
|
-
useStoryblokBridge(story.value.id, (evStory) => story.value = evStory, bridgeOptions);
|
|
558
|
-
}
|
|
559
|
-
});
|
|
560
|
-
const { fetch, fetchState } = useFetch(async () => {
|
|
561
|
-
const { data } = await storyblokApi.get(`cdn/stories/${slug}`, apiOptions);
|
|
562
|
-
story.value = data.story;
|
|
563
|
-
}, slug);
|
|
564
|
-
fetch();
|
|
565
|
-
return { story, fetchState };
|
|
566
|
-
};
|
|
567
|
-
export { StoryblokVue, api as apiPlugin, useStoryblok, useStoryblokApi, useStoryblokBridge };
|
package/module/index.js
DELETED
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
const path = require("path");
|
|
2
|
-
|
|
3
|
-
module.exports = function nuxtStoryblok(moduleOptions) {
|
|
4
|
-
let options = Object.assign({}, this.options.storyblok, moduleOptions);
|
|
5
|
-
this.addPlugin({
|
|
6
|
-
src: path.resolve(__dirname, "plugin.js"),
|
|
7
|
-
options,
|
|
8
|
-
});
|
|
9
|
-
|
|
10
|
-
const nuxtConfig = this.nuxt.options;
|
|
11
|
-
const componentsPath = "~/components/storyblok";
|
|
12
|
-
if (Array.isArray(nuxtConfig.components))
|
|
13
|
-
nuxtConfig.components.push(componentsPath);
|
|
14
|
-
else nuxtConfig.components = [componentsPath];
|
|
15
|
-
|
|
16
|
-
// Disable Webpack 4 mjs support (has issues)
|
|
17
|
-
this.extendBuild((config) => {
|
|
18
|
-
if (!config.module) return;
|
|
19
|
-
|
|
20
|
-
config.module.rules.forEach((rule) => {
|
|
21
|
-
if (rule.test instanceof RegExp && rule.test.test("index.mjs")) {
|
|
22
|
-
rule.type = "javascript/auto";
|
|
23
|
-
}
|
|
24
|
-
});
|
|
25
|
-
|
|
26
|
-
config.module.rules.unshift({
|
|
27
|
-
test: /\.mjs$/,
|
|
28
|
-
type: "javascript/auto",
|
|
29
|
-
include: [/node_modules/],
|
|
30
|
-
});
|
|
31
|
-
});
|
|
32
|
-
};
|
|
33
|
-
|
|
34
|
-
module.exports.meta = require("../package.json");
|
package/module/plugin.js
DELETED
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
/* eslint-disable */
|
|
2
|
-
|
|
3
|
-
import Vue from 'vue'
|
|
4
|
-
import { StoryblokVue, useStoryblokApi, useStoryblokBridge } from "@storyblok/nuxt";
|
|
5
|
-
<% if (options.useApiClient !== false) { %>
|
|
6
|
-
import { apiPlugin } from "@storyblok/nuxt";
|
|
7
|
-
<% } %>
|
|
8
|
-
|
|
9
|
-
export default (ctx) => {
|
|
10
|
-
const { app, store } = ctx
|
|
11
|
-
|
|
12
|
-
Vue.use(StoryblokVue, {
|
|
13
|
-
accessToken: "<%= options.accessToken %>",
|
|
14
|
-
bridge: <%= typeof options.bridge === "undefined" ? true : options.bridge %>,
|
|
15
|
-
apiOptions: <%- JSON.stringify(options.apiOptions || {}) %>,
|
|
16
|
-
<% if (options.useApiClient !== false) { %>
|
|
17
|
-
use: [apiPlugin]
|
|
18
|
-
<% } %>
|
|
19
|
-
});
|
|
20
|
-
|
|
21
|
-
const api = useStoryblokApi()
|
|
22
|
-
|
|
23
|
-
app.$storyapi = api
|
|
24
|
-
ctx.$storyapi = api
|
|
25
|
-
app.$storybridge = useStoryblokBridge
|
|
26
|
-
ctx.$storybridge = useStoryblokBridge
|
|
27
|
-
|
|
28
|
-
if (store) store.$storyapi = api
|
|
29
|
-
}
|