@uniformdev/uniform-nuxt 16.2.0 → 16.2.1-nuxt.249

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,5 +1,16 @@
1
1
  # Uniform Nuxt module
2
2
 
3
+ - [Uniform Nuxt module](#uniform-nuxt-module)
4
+ - [Getting started](#getting-started)
5
+ - [Features](#features)
6
+ - [API reference](#api-reference)
7
+ - [Options](#options)
8
+ - [Injected in the Nuxt instance](#injected-in-the-nuxt-instance)
9
+ - [Components](#components)
10
+ - [\<Composition />](#composition-)
11
+ - [\<SlotContent />](#slotcontent-)
12
+ - [Examples](#examples)
13
+
3
14
  ## Getting started
4
15
 
5
16
  Install the peer dependencies of the module (if you haven't already):
@@ -11,22 +22,17 @@ Install the module
11
22
  npm i @uniformdev/uniform-nuxt
12
23
  ```
13
24
 
14
- Add the module to you Nuxt config:
25
+ Add the module to your Nuxt config:
15
26
 
16
- ```ts
27
+ ```js
17
28
  import { defineNuxtConfig } from 'nuxt';
18
29
 
19
30
  export default defineNuxtConfig({
20
- transpile: ['@uniformdev/canvas-vue', '@uniformdev/context-vue'],
21
- modules: [
22
- [
23
- '@uniformdev/uniform-nuxt',
24
- {
25
- projectId: process.env.UNIFORM_PROJECT_ID,
26
- readOnlyApiKey: process.env.UNIFORM_API_KEY,
27
- },
28
- ],
29
- ],
31
+ modules: ['@uniformdev/uniform-nuxt'],
32
+ uniform: {
33
+ projectId: process.env.UNIFORM_PROJECT_ID,
34
+ readOnlyApiKey: process.env.UNIFORM_API_KEY,
35
+ }
30
36
  });
31
37
  ```
32
38
 
@@ -35,8 +41,8 @@ export default defineNuxtConfig({
35
41
  - Auto-registers the needed Uniform components.
36
42
  - Creates a Canvas client automatically.
37
43
  - Creates a Uniform Context instance and provides it through the whole app, without the need of a wrapping component.
38
- - Provides a handy `$useComposition` composable, build on top of Nuxt's [useAsyncData](https://v3.nuxtjs.org/api/composables/use-async-data).
39
- - Handle Live Preview.
44
+ - Provides a handy `$useComposition` composable, built on top of Nuxt's [useAsyncData](https://v3.nuxtjs.org/api/composables/use-async-data).
45
+ - Handles Live Preview.
40
46
  - Watches query string change, which Nuxt doesn't do by default.
41
47
 
42
48
  ## API reference
@@ -50,7 +56,12 @@ These are the option you pass to the module in `nuxt.config.ts`.
50
56
  | `readOnlyApiKey`* | string | An API key that has read permissions to your Uniform project. ⚠️ Make sure the API key has only read access, because it's used in Nuxt's public runtime config |
51
57
  | `manifest` | ManifestV2 | The Uniform Context manifest. This one is usually fetched right before the app is started using Uniform's CLI. Uniform Context won't be enabled if a manifest is missing. |
52
58
  | `outputType` | 'standard' \| 'edge' | Set it to 'edge' when building the app for the edge using [NESI technology](https://docs.uniform.app/context/reference/netlify). Defaults to 'standard' |
53
- | `apiHost` | string | The host to be used when calling the API. Defaults to 'https://uniform.app' |
59
+ | `apiHost` | string | The host to be used when calling the API. Defaults to `https://uniform.app` |
60
+ | `defaultConsent` | boolean | Sets the default value of the user consent. Defaults to `false` |
61
+ | `enableContextDevTools` | boolean | Enables the [Context DevTools](https://docs.uniform.app/context/getting-started/browser-extension) plugin. Defaults to `true` |
62
+ | `uniformContextPath` | string | The path to a file that exports a Unifrom Context instance as default.<br>This will override the values of `manifest`, `defaultConsent` and `enableContextDevTools`. Useful for advanced use cases (such us using plugins other than the Context DevTools one). |
63
+
64
+
54
65
  \* Required
55
66
 
56
67
  ### Injected in the Nuxt instance
@@ -58,38 +69,38 @@ These are the properties that the module injects in the Nuxt app instance, so yo
58
69
 
59
70
  | Property | Type | Description |
60
71
  |---|---|---|
61
- | `$useComposition` | function | A compasable that you can use to fetch a Canvas composition. It's preview-aware, it will automatically fetch the draft composition if the app is in preview mode, otherwise it will return the published one. It uses Suspense under the hood, so you can have access to the error and pending states of the request |
62
- | `$useUniformContext` | function | A compasable that returns the current Uniform Context instance which allows you interact with the context such updating the scores and so on. It also returns other provided properties such as `outputType` |
72
+ | `$useComposition` | function | A Vue composable that you can use to fetch a Canvas composition. It's preview-aware, it will automatically fetch the draft composition if the app is in preview mode, otherwise it will return the published one. It uses Suspense under the hood, so you can have access to the error and pending states of the request |
73
+ | `$useUniformContext` | function | A Vue composable that returns the current Uniform Context instance which allows you interact with the context such updating the scores and so on. It also returns other provided properties such as `outputType` |
63
74
  | `$preview` | object \| undefined | This object is only defined in preview mode, so you can use it to adjust your app if it's in preview mode. It contains the slug of the current composition. |
64
75
  | `$uniformCanvasClient` | CanvasClient | Returns the Canvas client which you can use to fetch or update compositions. For composition fetching, it's recommended to use `$useComposition` instead. |
65
- | `uniformCanvasClient` | CanvasClient | Returns the Canvas client which you can use to fetch or update compositions. For composition fetching, it's recommended to use `$useComposition` instead. |
76
+
66
77
 
67
78
  ### Components
68
79
  These are the components that the module auto registers for you, so you can use them without import.
69
80
 
70
- #### <Composition />
81
+ #### \<Composition />
71
82
  This component wraps the whole composition, it
72
83
 
73
84
  | Prop | Type | Description |
74
85
  |---|---|---|
75
86
  | `data`* | string | The data of the composition to be rendered, this is usually the `composition` object that you get from `$useComposition` |
76
- | `resolveRenderer` | function | This function is responsible of mapping Canvas components to Vue components. It takes a ComponentInstance object and should return a Vue component (usually based on the component `type`). If no resolver is provided, it will try to resolve the componnet in on the global context of the app, so if you have globally defined components, it will try to map them based on the `name` of the Vue component and the `type` of Canvas component|
87
+ | `resolveRenderer` | function | This function is responsible of mapping Canvas components to Vue components. It takes a `ComponentInstance` object and should return a Vue component (usually based on the component `type`). If no resolver is provided, it will try to resolve the component on the global context of the app, so if you have globally defined components, it will try to map them based on the `name` of the Vue component and the `type` of the Canvas component.|
77
88
 
78
- * Required
89
+ \* Required
79
90
 
80
- #### <SlotContent />
91
+ #### \<SlotContent />
81
92
  This component is used to render the slots of a composition, and it can be only used inside a `<Composition />`.
82
93
  You can nest `<SlotContent />` inside each other if you have nested slots.
83
94
 
84
95
  | Prop | Type | Description |
85
96
  |---|---|---|
86
- | `name` | string | The name of the Canvas slot to render. If no name is provided, all the slots will be rendered. This is not recommended as the order is not guaranteed |
97
+ | `name` | string | The name of the Canvas slot to render.<br>If no value is provided, all the slots will be rendered (this is not recommended as the order of the rendered slots is not guaranteed). |
87
98
 
88
- ## Example
99
+ ## Examples
89
100
 
90
101
  Here are some example where the module is used:
91
102
  - https://github.com/uniformdev/uniformconf-nuxt
92
- - https://github.com/uniformdev/nuxt-canvas-nuxt
103
+ - https://github.com/uniformdev/nuxt-canvas-context-helloworld
93
104
 
94
105
 
95
106
 
package/dist/module.d.ts CHANGED
@@ -1,12 +1,36 @@
1
+ import * as _nuxt_schema from '@nuxt/schema';
1
2
  import { ManifestV2 } from '@uniformdev/context';
2
3
 
3
- interface ModuleOptions {
4
- projectId?: string;
5
- readOnlyApiKey?: string;
4
+ interface UniformModuleOptions {
5
+ /** The ID of the Uniform project you want to use in your app. */
6
+ projectId: string;
7
+ /** An API key that has read permissions to your Uniform project. ⚠️ Make sure the API key has only read access, because it's used in Nuxt's public runtime config */
8
+ readOnlyApiKey: string;
9
+ /**
10
+ * The host to be used when calling the API.
11
+ * @default 'https://uniform.app'
12
+ */
6
13
  apiHost?: string;
14
+ /** The Uniform Context manifest. This one is usually fetched right before the app is started using Uniform's CLI. Uniform Context won't be enabled if a manifest is missing. */
7
15
  manifest?: ManifestV2;
16
+ /**
17
+ * Set it to 'edge' when building the app for the edge using [NESI technology](https://docs.uniform.app/context/reference/netlify)
18
+ * @default 'standard'
19
+ */
8
20
  outputType?: string;
21
+ /** The path to a file that exports a Unifrom Context instance as default.<br>This will override the values of `manifest`, `defaultConsent` and `enableContextDevTools`. Useful for advanced use cases (such us using plugins other than the Context DevTools one). */
22
+ uniformContextPath?: string;
23
+ /**
24
+ * Sets the default value of the user consent.
25
+ * @default false
26
+ */
27
+ defaultConsent?: boolean;
28
+ /**
29
+ * Enables the [Context DevTools](https://docs.uniform.app/context/getting-started/browser-extension) plugin.
30
+ * @default true
31
+ */
32
+ enableContextDevTools?: boolean;
9
33
  }
10
- declare const _default: NuxtModule<OptionsT>;
34
+ declare const _default: _nuxt_schema.NuxtModule<UniformModuleOptions>;
11
35
 
12
- export { ModuleOptions, _default as default };
36
+ export { UniformModuleOptions, _default as default };
package/dist/module.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "nuxt-uniform",
3
3
  "configKey": "uniform",
4
- "version": "16.2.0"
4
+ "version": "16.2.1-nuxt.249+6d2287689"
5
5
  }
package/dist/module.mjs CHANGED
@@ -1,25 +1,57 @@
1
1
  import { resolve } from 'path';
2
2
  import { fileURLToPath } from 'url';
3
- import { defineNuxtModule, addPlugin } from '@nuxt/kit';
3
+ import { defineNuxtModule, resolveAlias, addTemplate, addPlugin, extendViteConfig } from '@nuxt/kit';
4
4
 
5
+ const uniformContextProxyPath = "uniform/context/instance.ts";
5
6
  const module = defineNuxtModule({
6
7
  meta: {
7
8
  name: "nuxt-uniform",
8
9
  configKey: "uniform"
9
10
  },
10
11
  defaults: {
11
- projectId: void 0,
12
- readOnlyApiKey: void 0,
12
+ projectId: "",
13
+ readOnlyApiKey: "",
13
14
  apiHost: "https://uniform.app",
14
15
  manifest: void 0,
15
- outputType: void 0
16
+ outputType: void 0,
17
+ uniformContextPath: void 0,
18
+ defaultConsent: false,
19
+ enableContextDevTools: true
16
20
  },
17
21
  setup(options, nuxt) {
22
+ options.apiHost;
23
+ if (!options.projectId || !options.readOnlyApiKey) {
24
+ throw new Error("uniform-nuxt: The module options 'projectId' and 'readOnlyApiKey' are required");
25
+ }
26
+ optimizeDeps(["rfdc"]);
18
27
  nuxt.options.runtimeConfig.public["$uniform"] = { ...options };
28
+ if (options.uniformContextPath) {
29
+ const resolvedUserContextPath = resolveConfigFilePath(nuxt, options.uniformContextPath);
30
+ addTemplate({
31
+ filename: uniformContextProxyPath,
32
+ getContents: () => `export { default } from '${resolvedUserContextPath}';`
33
+ });
34
+ } else {
35
+ addTemplate({
36
+ filename: uniformContextProxyPath,
37
+ getContents: () => `export default undefined;`
38
+ });
39
+ }
19
40
  const runtimeDir = fileURLToPath(new URL("./runtime", import.meta.url));
20
41
  nuxt.options.build.transpile.push(runtimeDir);
21
42
  addPlugin(resolve(runtimeDir, "plugin"));
22
43
  }
23
44
  });
45
+ function resolveConfigFilePath(nuxt, filePath) {
46
+ return resolve(nuxt.options.rootDir, resolveAlias(filePath));
47
+ }
48
+ function optimizeDeps(deps) {
49
+ extendViteConfig((config) => {
50
+ config.optimizeDeps = {
51
+ ...config.optimizeDeps,
52
+ include: [...config.optimizeDeps?.include ?? [], ...deps]
53
+ };
54
+ });
55
+ }
24
56
 
25
57
  export { module as default };
@@ -1,6 +1,7 @@
1
1
  import {
2
2
  defineNuxtPlugin,
3
3
  useRoute,
4
+ useRouter,
4
5
  useRuntimeConfig,
5
6
  useHead,
6
7
  refreshNuxtData,
@@ -8,6 +9,7 @@ import {
8
9
  useState,
9
10
  useCookie
10
11
  } from "#app";
12
+ import userProvidedContextInstance from "#build/uniform/context/instance";
11
13
  import { watch, toRaw } from "vue-demi";
12
14
  import {
13
15
  CanvasClient,
@@ -16,6 +18,7 @@ import {
16
18
  } from "@uniformdev/canvas";
17
19
  import {
18
20
  Context,
21
+ SERVER_STATE_ID,
19
22
  CookieTransitionDataStore,
20
23
  enableContextDevTools,
21
24
  UNIFORM_DEFAULT_COOKIE_NAME
@@ -30,52 +33,73 @@ export default defineNuxtPlugin((nuxtApp) => {
30
33
  if (nuxtApp.$uniformIsSetup) {
31
34
  return;
32
35
  }
33
- const currentCompositionId = useState("currentCompositionId", () => "");
34
- const preview = setupPreview();
35
- const uniformContext = setupContext(nuxtApp);
36
- const uniformCanvasClient = setupCanvas(nuxtApp);
37
- setupLivePreview(currentCompositionId, Boolean(preview));
38
- const useComposition = setupUseComposition(uniformCanvasClient, currentCompositionId, preview);
39
- return {
40
- provide: {
41
- uniformIsSetup: true,
42
- useUniformContext,
43
- preview,
44
- uniformCanvasClient,
45
- uniformContext,
46
- useComposition
47
- }
48
- };
36
+ try {
37
+ const currentCompositionId = useState("currentCompositionId", () => "");
38
+ const preview = setupPreview();
39
+ const uniformContextData = setupContext(nuxtApp);
40
+ const uniformCanvasClient = setupCanvas(nuxtApp);
41
+ setupLivePreview(currentCompositionId, Boolean(preview));
42
+ const useComposition = setupUseComposition(uniformCanvasClient, currentCompositionId, preview);
43
+ return {
44
+ provide: {
45
+ uniformIsSetup: true,
46
+ useUniformContext,
47
+ preview,
48
+ uniformCanvasClient,
49
+ uniformContext: uniformContextData.context,
50
+ useComposition
51
+ }
52
+ };
53
+ } catch (e) {
54
+ console.error("uniform-nuxt: An error occurred while initializing the Uniform plugin", e);
55
+ }
49
56
  });
50
57
  function setupContext(nuxtApp) {
51
- const options = useRuntimeConfig().public.$uniform;
58
+ const options = getModuleOptions();
52
59
  const uniformCookie = useCookie(UNIFORM_DEFAULT_COOKIE_NAME).value;
53
- let uniformContext;
54
- if (options.manifest) {
60
+ let uniformContext = userProvidedContextInstance;
61
+ if (uniformContext !== void 0 && !uniformContext.manifest) {
62
+ throw new Error(`uniform-nuxt: The Uniform Context instance returned by ${options.uniformContextPath} is not valid`);
63
+ }
64
+ if (!uniformContext && options.manifest) {
55
65
  console.log("uniform-nuxt: \u{1F4DC} found a manifest, will initialize Context");
56
66
  const manifestAsSimpleObject = toRaw(options.manifest);
57
67
  uniformContext = new Context({
58
- defaultConsent: true,
68
+ defaultConsent: Boolean(options.defaultConsent),
59
69
  manifest: manifestAsSimpleObject,
60
70
  transitionStore: new CookieTransitionDataStore({
61
71
  serverCookieValue: uniformCookie
62
72
  }),
63
- plugins: [enableContextDevTools()]
73
+ plugins: options.enableContextDevTools ? [enableContextDevTools()] : void 0
64
74
  });
65
75
  }
66
76
  provideUniformContext({
67
77
  context: uniformContext,
68
78
  outputType: options.outputType,
69
- vueAppProvide: nuxtApp.vueApp.provide
79
+ vueAppInstance: nuxtApp.vueApp
70
80
  });
81
+ if (uniformContext && typeof window === "undefined") {
82
+ const transferState = uniformContext.getServerToClientTransitionState();
83
+ useHead({
84
+ script: [
85
+ {
86
+ children: JSON.stringify(transferState),
87
+ id: SERVER_STATE_ID,
88
+ type: "application/json"
89
+ }
90
+ ]
91
+ });
92
+ }
71
93
  const route = useRoute();
72
- watch(() => JSON.stringify(route.query), () => {
73
- onRouteChange(uniformContext);
94
+ watch(route, () => {
95
+ if (uniformContext) {
96
+ onRouteChange(uniformContext);
97
+ }
74
98
  });
75
- return uniformContext;
99
+ return { context: uniformContext, outputType: options.outputType };
76
100
  }
77
101
  function setupCanvas(nuxtApp) {
78
- const options = useRuntimeConfig().public.$uniform;
102
+ const options = getModuleOptions();
79
103
  nuxtApp.vueApp.component("Composition", Composition);
80
104
  nuxtApp.vueApp.component("SlotContent", SlotContent);
81
105
  const uniformCanvasClient = new CanvasClient({
@@ -86,18 +110,30 @@ function setupCanvas(nuxtApp) {
86
110
  return uniformCanvasClient;
87
111
  }
88
112
  function setupPreview() {
113
+ const router = useRouter();
89
114
  const route = useRoute();
90
115
  let preview;
91
116
  if (route.query.preview === "true") {
92
117
  console.log("uniform-nuxt: \u{1F575}\uFE0F Entering preview mode");
93
118
  preview = {
94
- slug: route.query.slug
119
+ slug: route.query.slug,
120
+ compositionId: route.query.id
95
121
  };
96
122
  }
123
+ router.beforeEach((to, from, next) => {
124
+ if (from.query.preview === "true" && to.query.preview !== "true") {
125
+ return next({
126
+ path: to.path,
127
+ hash: to.hash,
128
+ query: { ...to.query, preview: "true" }
129
+ });
130
+ }
131
+ return next();
132
+ });
97
133
  return preview;
98
134
  }
99
135
  function setupLivePreview(currentCompositionId, isPreview = false) {
100
- const { projectId } = useRuntimeConfig().public.$uniform;
136
+ const { projectId } = getModuleOptions();
101
137
  const enabled = isPreview;
102
138
  const onCompositionChange = async () => {
103
139
  await refreshNuxtData();
@@ -112,515 +148,22 @@ function setupLivePreview(currentCompositionId, isPreview = false) {
112
148
  effect: onCompositionChange
113
149
  });
114
150
  }
115
- const SAMPLE_COMPOSITION_RESPONSE = {
116
- composition: {
117
- _id: "ecf48923-00c6-4d2b-8493-b1e0895d2807",
118
- type: "page",
119
- _name: "Home",
120
- _slug: "/",
121
- slots: {
122
- footer: [
123
- {
124
- type: "footer",
125
- parameters: {}
126
- }
127
- ],
128
- header: [
129
- {
130
- type: "header",
131
- parameters: {
132
- text: {
133
- type: "text",
134
- value: "V1"
135
- }
136
- }
137
- }
138
- ],
139
- content: [
140
- {
141
- type: "$personalization",
142
- slots: {
143
- pz: [
144
- {
145
- type: "hero",
146
- parameters: {
147
- text: {
148
- type: "text",
149
- value: "Now check out the conference sessions and add them to your agenda"
150
- },
151
- image: {
152
- type: "text",
153
- value: "/images/registration-hero.svg"
154
- },
155
- title: {
156
- type: "text",
157
- value: "Thank you for joining!"
158
- },
159
- $pzCrit: {
160
- type: "$pzCrit",
161
- value: {
162
- crit: [
163
- {
164
- l: "registrationComplete",
165
- r: 50,
166
- op: ">"
167
- }
168
- ]
169
- }
170
- },
171
- intentTag: {
172
- type: "intentTag",
173
- value: null
174
- },
175
- buttonText: {
176
- type: "text",
177
- value: "See sessions"
178
- }
179
- }
180
- },
181
- {
182
- type: "hero",
183
- parameters: {
184
- text: {
185
- type: "text",
186
- value: "We can't wait to receive your talk submission!"
187
- },
188
- image: {
189
- type: "text",
190
- value: "/images/call-for-papers-hero.svg"
191
- },
192
- title: {
193
- type: "text",
194
- value: "Call for papers open now!"
195
- },
196
- $pzCrit: {
197
- type: "$pzCrit",
198
- value: {
199
- crit: [
200
- {
201
- l: "submitCallForPapers",
202
- r: 50,
203
- op: ">="
204
- }
205
- ]
206
- }
207
- },
208
- intentTag: {
209
- type: "intentTag",
210
- value: null
211
- },
212
- buttonText: {
213
- type: "text",
214
- value: "Submit your talk"
215
- }
216
- }
217
- },
218
- {
219
- type: "hero",
220
- parameters: {
221
- text: {
222
- type: "text",
223
- value: "We think you might be interested in this content."
224
- },
225
- image: {
226
- type: "text",
227
- value: "/images/developer-hero.svg"
228
- },
229
- title: {
230
- type: "text",
231
- value: "Hey, developer!"
232
- },
233
- $pzCrit: {
234
- type: "$pzCrit",
235
- value: {
236
- crit: [
237
- {
238
- l: "techies",
239
- op: "+"
240
- }
241
- ]
242
- }
243
- },
244
- intentTag: {
245
- type: "intentTag",
246
- value: null
247
- },
248
- buttonText: {
249
- type: "text",
250
- value: null
251
- }
252
- }
253
- },
254
- {
255
- type: "hero",
256
- parameters: {
257
- text: {
258
- type: "text",
259
- value: "We think you may be a marketer. This might be of interest to you!"
260
- },
261
- image: {
262
- type: "text",
263
- value: "/images/marketer-hero.svg"
264
- },
265
- title: {
266
- type: "text",
267
- value: "Howdy, Marketer!"
268
- },
269
- $pzCrit: {
270
- type: "$pzCrit",
271
- value: {
272
- crit: [
273
- {
274
- l: "nonTechies",
275
- op: "+"
276
- }
277
- ]
278
- }
279
- },
280
- intentTag: {
281
- type: "intentTag",
282
- value: null
283
- }
284
- }
285
- },
286
- {
287
- type: "hero",
288
- parameters: {
289
- text: {
290
- type: "text",
291
- value: "Whether you are a developer or a marketer, we got great content for you."
292
- },
293
- image: {
294
- type: "text",
295
- value: "/images/default-hero.svg"
296
- },
297
- title: {
298
- type: "text",
299
- value: "Welcome to UniformConf"
300
- },
301
- buttonLink: {
302
- type: "text",
303
- value: "/registration"
304
- },
305
- buttonText: {
306
- type: "text",
307
- value: "Register"
308
- }
309
- }
310
- }
311
- ]
312
- },
313
- parameters: {
314
- trackingEventName: {
315
- type: "text",
316
- value: "Home Hero"
317
- }
318
- }
319
- },
320
- {
321
- type: "$personalization",
322
- slots: {
323
- pz: [
324
- {
325
- type: "talklist",
326
- slots: {
327
- talks: [
328
- {
329
- type: "talk",
330
- parameters: {
331
- title: {
332
- type: "text",
333
- value: "Jamstack 101"
334
- },
335
- audience: {
336
- type: "select",
337
- value: "Marketers"
338
- },
339
- intentTag: {
340
- type: "intentTag",
341
- value: null
342
- },
343
- description: {
344
- type: "text",
345
- value: "Learn what Jamstack is in this introductory course for both developers and marketers."
346
- }
347
- }
348
- },
349
- {
350
- type: "talk",
351
- parameters: {
352
- title: {
353
- type: "text",
354
- value: "Personalization the Jamstack way"
355
- },
356
- audience: {
357
- type: "select",
358
- value: "Marketers"
359
- },
360
- description: {
361
- type: "text",
362
- value: "Marketers can learn about the basics of personalization and how to do it the Jamstack way."
363
- }
364
- }
365
- },
366
- {
367
- type: "talk",
368
- parameters: {
369
- title: {
370
- type: "text",
371
- value: "3rd party scripts and performance"
372
- },
373
- audience: {
374
- type: "select",
375
- value: "Marketers"
376
- },
377
- description: {
378
- type: "text",
379
- value: "The effect of 3rd party scripts on performance can be huge and the additional JavaScript payload coming from 3rd party scripts can easily exceed the amount of JavaScript you need to render your site."
380
- }
381
- }
382
- }
383
- ]
384
- },
385
- parameters: {
386
- title: {
387
- type: "text",
388
- value: "Personalized talks for marketers"
389
- },
390
- $pzCrit: {
391
- type: "$pzCrit",
392
- value: {
393
- crit: [
394
- {
395
- l: "nonTechies",
396
- op: "+"
397
- }
398
- ]
399
- }
400
- }
401
- }
402
- },
403
- {
404
- type: "talklist",
405
- slots: {
406
- talks: [
407
- {
408
- type: "talk",
409
- parameters: {
410
- title: {
411
- type: "text",
412
- value: "What's next in Next.js?"
413
- },
414
- audience: {
415
- type: "select",
416
- value: "Developers"
417
- },
418
- description: {
419
- type: "text",
420
- value: "Find out what's new in the latest Next.js release. Find out in this content packed session!"
421
- }
422
- }
423
- },
424
- {
425
- type: "talk",
426
- parameters: {
427
- title: {
428
- type: "text",
429
- value: "Edge-side computing basics"
430
- },
431
- audience: {
432
- type: "select",
433
- value: "Developers"
434
- },
435
- description: {
436
- type: "text",
437
- value: "Learn how to take the static to the new realm by adding edge-side logic to your application."
438
- }
439
- }
440
- },
441
- {
442
- type: "talk",
443
- parameters: {
444
- title: {
445
- type: "text",
446
- value: "Personalization the for developers"
447
- },
448
- audience: {
449
- type: "select",
450
- value: "Developers"
451
- },
452
- description: {
453
- type: "text",
454
- value: "Developers should know the basics of personalization and how to do it the Jamstack way."
455
- }
456
- }
457
- }
458
- ]
459
- },
460
- parameters: {
461
- title: {
462
- type: "text",
463
- value: "Personalized talks for developers"
464
- },
465
- $pzCrit: {
466
- type: "$pzCrit",
467
- value: {
468
- crit: [
469
- {
470
- l: "techies",
471
- op: "+"
472
- }
473
- ]
474
- }
475
- }
476
- }
477
- },
478
- {
479
- type: "talklist",
480
- slots: {
481
- talks: [
482
- {
483
- type: "talk",
484
- parameters: {
485
- title: {
486
- type: "text",
487
- value: "What's next in Next.js?"
488
- },
489
- audience: {
490
- type: "select",
491
- value: "Developers"
492
- },
493
- description: {
494
- type: "text",
495
- value: "Find out what's new in the latest Next.js release. Find out in this content packed session!"
496
- }
497
- }
498
- },
499
- {
500
- type: "talk",
501
- parameters: {
502
- title: {
503
- type: "text",
504
- value: "Personalization the Jamstack way"
505
- },
506
- audience: {
507
- type: "select",
508
- value: "Marketers"
509
- },
510
- description: {
511
- type: "text",
512
- value: "Marketers can learn about the basics of personalization and how to do it the Jamstack way."
513
- }
514
- }
515
- },
516
- {
517
- type: "talk",
518
- parameters: {
519
- title: {
520
- type: "text",
521
- value: "Personalization the for developers"
522
- },
523
- audience: {
524
- type: "select",
525
- value: "Developers"
526
- },
527
- description: {
528
- type: "text",
529
- value: "Developers should know the basics of personalization and how to do it the Jamstack way."
530
- }
531
- }
532
- }
533
- ]
534
- },
535
- parameters: {
536
- title: {
537
- type: "text",
538
- value: "Our conference talks for everyone"
539
- },
540
- $pzCrit: {
541
- type: "$pzCrit",
542
- value: null
543
- }
544
- }
545
- }
546
- ]
547
- },
548
- parameters: {
549
- trackingEventName: {
550
- type: "text",
551
- value: "Home page talks"
552
- }
553
- }
554
- },
555
- {
556
- type: "$test",
557
- slots: {
558
- test: [
559
- {
560
- type: "whyattend",
561
- variant: "whyattendright",
562
- parameters: {
563
- text: {
564
- type: "text",
565
- value: "This conference has something to offer developers and marketers alike. From basics to advanced, learn more about:\n\n1. Enterprise JAMstack Personalization\n2. Uniform Personalization\n3. Uniform DXP\n\nExpand your knowledge on these subjects and engage with professionals from all over the world."
566
- },
567
- image: {
568
- type: "text",
569
- value: "/images/crowd.jpg"
570
- },
571
- title: {
572
- type: "text",
573
- value: "Why You Should Attend"
574
- }
575
- }
576
- },
577
- {
578
- type: "whyattend",
579
- variant: "whyattendleft",
580
- parameters: {
581
- text: {
582
- type: "text",
583
- value: "This conference has something to offer developers and marketers alike. From basics to advanced, learn more about:\n\n1. Enterprise JAMstack Personalization\n2. Uniform Personalization\n3. Uniform DXP\n\nExpand your knowledge on these subjects and engage with professionals from all over the world."
584
- },
585
- image: {
586
- type: "text",
587
- value: "/images/crowd.jpg"
588
- },
589
- title: {
590
- type: "text",
591
- value: "Why You Should Attend"
592
- }
593
- }
594
- }
595
- ]
596
- },
597
- parameters: {
598
- test: {
599
- type: "testSelect",
600
- value: "whyAttendTest"
601
- }
602
- }
603
- }
604
- ]
605
- },
606
- parameters: {},
607
- _permissions: [],
608
- _use_team_permissions: true
609
- },
610
- projectId: "e132b5d8-2e49-4352-b2f6-640ab581784f",
611
- state: 64,
612
- created: "2022-06-02T10:42:50.973477+00:00",
613
- modified: "2022-06-16T14:13:05.324643+00:00",
614
- pattern: false
615
- };
616
151
  function setupUseComposition(uniformCanvasClient, currentCompositionId, preview) {
617
152
  const useComposition = async (options) => {
618
- const { data, pending, error } = await useAsyncData(`composition-${options.slug || options.compositionId}`, async () => await uniformCanvasClient[options.slug ? "getCompositionBySlug" : "getCompositionById"]({
619
- state: preview ? CANVAS_DRAFT_STATE : CANVAS_PUBLISHED_STATE,
620
- ...options
621
- }));
622
- currentCompositionId.value = data.value?.composition._id;
153
+ const slug = preview?.slug ?? options.slug;
154
+ const compositionId = preview?.compositionId ?? options.compositionId;
155
+ const state = preview ? CANVAS_DRAFT_STATE : CANVAS_PUBLISHED_STATE;
156
+ const { data, pending, error } = await useAsyncData(`composition-${slug || compositionId}`, async () => {
157
+ if (slug) {
158
+ return await uniformCanvasClient.getCompositionBySlug({ slug, state });
159
+ }
160
+ return await uniformCanvasClient.getCompositionById({ compositionId, state });
161
+ });
162
+ currentCompositionId.value = data.value?.composition._id ?? "";
623
163
  return { data, pending, error };
624
164
  };
625
165
  return useComposition;
626
166
  }
167
+ function getModuleOptions() {
168
+ return useRuntimeConfig().public.$uniform;
169
+ }
package/dist/types.d.ts CHANGED
@@ -1,10 +1,6 @@
1
1
 
2
- import { ModuleOptions } from './module'
2
+ import { } from './module'
3
3
 
4
- declare module '@nuxt/schema' {
5
- interface NuxtConfig { ['uniform']?: Partial<ModuleOptions> }
6
- interface NuxtOptions { ['uniform']?: ModuleOptions }
7
- }
8
4
 
9
5
 
10
6
  export { default } from './module'
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@uniformdev/uniform-nuxt",
3
- "version": "16.2.0",
3
+ "version": "16.2.1-nuxt.249+6d2287689",
4
4
  "license": "MIT",
5
5
  "type": "module",
6
6
  "exports": {
@@ -16,10 +16,14 @@
16
16
  ],
17
17
  "scripts": {
18
18
  "prepack": "nuxt-module-build",
19
- "build": "nuxt-module-build"
19
+ "build": "nuxt-module-build",
20
+ "clean": "rimraf dist",
21
+ "lint": "eslint \"src/**/*.{js,ts,tsx}\"",
22
+ "format": "prettier --write \"src/**/*.{js,ts,tsx}\""
20
23
  },
21
24
  "dependencies": {
22
- "@nuxt/kit": "^3.0.0-rc.4"
25
+ "@nuxt/kit": "^3.0.0-rc.4",
26
+ "vue-demi": "^0.13.0"
23
27
  },
24
28
  "peerDependencies": {
25
29
  "@uniformdev/canvas": ">15",
@@ -29,16 +33,20 @@
29
33
  },
30
34
  "devDependencies": {
31
35
  "@nuxt/module-builder": "0.1.7",
36
+ "@nuxt/schema": "3.0.0-rc.5",
32
37
  "@nuxtjs/eslint-config-typescript": "10.0.0",
33
- "@uniformdev/canvas": "^16.2.0",
34
- "@uniformdev/canvas-vue": "^16.2.0",
35
- "@uniformdev/context": "^16.2.0",
36
- "@uniformdev/context-vue": "^16.2.0",
38
+ "@uniformdev/canvas": "^16.2.1-nuxt.249+6d2287689",
39
+ "@uniformdev/canvas-vue": "^16.2.1-nuxt.249+6d2287689",
40
+ "@uniformdev/context": "^16.2.1-nuxt.249+6d2287689",
41
+ "@uniformdev/context-vue": "^16.2.1-nuxt.249+6d2287689",
37
42
  "esbuild": "0.13.15",
38
43
  "eslint": "latest",
39
- "nuxt": "^3.0.0-rc.4"
44
+ "nuxt": "3.0.0-rc.5",
45
+ "vue": "3.2.37",
46
+ "vue-router": "3.5.4"
40
47
  },
41
48
  "publishConfig": {
42
49
  "access": "public"
43
- }
50
+ },
51
+ "gitHead": "6d2287689097cb256d17483ea3726d4bb87b2fa6"
44
52
  }