@contentful/experiences-core 3.8.3-dev-20251010T1235-2d92513.0 → 3.8.3-dev-20251020T1356-dca4ced.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/dist/{constants.cjs → cjs/constants.cjs} +2 -0
- package/dist/cjs/constants.cjs.map +1 -0
- package/dist/{index.cjs → cjs/index.cjs} +129 -127
- package/dist/cjs/index.cjs.map +1 -0
- package/dist/esm/constants.js.map +1 -0
- package/dist/esm/index.js.map +1 -0
- package/dist/types/index.d.ts +1675 -0
- package/package.json +17 -21
- package/dist/communication/sendMessage.d.ts +0 -5
- package/dist/constants.cjs.map +0 -1
- package/dist/constants.js.map +0 -1
- package/dist/deep-binding/DeepReference.d.ts +0 -44
- package/dist/definitions/styles.d.ts +0 -11
- package/dist/entity/EditorEntityStore.d.ts +0 -34
- package/dist/entity/EditorModeEntityStore.d.ts +0 -28
- package/dist/entity/EntityStore.d.ts +0 -99
- package/dist/entity/EntityStoreBase.d.ts +0 -53
- package/dist/entity/InMemoryEntitiesPublicApi.d.ts +0 -41
- package/dist/entity/InMemoryEntitiesStore.d.ts +0 -17
- package/dist/enums.d.ts +0 -6
- package/dist/exports.d.ts +0 -3
- package/dist/fetchers/createExperience.d.ts +0 -25
- package/dist/fetchers/fetchAllEntities.d.ts +0 -30
- package/dist/fetchers/fetchById.d.ts +0 -24
- package/dist/fetchers/fetchBySlug.d.ts +0 -24
- package/dist/fetchers/fetchExperienceEntry.d.ts +0 -30
- package/dist/fetchers/fetchReferencedEntities.d.ts +0 -28
- package/dist/fetchers/gatherAutoFetchedReferentsFromIncludes.d.ts +0 -11
- package/dist/index.cjs.map +0 -1
- package/dist/index.d.ts +0 -42
- package/dist/index.js.map +0 -1
- package/dist/registries/breakpointsRegistry.d.ts +0 -43
- package/dist/registries/designTokenRegistry.d.ts +0 -13
- package/dist/registries/sdkOptionsRegistry.d.ts +0 -11
- package/dist/types.d.ts +0 -630
- package/dist/utils/breakpoints.d.ts +0 -26
- package/dist/utils/components.d.ts +0 -17
- package/dist/utils/debugLogger.d.ts +0 -36
- package/dist/utils/domValues.d.ts +0 -16
- package/dist/utils/extractPrebindingData.d.ts +0 -46
- package/dist/utils/isLink.d.ts +0 -7
- package/dist/utils/isLinkToAsset.d.ts +0 -5
- package/dist/utils/isLinkToEntry.d.ts +0 -5
- package/dist/utils/localizeEntity.d.ts +0 -24
- package/dist/utils/pathSchema.d.ts +0 -43
- package/dist/utils/resolveHyperlinkPattern.d.ts +0 -17
- package/dist/utils/sanitizeNodeProps.d.ts +0 -7
- package/dist/utils/schema/experienceSchema.d.ts +0 -23
- package/dist/utils/schema/references.d.ts +0 -18
- package/dist/utils/splitDirectAndSlotChildren.d.ts +0 -12
- package/dist/utils/styleUtils/ssrStyles.d.ts +0 -75
- package/dist/utils/styleUtils/styleTransformers.d.ts +0 -6
- package/dist/utils/styleUtils/stylesUtils.d.ts +0 -64
- package/dist/utils/styleUtils/toMediaQuery.d.ts +0 -15
- package/dist/utils/transformers/transformBoundContentValue.d.ts +0 -8
- package/dist/utils/treeTraversal.d.ts +0 -17
- package/dist/utils/typeguards.d.ts +0 -15
- package/dist/utils/utils.d.ts +0 -32
- package/dist/utils/validations.d.ts +0 -11
- package/dist/{constants.js → esm/constants.js} +0 -0
- package/dist/{index.js → esm/index.js} +127 -127
- /package/dist/{constants.d.ts → types/constants.d.ts} +0 -0
|
@@ -0,0 +1,1675 @@
|
|
|
1
|
+
import { ExperienceUnboundValues, ComponentDefinitionPropertyType, BindingSourceTypeEnum, ComponentPropertyValue, ExperienceDataSource, Breakpoint, Parameter, ExperienceComponentTree, ExperienceUsedComponents, ExperienceComponentSettings, ValuesByBreakpoint, PrimitiveValue, DesignValue, BoundValue, ComponentTreeNode, ParameterDefinition, VariableMapping } from '@contentful/experiences-validators';
|
|
2
|
+
export { BoundValue, Breakpoint, ComponentDefinitionPropertyType as ComponentDefinitionVariableType, ComponentPropertyValue, ComponentTreeNode, ComponentValue, DesignValue, ExperienceComponentSettings, ExperienceDataSource, ExperienceUnboundValues, NoValue, Parameter, ParameterDefinition, PrimitiveValue, SchemaVersions, UnboundValue, ValuesByBreakpoint, VariableMapping } from '@contentful/experiences-validators';
|
|
3
|
+
import * as contentful from 'contentful';
|
|
4
|
+
import { UnresolvedLink, Asset, Entry, ChainModifiers, AssetFile, ContentfulClientApi } from 'contentful';
|
|
5
|
+
import { Document } from '@contentful/rich-text-types';
|
|
6
|
+
import * as react from 'react';
|
|
7
|
+
import { Entry as Entry$1, Asset as Asset$1 } from 'contentful/dist/types/types';
|
|
8
|
+
import * as zustand from 'zustand';
|
|
9
|
+
|
|
10
|
+
declare const structureComponentIds: Set<"contentful-section" | "contentful-container" | "contentful-columns" | "contentful-single-column">;
|
|
11
|
+
type ComponentAllowOnRoot = {
|
|
12
|
+
type?: string;
|
|
13
|
+
category?: string;
|
|
14
|
+
componentId?: string;
|
|
15
|
+
};
|
|
16
|
+
declare const allContentfulComponentIds: Set<"contentful-section" | "contentful-container" | "contentful-columns" | "contentful-single-column" | "contentful-button" | "contentful-heading" | "contentful-image" | "contentful-richText" | "contentful-text" | "contentful-divider" | "contentful-carousel">;
|
|
17
|
+
type SetElement<ElementType> = ElementType extends Set<infer E> ? E : never;
|
|
18
|
+
type StructureComponentId = SetElement<typeof structureComponentIds>;
|
|
19
|
+
type AllContentfulComponentId = SetElement<typeof allContentfulComponentIds>;
|
|
20
|
+
declare const isPatternComponent: (type?: string) => boolean;
|
|
21
|
+
declare const isContentfulStructureComponent: (componentId?: string) => componentId is StructureComponentId;
|
|
22
|
+
declare const isContentfulComponent: (componentId?: string) => componentId is AllContentfulComponentId;
|
|
23
|
+
declare const isComponentAllowedOnRoot: ({ type, category, componentId }: ComponentAllowOnRoot) => boolean;
|
|
24
|
+
declare const isStructureWithRelativeHeight: (componentId?: string, height?: string | number) => componentId is StructureComponentId;
|
|
25
|
+
|
|
26
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
27
|
+
declare const SCROLL_STATES: {
|
|
28
|
+
readonly Start: "scrollStart";
|
|
29
|
+
readonly IsScrolling: "isScrolling";
|
|
30
|
+
readonly End: "scrollEnd";
|
|
31
|
+
};
|
|
32
|
+
declare const OUTGOING_EVENTS: {
|
|
33
|
+
readonly Connected: "connected";
|
|
34
|
+
readonly DesignTokens: "registerDesignTokens";
|
|
35
|
+
readonly RegisteredBreakpoints: "registeredBreakpoints";
|
|
36
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
37
|
+
readonly MouseMove: "mouseMove";
|
|
38
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
39
|
+
readonly ComponentSelected: "componentSelected";
|
|
40
|
+
readonly RegisteredComponents: "registeredComponents";
|
|
41
|
+
readonly RequestComponentTreeUpdate: "requestComponentTreeUpdate";
|
|
42
|
+
readonly CanvasReload: "canvasReload";
|
|
43
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
44
|
+
readonly UpdateSelectedComponentCoordinates: "updateSelectedComponentCoordinates";
|
|
45
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
46
|
+
readonly CanvasScroll: "canvasScrolling";
|
|
47
|
+
readonly CanvasError: "canvasError";
|
|
48
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
49
|
+
readonly OutsideCanvasClick: "outsideCanvasClick";
|
|
50
|
+
readonly SDKFeatures: "sdkFeatures";
|
|
51
|
+
readonly RequestEntities: "REQUEST_ENTITIES";
|
|
52
|
+
readonly CanvasGeometryUpdated: "canvasGeometryUpdated";
|
|
53
|
+
readonly CanvasPan: "canvasPan";
|
|
54
|
+
};
|
|
55
|
+
declare const INCOMING_EVENTS: {
|
|
56
|
+
readonly RequestEditorMode: "requestEditorMode";
|
|
57
|
+
readonly RequestReadOnlyMode: "requestReadOnlyMode";
|
|
58
|
+
readonly ExperienceUpdated: "componentTreeUpdated";
|
|
59
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
60
|
+
readonly ComponentDraggingChanged: "componentDraggingChanged";
|
|
61
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
62
|
+
readonly ComponentDragCanceled: "componentDragCanceled";
|
|
63
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
64
|
+
readonly ComponentDragStarted: "componentDragStarted";
|
|
65
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
66
|
+
readonly ComponentDragEnded: "componentDragEnded";
|
|
67
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
68
|
+
readonly ComponentMoveEnded: "componentMoveEnded";
|
|
69
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
70
|
+
readonly CanvasResized: "canvasResized";
|
|
71
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
72
|
+
readonly SelectComponent: "selectComponent";
|
|
73
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
74
|
+
readonly HoverComponent: "hoverComponent";
|
|
75
|
+
readonly UpdatedEntity: "updatedEntity";
|
|
76
|
+
/** @deprecated not needed after `patternResolution` was introduced. Will be removed in the next major version. */
|
|
77
|
+
readonly AssembliesAdded: "assembliesAdded";
|
|
78
|
+
/** @deprecated not needed after `patternResolution` was introduced. Will be removed in the next major version. */
|
|
79
|
+
readonly AssembliesRegistered: "assembliesRegistered";
|
|
80
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
81
|
+
readonly MouseMove: "mouseMove";
|
|
82
|
+
readonly RequestedEntities: "REQUESTED_ENTITIES";
|
|
83
|
+
};
|
|
84
|
+
declare const INTERNAL_EVENTS: {
|
|
85
|
+
readonly ComponentsRegistered: "cfComponentsRegistered";
|
|
86
|
+
readonly VisualEditorInitialize: "cfVisualEditorInitialize";
|
|
87
|
+
};
|
|
88
|
+
/**
|
|
89
|
+
* These modes are ONLY intended to be internally used within the context of
|
|
90
|
+
* editing an experience inside of Contentful Studio. i.e. these modes
|
|
91
|
+
* intentionally do not include preview/delivery modes.
|
|
92
|
+
*/
|
|
93
|
+
declare enum StudioCanvasMode {
|
|
94
|
+
READ_ONLY = "readOnlyMode",
|
|
95
|
+
EDITOR = "editorMode",
|
|
96
|
+
NONE = "none"
|
|
97
|
+
}
|
|
98
|
+
declare enum PostMessageMethods {
|
|
99
|
+
REQUEST_ENTITIES = "REQUEST_ENTITIES",
|
|
100
|
+
REQUESTED_ENTITIES = "REQUESTED_ENTITIES"
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
interface EntityFromLink {
|
|
104
|
+
getEntityFromLink(link: UnresolvedLink<'Entry' | 'Asset'>): Asset | Entry | undefined;
|
|
105
|
+
}
|
|
106
|
+
/**
|
|
107
|
+
* Base Store for entities
|
|
108
|
+
* Can be extended for the different loading behaviours (editor, production, ..)
|
|
109
|
+
*/
|
|
110
|
+
declare abstract class EntityStoreBase implements EntityFromLink {
|
|
111
|
+
locale: string;
|
|
112
|
+
protected entryMap: Map<string, Entry>;
|
|
113
|
+
protected assetMap: Map<string, Asset<ChainModifiers, string>>;
|
|
114
|
+
constructor({ entities, locale }: {
|
|
115
|
+
entities: Array<Entry | Asset>;
|
|
116
|
+
locale: string;
|
|
117
|
+
});
|
|
118
|
+
get entities(): (Entry | Asset<ChainModifiers, string>)[];
|
|
119
|
+
updateEntity(entity: Entry | Asset): void;
|
|
120
|
+
getEntryOrAsset(linkOrEntryOrAsset: UnresolvedLink<'Entry' | 'Asset'> | Asset | Entry, path: string): Entry | Asset | undefined;
|
|
121
|
+
/**
|
|
122
|
+
* @deprecated in the base class this should be simply an abstract method
|
|
123
|
+
* @param entityLink
|
|
124
|
+
* @param path
|
|
125
|
+
* @returns
|
|
126
|
+
*/
|
|
127
|
+
getValue(entityLink: UnresolvedLink<'Entry' | 'Asset'>, path: string[]): string | undefined;
|
|
128
|
+
getEntityFromLink(link: UnresolvedLink<'Entry' | 'Asset'>): Asset | Entry | undefined;
|
|
129
|
+
getAssetById(assetId: string): Asset | undefined;
|
|
130
|
+
getEntryById(entryId: string): Entry | undefined;
|
|
131
|
+
protected getEntitiesFromMap(type: 'Entry' | 'Asset', ids: string[]): {
|
|
132
|
+
resolved: (Entry | Asset<ChainModifiers, string>)[];
|
|
133
|
+
missing: string[];
|
|
134
|
+
};
|
|
135
|
+
protected addEntity(entity: Entry | Asset): void;
|
|
136
|
+
fetchAsset(id: string): Promise<Asset | undefined>;
|
|
137
|
+
fetchAssets(ids: string[]): Promise<Asset[]>;
|
|
138
|
+
fetchEntry(id: string): Promise<Entry | undefined>;
|
|
139
|
+
fetchEntries(ids: string[]): Promise<Entry[]>;
|
|
140
|
+
private getDeepEntry;
|
|
141
|
+
private getEntity;
|
|
142
|
+
toJSON(): {
|
|
143
|
+
entryMap: {
|
|
144
|
+
[k: string]: Entry;
|
|
145
|
+
};
|
|
146
|
+
assetMap: {
|
|
147
|
+
[k: string]: Asset<ChainModifiers, string>;
|
|
148
|
+
};
|
|
149
|
+
locale: string;
|
|
150
|
+
};
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
type SendMessage = (method: PostMessageMethods.REQUEST_ENTITIES, params: RequestEntitiesMessage) => void;
|
|
154
|
+
type Subscribe = (method: PostMessageMethods.REQUESTED_ENTITIES, cb: (message: RequestedEntitiesMessage) => void) => VoidFunction;
|
|
155
|
+
/**
|
|
156
|
+
* EntityStore which resolves entries and assets from the editor
|
|
157
|
+
* over the sendMessage and subscribe functions.
|
|
158
|
+
*/
|
|
159
|
+
declare abstract class EditorEntityStore extends EntityStoreBase {
|
|
160
|
+
private requestCache;
|
|
161
|
+
private sendMessage;
|
|
162
|
+
private subscribe;
|
|
163
|
+
private timeoutDuration;
|
|
164
|
+
constructor({ entities, locale, sendMessage, subscribe, timeoutDuration, }: {
|
|
165
|
+
entities: Array<Entry | Asset>;
|
|
166
|
+
locale: string;
|
|
167
|
+
sendMessage: SendMessage;
|
|
168
|
+
subscribe: Subscribe;
|
|
169
|
+
timeoutDuration?: number;
|
|
170
|
+
});
|
|
171
|
+
private cleanupPromise;
|
|
172
|
+
private cacheIdSeperator;
|
|
173
|
+
private getCacheId;
|
|
174
|
+
private fetchEntity;
|
|
175
|
+
fetchAsset(id: string, skipCache?: boolean): Promise<Asset | undefined>;
|
|
176
|
+
fetchAssets(ids: string[], skipCache?: boolean): Promise<Asset[]>;
|
|
177
|
+
fetchEntry(id: string, skipCache?: boolean): Promise<Entry | undefined>;
|
|
178
|
+
fetchEntries(ids: string[], skipCache?: boolean): Promise<Entry[]>;
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
declare class EditorModeEntityStore extends EditorEntityStore {
|
|
182
|
+
constructor({ entities, locale }: {
|
|
183
|
+
entities: Array<Asset | Entry>;
|
|
184
|
+
locale: string;
|
|
185
|
+
});
|
|
186
|
+
/**
|
|
187
|
+
* This function collects and returns the list of requested entries and assets. Additionally, it checks
|
|
188
|
+
* upfront whether any async fetching logic is actually happening. If not, it returns a plain `false` value, so we
|
|
189
|
+
* can detect this early and avoid unnecessary re-renders.
|
|
190
|
+
* @param entityLinks
|
|
191
|
+
* @returns false if no async fetching is happening, otherwise a promise that resolves when all entities are fetched
|
|
192
|
+
*/
|
|
193
|
+
fetchEntities({ missingEntryIds, missingAssetIds, skipCache, }: {
|
|
194
|
+
missingEntryIds: string[];
|
|
195
|
+
missingAssetIds: string[];
|
|
196
|
+
skipCache?: boolean;
|
|
197
|
+
}): Promise<void>;
|
|
198
|
+
getMissingEntityIds(entityLinks: UnresolvedLink<'Entry' | 'Asset'>[]): {
|
|
199
|
+
missingEntryIds: string[];
|
|
200
|
+
missingAssetIds: string[];
|
|
201
|
+
};
|
|
202
|
+
getValue(entityLinkOrEntity: UnresolvedLink<'Entry' | 'Asset'> | Entry | Asset, path: string[]): string | undefined;
|
|
203
|
+
}
|
|
204
|
+
|
|
205
|
+
type EntityStoreArgs = {
|
|
206
|
+
experienceEntry: ExperienceEntry | Entry;
|
|
207
|
+
entities: Array<Entry | Asset>;
|
|
208
|
+
locale: string;
|
|
209
|
+
};
|
|
210
|
+
declare class EntityStore extends EntityStoreBase {
|
|
211
|
+
private _isExperienceAPatternEntry;
|
|
212
|
+
private _experienceEntryFields;
|
|
213
|
+
private _experienceEntryId;
|
|
214
|
+
private _unboundValues;
|
|
215
|
+
private _usedComponentsWithDeepReferences;
|
|
216
|
+
private _hoistedParameterDefinitions;
|
|
217
|
+
private _hoistedVariableMappings;
|
|
218
|
+
constructor(json: string);
|
|
219
|
+
constructor({ experienceEntry, entities, locale }: EntityStoreArgs);
|
|
220
|
+
private static calculateHoistedParameterDefinitions;
|
|
221
|
+
private static calculateHoistedVariableMappings;
|
|
222
|
+
getCurrentLocale(): string;
|
|
223
|
+
get isExperienceAPatternEntry(): boolean;
|
|
224
|
+
get hoistedVariableMappings(): Record<string, {
|
|
225
|
+
type: "ContentTypeMapping";
|
|
226
|
+
parameterId: string;
|
|
227
|
+
pathsByContentType: Record<string, {
|
|
228
|
+
path: string;
|
|
229
|
+
}>;
|
|
230
|
+
}>;
|
|
231
|
+
get hoistedParameterDefinitions(): Record<string, {
|
|
232
|
+
contentTypes: string[];
|
|
233
|
+
passToNodes: {
|
|
234
|
+
prebindingId: string;
|
|
235
|
+
parameterId: string;
|
|
236
|
+
nodeId: string;
|
|
237
|
+
}[];
|
|
238
|
+
defaultSource?: {
|
|
239
|
+
type: "Entry";
|
|
240
|
+
contentTypeId: string;
|
|
241
|
+
link: {
|
|
242
|
+
sys: {
|
|
243
|
+
type: "Link";
|
|
244
|
+
id: string;
|
|
245
|
+
linkType: "Entry";
|
|
246
|
+
};
|
|
247
|
+
};
|
|
248
|
+
} | undefined;
|
|
249
|
+
}>;
|
|
250
|
+
get experienceEntryFields(): ExperienceFields | undefined;
|
|
251
|
+
get experienceEntryId(): string | undefined;
|
|
252
|
+
get schemaVersion(): "2023-09-28" | undefined;
|
|
253
|
+
get breakpoints(): {
|
|
254
|
+
id: string;
|
|
255
|
+
query: "*" | `>${number}px` | `<${number}px`;
|
|
256
|
+
displayName: string;
|
|
257
|
+
previewSize?: string | undefined;
|
|
258
|
+
displayIcon?: "desktop" | "tablet" | "mobile" | undefined;
|
|
259
|
+
}[];
|
|
260
|
+
get dataSource(): Record<string, {
|
|
261
|
+
sys: {
|
|
262
|
+
type: "Link";
|
|
263
|
+
id: string;
|
|
264
|
+
linkType: "Entry" | "Asset";
|
|
265
|
+
};
|
|
266
|
+
}>;
|
|
267
|
+
get unboundValues(): Record<string, {
|
|
268
|
+
value?: string | number | boolean | Record<any, any> | undefined;
|
|
269
|
+
}>;
|
|
270
|
+
get usedComponents(): ExperienceEntry[];
|
|
271
|
+
/**
|
|
272
|
+
* Extend the existing set of unbound values with the ones from the assembly definition.
|
|
273
|
+
* When creating a new assembly out of a container, the unbound value keys are copied and
|
|
274
|
+
* thus the existing and the added ones have colliding keys. In the case of overlapping value
|
|
275
|
+
* keys, the ones from the experience overrule the ones from the assembly definition as
|
|
276
|
+
* the latter one is certainly just a default value while the other one is from the actual instance.
|
|
277
|
+
* @param unboundValues set of unbound values defined in the assembly definition
|
|
278
|
+
*/
|
|
279
|
+
addAssemblyUnboundValues(unboundValues: ExperienceUnboundValues): void;
|
|
280
|
+
getValue(entityLinkOrEntity: UnresolvedLink<'Entry' | 'Asset'> | Entry | Asset, path: string[]): string | undefined;
|
|
281
|
+
toJSON(): {
|
|
282
|
+
entryMap: {
|
|
283
|
+
[k: string]: Entry;
|
|
284
|
+
};
|
|
285
|
+
assetMap: {
|
|
286
|
+
[k: string]: Asset<contentful.ChainModifiers, string>;
|
|
287
|
+
};
|
|
288
|
+
locale: string;
|
|
289
|
+
_experienceEntryFields: ExperienceFields | undefined;
|
|
290
|
+
_experienceEntryId: string | undefined;
|
|
291
|
+
_unboundValues: Record<string, {
|
|
292
|
+
value?: string | number | boolean | Record<any, any> | undefined;
|
|
293
|
+
}> | undefined;
|
|
294
|
+
};
|
|
295
|
+
}
|
|
296
|
+
|
|
297
|
+
interface InMemoryEntitiesState {
|
|
298
|
+
entityStore: EntityStoreBase;
|
|
299
|
+
areEntitiesFetched: boolean;
|
|
300
|
+
setEntitiesFetched: (fetched: boolean) => void;
|
|
301
|
+
resolveEntity: <T extends 'Entry' | 'Asset'>(link?: UnresolvedLink<T>) => Entry | Asset | undefined;
|
|
302
|
+
resolveAssetById: (assetId?: string) => Asset | undefined;
|
|
303
|
+
resolveEntryById: (entryId?: string) => Entry | undefined;
|
|
304
|
+
resetEntityStore: (entityStore: EntityStoreBase) => void;
|
|
305
|
+
}
|
|
306
|
+
declare const inMemoryEntitiesStore: zustand.UseBoundStore<zustand.StoreApi<InMemoryEntitiesState>>;
|
|
307
|
+
type InMemoryEntitiesStore = typeof inMemoryEntitiesStore;
|
|
308
|
+
|
|
309
|
+
/**
|
|
310
|
+
* Resolves a link to its corresponding entry or asset if available.
|
|
311
|
+
*
|
|
312
|
+
* @note When using this function please ensure to explicitly handle `undefined` values in
|
|
313
|
+
* your component to protect against scenarios where the property was not yet bound to an
|
|
314
|
+
* entity inside the editor UI. The SDK will set the property to `undefined` in those cases.
|
|
315
|
+
* You can use the SDK helper functions `isLink`, `isLinkToEntry`, `isLinkToAsset`, or
|
|
316
|
+
* `isArrayOfLinks` for this purpose.
|
|
317
|
+
*/
|
|
318
|
+
declare function maybeResolveLink(maybeLink: UnresolvedLink<'Entry'>): Entry | undefined;
|
|
319
|
+
declare function maybeResolveLink(maybeLink: UnresolvedLink<'Asset'>): Asset | undefined;
|
|
320
|
+
declare function maybeResolveLink(maybeLink: UnresolvedLink<'Asset' | 'Entry'>): Asset | Entry | undefined;
|
|
321
|
+
declare function maybeResolveLink(maybeLink: NonNullable<unknown>): Entry | Asset | undefined;
|
|
322
|
+
declare function maybeResolveByAssetId(assetId: string): Asset | undefined;
|
|
323
|
+
declare function maybeResolveByEntryId(entryId: string): Entry | undefined;
|
|
324
|
+
declare function hasEntry(entryId: string): boolean;
|
|
325
|
+
declare function hasAsset(assetId: string): boolean;
|
|
326
|
+
declare function addEntities(entities: Array<Entry>): void;
|
|
327
|
+
declare function addEntities(entities: Array<Asset>): void;
|
|
328
|
+
declare function addEntities(entities: Array<Entry | Asset>): void;
|
|
329
|
+
declare const inMemoryEntities: {
|
|
330
|
+
maybeResolveLink: typeof maybeResolveLink;
|
|
331
|
+
maybeResolveByAssetId: typeof maybeResolveByAssetId;
|
|
332
|
+
maybeResolveByEntryId: typeof maybeResolveByEntryId;
|
|
333
|
+
hasEntry: typeof hasEntry;
|
|
334
|
+
hasAsset: typeof hasAsset;
|
|
335
|
+
addEntities: typeof addEntities;
|
|
336
|
+
};
|
|
337
|
+
type InMemoryEntitiesPublicApi = typeof inMemoryEntities;
|
|
338
|
+
declare const useInMemoryEntities: () => {
|
|
339
|
+
maybeResolveLink: typeof maybeResolveLink;
|
|
340
|
+
maybeResolveByAssetId: typeof maybeResolveByAssetId;
|
|
341
|
+
maybeResolveByEntryId: typeof maybeResolveByEntryId;
|
|
342
|
+
hasEntry: typeof hasEntry;
|
|
343
|
+
hasAsset: typeof hasAsset;
|
|
344
|
+
addEntities: typeof addEntities;
|
|
345
|
+
};
|
|
346
|
+
|
|
347
|
+
type ComponentDefinitionVariableTypeMap = {
|
|
348
|
+
Array: unknown[];
|
|
349
|
+
Boolean: boolean;
|
|
350
|
+
Date: string;
|
|
351
|
+
Hyperlink: string;
|
|
352
|
+
Link: Record<string, unknown>;
|
|
353
|
+
Location: {
|
|
354
|
+
lon: number;
|
|
355
|
+
lat: number;
|
|
356
|
+
};
|
|
357
|
+
Media: Record<string, unknown> | string;
|
|
358
|
+
Number: number;
|
|
359
|
+
Object: Record<string, unknown>;
|
|
360
|
+
RichText: string;
|
|
361
|
+
Text: string;
|
|
362
|
+
};
|
|
363
|
+
type ScrollStateKey = keyof typeof SCROLL_STATES;
|
|
364
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
365
|
+
type ScrollState = (typeof SCROLL_STATES)[ScrollStateKey];
|
|
366
|
+
type OutgoingEventKey = keyof typeof OUTGOING_EVENTS;
|
|
367
|
+
type OutgoingEvent = (typeof OUTGOING_EVENTS)[OutgoingEventKey];
|
|
368
|
+
type IncomingEventKey = keyof typeof INCOMING_EVENTS;
|
|
369
|
+
type IncomingEvent = (typeof INCOMING_EVENTS)[IncomingEventKey];
|
|
370
|
+
type InternalEventKey = keyof typeof INTERNAL_EVENTS;
|
|
371
|
+
type InternalEvent = (typeof INTERNAL_EVENTS)[InternalEventKey];
|
|
372
|
+
interface Link<T extends string> {
|
|
373
|
+
sys: {
|
|
374
|
+
type: 'Link';
|
|
375
|
+
linkType: T;
|
|
376
|
+
id: string;
|
|
377
|
+
};
|
|
378
|
+
}
|
|
379
|
+
type VariableFormats = 'URL';
|
|
380
|
+
type ValidationOption<T extends ComponentDefinitionPropertyType> = {
|
|
381
|
+
value: T extends 'Text' ? string : T extends 'Number' ? number : never;
|
|
382
|
+
displayName?: string;
|
|
383
|
+
};
|
|
384
|
+
type ComponentDefinitionVariableValidation<T extends ComponentDefinitionPropertyType> = {
|
|
385
|
+
required?: boolean;
|
|
386
|
+
in?: ValidationOption<T>[];
|
|
387
|
+
format?: VariableFormats;
|
|
388
|
+
/** Define the type of entity that can be bound to this variable. The provided list order defines
|
|
389
|
+
* the order of select options in the editor UI, i.e. the first item will be pre-selected by default. */
|
|
390
|
+
bindingSourceType?: BindingSourceTypeEnum;
|
|
391
|
+
};
|
|
392
|
+
interface ComponentDefinitionVariableBase<T extends ComponentDefinitionPropertyType> {
|
|
393
|
+
type: T;
|
|
394
|
+
validations?: ComponentDefinitionVariableValidation<T>;
|
|
395
|
+
group?: 'style' | 'content';
|
|
396
|
+
description?: string;
|
|
397
|
+
displayName?: string;
|
|
398
|
+
defaultValue?: ComponentDefinitionVariableTypeMap[T];
|
|
399
|
+
}
|
|
400
|
+
type ComponentDefinitionVariable<T extends ComponentDefinitionPropertyType = ComponentDefinitionPropertyType> = ComponentDefinitionVariableBase<T>;
|
|
401
|
+
type ComponentDefinition<T extends ComponentDefinitionPropertyType = ComponentDefinitionPropertyType> = {
|
|
402
|
+
id: string;
|
|
403
|
+
name: string;
|
|
404
|
+
category?: string;
|
|
405
|
+
thumbnailUrl?: string;
|
|
406
|
+
thumbnailId?: string;
|
|
407
|
+
hyperlinkPattern?: string;
|
|
408
|
+
variables: Partial<DesignVariableMap> & Record<string, ComponentDefinitionVariable<T>>;
|
|
409
|
+
/** Render child components in specified slots. This is an advanced version of the `children`
|
|
410
|
+
* configuration. We don't recommend using both together, as it can lead to unexpected behavior. */
|
|
411
|
+
slots?: Record<string, {
|
|
412
|
+
displayName: string;
|
|
413
|
+
}>;
|
|
414
|
+
/**
|
|
415
|
+
* List of built-in styles that can be applied to the component.
|
|
416
|
+
*
|
|
417
|
+
* Note that the property 'cfVisibility' is enforced on every component to control its visibility.
|
|
418
|
+
* @example ['cfWidth', 'cfPadding']
|
|
419
|
+
* @default ['cfMargin']
|
|
420
|
+
*/
|
|
421
|
+
builtInStyles?: Array<keyof Omit<StyleProps, 'cfHyperlink' | 'cfOpenInNewTab'>>;
|
|
422
|
+
/** Component allows passing child components inside it.
|
|
423
|
+
* @default false
|
|
424
|
+
*/
|
|
425
|
+
children?: boolean;
|
|
426
|
+
tooltip?: {
|
|
427
|
+
imageUrl?: string;
|
|
428
|
+
description: string;
|
|
429
|
+
};
|
|
430
|
+
};
|
|
431
|
+
type ComponentRegistration = {
|
|
432
|
+
component: React.ElementType;
|
|
433
|
+
definition: ComponentDefinition;
|
|
434
|
+
options?: {
|
|
435
|
+
/**
|
|
436
|
+
* If true, the component receives the optional boolean property `isInExpEditorMode` to
|
|
437
|
+
* render different content between editor and delivery mode.
|
|
438
|
+
*
|
|
439
|
+
* @deprecated this will be replaced by enableEditorProperties in the next major version
|
|
440
|
+
*/
|
|
441
|
+
enableCustomEditorView?: boolean;
|
|
442
|
+
/**
|
|
443
|
+
* If set, the specified properties are passed to the component when rendered in the editor.
|
|
444
|
+
*/
|
|
445
|
+
enableEditorProperties?: {
|
|
446
|
+
/**
|
|
447
|
+
* Enable the property `isEditorMode` which will be `true` if being rendered inside the Studio editor.
|
|
448
|
+
*/
|
|
449
|
+
isEditorMode?: boolean;
|
|
450
|
+
/**
|
|
451
|
+
* Enable the property `isEmpty` which will be `true` if the component has no children.
|
|
452
|
+
* This can be used to render a placeholder or label in the editor when the component is empty.
|
|
453
|
+
*
|
|
454
|
+
* @note This will be false if there are no direct children nor slot children.
|
|
455
|
+
*/
|
|
456
|
+
isEmpty?: boolean;
|
|
457
|
+
/**
|
|
458
|
+
* Enable the string property `nodeBlockId` which is equal to the component ID
|
|
459
|
+
* passed during registration, i.e. `ComponentDefinition['id']`.
|
|
460
|
+
*/
|
|
461
|
+
nodeBlockId?: boolean;
|
|
462
|
+
};
|
|
463
|
+
wrapComponent?: boolean;
|
|
464
|
+
wrapContainer?: keyof JSX.IntrinsicElements;
|
|
465
|
+
/**
|
|
466
|
+
* @deprecated This option is not supported anymore and will be fully removed in the
|
|
467
|
+
* next major release v4. */
|
|
468
|
+
wrapContainerWidth?: React.CSSProperties['width'];
|
|
469
|
+
};
|
|
470
|
+
};
|
|
471
|
+
/**
|
|
472
|
+
* Use this for type-safe access to editor properties in your custom components
|
|
473
|
+
* @example
|
|
474
|
+
* type MyCustomProps = { myValue: string }
|
|
475
|
+
* type MyComponentProps = EditorProperties<'isEmpty'> & MyCustomProps
|
|
476
|
+
*/
|
|
477
|
+
type EditorProperties<T extends EditorPropertyNames = EditorPropertyNames> = Pick<BaseEditorProperties, T>;
|
|
478
|
+
type EditorPropertyNames = keyof BaseEditorProperties;
|
|
479
|
+
type BaseEditorProperties = {
|
|
480
|
+
isEditorMode?: boolean;
|
|
481
|
+
isEmpty?: boolean;
|
|
482
|
+
nodeBlockId?: string;
|
|
483
|
+
/** @deprecated will be replaced by `isEditorMode` with the next major version of the SDK */
|
|
484
|
+
isInExpEditorMode?: boolean;
|
|
485
|
+
};
|
|
486
|
+
type ComponentRegistrationOptions = {
|
|
487
|
+
/**
|
|
488
|
+
* Restrict the list of built-in components to a defined set of IDs.
|
|
489
|
+
* @example ['contentful-container', 'contentful-button']
|
|
490
|
+
*/
|
|
491
|
+
enabledBuiltInComponents?: string[];
|
|
492
|
+
experimentalComponents?: {
|
|
493
|
+
carousel?: boolean;
|
|
494
|
+
};
|
|
495
|
+
/**
|
|
496
|
+
* Originally, the persisted values for `cfTextAlign` were plainly rendered
|
|
497
|
+
* when generating the CSS code for a components styles. To enable right-to-left
|
|
498
|
+
* directions natively, the alignment values were recently switched from
|
|
499
|
+
* `left`/`right` to `start`/`end`. To save customers from manually replacing old
|
|
500
|
+
* with new alignment values in every experience, we're translating them automatically
|
|
501
|
+
* in the rendering logic as well. If this new behaviour introduces any issues,
|
|
502
|
+
* customers can opt-out by setting this flag.
|
|
503
|
+
* @deprecated This is a temporary solution and will be removed in a future major version.
|
|
504
|
+
*/
|
|
505
|
+
__disableTextAlignmentTransform?: boolean;
|
|
506
|
+
/**
|
|
507
|
+
* If you need to adjust the built-in structural components (e.g. `container`),
|
|
508
|
+
* enable this flag. It is marked as *unsafe* since the logic of those components
|
|
509
|
+
* might evolve in future versions. By overwriting their implementation, you accept
|
|
510
|
+
* the risk of potential breaking changes and running out of sync with the original
|
|
511
|
+
* implementation.
|
|
512
|
+
*/
|
|
513
|
+
__unsafe__enableBuiltInStructureOverwrites?: boolean;
|
|
514
|
+
};
|
|
515
|
+
type Binding = {
|
|
516
|
+
spaceId: string;
|
|
517
|
+
environmentId: string;
|
|
518
|
+
entityId: string;
|
|
519
|
+
entityType: 'Entry' | 'Asset' | 'ContentType';
|
|
520
|
+
path: string[];
|
|
521
|
+
};
|
|
522
|
+
type ComponentBinding = Record<string, Binding>;
|
|
523
|
+
type BindingMap = Record<string, ComponentBinding>;
|
|
524
|
+
type BindingMapByBlockId = Record<string, BindingMap>;
|
|
525
|
+
type DataSourceEntryValueType = Link<'Entry' | 'Asset'>;
|
|
526
|
+
/** Type of a single node of the experience tree exchanged via postMessage between the SDK and Contentful Web app */
|
|
527
|
+
type ExperienceTreeNode = {
|
|
528
|
+
type: 'block' | 'root' | 'assembly' | 'assemblyBlock';
|
|
529
|
+
data: {
|
|
530
|
+
id: string;
|
|
531
|
+
blockId?: string;
|
|
532
|
+
slotId?: string;
|
|
533
|
+
displayName?: string;
|
|
534
|
+
props: Record<string, ComponentPropertyValue>;
|
|
535
|
+
dataSource: ExperienceDataSource;
|
|
536
|
+
unboundValues: ExperienceUnboundValues;
|
|
537
|
+
breakpoints: Breakpoint[];
|
|
538
|
+
parameters?: Record<string, Parameter>;
|
|
539
|
+
prebindingId?: string;
|
|
540
|
+
pattern?: {
|
|
541
|
+
id: string;
|
|
542
|
+
nodeId: string;
|
|
543
|
+
nodeLocation: string;
|
|
544
|
+
nodeIdOnPattern: string;
|
|
545
|
+
isVisibilityPropertyExposed: boolean;
|
|
546
|
+
variableNameToComponentValueKeyMap: Record<string, string>;
|
|
547
|
+
};
|
|
548
|
+
};
|
|
549
|
+
children: ExperienceTreeNode[];
|
|
550
|
+
parentId?: string;
|
|
551
|
+
};
|
|
552
|
+
/** Type of the tree data structure exchanged via postMessage between the SDK and Contentful Web app */
|
|
553
|
+
type ExperienceTree = {
|
|
554
|
+
root: ExperienceTreeNode;
|
|
555
|
+
};
|
|
556
|
+
/**
|
|
557
|
+
* Internally defined style variables are prefix with `cf` to avoid
|
|
558
|
+
* collisions with user defined variables.
|
|
559
|
+
*/
|
|
560
|
+
type StyleProps = {
|
|
561
|
+
cfVisibility: boolean;
|
|
562
|
+
cfHorizontalAlignment: 'start' | 'end' | 'center' | 'stretch';
|
|
563
|
+
cfVerticalAlignment: 'start' | 'end' | 'center' | 'stretch';
|
|
564
|
+
cfMargin: string;
|
|
565
|
+
cfPadding: string;
|
|
566
|
+
cfBackgroundColor: string;
|
|
567
|
+
cfWidth: string;
|
|
568
|
+
cfMaxWidth: string;
|
|
569
|
+
cfHeight: string;
|
|
570
|
+
cfFlexDirection: 'row' | 'column';
|
|
571
|
+
cfFlexWrap: 'nowrap' | 'wrap';
|
|
572
|
+
cfFlexReverse: boolean;
|
|
573
|
+
cfBorder: string;
|
|
574
|
+
cfBorderRadius: string;
|
|
575
|
+
cfGap: string;
|
|
576
|
+
cfHyperlink: string;
|
|
577
|
+
cfImageAsset: OptimizedImageAsset | string;
|
|
578
|
+
cfImageOptions: ImageOptions;
|
|
579
|
+
cfBackgroundImageUrl: OptimizedBackgroundImageAsset | string;
|
|
580
|
+
cfBackgroundImageOptions: BackgroundImageOptions;
|
|
581
|
+
cfOpenInNewTab: boolean;
|
|
582
|
+
cfFontSize: string;
|
|
583
|
+
cfFontWeight: string;
|
|
584
|
+
cfLineHeight: string;
|
|
585
|
+
cfLetterSpacing: string;
|
|
586
|
+
cfTextColor: string;
|
|
587
|
+
cfTextAlign: 'start' | 'center' | 'end';
|
|
588
|
+
cfTextTransform: 'none' | 'capitalize' | 'uppercase' | 'lowercase';
|
|
589
|
+
cfTextBold: boolean;
|
|
590
|
+
cfTextItalic: boolean;
|
|
591
|
+
cfTextUnderline: boolean;
|
|
592
|
+
cfColumns: string;
|
|
593
|
+
cfColumnSpan: string;
|
|
594
|
+
cfColumnSpanLock: boolean;
|
|
595
|
+
cfWrapColumns: boolean;
|
|
596
|
+
cfWrapColumnsCount: string;
|
|
597
|
+
};
|
|
598
|
+
/**
|
|
599
|
+
* Internally defined style variables mapped to each variable type
|
|
600
|
+
*/
|
|
601
|
+
type DesignVariableTypes = {
|
|
602
|
+
cfVisibility: 'Boolean';
|
|
603
|
+
cfHorizontalAlignment: 'Text';
|
|
604
|
+
cfVerticalAlignment: 'Text';
|
|
605
|
+
cfMargin: 'Text';
|
|
606
|
+
cfPadding: 'Text';
|
|
607
|
+
cfBackgroundColor: 'Text';
|
|
608
|
+
cfWidth: 'Text';
|
|
609
|
+
cfMaxWidth: 'Text';
|
|
610
|
+
cfHeight: 'Text';
|
|
611
|
+
cfFlexDirection: 'Text';
|
|
612
|
+
cfFlexWrap: 'Text';
|
|
613
|
+
cfFlexReverse: 'Boolean';
|
|
614
|
+
cfBorder: 'Text';
|
|
615
|
+
cfBorderRadius: 'Text';
|
|
616
|
+
cfGap: 'Text';
|
|
617
|
+
cfHyperlink: 'Hyperlink';
|
|
618
|
+
cfImageAsset: 'Media';
|
|
619
|
+
cfImageOptions: 'Object';
|
|
620
|
+
cfBackgroundImageUrl: 'Media';
|
|
621
|
+
cfBackgroundImageOptions: 'Object';
|
|
622
|
+
cfOpenInNewTab: 'Boolean';
|
|
623
|
+
cfFontSize: 'Text';
|
|
624
|
+
cfFontWeight: 'Text';
|
|
625
|
+
cfLineHeight: 'Text';
|
|
626
|
+
cfLetterSpacing: 'Text';
|
|
627
|
+
cfTextColor: 'Text';
|
|
628
|
+
cfTextAlign: 'Text';
|
|
629
|
+
cfTextTransform: 'Text';
|
|
630
|
+
cfTextBold: 'Boolean';
|
|
631
|
+
cfTextItalic: 'Boolean';
|
|
632
|
+
cfTextUnderline: 'Boolean';
|
|
633
|
+
cfColumns: 'Text';
|
|
634
|
+
cfColumnSpan: 'Text';
|
|
635
|
+
cfColumnSpanLock: 'Boolean';
|
|
636
|
+
cfWrapColumns: 'Boolean';
|
|
637
|
+
cfWrapColumnsCount: 'Text';
|
|
638
|
+
};
|
|
639
|
+
type DesignVariableMap = {
|
|
640
|
+
[K in keyof DesignVariableTypes]: ComponentDefinitionVariable<DesignVariableTypes[K]>;
|
|
641
|
+
};
|
|
642
|
+
type CSSProperties = React.CSSProperties;
|
|
643
|
+
type ContainerStyleVariableName = keyof StyleProps;
|
|
644
|
+
type ExperienceFields = {
|
|
645
|
+
title: string;
|
|
646
|
+
slug: string;
|
|
647
|
+
componentTree: ExperienceComponentTree;
|
|
648
|
+
dataSource: ExperienceDataSource;
|
|
649
|
+
unboundValues: ExperienceUnboundValues;
|
|
650
|
+
usedComponents?: ExperienceUsedComponents | Array<ExperienceEntry>;
|
|
651
|
+
componentSettings?: ExperienceComponentSettings;
|
|
652
|
+
};
|
|
653
|
+
type RecursiveDesignTokenDefinition = {
|
|
654
|
+
[key: string]: string | RecursiveDesignTokenDefinition;
|
|
655
|
+
};
|
|
656
|
+
type DesignBorderTokenStyle = 'solid' | 'dashed' | 'dotted';
|
|
657
|
+
/** We are currently in the process of implementing this feature. Do not use this field in your designTokenDefinition. **/
|
|
658
|
+
type DesignTextTokenEmphasis = 'bold' | 'italic' | 'underline' | 'bold italic' | 'bold underline' | 'italic underline' | 'bold italic underline' | 'none';
|
|
659
|
+
/** We are currently in the process of implementing this feature. Do not use this field in your designTokenDefinition. **/
|
|
660
|
+
type DesignTextTokenCase = 'capitalize' | 'uppercase' | 'lowercase' | 'normal';
|
|
661
|
+
type DesignTokensDefinition = {
|
|
662
|
+
spacing?: Record<string, string>;
|
|
663
|
+
sizing?: Record<string, string>;
|
|
664
|
+
color?: Record<string, string>;
|
|
665
|
+
border?: Record<string, {
|
|
666
|
+
width?: string;
|
|
667
|
+
style?: DesignBorderTokenStyle;
|
|
668
|
+
color?: string;
|
|
669
|
+
}>;
|
|
670
|
+
borderRadius?: Record<string, string>;
|
|
671
|
+
fontSize?: Record<string, string>;
|
|
672
|
+
lineHeight?: Record<string, string>;
|
|
673
|
+
letterSpacing?: Record<string, string>;
|
|
674
|
+
textColor?: Record<string, string>;
|
|
675
|
+
/** We are currently in the process of implementing this feature. Do not use this field in your designTokenDefinition. **/
|
|
676
|
+
text?: Record<string, {
|
|
677
|
+
emphasis?: DesignTextTokenEmphasis;
|
|
678
|
+
fontSize?: string;
|
|
679
|
+
case?: DesignTextTokenCase;
|
|
680
|
+
fontWeight?: string;
|
|
681
|
+
lineHeight?: string;
|
|
682
|
+
letterSpacing?: string;
|
|
683
|
+
color?: string;
|
|
684
|
+
}>;
|
|
685
|
+
} & RecursiveDesignTokenDefinition;
|
|
686
|
+
type SdkOptions = {
|
|
687
|
+
__disableTextAlignmentTransform?: ComponentRegistrationOptions['__disableTextAlignmentTransform'];
|
|
688
|
+
__unsafe__enableBuiltInStructureOverwrites?: ComponentRegistrationOptions['__unsafe__enableBuiltInStructureOverwrites'];
|
|
689
|
+
};
|
|
690
|
+
/** Type of experience entry JSON data structure as returned by CPA/CDA */
|
|
691
|
+
type ExperienceEntry = {
|
|
692
|
+
sys: Entry['sys'];
|
|
693
|
+
fields: ExperienceFields;
|
|
694
|
+
metadata: Entry['metadata'];
|
|
695
|
+
};
|
|
696
|
+
interface RawCoordinates {
|
|
697
|
+
left: number;
|
|
698
|
+
top: number;
|
|
699
|
+
width: number;
|
|
700
|
+
height: number;
|
|
701
|
+
}
|
|
702
|
+
interface Coordinates extends RawCoordinates {
|
|
703
|
+
childrenCoordinates: RawCoordinates[];
|
|
704
|
+
}
|
|
705
|
+
interface HoveredElement {
|
|
706
|
+
blockType: string | undefined;
|
|
707
|
+
nodeId: string | undefined;
|
|
708
|
+
blockId: string | undefined;
|
|
709
|
+
}
|
|
710
|
+
interface Experience<T extends EntityStore = EntityStore> {
|
|
711
|
+
hyperlinkPattern?: string;
|
|
712
|
+
entityStore?: T;
|
|
713
|
+
}
|
|
714
|
+
type ResolveDesignValueType = (valuesByBreakpoint: ValuesByBreakpoint | undefined, propertyName?: string) => PrimitiveValue;
|
|
715
|
+
type ManagementEntity = (Entry | Asset) & {
|
|
716
|
+
sys: {
|
|
717
|
+
version: number;
|
|
718
|
+
};
|
|
719
|
+
};
|
|
720
|
+
type RequestEntitiesMessage = {
|
|
721
|
+
entityIds: string[];
|
|
722
|
+
entityType: 'Asset' | 'Entry';
|
|
723
|
+
locale: string;
|
|
724
|
+
};
|
|
725
|
+
type RequestedEntitiesMessage = {
|
|
726
|
+
entities: Array<Entry | Asset>;
|
|
727
|
+
missingEntityIds?: string[];
|
|
728
|
+
};
|
|
729
|
+
type BoundComponentPropertyTypes = string | number | boolean | AssetFile | Record<string, AssetFile | undefined> | Document | OptimizedBackgroundImageAsset | OptimizedImageAsset | Link<'Asset'> | Link<'Entry'> | Array<Link<'Asset' | 'Entry'>> | Entry | Asset | (string | Entry | Asset<ChainModifiers, string> | undefined)[] | undefined;
|
|
730
|
+
type OptimizedImageAsset = {
|
|
731
|
+
url: string;
|
|
732
|
+
srcSet?: string[];
|
|
733
|
+
sizes?: string;
|
|
734
|
+
quality?: number;
|
|
735
|
+
format?: string;
|
|
736
|
+
file: AssetFile;
|
|
737
|
+
loading?: ImageLoadingOption;
|
|
738
|
+
};
|
|
739
|
+
type OptimizedBackgroundImageAsset = {
|
|
740
|
+
url: string;
|
|
741
|
+
srcSet?: string[];
|
|
742
|
+
file: AssetFile;
|
|
743
|
+
};
|
|
744
|
+
type ImageObjectFitOption = 'contain' | 'cover' | 'none';
|
|
745
|
+
type ImageObjectPositionOption = 'left top' | 'left center' | 'left bottom' | 'right top' | 'right center' | 'right bottom' | 'center top' | 'center center' | 'center bottom';
|
|
746
|
+
type ImageLoadingOption = 'lazy' | 'eager';
|
|
747
|
+
type ImageOptions = {
|
|
748
|
+
format?: string;
|
|
749
|
+
width: string;
|
|
750
|
+
height: string;
|
|
751
|
+
loading?: ImageLoadingOption;
|
|
752
|
+
objectFit?: ImageObjectFitOption;
|
|
753
|
+
objectPosition?: ImageObjectPositionOption;
|
|
754
|
+
quality?: string;
|
|
755
|
+
targetSize: string;
|
|
756
|
+
};
|
|
757
|
+
type BackgroundImageScalingOption = 'fit' | 'fill' | 'tile';
|
|
758
|
+
type BackgroundImageAlignmentOption = 'left top' | 'left center' | 'left bottom' | 'right top' | 'right center' | 'right bottom' | 'center top' | 'center center' | 'center bottom';
|
|
759
|
+
type BackgroundImageOptions = {
|
|
760
|
+
format?: string;
|
|
761
|
+
scaling: BackgroundImageScalingOption;
|
|
762
|
+
alignment: BackgroundImageAlignmentOption;
|
|
763
|
+
quality?: string;
|
|
764
|
+
targetSize: string;
|
|
765
|
+
};
|
|
766
|
+
type ConnectedPayload = undefined | {
|
|
767
|
+
sdkVersion: string;
|
|
768
|
+
definitions: ComponentDefinition[];
|
|
769
|
+
};
|
|
770
|
+
type DesignTokensPayload = {
|
|
771
|
+
designTokens: DesignTokensDefinition;
|
|
772
|
+
resolvedCssVariables: Record<string, string>;
|
|
773
|
+
};
|
|
774
|
+
type RegisteredBreakpointsPayload = {
|
|
775
|
+
breakpoints: Breakpoint[];
|
|
776
|
+
};
|
|
777
|
+
type MouseMovePayload = {
|
|
778
|
+
clientX: number;
|
|
779
|
+
clientY: number;
|
|
780
|
+
};
|
|
781
|
+
type NewHoveredElementPayload = {
|
|
782
|
+
nodeId?: string;
|
|
783
|
+
};
|
|
784
|
+
type ComponentSelectedPayload = {
|
|
785
|
+
nodeId: string;
|
|
786
|
+
assembly?: {
|
|
787
|
+
id: string;
|
|
788
|
+
componentId: string;
|
|
789
|
+
nodeLocation: string | null;
|
|
790
|
+
};
|
|
791
|
+
};
|
|
792
|
+
type RegisteredComponentsPayload = {
|
|
793
|
+
definitions: ComponentDefinition[];
|
|
794
|
+
};
|
|
795
|
+
type RequestComponentTreeUpdatePayload = undefined;
|
|
796
|
+
type ComponentDragCanceledPayload = undefined;
|
|
797
|
+
type ComponentDroppedPayload = {
|
|
798
|
+
node: ExperienceTreeNode;
|
|
799
|
+
index: number;
|
|
800
|
+
parentNode: {
|
|
801
|
+
type?: ExperienceTreeNode['type'] | 'root';
|
|
802
|
+
data: {
|
|
803
|
+
blockId?: string;
|
|
804
|
+
id?: string;
|
|
805
|
+
};
|
|
806
|
+
};
|
|
807
|
+
};
|
|
808
|
+
type ComponentMovedPayload = {
|
|
809
|
+
nodeId: string;
|
|
810
|
+
sourceParentId: string;
|
|
811
|
+
destinationParentId: string;
|
|
812
|
+
sourceIndex: number;
|
|
813
|
+
destinationIndex: number;
|
|
814
|
+
};
|
|
815
|
+
type CanvasReloadPayload = undefined;
|
|
816
|
+
type CanvasErrorPayload = Error;
|
|
817
|
+
type UpdateSelectedComponentCoordinatesPayload = {
|
|
818
|
+
selectedNodeCoordinates: DOMRect;
|
|
819
|
+
selectedAssemblyChildCoordinates?: DOMRect;
|
|
820
|
+
parentCoordinates?: DOMRect;
|
|
821
|
+
};
|
|
822
|
+
type CanvasScrollPayload = (typeof SCROLL_STATES)[keyof typeof SCROLL_STATES];
|
|
823
|
+
type ComponentMoveStartedPayload = undefined;
|
|
824
|
+
type ComponentMoveEndedPayload = undefined;
|
|
825
|
+
type OutsideCanvasClickPayload = {
|
|
826
|
+
outsideCanvasClick: boolean;
|
|
827
|
+
};
|
|
828
|
+
type SDKFeaturesPayload = Record<string, unknown>;
|
|
829
|
+
type RequestEntitiesPayload = {
|
|
830
|
+
entityIds: string[];
|
|
831
|
+
entityType: 'Entry' | 'Asset';
|
|
832
|
+
locale: string;
|
|
833
|
+
};
|
|
834
|
+
type OUTGOING_EVENT_PAYLOADS = {
|
|
835
|
+
connected: ConnectedPayload;
|
|
836
|
+
registerDesignTokens: DesignTokensPayload;
|
|
837
|
+
registeredBreakpoints: RegisteredBreakpointsPayload;
|
|
838
|
+
mouseMove: MouseMovePayload;
|
|
839
|
+
newHoveredElement: NewHoveredElementPayload;
|
|
840
|
+
componentSelected: ComponentSelectedPayload;
|
|
841
|
+
registeredComponents: RegisteredComponentsPayload;
|
|
842
|
+
requestComponentTreeUpdate: RequestComponentTreeUpdatePayload;
|
|
843
|
+
componentDragCanceled: ComponentDragCanceledPayload;
|
|
844
|
+
componentDropped: ComponentDroppedPayload;
|
|
845
|
+
componentMoved: ComponentMovedPayload;
|
|
846
|
+
canvasReload: CanvasReloadPayload;
|
|
847
|
+
canvasError: CanvasErrorPayload;
|
|
848
|
+
updateSelectedComponentCoordinates: UpdateSelectedComponentCoordinatesPayload;
|
|
849
|
+
canvasScrolling: CanvasScrollPayload;
|
|
850
|
+
componentMoveStarted: ComponentMoveStartedPayload;
|
|
851
|
+
componentMoveEnded: ComponentMoveEndedPayload;
|
|
852
|
+
outsideCanvasClick: OutsideCanvasClickPayload;
|
|
853
|
+
sdkFeatures: SDKFeaturesPayload;
|
|
854
|
+
REQUEST_ENTITIES: RequestEntitiesPayload;
|
|
855
|
+
canvasGeometryUpdated: {
|
|
856
|
+
size: {
|
|
857
|
+
width: number;
|
|
858
|
+
height: number;
|
|
859
|
+
};
|
|
860
|
+
nodes: Record<string, {
|
|
861
|
+
coordinates: Pick<DOMRect, 'x' | 'y' | 'width' | 'height'>;
|
|
862
|
+
}>;
|
|
863
|
+
sourceEvent: CanvasGeometryUpdateSourceEvent;
|
|
864
|
+
};
|
|
865
|
+
canvasPan: {
|
|
866
|
+
ctrlKey: boolean;
|
|
867
|
+
metaKey: boolean;
|
|
868
|
+
clientX: number;
|
|
869
|
+
clientY: number;
|
|
870
|
+
deltaX: number;
|
|
871
|
+
deltaY: number;
|
|
872
|
+
};
|
|
873
|
+
};
|
|
874
|
+
type CanvasGeometryUpdateSourceEvent = 'resize' | 'mutation' | 'mediaResize';
|
|
875
|
+
type SendMessageParams = <T extends OutgoingEvent>(eventType: T, data: OUTGOING_EVENT_PAYLOADS[T]) => void;
|
|
876
|
+
type OutgoingMessage = {
|
|
877
|
+
[K in keyof OUTGOING_EVENT_PAYLOADS]: {
|
|
878
|
+
source: 'customer-app';
|
|
879
|
+
eventType: K;
|
|
880
|
+
payload: OUTGOING_EVENT_PAYLOADS[K];
|
|
881
|
+
};
|
|
882
|
+
}[keyof OUTGOING_EVENT_PAYLOADS];
|
|
883
|
+
type Filter<T, U> = T extends U ? T : never;
|
|
884
|
+
type SelectedValueTypes = Filter<ComponentPropertyValue['type'], 'UnboundValue' | 'BoundValue'>;
|
|
885
|
+
type RequestReadOnlyModePayload = undefined;
|
|
886
|
+
type RequestEditorModePayload = undefined;
|
|
887
|
+
type ExperienceUpdatedPayload = {
|
|
888
|
+
tree: ExperienceTree;
|
|
889
|
+
/** @deprecated not needed after `patternResolution` was introduced. Will be removed in the next major version. */
|
|
890
|
+
assemblies?: ExperienceUsedComponents;
|
|
891
|
+
locale: string;
|
|
892
|
+
changedNode?: ExperienceTreeNode;
|
|
893
|
+
changedValueType?: SelectedValueTypes;
|
|
894
|
+
};
|
|
895
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
896
|
+
type ComponentDraggingChangedPayload = {
|
|
897
|
+
isDragging: boolean;
|
|
898
|
+
};
|
|
899
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
900
|
+
type IncomingComponentDragCanceledPayload = undefined;
|
|
901
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
902
|
+
type ComponentDragStartedPayload = {
|
|
903
|
+
id: string;
|
|
904
|
+
isAssembly: boolean;
|
|
905
|
+
};
|
|
906
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
907
|
+
type ComponentDragEndedPayload = undefined;
|
|
908
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
909
|
+
type IncomingComponentMoveEndedPayload = {
|
|
910
|
+
mouseX: number;
|
|
911
|
+
mouseY: number;
|
|
912
|
+
};
|
|
913
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
914
|
+
type CanvasResizedPayload = {
|
|
915
|
+
selectedNodeId: string;
|
|
916
|
+
};
|
|
917
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
918
|
+
type SelectComponentPayload = {
|
|
919
|
+
selectedNodeId: string;
|
|
920
|
+
};
|
|
921
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
922
|
+
type HoverComponentPayload = {
|
|
923
|
+
hoveredNodeId: string;
|
|
924
|
+
};
|
|
925
|
+
type UpdatedEntityPayload = {
|
|
926
|
+
entity: ManagementEntity;
|
|
927
|
+
shouldRerender?: boolean;
|
|
928
|
+
};
|
|
929
|
+
type AssembliesAddedPayload = {
|
|
930
|
+
assembly: ManagementEntity;
|
|
931
|
+
assemblyDefinition: ComponentDefinition;
|
|
932
|
+
};
|
|
933
|
+
type AssembliesRegisteredPayload = {
|
|
934
|
+
assemblies: ComponentDefinition[];
|
|
935
|
+
};
|
|
936
|
+
/** @deprecated will be removed when dropping backward compatibility for old DND */
|
|
937
|
+
type IncomingMouseMovePayload = {
|
|
938
|
+
mouseX: number;
|
|
939
|
+
mouseY: number;
|
|
940
|
+
};
|
|
941
|
+
type RequestedEntitiesPayload = {
|
|
942
|
+
entities: ManagementEntity[];
|
|
943
|
+
};
|
|
944
|
+
type INCOMING_EVENT_PAYLOADS = {
|
|
945
|
+
requestEditorMode: RequestEditorModePayload;
|
|
946
|
+
requestReadOnlyMode: RequestReadOnlyModePayload;
|
|
947
|
+
componentTreeUpdated: ExperienceUpdatedPayload;
|
|
948
|
+
componentDraggingChanged: ComponentDraggingChangedPayload;
|
|
949
|
+
componentDragCanceled: IncomingComponentDragCanceledPayload;
|
|
950
|
+
componentDragStarted: ComponentDragStartedPayload;
|
|
951
|
+
componentDragEnded: ComponentDragEndedPayload;
|
|
952
|
+
componentMoveEnded: IncomingComponentMoveEndedPayload;
|
|
953
|
+
canvasResized: CanvasResizedPayload;
|
|
954
|
+
selectComponent: SelectComponentPayload;
|
|
955
|
+
hoverComponent: HoverComponentPayload;
|
|
956
|
+
updatedEntity: UpdatedEntityPayload;
|
|
957
|
+
assembliesAdded: AssembliesAddedPayload;
|
|
958
|
+
assembliesRegistered: AssembliesRegisteredPayload;
|
|
959
|
+
mouseMove: IncomingMouseMovePayload;
|
|
960
|
+
REQUESTED_ENTITIES: RequestedEntitiesPayload;
|
|
961
|
+
};
|
|
962
|
+
type IncomingMessage = {
|
|
963
|
+
[K in keyof INCOMING_EVENT_PAYLOADS]: {
|
|
964
|
+
eventType: K;
|
|
965
|
+
payload: INCOMING_EVENT_PAYLOADS[K];
|
|
966
|
+
};
|
|
967
|
+
}[keyof INCOMING_EVENT_PAYLOADS];
|
|
968
|
+
|
|
969
|
+
declare const MEDIA_QUERY_REGEXP: RegExp;
|
|
970
|
+
declare const mediaQueryMatcher: (breakpoints: Breakpoint[]) => [{
|
|
971
|
+
id: string;
|
|
972
|
+
signal: MediaQueryList;
|
|
973
|
+
}[], Record<string, boolean>];
|
|
974
|
+
declare const getActiveBreakpointIndex: (breakpoints: Breakpoint[], mediaQueryMatches: Record<string, boolean>, fallbackBreakpointIndex: number) => number;
|
|
975
|
+
declare const getFallbackBreakpointIndex: (breakpoints: Breakpoint[]) => number;
|
|
976
|
+
declare const isValidBreakpointValue: (value: PrimitiveValue) => value is Exclude<PrimitiveValue, undefined>;
|
|
977
|
+
declare const getValueForBreakpoint: (valuesByBreakpoint: ValuesByBreakpoint | undefined, breakpoints: Breakpoint[], activeBreakpointIndex: number, fallbackBreakpointIndex: number, propertyName?: string, resolveDesignTokens?: boolean) => string | number | boolean | Record<any, any> | undefined;
|
|
978
|
+
declare function mergeDesignValuesByBreakpoint(defaultValue: DesignValue, overwriteValue: DesignValue | undefined): DesignValue;
|
|
979
|
+
declare function mergeDesignValuesByBreakpoint(defaultValue: DesignValue | undefined, overwriteValue: DesignValue): DesignValue;
|
|
980
|
+
declare function mergeDesignValuesByBreakpoint(defaultValue: DesignValue | undefined, overwriteValue: DesignValue | undefined): DesignValue | undefined;
|
|
981
|
+
declare const BREAKPOINTS_STRATEGY_DESKTOP_FIRST = "desktop-first";
|
|
982
|
+
declare const BREAKPOINTS_STRATEGY_MOBILE_FIRST = "mobile-first";
|
|
983
|
+
type BreakpointsStrategy = typeof BREAKPOINTS_STRATEGY_DESKTOP_FIRST | typeof BREAKPOINTS_STRATEGY_MOBILE_FIRST | undefined;
|
|
984
|
+
/**
|
|
985
|
+
* Detects the breakpoint strategy based on the provided breakpoints.
|
|
986
|
+
*
|
|
987
|
+
* @param breakpoints The array of breakpoints to analyze.
|
|
988
|
+
* @returns The detected breakpoint strategy or undefined if not determinable.
|
|
989
|
+
*/
|
|
990
|
+
declare const detectBreakpointsStrategy: (breakpoints: Breakpoint[]) => BreakpointsStrategy;
|
|
991
|
+
|
|
992
|
+
declare const DEBUG_LEVELS_HIERARCHY: readonly ["error", "warn", "log", "debug"];
|
|
993
|
+
type DEBUG_LEVEL = (typeof DEBUG_LEVELS_HIERARCHY)[number];
|
|
994
|
+
declare class DebugLogger {
|
|
995
|
+
private static instance;
|
|
996
|
+
private activeLevel;
|
|
997
|
+
constructor();
|
|
998
|
+
static getInstance(): DebugLogger;
|
|
999
|
+
getActiveLevel(): "error" | "warn" | "log" | "debug";
|
|
1000
|
+
setActiveLevel(level: DEBUG_LEVEL): void;
|
|
1001
|
+
private logger;
|
|
1002
|
+
error: {
|
|
1003
|
+
(...data: any[]): void;
|
|
1004
|
+
(message?: any, ...optionalParams: any[]): void;
|
|
1005
|
+
};
|
|
1006
|
+
warn: {
|
|
1007
|
+
(...data: any[]): void;
|
|
1008
|
+
(message?: any, ...optionalParams: any[]): void;
|
|
1009
|
+
};
|
|
1010
|
+
log: {
|
|
1011
|
+
(...data: any[]): void;
|
|
1012
|
+
(message?: any, ...optionalParams: any[]): void;
|
|
1013
|
+
};
|
|
1014
|
+
debug: {
|
|
1015
|
+
(...data: any[]): void;
|
|
1016
|
+
(message?: any, ...optionalParams: any[]): void;
|
|
1017
|
+
};
|
|
1018
|
+
}
|
|
1019
|
+
declare const debug: DebugLogger;
|
|
1020
|
+
/** Set the logging level to `debug` */
|
|
1021
|
+
declare const enableDebug: () => void;
|
|
1022
|
+
/** Set the debug level to `warn` */
|
|
1023
|
+
declare const disableDebug: () => void;
|
|
1024
|
+
/** Set the debug level to the provided level */
|
|
1025
|
+
declare const setDebugLevel: (level: DEBUG_LEVEL) => void;
|
|
1026
|
+
|
|
1027
|
+
type Rect = {
|
|
1028
|
+
top: number;
|
|
1029
|
+
right: number;
|
|
1030
|
+
bottom: number;
|
|
1031
|
+
left: number;
|
|
1032
|
+
};
|
|
1033
|
+
declare const findOutermostCoordinates: (first: Rect, second: Rect) => {
|
|
1034
|
+
top: number;
|
|
1035
|
+
right: number;
|
|
1036
|
+
bottom: number;
|
|
1037
|
+
left: number;
|
|
1038
|
+
};
|
|
1039
|
+
declare const isElementHidden: (rect: DOMRect) => boolean;
|
|
1040
|
+
declare const getElementCoordinates: (element: Element) => DOMRect;
|
|
1041
|
+
|
|
1042
|
+
declare const isLinkToAsset: (variable: unknown) => variable is Link<"Asset">;
|
|
1043
|
+
|
|
1044
|
+
declare const isLinkToEntry: (variable: unknown) => variable is Link<"Entry">;
|
|
1045
|
+
|
|
1046
|
+
declare function isLink(maybeLink: UnresolvedLink<'Entry'> | Entry | undefined): maybeLink is UnresolvedLink<'Entry'>;
|
|
1047
|
+
declare function isLink(maybeLink: UnresolvedLink<'Asset'> | Asset | undefined): maybeLink is UnresolvedLink<'Asset'>;
|
|
1048
|
+
declare function isLink(maybeLink: unknown): maybeLink is UnresolvedLink<'Entry' | 'Asset'>;
|
|
1049
|
+
|
|
1050
|
+
/**
|
|
1051
|
+
* Localizes the provided entry or asset to match the regular format of CDA/CPA entities.
|
|
1052
|
+
* Note that this function does not apply a fallback to the default locale nor does it check
|
|
1053
|
+
* the content type for the localization setting of each field.
|
|
1054
|
+
* It will simply resolve each field to the requested locale. As using single and multiple
|
|
1055
|
+
* reference fields is still considered an experimental feature, this function does not handle
|
|
1056
|
+
* recursive localization of deeper referenced entities.
|
|
1057
|
+
*
|
|
1058
|
+
* If the entity is already localized, it will return the entity as is.
|
|
1059
|
+
*
|
|
1060
|
+
* Note that localization is later on determined by the existence of the `sys.locale` property (matching the API shape).
|
|
1061
|
+
*
|
|
1062
|
+
* @example
|
|
1063
|
+
* ```
|
|
1064
|
+
* const multiLocaleEntry = { fields: { title: { 'en-US': 'Hello' } } };
|
|
1065
|
+
* const localizedEntry = localizeEntity(multiLocaleEntry, 'en-US');
|
|
1066
|
+
* console.log(localizedEntry.fields.title); // 'Hello'
|
|
1067
|
+
* ```
|
|
1068
|
+
*/
|
|
1069
|
+
declare function localizeEntity<T extends Asset | Entry>(entity: T, locale: string): T;
|
|
1070
|
+
|
|
1071
|
+
/**
|
|
1072
|
+
* This module encapsulates format of the path to a deep reference.
|
|
1073
|
+
*/
|
|
1074
|
+
|
|
1075
|
+
type PreboundVariable = {
|
|
1076
|
+
type: 'BoundValue';
|
|
1077
|
+
path: string;
|
|
1078
|
+
isPrebound: boolean;
|
|
1079
|
+
pathsByContentType: Record<string, {
|
|
1080
|
+
path: string;
|
|
1081
|
+
}>;
|
|
1082
|
+
};
|
|
1083
|
+
declare const isPreboundProp: (variable: ComponentPropertyValue) => variable is PreboundVariable;
|
|
1084
|
+
type UnresolvedFieldset = Array<[null, string, string?]>;
|
|
1085
|
+
type Fieldset = Array<[Entry | Asset, string, string?]>;
|
|
1086
|
+
declare const parseDataSourcePathIntoFieldset: (path: string) => UnresolvedFieldset;
|
|
1087
|
+
/**
|
|
1088
|
+
* Parse path into components, supports L1 references (one reference follow) atm.
|
|
1089
|
+
* @param path from data source. eg. `/uuid123/fields/image/~locale/fields/file/~locale`
|
|
1090
|
+
* eg. `/uuid123/fields/file/~locale/fields/title/~locale`
|
|
1091
|
+
* @returns
|
|
1092
|
+
*/
|
|
1093
|
+
declare const parseDataSourcePathWithL1DeepBindings: (path: string) => {
|
|
1094
|
+
key: string;
|
|
1095
|
+
field: string;
|
|
1096
|
+
referentField: string;
|
|
1097
|
+
};
|
|
1098
|
+
/**
|
|
1099
|
+
* Detects if paths is valid deep-path, like:
|
|
1100
|
+
* - /gV6yKXp61hfYrR7rEyKxY/fields/mainStory/~locale/fields/cover/~locale/fields/title/~locale
|
|
1101
|
+
* or regular, like:
|
|
1102
|
+
* - /6J8eA60yXwdm5eyUh9fX6/fields/mainStory/~locale
|
|
1103
|
+
* @returns
|
|
1104
|
+
*/
|
|
1105
|
+
declare const isDeepPath: (deepPathCandidate: string) => boolean;
|
|
1106
|
+
declare const isDeepPrebinding: (boundValueProperty: BoundValue) => boolean;
|
|
1107
|
+
declare const getPrebindingPathBySourceEntry: (preboundValueProperty: PreboundVariable, getHeadEntityByDataSourceKey: (id: string) => Entry | Asset | undefined) => string | undefined;
|
|
1108
|
+
declare const lastPathNamedSegmentEq: (path: string, expectedName: string) => boolean;
|
|
1109
|
+
|
|
1110
|
+
declare const resolveHyperlinkPattern: (pattern: string, entry: Entry | null, locale: string | null) => string | null;
|
|
1111
|
+
declare function addLocale(str: string, locale: string): string;
|
|
1112
|
+
declare function getTemplateValue(ctx: {
|
|
1113
|
+
entry: Entry;
|
|
1114
|
+
locale: string;
|
|
1115
|
+
}, path: string): string | (() => string);
|
|
1116
|
+
declare function buildTemplate({ template, context, }: {
|
|
1117
|
+
template: string;
|
|
1118
|
+
context: {
|
|
1119
|
+
entry: Entry;
|
|
1120
|
+
locale: string;
|
|
1121
|
+
};
|
|
1122
|
+
}): string;
|
|
1123
|
+
|
|
1124
|
+
declare const sanitizeNodeProps: (nodeProps: Record<PropertyKey, PrimitiveValue>) => {
|
|
1125
|
+
[k: string]: string | number | boolean | Record<any, any> | undefined;
|
|
1126
|
+
};
|
|
1127
|
+
|
|
1128
|
+
declare const toCSSAttribute: (key: string) => string;
|
|
1129
|
+
/**
|
|
1130
|
+
* Turns a list of CSSProperties into a joined CSS string that can be
|
|
1131
|
+
* used for <style> tags. Per default it creates a minimized version.
|
|
1132
|
+
* For editor mode, use the `useWhitespaces` flag to create a more readable version.
|
|
1133
|
+
*
|
|
1134
|
+
* @param cssProperties list of CSS properties
|
|
1135
|
+
* @param useWhitespaces adds whitespaces and newlines between each rule
|
|
1136
|
+
* @returns a string of CSS rules
|
|
1137
|
+
*/
|
|
1138
|
+
declare const stringifyCssProperties: (cssProperties: CSSProperties, useWhitespaces?: boolean) => string;
|
|
1139
|
+
declare const buildStyleTag: ({ styles, nodeId }: {
|
|
1140
|
+
styles: CSSProperties;
|
|
1141
|
+
nodeId?: string;
|
|
1142
|
+
}) => string[];
|
|
1143
|
+
/**
|
|
1144
|
+
* Takes plain design values and transforms them into CSS properties. Undefined values will
|
|
1145
|
+
* be filtered out.
|
|
1146
|
+
*
|
|
1147
|
+
* **Example Input**
|
|
1148
|
+
* ```
|
|
1149
|
+
* values = {
|
|
1150
|
+
* cfVisibility: 'visible',
|
|
1151
|
+
* cfMargin: '10px',
|
|
1152
|
+
* cfFlexReverse: true,
|
|
1153
|
+
* cfImageOptions: { objectFit: 'cover' },
|
|
1154
|
+
* // ...
|
|
1155
|
+
* }
|
|
1156
|
+
* ```
|
|
1157
|
+
* **Example Output**
|
|
1158
|
+
* ```
|
|
1159
|
+
* cssProperties = {
|
|
1160
|
+
* margin: '10px',
|
|
1161
|
+
* flexDirection: 'row-reverse',
|
|
1162
|
+
* objectFit: 'cover',
|
|
1163
|
+
* // ...
|
|
1164
|
+
* }
|
|
1165
|
+
* ```
|
|
1166
|
+
*/
|
|
1167
|
+
declare const buildCfStyles: (values: Partial<StyleProps>) => CSSProperties;
|
|
1168
|
+
/**
|
|
1169
|
+
* **Only meant to be used in editor mode!**
|
|
1170
|
+
*
|
|
1171
|
+
* If the node is an empty structure component with a relative height (e.g. '100%'),
|
|
1172
|
+
* it might render with a zero height. In this case, add a min height of 80px to ensure
|
|
1173
|
+
* that child nodes can be added via drag & drop.
|
|
1174
|
+
*/
|
|
1175
|
+
declare const addMinHeightForEmptyStructures: (cssProperties: CSSProperties, node: ComponentTreeNode) => react.CSSProperties;
|
|
1176
|
+
/**
|
|
1177
|
+
* Container/section default behavior:
|
|
1178
|
+
* Default height => height: EMPTY_CONTAINER_SIZE
|
|
1179
|
+
* If a container component has children => height: 'fit-content'
|
|
1180
|
+
*/
|
|
1181
|
+
declare const calculateNodeDefaultHeight: ({ blockId, children, value, }: {
|
|
1182
|
+
blockId?: string;
|
|
1183
|
+
children: ExperienceTreeNode["children"];
|
|
1184
|
+
value: PrimitiveValue;
|
|
1185
|
+
}) => string | number | boolean | Record<any, any> | undefined;
|
|
1186
|
+
|
|
1187
|
+
type FlattenedDesignTokens = Record<string, string | {
|
|
1188
|
+
width?: string;
|
|
1189
|
+
style?: string;
|
|
1190
|
+
color?: string;
|
|
1191
|
+
}>;
|
|
1192
|
+
declare const detachExperienceStyles: (experience: Experience) => string | undefined;
|
|
1193
|
+
declare const isCfStyleAttribute: (variableName: string) => variableName is keyof StyleProps;
|
|
1194
|
+
declare const maybePopulateDesignTokenValue: (variableName: string, variableValue: unknown, mapOfDesignVariableKeys: FlattenedDesignTokens) => unknown;
|
|
1195
|
+
declare const resolveBackgroundImageBinding: ({ variableData, getBoundEntityById, dataSource, unboundValues, componentVariablesOverwrites, componentSettings, options, width, }: {
|
|
1196
|
+
variableData: ComponentPropertyValue;
|
|
1197
|
+
getBoundEntityById: (id: string) => Entry$1 | Asset$1 | undefined;
|
|
1198
|
+
unboundValues?: ExperienceUnboundValues;
|
|
1199
|
+
dataSource?: ExperienceDataSource;
|
|
1200
|
+
componentSettings?: ExperienceComponentSettings;
|
|
1201
|
+
componentVariablesOverwrites?: Record<string, ComponentPropertyValue>;
|
|
1202
|
+
options?: BackgroundImageOptions;
|
|
1203
|
+
width?: string;
|
|
1204
|
+
}) => any;
|
|
1205
|
+
/**
|
|
1206
|
+
* Takes the initial set of properties, filters only design properties that will be mapped to CSS and
|
|
1207
|
+
* re-organizes them to be indexed by breakpoint ID ("breakpoint > variable > value"). It will
|
|
1208
|
+
* also resolve the design/ component values to plain values.
|
|
1209
|
+
*
|
|
1210
|
+
* **Example Input**
|
|
1211
|
+
* ```
|
|
1212
|
+
* variables = {
|
|
1213
|
+
* cfMargin: { type: 'DesignValue', valuesByBreakpoint: { desktop: '1px', tablet: '2px' } },
|
|
1214
|
+
* cfPadding: { type: 'DesignValue', valuesByBreakpoint: { desktop: '3px', mobile: '4px' } }
|
|
1215
|
+
* }
|
|
1216
|
+
* ```
|
|
1217
|
+
*
|
|
1218
|
+
* **Example Output**
|
|
1219
|
+
* ```
|
|
1220
|
+
* variableValuesByBreakpoints = {
|
|
1221
|
+
* desktop: {
|
|
1222
|
+
* cfMargin: '1px',
|
|
1223
|
+
* cfPadding: '3px'
|
|
1224
|
+
* },
|
|
1225
|
+
* tablet: {
|
|
1226
|
+
* cfMargin: '2px'
|
|
1227
|
+
* },
|
|
1228
|
+
* mobile: {
|
|
1229
|
+
* cfPadding: '4px'
|
|
1230
|
+
* }
|
|
1231
|
+
* }
|
|
1232
|
+
* ```
|
|
1233
|
+
*
|
|
1234
|
+
* **Note**
|
|
1235
|
+
* - The property cfBackgroundImageUrl is the only content property that gets mapped to CSS as well.
|
|
1236
|
+
* It will be solely stored on the default breakpoint.
|
|
1237
|
+
* - For ComponentValues, it will either take the override from the pattern instance or fallback to
|
|
1238
|
+
* the defaultValue defined in variableDefinitions.
|
|
1239
|
+
*/
|
|
1240
|
+
declare const indexByBreakpoint: ({ variables, breakpointIds, getBoundEntityById, unboundValues, dataSource, componentVariablesOverwrites, componentSettings, }: {
|
|
1241
|
+
variables: Record<string, ComponentPropertyValue>;
|
|
1242
|
+
breakpointIds: string[];
|
|
1243
|
+
getBoundEntityById: (id: string) => Entry$1 | Asset$1 | undefined;
|
|
1244
|
+
unboundValues?: ExperienceUnboundValues;
|
|
1245
|
+
dataSource?: ExperienceDataSource;
|
|
1246
|
+
componentVariablesOverwrites?: Record<string, ComponentPropertyValue>;
|
|
1247
|
+
componentSettings?: ExperienceComponentSettings;
|
|
1248
|
+
}) => Record<string, Record<string, string | number | boolean | Record<any, any>>>;
|
|
1249
|
+
/**
|
|
1250
|
+
* Flattens the object from
|
|
1251
|
+
* `{ color: { [key]: [value] } }`
|
|
1252
|
+
* to
|
|
1253
|
+
* `{ 'color.key': [value] }`
|
|
1254
|
+
*/
|
|
1255
|
+
declare const flattenDesignTokenRegistry: (designTokenRegistry: DesignTokensDefinition) => FlattenedDesignTokens;
|
|
1256
|
+
|
|
1257
|
+
/**
|
|
1258
|
+
* Create a single CSS string containing all class definitions for a given media query.
|
|
1259
|
+
*
|
|
1260
|
+
* @param cssByClassName map of class names to CSS strings containing all rules for each class
|
|
1261
|
+
* @param condition e.g. "*", "<520px", ">520px"
|
|
1262
|
+
* @param nextCondition optional next condition to create a disjunct media query that doesn't affect the next breakpoint
|
|
1263
|
+
* @returns joined string of all CSS class definitions wrapped into media queries
|
|
1264
|
+
*/
|
|
1265
|
+
declare const toMediaQuery: ({ cssByClassName, condition, nextCondition, }: {
|
|
1266
|
+
cssByClassName: Record<string, string>;
|
|
1267
|
+
condition: string;
|
|
1268
|
+
nextCondition?: string;
|
|
1269
|
+
}) => string;
|
|
1270
|
+
|
|
1271
|
+
/** Turn the visibility value into a style object that can be used for inline styles in React */
|
|
1272
|
+
declare const transformVisibility: (value?: boolean) => CSSProperties;
|
|
1273
|
+
|
|
1274
|
+
declare const transformBoundContentValue: (variables: ComponentTreeNode["variables"], entityStore: EntityStoreBase, binding: UnresolvedLink<"Entry" | "Asset">, resolveDesignValue: ResolveDesignValueType, variableName: string, variableType: ComponentDefinitionPropertyType, path: string) => BoundComponentPropertyTypes;
|
|
1275
|
+
|
|
1276
|
+
type NodeWithChildren<T> = {
|
|
1277
|
+
children: T[];
|
|
1278
|
+
};
|
|
1279
|
+
declare function treeVisit<T extends NodeWithChildren<T>>(initialNode: T, onNode: (node: T, index: number, depth: number) => void): void;
|
|
1280
|
+
/**
|
|
1281
|
+
* Traverses all nodes of a tree and maps all of them.
|
|
1282
|
+
* Intuitively works similarly to Array.map().
|
|
1283
|
+
* When returning mapped object from the mapper function
|
|
1284
|
+
* you _do not_ need to return about `.children[]` field.
|
|
1285
|
+
* This field is automatically managed by the treeMap() function.
|
|
1286
|
+
*
|
|
1287
|
+
* You can map each node to whatever you want, but shouldn't
|
|
1288
|
+
* modify the structure of the tree from the mapping function.
|
|
1289
|
+
*/
|
|
1290
|
+
declare function treeMap<T extends NodeWithChildren<T>, U>(node: T, onNode: (node: T) => Omit<U, 'children'>): U;
|
|
1291
|
+
|
|
1292
|
+
declare const isExperienceEntry: (entry: ExperienceEntry | Entry) => entry is ExperienceEntry;
|
|
1293
|
+
declare const isPatternEntry: (entry: Entry | ExperienceEntry) => entry is ExperienceEntry;
|
|
1294
|
+
declare const isEntry: (value: unknown) => value is Entry;
|
|
1295
|
+
declare const isAsset: (value: unknown) => value is Asset;
|
|
1296
|
+
/**
|
|
1297
|
+
* Checks if the values is an array of links.
|
|
1298
|
+
* Note: we use convention where empty arrays are considered valid "arrays of links"
|
|
1299
|
+
* as they don't contradict the type definition.
|
|
1300
|
+
*/
|
|
1301
|
+
declare const isArrayOfLinks: (value: unknown) => value is Array<UnresolvedLink<"Asset"> | UnresolvedLink<"Entry">>;
|
|
1302
|
+
|
|
1303
|
+
declare const getDataFromTree: (tree: ExperienceTree) => {
|
|
1304
|
+
dataSource: ExperienceDataSource;
|
|
1305
|
+
unboundValues: ExperienceUnboundValues;
|
|
1306
|
+
};
|
|
1307
|
+
declare const generateRandomId: (letterCount: number) => string;
|
|
1308
|
+
declare const checkIsAssemblyNode: ({ componentId, usedComponents, }: {
|
|
1309
|
+
componentId: string;
|
|
1310
|
+
usedComponents: ExperienceEntry["fields"]["usedComponents"];
|
|
1311
|
+
}) => boolean;
|
|
1312
|
+
/**
|
|
1313
|
+
* This check assumes that the entry is already ensured to be an experience, i.e. the
|
|
1314
|
+
* content type of the entry is an experience type with the necessary annotations.
|
|
1315
|
+
**/
|
|
1316
|
+
declare const checkIsAssemblyEntry: (entry: Entry) => boolean;
|
|
1317
|
+
declare const checkIsAssemblyDefinition: (component?: ComponentDefinition) => boolean;
|
|
1318
|
+
interface ParsedValue {
|
|
1319
|
+
value: number;
|
|
1320
|
+
unit: 'px' | 'em' | 'rem';
|
|
1321
|
+
}
|
|
1322
|
+
declare function parseCSSValue(input: string): ParsedValue | null;
|
|
1323
|
+
declare function getTargetValueInPixels(targetWidthObject: ParsedValue): number;
|
|
1324
|
+
/**
|
|
1325
|
+
* Creates a component definition for an assembly. As all assemblies use the same definition in the SDK,
|
|
1326
|
+
* all should be registered via this function.
|
|
1327
|
+
*/
|
|
1328
|
+
declare const createAssemblyDefinition: (definitionId: string) => ComponentDefinition;
|
|
1329
|
+
|
|
1330
|
+
declare const doesMismatchMessageSchema: (event: MessageEvent) => false | string;
|
|
1331
|
+
declare const tryParseMessage: (event: MessageEvent) => IncomingMessage;
|
|
1332
|
+
declare const validateExperienceBuilderConfig: ({ locale, mode, }: {
|
|
1333
|
+
locale: string;
|
|
1334
|
+
mode: StudioCanvasMode;
|
|
1335
|
+
}) => void;
|
|
1336
|
+
|
|
1337
|
+
/**
|
|
1338
|
+
* Parses experience and extracts all leaf links that are referenced from the experience.
|
|
1339
|
+
* PRECONDITION: Relies on the fact that entityStore is preloaded with all dataSource
|
|
1340
|
+
* entries using include=2 (meaning that up to L3 entries are already preloaded into EntitStore).
|
|
1341
|
+
*
|
|
1342
|
+
* The function iterates over all entries in the entityStore (assuming they can be L1, L2, L3) and
|
|
1343
|
+
* over all of their references. Any references that are NOT available in the entityStore are considered
|
|
1344
|
+
* "leaf references" aka "leaf links" and are returned.
|
|
1345
|
+
*
|
|
1346
|
+
* The EntityStore happens to contain also entities representing patterns, which we do NOT consider
|
|
1347
|
+
* as entries that point to leaf links. So we don't iterate over patterns only over entries which
|
|
1348
|
+
* can be used for binding.
|
|
1349
|
+
*/
|
|
1350
|
+
declare const extractLeafLinksReferencedFromExperience: (experience: Experience) => {
|
|
1351
|
+
assetLinks: Link<"Asset">[];
|
|
1352
|
+
entryLinks: Link<"Entry">[];
|
|
1353
|
+
assetIds: string[];
|
|
1354
|
+
entryIds: string[];
|
|
1355
|
+
};
|
|
1356
|
+
|
|
1357
|
+
type FnShouldFollowReferencesOfEntryField = (fieldName: string, entry: Entry) => boolean;
|
|
1358
|
+
declare const uniqueById: <T extends {
|
|
1359
|
+
sys: {
|
|
1360
|
+
id: string;
|
|
1361
|
+
};
|
|
1362
|
+
}>(arr: Array<T>) => T[];
|
|
1363
|
+
/**
|
|
1364
|
+
* Extracts all references from an entry.
|
|
1365
|
+
* Handles both: reference and multi-reference fields.
|
|
1366
|
+
* Returns unique array of references (even if they repeat within the entry).
|
|
1367
|
+
*/
|
|
1368
|
+
declare const referencesOf: (entry: Entry, fnShouldFollowReferencesOfEntryField?: FnShouldFollowReferencesOfEntryField) => UnresolvedLink<"Asset" | "Entry">[];
|
|
1369
|
+
declare function extractReferencesFromEntriesAsIds(entries: Array<Entry>): [string[], string[], string[]];
|
|
1370
|
+
declare function extractReferencesFromEntries(entries: Array<Entry>): [UnresolvedLink<'Entry'>[], UnresolvedLink<'Asset'>[], UnresolvedLink<'Entry' | 'Asset'>[]];
|
|
1371
|
+
|
|
1372
|
+
declare const splitDirectAndSlotChildren: <T extends ExperienceTreeNode | ComponentTreeNode>(allChildNodes: T[], componentDefinition: ComponentRegistration["definition"]) => {
|
|
1373
|
+
slotNodesMap: Record<string, T[] | null>;
|
|
1374
|
+
directChildNodes: undefined;
|
|
1375
|
+
} | {
|
|
1376
|
+
slotNodesMap: Record<string, T[] | null>;
|
|
1377
|
+
directChildNodes: T[];
|
|
1378
|
+
};
|
|
1379
|
+
|
|
1380
|
+
type PrebindingData = {
|
|
1381
|
+
prebindingDefinitionId: string;
|
|
1382
|
+
parameterIds: Array<string>;
|
|
1383
|
+
nativeParameterId?: string;
|
|
1384
|
+
parameterDefinitions: Record<string, ParameterDefinition>;
|
|
1385
|
+
variableMappings?: Record<string, VariableMapping>;
|
|
1386
|
+
};
|
|
1387
|
+
declare const flattenNestedPatterns: (fetchedPatterns: Array<ExperienceEntry>) => ExperienceEntry[];
|
|
1388
|
+
/**
|
|
1389
|
+
* Given a list of patterns, extract the prebinding data into a more digestable format indexed by the pattern entry id
|
|
1390
|
+
* @param patterns a list of pattern entries
|
|
1391
|
+
* @returns a map of pattern entry ids to their prebinding data
|
|
1392
|
+
*/
|
|
1393
|
+
declare const extractPrebindingDataByPatternId: (patterns: Array<ExperienceEntry>) => Record<string, PrebindingData>;
|
|
1394
|
+
declare const generateDefaultDataSourceForPrebindingDefinition: (prebindingDefinitions?: ExperienceComponentSettings["prebindingDefinitions"]) => {
|
|
1395
|
+
dataSource: Record<string, {
|
|
1396
|
+
sys: {
|
|
1397
|
+
type: "Link";
|
|
1398
|
+
id: string;
|
|
1399
|
+
linkType: "Entry" | "Asset";
|
|
1400
|
+
};
|
|
1401
|
+
}>;
|
|
1402
|
+
parameters: Record<string, {
|
|
1403
|
+
path: string;
|
|
1404
|
+
type: "BoundValue";
|
|
1405
|
+
}>;
|
|
1406
|
+
};
|
|
1407
|
+
declare function getTargetPatternMappingsForParameter({ fetchedPatterns, prebindingDataByPatternId, patternNodeDefinitionId, parameterId, }: {
|
|
1408
|
+
fetchedPatterns: Array<ExperienceEntry>;
|
|
1409
|
+
prebindingDataByPatternId: Record<string, PrebindingData>;
|
|
1410
|
+
patternNodeDefinitionId: string;
|
|
1411
|
+
parameterId: string;
|
|
1412
|
+
}): {
|
|
1413
|
+
[k: string]: {
|
|
1414
|
+
type: "ContentTypeMapping";
|
|
1415
|
+
parameterId: string;
|
|
1416
|
+
pathsByContentType: Record<string, {
|
|
1417
|
+
path: string;
|
|
1418
|
+
}>;
|
|
1419
|
+
};
|
|
1420
|
+
} | undefined;
|
|
1421
|
+
|
|
1422
|
+
declare const builtInStyles: Partial<DesignVariableMap>;
|
|
1423
|
+
declare const optionalBuiltInStyles: Partial<DesignVariableMap>;
|
|
1424
|
+
declare const sectionBuiltInStyles: Partial<DesignVariableMap>;
|
|
1425
|
+
declare const containerBuiltInStyles: Partial<DesignVariableMap>;
|
|
1426
|
+
declare const dividerBuiltInStyles: Partial<DesignVariableMap>;
|
|
1427
|
+
declare const singleColumnBuiltInStyles: Partial<DesignVariableMap>;
|
|
1428
|
+
declare const columnsBuiltInStyles: Partial<DesignVariableMap>;
|
|
1429
|
+
|
|
1430
|
+
declare const sendMessage: SendMessageParams;
|
|
1431
|
+
|
|
1432
|
+
declare enum VisualEditorMode {
|
|
1433
|
+
LazyLoad = "lazyLoad",
|
|
1434
|
+
InjectScript = "injectScript"
|
|
1435
|
+
}
|
|
1436
|
+
|
|
1437
|
+
type FetchBySlugParams = {
|
|
1438
|
+
/** instantiated client from the Contentful SDK */
|
|
1439
|
+
client: ContentfulClientApi<undefined>;
|
|
1440
|
+
/** id of the content type associated with the experience */
|
|
1441
|
+
experienceTypeId: string;
|
|
1442
|
+
/** slug of the experience (defined in entry settings) */
|
|
1443
|
+
slug: string;
|
|
1444
|
+
/** locale code to fetch the experience */
|
|
1445
|
+
localeCode: string;
|
|
1446
|
+
/** if the experience is being loaded in the Contentful Studio editor or not. If true, this function is a noop. */
|
|
1447
|
+
isEditorMode?: boolean;
|
|
1448
|
+
};
|
|
1449
|
+
/**
|
|
1450
|
+
* Fetches an experience entry by its slug and additionally fetches all its references to return
|
|
1451
|
+
* an initilized experience instance.
|
|
1452
|
+
* @param {FetchBySlugParams} options - options to fetch the experience
|
|
1453
|
+
*/
|
|
1454
|
+
declare function fetchBySlug({ client, experienceTypeId, slug, localeCode, isEditorMode, }: FetchBySlugParams): Promise<Experience<EntityStore> | undefined>;
|
|
1455
|
+
|
|
1456
|
+
type FetchByIdParams = {
|
|
1457
|
+
/** instantiated client from the Contentful SDK */
|
|
1458
|
+
client: ContentfulClientApi<undefined>;
|
|
1459
|
+
/** id of the content type associated with the experience */
|
|
1460
|
+
experienceTypeId: string;
|
|
1461
|
+
/** id of the experience (defined in entry settings) */
|
|
1462
|
+
id: string;
|
|
1463
|
+
/** locale code to fetch the experience */
|
|
1464
|
+
localeCode: string;
|
|
1465
|
+
/** if the experience is being loaded in the Contentful Studio editor or not. If true, this function is a noop. */
|
|
1466
|
+
isEditorMode?: boolean;
|
|
1467
|
+
};
|
|
1468
|
+
/**
|
|
1469
|
+
* Fetches an experience entry by its id and additionally fetches all its references to return
|
|
1470
|
+
* an initilized experience instance.
|
|
1471
|
+
* @param {FetchByIdParams} options - options to fetch the experience
|
|
1472
|
+
*/
|
|
1473
|
+
declare function fetchById({ client, experienceTypeId, id, localeCode, isEditorMode, }: FetchByIdParams): Promise<Experience<EntityStore> | undefined>;
|
|
1474
|
+
|
|
1475
|
+
type DeepReferenceOpts = {
|
|
1476
|
+
path: string;
|
|
1477
|
+
dataSource: ExperienceDataSource;
|
|
1478
|
+
};
|
|
1479
|
+
declare class DeepReference {
|
|
1480
|
+
entityId: string;
|
|
1481
|
+
entityLink: DataSourceEntryValueType;
|
|
1482
|
+
field: string;
|
|
1483
|
+
referentField: string;
|
|
1484
|
+
originalPath: string;
|
|
1485
|
+
constructor({ path, dataSource }: DeepReferenceOpts);
|
|
1486
|
+
get headEntityId(): string;
|
|
1487
|
+
/**
|
|
1488
|
+
* Extracts referent from the path, using EntityStore as source of
|
|
1489
|
+
* entities during the resolution path.
|
|
1490
|
+
*/
|
|
1491
|
+
extractReferent(entityStore: EntityFromLink): Link<'Asset' | 'Entry'> | undefined;
|
|
1492
|
+
static from(opt: DeepReferenceOpts): DeepReference;
|
|
1493
|
+
}
|
|
1494
|
+
declare function gatherDeepReferencesFromExperienceEntry(experienceEntry: ExperienceEntry): DeepReference[];
|
|
1495
|
+
declare function gatherDeepPrebindingReferencesFromExperienceEntry({ experienceEntry, fetchedPatterns, prebindingDataByPatternId, fetchedLevel1Entries, }: {
|
|
1496
|
+
experienceEntry: ExperienceEntry;
|
|
1497
|
+
fetchedPatterns: Array<ExperienceEntry>;
|
|
1498
|
+
prebindingDataByPatternId: Record<string, PrebindingData>;
|
|
1499
|
+
fetchedLevel1Entries: Array<Entry>;
|
|
1500
|
+
}): DeepReference[];
|
|
1501
|
+
declare function gatherDeepPrebindingReferencesFromPatternEntry({ patternEntry, fetchedPatterns, prebindingDataByPatternId, fetchedLevel1Entries, }: {
|
|
1502
|
+
patternEntry: ExperienceEntry;
|
|
1503
|
+
fetchedPatterns: Array<ExperienceEntry>;
|
|
1504
|
+
prebindingDataByPatternId: Record<string, PrebindingData>;
|
|
1505
|
+
fetchedLevel1Entries: Array<Entry>;
|
|
1506
|
+
}): DeepReference[];
|
|
1507
|
+
/**
|
|
1508
|
+
* used in editor mode. for delivery mode see `gatherDeepReferencesFromExperienceEntry`
|
|
1509
|
+
*/
|
|
1510
|
+
declare function gatherDeepReferencesFromTree(startingNode: ExperienceTreeNode, dataSource: ExperienceDataSource, getEntityFromLink: EntityStoreBase['getEntityFromLink']): DeepReference[];
|
|
1511
|
+
|
|
1512
|
+
type MinimalEntryCollection = {
|
|
1513
|
+
items: Entry[];
|
|
1514
|
+
includes: {
|
|
1515
|
+
Entry: Entry[];
|
|
1516
|
+
Asset: Asset[];
|
|
1517
|
+
};
|
|
1518
|
+
};
|
|
1519
|
+
|
|
1520
|
+
declare const fetchAllEntries: ({ client, ids, locale, skip, limit, responseItems, responseIncludes, }: {
|
|
1521
|
+
client: ContentfulClientApi<undefined> | ContentfulClientApi<"WITH_ALL_LOCALES">;
|
|
1522
|
+
ids: string[];
|
|
1523
|
+
locale?: string;
|
|
1524
|
+
skip?: number;
|
|
1525
|
+
limit?: number;
|
|
1526
|
+
responseItems?: Entry[];
|
|
1527
|
+
responseIncludes?: MinimalEntryCollection["includes"];
|
|
1528
|
+
}) => Promise<{
|
|
1529
|
+
items: Entry[];
|
|
1530
|
+
includes: {
|
|
1531
|
+
Entry: Entry[];
|
|
1532
|
+
Asset: Asset[];
|
|
1533
|
+
};
|
|
1534
|
+
}>;
|
|
1535
|
+
declare const fetchAllAssets: ({ client, ids, locale, skip, limit, responseItems, }: {
|
|
1536
|
+
client: ContentfulClientApi<undefined> | ContentfulClientApi<"WITH_ALL_LOCALES">;
|
|
1537
|
+
ids: string[];
|
|
1538
|
+
locale?: string;
|
|
1539
|
+
skip?: number;
|
|
1540
|
+
limit?: number;
|
|
1541
|
+
responseItems?: Asset[];
|
|
1542
|
+
}) => Promise<{
|
|
1543
|
+
items: Asset[];
|
|
1544
|
+
}>;
|
|
1545
|
+
|
|
1546
|
+
type CreateExperienceParams = {
|
|
1547
|
+
experienceEntry: Entry;
|
|
1548
|
+
referencedEntries: Array<Entry>;
|
|
1549
|
+
referencedAssets: Array<Asset>;
|
|
1550
|
+
locale: string;
|
|
1551
|
+
};
|
|
1552
|
+
/**
|
|
1553
|
+
* Create an experience instance using a serialized version of the entity store for SSR purposes.
|
|
1554
|
+
* @param {string} json - JSON representation of the experience
|
|
1555
|
+
*/
|
|
1556
|
+
declare function createExperience(json: string): Experience<EntityStore>;
|
|
1557
|
+
/**
|
|
1558
|
+
* Create an experience instance using the already fetched entries and assets.
|
|
1559
|
+
* @param options.experienceEntry - Localized experience entry which will be rendered
|
|
1560
|
+
* @param options.referencedEntries - Array of localized entries which are referenced by the experience entry in its dataSource
|
|
1561
|
+
* @param options.referencedAssets - Array of localized assets which are referenced by the experience entry in its dataSource
|
|
1562
|
+
* @param options.locale - (Soon to be removed unused parameter)
|
|
1563
|
+
*/
|
|
1564
|
+
declare function createExperience(options: CreateExperienceParams): Experience<EntityStore>;
|
|
1565
|
+
|
|
1566
|
+
type ClientAndLocaleParams$1 = {
|
|
1567
|
+
client: ContentfulClientApi<undefined>;
|
|
1568
|
+
locale?: string;
|
|
1569
|
+
} | {
|
|
1570
|
+
client: ContentfulClientApi<'WITH_ALL_LOCALES'>;
|
|
1571
|
+
/** When fetching all locales, this may not be defined */
|
|
1572
|
+
locale?: undefined;
|
|
1573
|
+
};
|
|
1574
|
+
type FetchReferencedEntitiesArgs = {
|
|
1575
|
+
experienceEntry: Entry | ExperienceEntry;
|
|
1576
|
+
} & ClientAndLocaleParams$1;
|
|
1577
|
+
/**
|
|
1578
|
+
* Fetches all entries and assets from the `dataSource` of the given experience entry. This will
|
|
1579
|
+
* also consider deep references that are not listed explicitly but linked through deep binding paths.
|
|
1580
|
+
* @param options.client - Instantiated client from the Contentful SDK. If this is using the `withAllLocales` modifier, you may not provide a specific locale.
|
|
1581
|
+
* @param options.experienceEntry - Localized experience entry. To localize a multi locale entry, use the `localizeEntity` function.
|
|
1582
|
+
* @param options.locale - Retrieve a specific localized version of the referenced entities. Otherwise, it will fallback to the default locale.
|
|
1583
|
+
* @returns object with a list of `entries` and a list of `assets`
|
|
1584
|
+
*/
|
|
1585
|
+
declare const fetchReferencedEntities: ({ client, experienceEntry, locale, }: FetchReferencedEntitiesArgs) => Promise<{
|
|
1586
|
+
entries: Entry[];
|
|
1587
|
+
assets: Asset[];
|
|
1588
|
+
}>;
|
|
1589
|
+
|
|
1590
|
+
type ClientAndLocaleParams = {
|
|
1591
|
+
client: ContentfulClientApi<undefined>;
|
|
1592
|
+
locale?: string;
|
|
1593
|
+
} | {
|
|
1594
|
+
client: ContentfulClientApi<'WITH_ALL_LOCALES'>;
|
|
1595
|
+
/** When fetching all locales, this may not be defined */
|
|
1596
|
+
locale?: undefined;
|
|
1597
|
+
};
|
|
1598
|
+
type FetchExperienceEntryParams = {
|
|
1599
|
+
experienceTypeId: string;
|
|
1600
|
+
identifier: {
|
|
1601
|
+
slug: string;
|
|
1602
|
+
} | {
|
|
1603
|
+
id: string;
|
|
1604
|
+
};
|
|
1605
|
+
} & ClientAndLocaleParams;
|
|
1606
|
+
/**
|
|
1607
|
+
* Fetches an experience entry by its slug or id. Throws an error if there are multiple
|
|
1608
|
+
* entries with the same slug. Additionally, it resolves all nested pattern entries inside `fields.usedComponents`.
|
|
1609
|
+
* @param options.client - Instantiated client from the Contentful SDK. If this is using the `withAllLocales` modifier, you may not provide a specific locale.
|
|
1610
|
+
* @param options.locale - Provide a locale if your experience contains custom localized fields. Otherwise, it will fallback to the default locale.
|
|
1611
|
+
* @param options.experienceTypeId - id of the content type associated with the experience
|
|
1612
|
+
* @param options.identifier - identifying condition to find the correct experience entry
|
|
1613
|
+
*
|
|
1614
|
+
*/
|
|
1615
|
+
declare const fetchExperienceEntry: ({ client, experienceTypeId, locale, identifier, }: FetchExperienceEntryParams) => Promise<Entry | undefined>;
|
|
1616
|
+
|
|
1617
|
+
declare let designTokensRegistry: DesignTokensDefinition;
|
|
1618
|
+
/**
|
|
1619
|
+
* Register design tokens styling
|
|
1620
|
+
* @param designTokenDefinition - {[key:string]: Record<string, string>}
|
|
1621
|
+
* @returns void
|
|
1622
|
+
*/
|
|
1623
|
+
declare const defineDesignTokens: (designTokenDefinition: DesignTokensDefinition) => void;
|
|
1624
|
+
declare const getDesignTokenRegistration: (breakpointValue: string, variableName: string) => string;
|
|
1625
|
+
declare const resetDesignTokenRegistry: () => void;
|
|
1626
|
+
|
|
1627
|
+
declare const breakpointsRegistry: Breakpoint[];
|
|
1628
|
+
/**
|
|
1629
|
+
* Define custom breakpoints that should be used for all your experiences.
|
|
1630
|
+
* A breakpoint consists of:
|
|
1631
|
+
* - id: a unique identifier for this breakpoint
|
|
1632
|
+
* - query: a media query string that defines when this breakpoint is active
|
|
1633
|
+
* - previewSize: an optional fixed preview size to be used in the Studio editor when selecting this breakpoint
|
|
1634
|
+
* - displayName: the name to be displayed in the Studio editor for this breakpoint
|
|
1635
|
+
* - displayIcon: an optional icon to be displayed in the Studio editor for this breakpoint
|
|
1636
|
+
*
|
|
1637
|
+
* The first breakpoint must use a wildcard query (`*`) to match all sizes.
|
|
1638
|
+
*
|
|
1639
|
+
* Every subsequent breakpoint inherits the designs of the previous ones by default.
|
|
1640
|
+
*
|
|
1641
|
+
* The order of breakpoints must be either:
|
|
1642
|
+
* - desktop first: from largest to smallest, using `<` operators
|
|
1643
|
+
* - mobile first: from smallest to largest, using `>` operators
|
|
1644
|
+
*
|
|
1645
|
+
* @note changing breakpoints after you have created experiences may break those experiences
|
|
1646
|
+
* @example
|
|
1647
|
+
* defineBreakpoints([{
|
|
1648
|
+
* id: 'desktop',
|
|
1649
|
+
* query: '*',
|
|
1650
|
+
* displayName: 'Desktop',
|
|
1651
|
+
* displayIcon: 'desktop',
|
|
1652
|
+
* }, {
|
|
1653
|
+
* id: 'tablet',
|
|
1654
|
+
* query: '<992px',
|
|
1655
|
+
* displayName: 'Tablet',
|
|
1656
|
+
* displayIcon: 'tablet',
|
|
1657
|
+
* }, {
|
|
1658
|
+
* id: 'mobile',
|
|
1659
|
+
* query: '<576px',
|
|
1660
|
+
* displayName: 'Mobile',
|
|
1661
|
+
* displayIcon: 'mobile',
|
|
1662
|
+
* }]);
|
|
1663
|
+
*/
|
|
1664
|
+
declare const defineBreakpoints: (breakpoints: Breakpoint[]) => void;
|
|
1665
|
+
declare const runBreakpointsValidation: () => void;
|
|
1666
|
+
|
|
1667
|
+
declare const sdkOptionsRegistry: SdkOptions;
|
|
1668
|
+
/**
|
|
1669
|
+
* Used inside defineComponents to forward registry arguments to this registry
|
|
1670
|
+
* of SDK options.
|
|
1671
|
+
*/
|
|
1672
|
+
declare const defineSdkOptions: (options: typeof sdkOptionsRegistry) => void;
|
|
1673
|
+
declare const getSdkOptions: () => Readonly<typeof sdkOptionsRegistry>;
|
|
1674
|
+
|
|
1675
|
+
export { type AssembliesAddedPayload, type AssembliesRegisteredPayload, BREAKPOINTS_STRATEGY_DESKTOP_FIRST, BREAKPOINTS_STRATEGY_MOBILE_FIRST, type BackgroundImageAlignmentOption, type BackgroundImageOptions, type BackgroundImageScalingOption, type Binding, type BindingMap, type BindingMapByBlockId, type BoundComponentPropertyTypes, type BreakpointsStrategy, type CSSProperties, type CanvasErrorPayload, type CanvasGeometryUpdateSourceEvent, type CanvasReloadPayload, type CanvasResizedPayload, type CanvasScrollPayload, type ComponentBinding, type ComponentDefinition, type ComponentDefinitionVariable, type ComponentDefinitionVariableBase, type ComponentDefinitionVariableTypeMap, type ComponentDefinitionVariableValidation, type ComponentDragCanceledPayload, type ComponentDragEndedPayload, type ComponentDragStartedPayload, type ComponentDraggingChangedPayload, type ComponentDroppedPayload, type ComponentMoveEndedPayload, type ComponentMoveStartedPayload, type ComponentMovedPayload, type ComponentRegistration, type ComponentRegistrationOptions, type ComponentSelectedPayload, type ConnectedPayload, type ContainerStyleVariableName, type Coordinates, type DataSourceEntryValueType, DebugLogger, DeepReference, type DesignTokensDefinition, type DesignTokensPayload, type DesignVariableMap, type DesignVariableTypes, EditorModeEntityStore, type EditorProperties, type EditorPropertyNames, type EntityFromLink, EntityStore, EntityStoreBase, type Experience, type ExperienceEntry, type ExperienceFields, type ExperienceTree, type ExperienceTreeNode, type ExperienceUpdatedPayload, type Fieldset, type FnShouldFollowReferencesOfEntryField, type HoverComponentPayload, type HoveredElement, type ImageLoadingOption, type ImageObjectFitOption, type ImageObjectPositionOption, type ImageOptions, type InMemoryEntitiesPublicApi as InMemoryEntitiesService, type InMemoryEntitiesStore, type IncomingComponentDragCanceledPayload, type IncomingComponentMoveEndedPayload, type IncomingEvent, type IncomingMessage, type IncomingMouseMovePayload, type InternalEvent, type Link, MEDIA_QUERY_REGEXP, type ManagementEntity, type MouseMovePayload, type NewHoveredElementPayload, type OptimizedBackgroundImageAsset, type OptimizedImageAsset, type OutgoingEvent, type OutgoingMessage, type OutsideCanvasClickPayload, type PrebindingData, type PreboundVariable, type RawCoordinates, type RecursiveDesignTokenDefinition, type RegisteredBreakpointsPayload, type RegisteredComponentsPayload, type RequestComponentTreeUpdatePayload, type RequestEditorModePayload, type RequestEntitiesMessage, type RequestEntitiesPayload, type RequestReadOnlyModePayload, type RequestedEntitiesMessage, type RequestedEntitiesPayload, type ResolveDesignValueType, type SDKFeaturesPayload, type ScrollState, type SdkOptions, type SelectComponentPayload, type SendMessageParams, type StyleProps, type UnresolvedFieldset, type UpdateSelectedComponentCoordinatesPayload, type UpdatedEntityPayload, type ValidationOption, type VariableFormats, VisualEditorMode, addLocale, addMinHeightForEmptyStructures, breakpointsRegistry, buildCfStyles, buildStyleTag, buildTemplate, builtInStyles, calculateNodeDefaultHeight, checkIsAssemblyDefinition, checkIsAssemblyEntry, checkIsAssemblyNode, columnsBuiltInStyles, containerBuiltInStyles, createAssemblyDefinition, createExperience, debug, defineBreakpoints, defineDesignTokens, defineSdkOptions, designTokensRegistry, detachExperienceStyles, detectBreakpointsStrategy, disableDebug, dividerBuiltInStyles, doesMismatchMessageSchema, enableDebug, extractLeafLinksReferencedFromExperience, extractPrebindingDataByPatternId, extractReferencesFromEntries, extractReferencesFromEntriesAsIds, fetchAllAssets, fetchAllEntries, fetchById, fetchBySlug, fetchExperienceEntry, fetchReferencedEntities, findOutermostCoordinates, flattenDesignTokenRegistry, flattenNestedPatterns, gatherDeepPrebindingReferencesFromExperienceEntry, gatherDeepPrebindingReferencesFromPatternEntry, gatherDeepReferencesFromExperienceEntry, gatherDeepReferencesFromTree, generateDefaultDataSourceForPrebindingDefinition, generateRandomId, getActiveBreakpointIndex, getDataFromTree, getDesignTokenRegistration, getElementCoordinates, getFallbackBreakpointIndex, getPrebindingPathBySourceEntry, getSdkOptions, getTargetPatternMappingsForParameter, getTargetValueInPixels, getTemplateValue, getValueForBreakpoint, inMemoryEntities, inMemoryEntitiesStore, indexByBreakpoint, isArrayOfLinks, isAsset, isCfStyleAttribute, isComponentAllowedOnRoot, isContentfulComponent, isContentfulStructureComponent, isDeepPath, isDeepPrebinding, isElementHidden, isEntry, isExperienceEntry, isLink, isLinkToAsset, isLinkToEntry, isPatternComponent, isPatternEntry, isPreboundProp, isStructureWithRelativeHeight, isValidBreakpointValue, lastPathNamedSegmentEq, localizeEntity, maybePopulateDesignTokenValue, mediaQueryMatcher, mergeDesignValuesByBreakpoint, optionalBuiltInStyles, parseCSSValue, parseDataSourcePathIntoFieldset, parseDataSourcePathWithL1DeepBindings, referencesOf, resetDesignTokenRegistry, resolveBackgroundImageBinding, resolveHyperlinkPattern, runBreakpointsValidation, sanitizeNodeProps, sdkOptionsRegistry, sectionBuiltInStyles, sendMessage, setDebugLevel, singleColumnBuiltInStyles, splitDirectAndSlotChildren, stringifyCssProperties, toCSSAttribute, toMediaQuery, transformBoundContentValue, transformVisibility, treeMap, treeVisit, tryParseMessage, uniqueById, useInMemoryEntities, validateExperienceBuilderConfig };
|