@contentful/experiences-sdk-react 1.0.2 → 1.0.3-dev-20240411T1552-43cc1cb.0

package/README.md

@@ -1,113 +1,11 @@
 # @contentful/experiences-sdk-react
 
-Experience builder SDK by [Contentful](https://www.contentful.com/).
-
-## Documentation
-
-Please find more information about this sdk [on our Wiki page](https://github.com/contentful/experience-builder/wiki)
+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.
 
 ## Installation
 
-```
-npm install @contentful/experiences-sdk-react
-```
-
-## Example Component:
-
-```tsx
-function MyButton({ buttonTitle, buttonUrl, ...props }) {
-  // WARNING:
-  //  - you must spread the props as last argument to enable canvas interactions and proper rendering on canvas
-  //  - be sure to ensure that onClick handlers are above the {...props} spreading so that they are stubbed
-  //    during EDITOR mode
-  return (
-    <button onClick={() => (window.location.href = buttonUrl)} {...props}>
-      {buttonTitle}
-    </button>
-  );
-}
-```
-
-## Setup example
-
-Please find more setup examples [on a dedicated Wiki page](https://github.com/contentful/experience-builder/wiki/Setup-examples)
-
-```tsx
-import {
-  defineComponents,
-  defineDesignTokens,
-  ExperienceRoot,
-  useFetchBySlug,
-} from '@contentful/experiences-sdk-react';
-
-import { createClient } from 'contentful';
+Please follow the guide to [Set up Experiences SDK](https://www.contentful.com/developers/docs/experiences/set-up-experiences-sdk/).
 
-// component example can be found at the top of this document
-import { MyButton } from './components/MyButton';
-
-const client = createClient({
-  space: 'YOUR_SPACE_ID',
-  environment: 'YOUR_ENVIRONMENT_ID',
-  host: 'preview.contentful.com', // Supported values: 'preview.contentful.com' or 'cdn.contentful.com',
-  accessToken: 'YOUR_PREVIEW_OR_DELIVERY_TOKEN', // needs to be preview token if host = 'preview.contentful.com' and delivery token if 'cdn.contentful.com'
-});
-
-// 1. Define components outside of React
-defineComponents([
-  {
-    component: MyButton, // example component defined above in this file
-    definition: {
-      id: 'my-button',
-      name: 'MyButton',
-      variables: {
-        buttonTitle: { type: 'Text', defaultValue: 'Click me' },
-        buttonUrl: {
-          type: 'Text',
-          defaultValue: 'https://www.contentful.com/',
-        },
-      },
-    },
-  },
-]);
-
-// 2. Define design tokens (optional)
-defineDesignTokens({
-  spacing: { XS: '4px', S: '16px', M: '32px', L: '64px', XL: '128px' },
-  color: { Slate: '#94a3b8', Azure: 'azure', Orange: '#fdba74' },
-});
-
-const Home = () => {
-
-  // You could pull these values from your router, state, etc...
-  const localeCode = 'en-US';  // the initial locale to use
-  const slug = 'homePage'; // the slug of the experience to fetch
-  const experienceTypeId = 'layout'; // the content id of the experience to fetch
-
-  // 3. Fetch the experience
-  const { experience, error, isLoading } = useFetchBySlug({
-    client,
-    slug,
-    experienceTypeId,
-    localeCode,
-  });
-
-  // 4. Handle loading state
-  if(isLoading) {
-    return <div>Loading...</div>
-  }
-
-  // 5. Handle errors
-  if (error) {
-    return <div>{error.message}</div>;
-  }
+## Documentation
 
-  // 6. Render the experience
-  return (
-    <ExperienceRoot
-      experience={experience}
-      // The locale that will appear on the website first
-      locale={locale}
-    />
-  );
-};
-```
+Please refer to our [Documentation](https://www.contentful.com/developers/docs/experiences/) to learn more about it.

package/dist/index.js

@@ -9,7 +9,7 @@ import * as Components from '@contentful/experiences-components-react';
 import { ContentfulContainer, Columns, SingleColumn } from '@contentful/experiences-components-react';
 import styleInject from 'style-inject';
 
-const SDK_VERSION = '1.0.2-beta.1';
+const SDK_VERSION = '1.0.2';
 
 var util;
 (function (util) {
@@ -4027,8 +4027,10 @@ var z = /*#__PURE__*/Object.freeze({
     ZodError: ZodError
 });
 
-const SchemaVersions = z.union([
-    z.literal('2023-09-28'),
+// If more than one version is supported, use z.union
+const SchemaVersions = z.literal('2023-09-28');
+// Keep deprecated versions here just for reference
+z.union([
     z.literal('2023-08-23'),
     z.literal('2023-07-26'),
     z.literal('2023-06-27'),
@@ -4372,7 +4374,7 @@ function withComponentWrapper(Component, options = {
 }
 
 // this is the array of version which currently LATEST_SCHEMA_VERSION is compatible with
-const compatibleVersions = ['2023-08-23', '2023-09-28'];
+const compatibleVersions = ['2023-09-28'];
 
 const cloneObject = (targetObject) => {
     if (typeof structuredClone !== 'undefined') {
@@ -4923,7 +4925,7 @@ const PreviewDeliveryRoot = ({ locale, experience }) => {
         return null;
     }
     if (!compatibleVersions.includes(entityStore.schemaVersion)) {
-        console.warn(`[experiences-sdk-react] Contentful composition schema version: ${entityStore.schemaVersion} does not match the compatible schema versions: ${compatibleVersions}. Aborting.`);
+        console.warn(`[experiences-sdk-react] Contentful experience schema version: ${entityStore.schemaVersion} does not match the compatible schema versions: ${compatibleVersions}. Aborting.`);
         return null;
     }
     return (jsx(Fragment, { children: entityStore.experienceEntryFields.componentTree.children.map((childNode, index) => (jsx(CompositionBlock, { node: childNode, locale: locale, entityStore: entityStore, resolveDesignValue: resolveDesignValue }, index))) }));