@uniformdev/canvas-next-rsc 19.38.3-alpha.70 → 19.38.3-alpha.78
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/dist/components/UniformComponent.d.ts +2 -2
- package/dist/components/UniformComposition.js +26 -3
- package/dist/components/UniformScript.js +7 -31
- package/dist/components/UniformSlot.d.ts +16 -3
- package/dist/components/UniformSlot.js +9 -4
- package/dist/components/__tests__/evaluateComposition.spec.d.ts +1 -0
- package/dist/components/__tests__/evaluateComposition.spec.js +72 -0
- package/dist/components/evaluateComposition.d.ts +9 -2
- package/dist/components/evaluateComposition.js +21 -36
- package/dist/components/renderComponent.js +5 -2
- package/dist/components/retrieveRoute.js +9 -2
- package/dist/config/models.d.ts +4 -0
- package/dist/utils/draft.js +2 -2
- package/package.json +10 -10
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { type ComponentInstance, type RootComponentInstance } from '@uniformdev/canvas';
|
|
1
|
+
import { type ComponentInstance, type RootComponentInstance, RouteGetResponseComposition } from '@uniformdev/canvas';
|
|
2
2
|
import { ReactNode } from 'react';
|
|
3
|
-
export type CompositionContext = {
|
|
3
|
+
export type CompositionContext = Omit<RouteGetResponseComposition, 'compositionApiResponse'> & {
|
|
4
4
|
composition: RootComponentInstance;
|
|
5
5
|
path: string;
|
|
6
6
|
state?: number;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { CANVAS_DRAFT_STATE, CANVAS_PUBLISHED_STATE } from '@uniformdev/canvas';
|
|
2
|
+
import { CANVAS_DRAFT_STATE, CANVAS_EDITOR_STATE, CANVAS_PUBLISHED_STATE } from '@uniformdev/canvas';
|
|
3
|
+
import { cookies, headers } from 'next/headers';
|
|
3
4
|
import { notFound, redirect } from 'next/navigation';
|
|
4
5
|
import { Suspense } from 'react';
|
|
5
6
|
import { getManifestFromApi } from '../client/manifestClient';
|
|
@@ -34,10 +35,17 @@ const UniformCompositionInner = async ({ params, searchParams, children }) => {
|
|
|
34
35
|
const path = resolvePath({
|
|
35
36
|
params,
|
|
36
37
|
});
|
|
38
|
+
let state;
|
|
39
|
+
if (isCanvasEditing) {
|
|
40
|
+
state = CANVAS_EDITOR_STATE;
|
|
41
|
+
}
|
|
42
|
+
else {
|
|
43
|
+
state = draftMode || previewEnvironment || isDevelopment ? CANVAS_DRAFT_STATE : CANVAS_PUBLISHED_STATE;
|
|
44
|
+
}
|
|
37
45
|
// resolve the route from the path
|
|
38
46
|
const resolveResult = await retrieveRoute({
|
|
39
47
|
path,
|
|
40
|
-
state
|
|
48
|
+
state,
|
|
41
49
|
searchParams,
|
|
42
50
|
});
|
|
43
51
|
// if the route is a redirect, redirect
|
|
@@ -49,16 +57,31 @@ const UniformCompositionInner = async ({ params, searchParams, children }) => {
|
|
|
49
57
|
if (resolveResult.type === 'notFound') {
|
|
50
58
|
notFound();
|
|
51
59
|
}
|
|
60
|
+
const { compositionApiResponse, ...rest } = resolveResult;
|
|
61
|
+
// retrieve the manifest
|
|
62
|
+
const manifest = await getManifestFromApi({
|
|
63
|
+
searchParams,
|
|
64
|
+
});
|
|
52
65
|
// evaluate the composition
|
|
53
66
|
const { cookieValue, composition: evaluatedComposition, seenComponents, } = await evaluateComposition({
|
|
54
|
-
root:
|
|
67
|
+
root: compositionApiResponse.composition,
|
|
55
68
|
params,
|
|
56
69
|
searchParams: searchParams !== null && searchParams !== void 0 ? searchParams : {},
|
|
70
|
+
dynamicInputs: rest.dynamicInputs,
|
|
71
|
+
manifest,
|
|
72
|
+
headers: headers(),
|
|
73
|
+
cookies: cookies()
|
|
74
|
+
.getAll()
|
|
75
|
+
.reduce((acc, cookie) => {
|
|
76
|
+
acc[cookie.name] = cookie.value;
|
|
77
|
+
return acc;
|
|
78
|
+
}, {}),
|
|
57
79
|
});
|
|
58
80
|
const context = {
|
|
59
81
|
composition: evaluatedComposition,
|
|
60
82
|
path,
|
|
61
83
|
searchParams,
|
|
84
|
+
...rest,
|
|
62
85
|
};
|
|
63
86
|
return (_jsxs(UniformProvider, { cookieValue: cookieValue, seenComponents: seenComponents, children: [_jsx(UniformScript, { enabled: isCanvasEditing }), _jsx(UniformComponent, { data: evaluatedComposition, context: context }), Boolean(children) && children] }));
|
|
64
87
|
};
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
-
import { createCanvasChannel
|
|
3
|
+
import { createCanvasChannel } from '@uniformdev/canvas';
|
|
4
|
+
import { useRouter } from 'next/navigation';
|
|
4
5
|
import { useEffect, useMemo } from 'react';
|
|
5
6
|
export const UniformScript = ({ enabled }) => {
|
|
7
|
+
const router = useRouter();
|
|
6
8
|
const channel = useMemo(() => {
|
|
7
9
|
var _a;
|
|
8
10
|
if (typeof window === 'undefined') {
|
|
@@ -18,39 +20,13 @@ export const UniformScript = ({ enabled }) => {
|
|
|
18
20
|
if (!channel) {
|
|
19
21
|
return;
|
|
20
22
|
}
|
|
21
|
-
const
|
|
22
|
-
|
|
23
|
-
if (isUpdateCompositionInternalMessage(data)) {
|
|
24
|
-
const url = new URL(window.location.href);
|
|
25
|
-
if (url.searchParams.get('vcdiffhash') === ((_a = data.hash) === null || _a === void 0 ? void 0 : _a.toString())) {
|
|
26
|
-
// eslint-disable-next-line no-console
|
|
27
|
-
console.log("Skipping composition update because it's already been applied.");
|
|
28
|
-
return;
|
|
29
|
-
}
|
|
30
|
-
const response = await fetch('/api/uniform', {
|
|
31
|
-
method: 'POST',
|
|
32
|
-
body: JSON.stringify(data),
|
|
33
|
-
});
|
|
34
|
-
if (!response.ok) {
|
|
35
|
-
// eslint-disable-next-line no-console
|
|
36
|
-
console.error(response);
|
|
37
|
-
return;
|
|
38
|
-
}
|
|
39
|
-
const json = (await response.json());
|
|
40
|
-
if (json.diff.length) {
|
|
41
|
-
const serialized = Buffer.from(JSON.stringify(json.diff)).toString('base64');
|
|
42
|
-
// set serialized as query string param
|
|
43
|
-
url.searchParams.set('vcdiff', serialized);
|
|
44
|
-
url.searchParams.set('vcdiffhash', (_c = (_b = data.hash) === null || _b === void 0 ? void 0 : _b.toString()) !== null && _c !== void 0 ? _c : '');
|
|
45
|
-
// set url
|
|
46
|
-
window.location.href = url.toString();
|
|
47
|
-
}
|
|
48
|
-
}
|
|
23
|
+
const unsubscribeFromEditorUpdates = channel.on('editor-state-updated', () => {
|
|
24
|
+
router.refresh();
|
|
49
25
|
});
|
|
50
26
|
return () => {
|
|
51
|
-
|
|
27
|
+
unsubscribeFromEditorUpdates();
|
|
52
28
|
};
|
|
53
|
-
}, [channel]);
|
|
29
|
+
}, [channel, router]);
|
|
54
30
|
useEffect(() => {
|
|
55
31
|
if (typeof window === 'undefined') {
|
|
56
32
|
return;
|
|
@@ -1,11 +1,15 @@
|
|
|
1
1
|
import { ComponentInstance } from '@uniformdev/canvas';
|
|
2
|
-
import { Key, ReactNode } from 'react';
|
|
2
|
+
import React, { Key, ReactNode } from 'react';
|
|
3
3
|
import { CompositionContext } from './UniformComponent';
|
|
4
4
|
export type CustomSlotChildRenderFunc = (options: {
|
|
5
5
|
child: ReactNode;
|
|
6
6
|
component: ComponentInstance;
|
|
7
7
|
key: Key;
|
|
8
8
|
}) => JSX.Element;
|
|
9
|
+
export type UniformSlotWrapperComponentProps = {
|
|
10
|
+
items: ReactNode[];
|
|
11
|
+
slotName: string;
|
|
12
|
+
};
|
|
9
13
|
export type UniformSlotProps<TSlotNames extends string> = {
|
|
10
14
|
/** Name of the slot to render */
|
|
11
15
|
name: TSlotNames;
|
|
@@ -13,8 +17,17 @@ export type UniformSlotProps<TSlotNames extends string> = {
|
|
|
13
17
|
data: ComponentInstance;
|
|
14
18
|
/** The context of the composition that is being rendered */
|
|
15
19
|
context: CompositionContext;
|
|
16
|
-
/**
|
|
20
|
+
/**
|
|
21
|
+
* Optional render props enables wrapping all child components in the slot with some markup
|
|
22
|
+
*
|
|
23
|
+
* @deprecated Use `wrapperComponent` instead and define wrapping component for slot children inside.
|
|
24
|
+
*/
|
|
17
25
|
children?: CustomSlotChildRenderFunc;
|
|
26
|
+
/**
|
|
27
|
+
* Optional wrapper component around list of slot items that allows to control
|
|
28
|
+
* exactly how to render slot items, otherwise React.Fragment is being used
|
|
29
|
+
*/
|
|
30
|
+
wrapperComponent?: React.ComponentType<UniformSlotWrapperComponentProps>;
|
|
18
31
|
/**
|
|
19
32
|
* Optional ReactNode to use as a placeholder in Canvas editor when the slot is empty.
|
|
20
33
|
* The node is used to render a placeholder with realistic dimensions and it's never shown to users.
|
|
@@ -22,6 +35,6 @@ export type UniformSlotProps<TSlotNames extends string> = {
|
|
|
22
35
|
*/
|
|
23
36
|
emptyPlaceholder?: ReactNode;
|
|
24
37
|
};
|
|
25
|
-
export declare function UniformSlot<TSlotNames extends string = string>({ name, children, emptyPlaceholder, data: parentData, context, }: UniformSlotProps<TSlotNames> & {
|
|
38
|
+
export declare function UniformSlot<TSlotNames extends string = string>({ name, children, emptyPlaceholder, data: parentData, wrapperComponent, context, }: UniformSlotProps<TSlotNames> & {
|
|
26
39
|
data: ComponentInstance;
|
|
27
40
|
}): JSX.Element | null;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import React, { createElement, Fragment } from 'react';
|
|
2
3
|
import { renderComponent } from './renderComponent';
|
|
3
|
-
export function UniformSlot({ name, children, emptyPlaceholder, data: parentData, context, }) {
|
|
4
|
+
export function UniformSlot({ name, children, emptyPlaceholder, data: parentData, wrapperComponent, context, }) {
|
|
4
5
|
var _a;
|
|
5
6
|
const slot = (_a = parentData.slots) === null || _a === void 0 ? void 0 : _a[name];
|
|
6
7
|
if (!slot || !Array.isArray(slot)) {
|
|
@@ -27,7 +28,11 @@ export function UniformSlot({ name, children, emptyPlaceholder, data: parentData
|
|
|
27
28
|
emptyPlaceholder,
|
|
28
29
|
});
|
|
29
30
|
const elements = children ? children({ child, component, key: `wrapped-inner-${index}` }) : child;
|
|
30
|
-
return createElement(Fragment, { key: index }, elements);
|
|
31
|
+
return createElement(Fragment, { key: `wrapped-${index}` }, elements);
|
|
31
32
|
});
|
|
32
|
-
|
|
33
|
+
if (!wrapperComponent) {
|
|
34
|
+
return React.createElement(React.Fragment, undefined, finalChildren);
|
|
35
|
+
}
|
|
36
|
+
const Wrapper = wrapperComponent;
|
|
37
|
+
return _jsx(Wrapper, { items: finalChildren, slotName: name });
|
|
33
38
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
import { CANVAS_LOCALE_TAG_PARAM, CANVAS_LOCALIZATION_SLOT, CANVAS_LOCALIZATION_TYPE, } from '@uniformdev/canvas';
|
|
2
|
+
import { evaluateComposition } from '../evaluateComposition';
|
|
3
|
+
describe('evaluateComposition', () => {
|
|
4
|
+
it('should localize a compoisition when dynmaic inputs include locale token', async () => {
|
|
5
|
+
var _a, _b;
|
|
6
|
+
const root = {
|
|
7
|
+
_id: 'root',
|
|
8
|
+
_name: 'root',
|
|
9
|
+
type: 'root',
|
|
10
|
+
slots: {
|
|
11
|
+
content: [
|
|
12
|
+
{
|
|
13
|
+
type: CANVAS_LOCALIZATION_TYPE,
|
|
14
|
+
slots: {
|
|
15
|
+
[CANVAS_LOCALIZATION_SLOT]: [
|
|
16
|
+
{
|
|
17
|
+
type: 'hero',
|
|
18
|
+
parameters: {
|
|
19
|
+
[CANVAS_LOCALE_TAG_PARAM]: {
|
|
20
|
+
type: CANVAS_LOCALE_TAG_PARAM,
|
|
21
|
+
value: 'fr',
|
|
22
|
+
},
|
|
23
|
+
title: {
|
|
24
|
+
type: 'text',
|
|
25
|
+
value: 'This is the french title!',
|
|
26
|
+
},
|
|
27
|
+
},
|
|
28
|
+
},
|
|
29
|
+
{
|
|
30
|
+
type: 'hero',
|
|
31
|
+
parameters: {
|
|
32
|
+
[CANVAS_LOCALE_TAG_PARAM]: {
|
|
33
|
+
type: CANVAS_LOCALE_TAG_PARAM,
|
|
34
|
+
value: 'en',
|
|
35
|
+
},
|
|
36
|
+
title: {
|
|
37
|
+
type: 'text',
|
|
38
|
+
value: 'This is the english title!',
|
|
39
|
+
},
|
|
40
|
+
},
|
|
41
|
+
},
|
|
42
|
+
],
|
|
43
|
+
},
|
|
44
|
+
},
|
|
45
|
+
],
|
|
46
|
+
},
|
|
47
|
+
};
|
|
48
|
+
await evaluateComposition({
|
|
49
|
+
root,
|
|
50
|
+
dynamicInputs: {
|
|
51
|
+
lang: 'en',
|
|
52
|
+
},
|
|
53
|
+
cookies: {},
|
|
54
|
+
headers: new Headers(),
|
|
55
|
+
params: {
|
|
56
|
+
slug: 'whatever',
|
|
57
|
+
},
|
|
58
|
+
searchParams: {},
|
|
59
|
+
config: {
|
|
60
|
+
experimental: {
|
|
61
|
+
localeDynamicInputs: ['lang'],
|
|
62
|
+
},
|
|
63
|
+
},
|
|
64
|
+
manifest: {
|
|
65
|
+
project: {},
|
|
66
|
+
},
|
|
67
|
+
});
|
|
68
|
+
const localizedHero = (_a = root.slots) === null || _a === void 0 ? void 0 : _a['content'][0];
|
|
69
|
+
expect(localizedHero).toBeDefined();
|
|
70
|
+
expect((_b = localizedHero === null || localizedHero === void 0 ? void 0 : localizedHero.parameters) === null || _b === void 0 ? void 0 : _b[CANVAS_LOCALE_TAG_PARAM].value).toBe('en');
|
|
71
|
+
});
|
|
72
|
+
});
|
|
@@ -1,6 +1,8 @@
|
|
|
1
|
-
import { RootComponentInstance } from '@uniformdev/canvas';
|
|
1
|
+
import { RootComponentInstance, RouteGetResponseComposition } from '@uniformdev/canvas';
|
|
2
|
+
import { ManifestV2 } from '@uniformdev/context';
|
|
3
|
+
import { UniformServerConfig } from '../config';
|
|
2
4
|
import { SeenUniformComponent } from '../models';
|
|
3
|
-
export declare const evaluateComposition: ({ root, params, searchParams, }: {
|
|
5
|
+
export declare const evaluateComposition: ({ root, params, searchParams, dynamicInputs, manifest, headers, cookies, config, }: {
|
|
4
6
|
root: RootComponentInstance;
|
|
5
7
|
params: {
|
|
6
8
|
slug: string | string[];
|
|
@@ -8,6 +10,11 @@ export declare const evaluateComposition: ({ root, params, searchParams, }: {
|
|
|
8
10
|
searchParams: {
|
|
9
11
|
[key: string]: string | undefined;
|
|
10
12
|
};
|
|
13
|
+
dynamicInputs: RouteGetResponseComposition['dynamicInputs'];
|
|
14
|
+
manifest: ManifestV2;
|
|
15
|
+
headers: Headers;
|
|
16
|
+
cookies: Record<string, string>;
|
|
17
|
+
config?: UniformServerConfig | undefined;
|
|
11
18
|
}) => Promise<{
|
|
12
19
|
composition: RootComponentInstance;
|
|
13
20
|
cookieValue: string | undefined;
|
|
@@ -1,21 +1,13 @@
|
|
|
1
|
-
import { CANVAS_PERSONALIZATION_PARAM, CANVAS_PERSONALIZE_TYPE, CANVAS_TEST_TYPE, mapSlotToPersonalizedVariations, mapSlotToTestVariations, walkComponentTree, } from '@uniformdev/canvas';
|
|
1
|
+
import { CANVAS_PERSONALIZATION_PARAM, CANVAS_PERSONALIZE_TYPE, CANVAS_TEST_TYPE, localize, mapSlotToPersonalizedVariations, mapSlotToTestVariations, walkComponentTree, } from '@uniformdev/canvas';
|
|
2
2
|
import { Context, CookieTransitionDataStore, UNIFORM_DEFAULT_COOKIE_NAME, } from '@uniformdev/context';
|
|
3
|
-
import
|
|
4
|
-
import { getManifestFromApi } from '../client/manifestClient';
|
|
3
|
+
import serverConfig from '../config/uniform.server.config';
|
|
5
4
|
import { serializeCookie } from '../score';
|
|
6
|
-
import { applyDiff } from '../utils/apply';
|
|
7
|
-
import { isDraftModeEnabled } from '../utils/draft';
|
|
8
5
|
import { getBaseUrl } from '../utils/url';
|
|
9
6
|
import { getEnrichmentTags } from './getEnrichmentTags';
|
|
10
7
|
import { resolvePath } from './resolvePath';
|
|
11
|
-
export const evaluateComposition = async ({ root, params, searchParams, }) => {
|
|
12
|
-
var _a;
|
|
13
|
-
// retrieve the manifest
|
|
14
|
-
const manifest = await getManifestFromApi({
|
|
15
|
-
searchParams,
|
|
16
|
-
});
|
|
8
|
+
export const evaluateComposition = async ({ root, params, searchParams, dynamicInputs, manifest, headers, cookies, config = serverConfig, }) => {
|
|
17
9
|
// retrieve the score from the cookie, if any
|
|
18
|
-
const score =
|
|
10
|
+
const score = cookies[UNIFORM_DEFAULT_COOKIE_NAME];
|
|
19
11
|
// resolve the path from route params
|
|
20
12
|
const path = resolvePath({
|
|
21
13
|
params,
|
|
@@ -34,37 +26,30 @@ export const evaluateComposition = async ({ root, params, searchParams, }) => {
|
|
|
34
26
|
url.searchParams.set(key, value);
|
|
35
27
|
}
|
|
36
28
|
}
|
|
37
|
-
const headersInstance = headers();
|
|
38
29
|
const missingQuirkValue = 'unknown';
|
|
39
30
|
// update context to update scores
|
|
40
31
|
await context.update({
|
|
41
|
-
cookies
|
|
42
|
-
.getAll()
|
|
43
|
-
.reduce((acc, cookie) => {
|
|
44
|
-
acc[cookie.name] = cookie.value;
|
|
45
|
-
return acc;
|
|
46
|
-
}, {}),
|
|
32
|
+
cookies,
|
|
47
33
|
url,
|
|
48
34
|
quirks: {
|
|
49
|
-
'vc-country':
|
|
50
|
-
'vc-region':
|
|
51
|
-
'vc-city':
|
|
35
|
+
'vc-country': headers.get('x-vercel-ip-country') || missingQuirkValue,
|
|
36
|
+
'vc-region': headers.get('x-vercel-ip-country-region') || missingQuirkValue,
|
|
37
|
+
'vc-city': headers.get('x-vercel-ip-city') || missingQuirkValue,
|
|
52
38
|
},
|
|
53
39
|
});
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
}
|
|
40
|
+
const composition = root;
|
|
41
|
+
const resolvedLocaleKey = Object.keys(dynamicInputs || {}).find((key) => {
|
|
42
|
+
var _a, _b;
|
|
43
|
+
return (_b = (_a = config.experimental) === null || _a === void 0 ? void 0 : _a.localeDynamicInputs) === null || _b === void 0 ? void 0 : _b.includes(key);
|
|
44
|
+
});
|
|
45
|
+
const resolvedLocale = resolvedLocaleKey
|
|
46
|
+
? dynamicInputs[resolvedLocaleKey]
|
|
47
|
+
: undefined;
|
|
48
|
+
if (typeof resolvedLocale !== 'undefined') {
|
|
49
|
+
localize({
|
|
50
|
+
composition,
|
|
51
|
+
locale: resolvedLocale,
|
|
52
|
+
});
|
|
68
53
|
}
|
|
69
54
|
const enrichmentTags = [];
|
|
70
55
|
const seenComponents = [];
|
|
@@ -4,7 +4,7 @@ import { componentStoreResolver } from '../register/componentStoreResolver';
|
|
|
4
4
|
import { convertComponentToProps } from './convertComponentToProps';
|
|
5
5
|
import { UniformComponent } from './UniformComponent';
|
|
6
6
|
export function renderComponent({ component, context, resolveSystem, key = 0, indexInSlot, slotName, parentComponent, slotChildrenCount, emptyPlaceholder, }) {
|
|
7
|
-
var _a, _b, _c, _d;
|
|
7
|
+
var _a, _b, _c, _d, _e;
|
|
8
8
|
const RenderComponent = componentStoreResolver(component);
|
|
9
9
|
// custom handling for tests and personalizes
|
|
10
10
|
if (component.type === CANVAS_TEST_TYPE) {
|
|
@@ -44,7 +44,10 @@ export function renderComponent({ component, context, resolveSystem, key = 0, in
|
|
|
44
44
|
});
|
|
45
45
|
const shouldRenderContextualEditingTags = Boolean(component._id);
|
|
46
46
|
const isPlaceholder = component._id === PLACEHOLDER_ID;
|
|
47
|
-
|
|
47
|
+
const isReadOnly = ((_a = component === null || component === void 0 ? void 0 : component._contextualEditing) === null || _a === void 0 ? void 0 : _a.isEditable)
|
|
48
|
+
? undefined
|
|
49
|
+
: 'true';
|
|
50
|
+
return (_jsx(UniformComponent, { data: component, context: context, children: _jsxs(_Fragment, { children: [!shouldRenderContextualEditingTags ? null : (_jsx("script", { "data-role": IN_CONTEXT_EDITOR_COMPONENT_START_ROLE, "data-parent-id": parentComponent === null || parentComponent === void 0 ? void 0 : parentComponent._id, "data-parent-type": parentComponent === null || parentComponent === void 0 ? void 0 : parentComponent.type, "data-component-id": component._id, "data-slot-name": slotName !== null && slotName !== void 0 ? slotName : '', "data-component-index": indexInSlot !== null && indexInSlot !== void 0 ? indexInSlot : '', "data-total-components": slotChildrenCount !== null && slotChildrenCount !== void 0 ? slotChildrenCount : '', "data-component-name": component.type, "data-is-placeholder": isPlaceholder ? 'true' : undefined, "data-is-localized": ((_b = component.parameters) === null || _b === void 0 ? void 0 : _b[CANVAS_LOCALE_TAG_PARAM]) ? 'true' : undefined, "data-component-title": (_e = (_d = (_c = component.parameters) === null || _c === void 0 ? void 0 : _c.title) === null || _d === void 0 ? void 0 : _d.value) !== null && _e !== void 0 ? _e : '', "data-is-readonly": isReadOnly }, key)), isPlaceholder && emptyPlaceholder !== undefined ? (emptyPlaceholder) : (_jsx(RenderComponent, { ...props })), !shouldRenderContextualEditingTags ? null : _jsx("script", { "data-role": "component-end" })] }) }, key));
|
|
48
51
|
}
|
|
49
52
|
return null;
|
|
50
53
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { CANVAS_DRAFT_STATE } from '@uniformdev/canvas';
|
|
1
|
+
import { CANVAS_DRAFT_STATE, CANVAS_EDITOR_STATE, } from '@uniformdev/canvas';
|
|
2
2
|
import { RedirectClient } from '@uniformdev/redirect';
|
|
3
3
|
import { get } from '@vercel/edge-config';
|
|
4
4
|
import { getRouteClient } from '../client/routeClient';
|
|
@@ -19,6 +19,13 @@ export const retrieveRoute = async (data) => {
|
|
|
19
19
|
const routeApiValue = await resolveRouteByRouteApi(data);
|
|
20
20
|
result = routeApiValue;
|
|
21
21
|
}
|
|
22
|
+
// fall back to draft if requesting editor state
|
|
23
|
+
if (result.type === 'notFound' && data.state === CANVAS_EDITOR_STATE) {
|
|
24
|
+
return retrieveRoute({
|
|
25
|
+
...data,
|
|
26
|
+
state: CANVAS_DRAFT_STATE,
|
|
27
|
+
});
|
|
28
|
+
}
|
|
22
29
|
return result;
|
|
23
30
|
};
|
|
24
31
|
export const resolveRedirectHref = (resolveResult, path) => {
|
|
@@ -63,7 +70,7 @@ const resolveRouteByRouteApi = async (data) => {
|
|
|
63
70
|
const routeResult = await routeClient.getRoute({
|
|
64
71
|
path: data.path,
|
|
65
72
|
state: data.state,
|
|
66
|
-
withComponentIDs: data.state === CANVAS_DRAFT_STATE,
|
|
73
|
+
withComponentIDs: data.state === CANVAS_DRAFT_STATE || data.state === CANVAS_EDITOR_STATE,
|
|
67
74
|
withContentSourceMap: isOnVercelPreviewEnvironment(),
|
|
68
75
|
});
|
|
69
76
|
return routeResult;
|
package/dist/config/models.d.ts
CHANGED
package/dist/utils/draft.js
CHANGED
|
@@ -11,7 +11,7 @@ export const isDraftModeEnabled = ({ searchParams, }) => {
|
|
|
11
11
|
export const isIncontextEditingEnabled = ({ searchParams, }) => {
|
|
12
12
|
// workaround for this https://github.com/vercel/next.js/issues/49927, as draftMode() is not working in dev mode
|
|
13
13
|
// so we just need to check if the query string contains the IN_CONTEXT_EDITOR_QUERY_STRING_PARAM blindly
|
|
14
|
-
if (isDevelopmentEnvironment()) {
|
|
14
|
+
if (isDevelopmentEnvironment() || draftMode().isEnabled) {
|
|
15
15
|
const containsKey = typeof (searchParams === null || searchParams === void 0 ? void 0 : searchParams[IN_CONTEXT_EDITOR_QUERY_STRING_PARAM]) !== 'undefined';
|
|
16
16
|
return containsKey;
|
|
17
17
|
}
|
|
@@ -21,5 +21,5 @@ export const isOnVercelPreviewEnvironment = () => {
|
|
|
21
21
|
return process.env.VERCEL_ENV === 'preview';
|
|
22
22
|
};
|
|
23
23
|
export const isDevelopmentEnvironment = () => {
|
|
24
|
-
return process.env.NODE_ENV === 'development';
|
|
24
|
+
return process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test';
|
|
25
25
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@uniformdev/canvas-next-rsc",
|
|
3
|
-
"version": "19.38.3-alpha.
|
|
3
|
+
"version": "19.38.3-alpha.78+5c9892bf1",
|
|
4
4
|
"license": "SEE LICENSE IN LICENSE.txt",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"dev": "pnpm build --watch",
|
|
@@ -45,7 +45,7 @@
|
|
|
45
45
|
"/dist"
|
|
46
46
|
],
|
|
47
47
|
"devDependencies": {
|
|
48
|
-
"@types/gtag.js": "^0.0.
|
|
48
|
+
"@types/gtag.js": "^0.0.13",
|
|
49
49
|
"@types/js-cookie": "^3.0.3",
|
|
50
50
|
"@types/node": "^18.0.0",
|
|
51
51
|
"@types/react": "^18.2.3",
|
|
@@ -56,13 +56,13 @@
|
|
|
56
56
|
"typescript": "^5.0.4"
|
|
57
57
|
},
|
|
58
58
|
"dependencies": {
|
|
59
|
-
"@uniformdev/canvas": "19.38.3-alpha.
|
|
60
|
-
"@uniformdev/canvas-react": "19.38.3-alpha.
|
|
61
|
-
"@uniformdev/context": "19.38.3-alpha.
|
|
62
|
-
"@uniformdev/project-map": "19.38.3-alpha.
|
|
63
|
-
"@uniformdev/redirect": "19.38.3-alpha.
|
|
64
|
-
"@uniformdev/richtext": "19.38.3-alpha.
|
|
65
|
-
"@uniformdev/webhooks": "19.38.3-alpha.
|
|
59
|
+
"@uniformdev/canvas": "19.38.3-alpha.78+5c9892bf1",
|
|
60
|
+
"@uniformdev/canvas-react": "19.38.3-alpha.78+5c9892bf1",
|
|
61
|
+
"@uniformdev/context": "19.38.3-alpha.78+5c9892bf1",
|
|
62
|
+
"@uniformdev/project-map": "19.38.3-alpha.78+5c9892bf1",
|
|
63
|
+
"@uniformdev/redirect": "19.38.3-alpha.78+5c9892bf1",
|
|
64
|
+
"@uniformdev/richtext": "19.38.3-alpha.78+5c9892bf1",
|
|
65
|
+
"@uniformdev/webhooks": "19.38.3-alpha.78+5c9892bf1",
|
|
66
66
|
"@vercel/edge-config": "^0.2.0",
|
|
67
67
|
"dequal": "^2.0.3",
|
|
68
68
|
"js-cookie": "^3.0.5",
|
|
@@ -76,5 +76,5 @@
|
|
|
76
76
|
"publishConfig": {
|
|
77
77
|
"access": "public"
|
|
78
78
|
},
|
|
79
|
-
"gitHead": "
|
|
79
|
+
"gitHead": "5c9892bf101584d351d06b65e1658a1237594cfb"
|
|
80
80
|
}
|