@contentful/experiences-sdk-react 1.0.2 → 1.0.3-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,113 +1,11 @@
1
1
  # @contentful/experiences-sdk-react
2
2
 
3
- Experience builder SDK by [Contentful](https://www.contentful.com/).
4
-
5
- ## Documentation
6
-
7
- Please find more information about this sdk [on our Wiki page](https://github.com/contentful/experience-builder/wiki)
3
+ This package provides the core SDK for Contentful Studio Experiences. It offers a set of tools and services that enable developers to build, manage, and enhance experiences.
8
4
 
9
5
  ## Installation
10
6
 
11
- ```
12
- npm install @contentful/experiences-sdk-react
13
- ```
14
-
15
- ## Example Component:
16
-
17
- ```tsx
18
- function MyButton({ buttonTitle, buttonUrl, ...props }) {
19
- // WARNING:
20
- // - you must spread the props as last argument to enable canvas interactions and proper rendering on canvas
21
- // - be sure to ensure that onClick handlers are above the {...props} spreading so that they are stubbed
22
- // during EDITOR mode
23
- return (
24
- <button onClick={() => (window.location.href = buttonUrl)} {...props}>
25
- {buttonTitle}
26
- </button>
27
- );
28
- }
29
- ```
30
-
31
- ## Setup example
32
-
33
- Please find more setup examples [on a dedicated Wiki page](https://github.com/contentful/experience-builder/wiki/Setup-examples)
34
-
35
- ```tsx
36
- import {
37
- defineComponents,
38
- defineDesignTokens,
39
- ExperienceRoot,
40
- useFetchBySlug,
41
- } from '@contentful/experiences-sdk-react';
42
-
43
- import { createClient } from 'contentful';
7
+ Please follow the guide to [Set up Experiences SDK](https://www.contentful.com/developers/docs/experiences/set-up-experiences-sdk/).
44
8
 
45
- // component example can be found at the top of this document
46
- import { MyButton } from './components/MyButton';
47
-
48
- const client = createClient({
49
- space: 'YOUR_SPACE_ID',
50
- environment: 'YOUR_ENVIRONMENT_ID',
51
- host: 'preview.contentful.com', // Supported values: 'preview.contentful.com' or 'cdn.contentful.com',
52
- accessToken: 'YOUR_PREVIEW_OR_DELIVERY_TOKEN', // needs to be preview token if host = 'preview.contentful.com' and delivery token if 'cdn.contentful.com'
53
- });
54
-
55
- // 1. Define components outside of React
56
- defineComponents([
57
- {
58
- component: MyButton, // example component defined above in this file
59
- definition: {
60
- id: 'my-button',
61
- name: 'MyButton',
62
- variables: {
63
- buttonTitle: { type: 'Text', defaultValue: 'Click me' },
64
- buttonUrl: {
65
- type: 'Text',
66
- defaultValue: 'https://www.contentful.com/',
67
- },
68
- },
69
- },
70
- },
71
- ]);
72
-
73
- // 2. Define design tokens (optional)
74
- defineDesignTokens({
75
- spacing: { XS: '4px', S: '16px', M: '32px', L: '64px', XL: '128px' },
76
- color: { Slate: '#94a3b8', Azure: 'azure', Orange: '#fdba74' },
77
- });
78
-
79
- const Home = () => {
80
-
81
- // You could pull these values from your router, state, etc...
82
- const localeCode = 'en-US'; // the initial locale to use
83
- const slug = 'homePage'; // the slug of the experience to fetch
84
- const experienceTypeId = 'layout'; // the content id of the experience to fetch
85
-
86
- // 3. Fetch the experience
87
- const { experience, error, isLoading } = useFetchBySlug({
88
- client,
89
- slug,
90
- experienceTypeId,
91
- localeCode,
92
- });
93
-
94
- // 4. Handle loading state
95
- if(isLoading) {
96
- return <div>Loading...</div>
97
- }
98
-
99
- // 5. Handle errors
100
- if (error) {
101
- return <div>{error.message}</div>;
102
- }
9
+ ## Documentation
103
10
 
104
- // 6. Render the experience
105
- return (
106
- <ExperienceRoot
107
- experience={experience}
108
- // The locale that will appear on the website first
109
- locale={locale}
110
- />
111
- );
112
- };
113
- ```
11
+ Please refer to our [Documentation](https://www.contentful.com/developers/docs/experiences/) to learn more about it.
package/dist/index.js CHANGED
@@ -9,7 +9,7 @@ import * as Components from '@contentful/experiences-components-react';
9
9
  import { ContentfulContainer, Columns, SingleColumn } from '@contentful/experiences-components-react';
10
10
  import styleInject from 'style-inject';
11
11
 
12
- const SDK_VERSION = '1.0.2-beta.1';
12
+ const SDK_VERSION = '1.0.2';
13
13
 
14
14
  var util;
15
15
  (function (util) {
@@ -4027,8 +4027,10 @@ var z = /*#__PURE__*/Object.freeze({
4027
4027
  ZodError: ZodError
4028
4028
  });
4029
4029
 
4030
- const SchemaVersions = z.union([
4031
- z.literal('2023-09-28'),
4030
+ // If more than one version is supported, use z.union
4031
+ const SchemaVersions = z.literal('2023-09-28');
4032
+ // Keep deprecated versions here just for reference
4033
+ z.union([
4032
4034
  z.literal('2023-08-23'),
4033
4035
  z.literal('2023-07-26'),
4034
4036
  z.literal('2023-06-27'),
@@ -4043,6 +4045,7 @@ const DefinitionPropertyTypeSchema = z.enum([
4043
4045
  'Location',
4044
4046
  'Media',
4045
4047
  'Object',
4048
+ 'Hyperlink',
4046
4049
  ]);
4047
4050
  const DefinitionPropertyKeySchema = z
4048
4051
  .string()
@@ -4372,7 +4375,7 @@ function withComponentWrapper(Component, options = {
4372
4375
  }
4373
4376
 
4374
4377
  // this is the array of version which currently LATEST_SCHEMA_VERSION is compatible with
4375
- const compatibleVersions = ['2023-08-23', '2023-09-28'];
4378
+ const compatibleVersions = ['2023-09-28'];
4376
4379
 
4377
4380
  const cloneObject = (targetObject) => {
4378
4381
  if (typeof structuredClone !== 'undefined') {
@@ -4923,7 +4926,7 @@ const PreviewDeliveryRoot = ({ locale, experience }) => {
4923
4926
  return null;
4924
4927
  }
4925
4928
  if (!compatibleVersions.includes(entityStore.schemaVersion)) {
4926
- console.warn(`[experiences-sdk-react] Contentful composition schema version: ${entityStore.schemaVersion} does not match the compatible schema versions: ${compatibleVersions}. Aborting.`);
4929
+ console.warn(`[experiences-sdk-react] Contentful experience schema version: ${entityStore.schemaVersion} does not match the compatible schema versions: ${compatibleVersions}. Aborting.`);
4927
4930
  return null;
4928
4931
  }
4929
4932
  return (jsx(Fragment, { children: entityStore.experienceEntryFields.componentTree.children.map((childNode, index) => (jsx(CompositionBlock, { node: childNode, locale: locale, entityStore: entityStore, resolveDesignValue: resolveDesignValue }, index))) }));