@contentful/experiences-sdk-react 1.27.0-prerelease-20241213T0010-0475c78.0 → 1.27.1-beta.0

package/dist/blocks/preview/CompositionBlock.js

@@ -32,20 +32,17 @@ const CompositionBlock = ({ node: rawNode, locale, entityStore, hyperlinkPattern
         return registration;
     }, [isAssembly, node.definitionId]);
     const nodeProps = useMemo(() => {
+        // In SSR, we store the className under breakpoints[0] which is resolved here to the actual string
+        const cfSsrClassNameValues = node.variables.cfSsrClassName;
+        const cfSsrClassName = resolveDesignValue(cfSsrClassNameValues?.valuesByBreakpoint, 'cfSsrClassName');
         // Don't enrich the assembly wrapper node with props
         if (!componentRegistration || isAssembly) {
-            return {
-                cfSsrClassName: node.variables.cfSsrClassName
-                    ? resolveDesignValue(node.variables.cfSsrClassName.valuesByBreakpoint, 'cfSsrClassName')
-                    : undefined,
-            };
+            return { cfSsrClassName };
         }
         const propMap = {
-            cfSsrClassName: node.id
-                ? getPatternChildNodeClassName?.(node.id)
-                : node.variables.cfSsrClassName
-                    ? resolveDesignValue(node.variables.cfSsrClassName.valuesByBreakpoint, 'cfSsrClassName')
-                    : undefined,
+            cfSsrClassName: node.id && getPatternChildNodeClassName
+                ? getPatternChildNodeClassName(node.id)
+                : cfSsrClassName,
         };
         const props = Object.entries(componentRegistration.definition.variables).reduce((acc, [variableName, variableDefinition]) => {
             const variable = node.variables[variableName];
@@ -98,11 +95,13 @@ const CompositionBlock = ({ node: rawNode, locale, entityStore, hyperlinkPattern
         }
         return props;
     }, [
+        resolveDesignValue,
+        node.variables,
+        node.id,
+        node.children,
         componentRegistration,
         isAssembly,
-        node.children,
-        node.variables,
-        resolveDesignValue,
+        getPatternChildNodeClassName,
         entityStore,
         hyperlinkPattern,
         locale,
@@ -112,20 +111,22 @@ const CompositionBlock = ({ node: rawNode, locale, entityStore, hyperlinkPattern
         return null;
     }
     const { component } = componentRegistration;
+    // Retrieves the CSS class name for a given child node ID.
     const _getPatternChildNodeClassName = (childNodeId) => {
         if (isAssembly) {
             // @ts-expect-error -- property cfSsrClassName is a map (id to classNames) that is added during rendering in ssrStyles
-            const classesForNode = node.variables.cfSsrClassName[childNodeId];
-            if (classesForNode) {
-                return resolveDesignValue(classesForNode.valuesByBreakpoint, 'cfSsrClassName');
-            }
-            return;
+            const classesForNode = node.variables.cfSsrClassName?.[childNodeId];
+            if (!classesForNode)
+                return undefined;
+            return resolveDesignValue(classesForNode.valuesByBreakpoint, 'cfSsrClassName');
         }
         return getPatternChildNodeClassName?.(childNodeId);
     };
     const children = componentRegistration.definition.children === true
         ? node.children.map((childNode, index) => {
-            return (jsx(CompositionBlock, { getPatternChildNodeClassName: _getPatternChildNodeClassName, node: childNode, locale: locale, hyperlinkPattern: hyperlinkPattern, entityStore: entityStore, resolveDesignValue: resolveDesignValue }, index));
+            return (jsx(CompositionBlock, { getPatternChildNodeClassName: isAssembly || getPatternChildNodeClassName
+                    ? _getPatternChildNodeClassName
+                    : undefined, node: childNode, locale: locale, hyperlinkPattern: hyperlinkPattern, entityStore: entityStore, resolveDesignValue: resolveDesignValue }, index));
         })
         : null;
     if ([CONTENTFUL_COMPONENTS.container.id, CONTENTFUL_COMPONENTS.section.id].includes(node.definitionId)) {

package/dist/blocks/preview/CompositionBlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"CompositionBlock.js","sources":["../../../../src/blocks/preview/CompositionBlock.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport type { UnresolvedLink } from 'contentful';\nimport {\n  EntityStore,\n  resolveHyperlinkPattern,\n  sanitizeNodeProps,\n} from '@contentful/experiences-core';\nimport {\n  CONTENTFUL_COMPONENTS,\n  HYPERLINK_DEFAULT_PATTERN,\n} from '@contentful/experiences-core/constants';\nimport type {\n  ComponentTreeNode,\n  DesignValue,\n  PrimitiveValue,\n  ResolveDesignValueType,\n  StyleProps,\n} from '@contentful/experiences-core/types';\nimport { createAssemblyRegistration, getComponentRegistration } from '../../core/componentRegistry';\nimport { checkIsAssemblyNode, transformBoundContentValue } from '@contentful/experiences-core';\nimport { useClassName } from '../../hooks/useClassName';\nimport {\n  Assembly,\n  Columns,\n  ContentfulContainer,\n  SingleColumn,\n} from '@contentful/experiences-components-react';\n\nimport { resolveAssembly } from '../../core/preview/assemblyUtils';\nimport { Entry } from 'contentful';\nimport PreviewUnboundImage from './PreviewUnboundImage';\n\ntype CompositionBlockProps = {\n  node: ComponentTreeNode;\n  locale: string;\n  entityStore: EntityStore;\n  hyperlinkPattern?: string | undefined;\n  resolveDesignValue: ResolveDesignValueType;\n  getPatternChildNodeClassName?: (childNodeId: string) => string | undefined;\n};\n\nexport const CompositionBlock = ({\n  node: rawNode,\n  locale,\n  entityStore,\n  hyperlinkPattern,\n  resolveDesignValue,\n  getPatternChildNodeClassName,\n}: CompositionBlockProps) => {\n  const isAssembly = useMemo(\n    () =>\n      checkIsAssemblyNode({\n        componentId: rawNode.definitionId,\n        usedComponents: entityStore.usedComponents,\n      }),\n    [entityStore.usedComponents, rawNode.definitionId],\n  );\n\n  const node = useMemo(() => {\n    return isAssembly\n      ? resolveAssembly({\n          node: rawNode,\n          entityStore,\n        })\n      : rawNode;\n  }, [entityStore, isAssembly, rawNode]);\n\n  const componentRegistration = useMemo(() => {\n    const registration = getComponentRegistration(node.definitionId as string);\n\n    if (isAssembly && !registration) {\n      return createAssemblyRegistration({\n        definitionId: node.definitionId as string,\n        component: Assembly,\n      });\n    }\n    return registration;\n  }, [isAssembly, node.definitionId]);\n\n  const nodeProps = useMemo(() => {\n    // Don't enrich the assembly wrapper node with props\n    if (!componentRegistration || isAssembly) {\n      return {\n        cfSsrClassName: node.variables.cfSsrClassName\n          ? resolveDesignValue(\n              (node.variables.cfSsrClassName as DesignValue).valuesByBreakpoint,\n              'cfSsrClassName',\n            )\n          : undefined,\n      };\n    }\n\n    const propMap: Record<string, PrimitiveValue> = {\n      cfSsrClassName: node.id\n        ? getPatternChildNodeClassName?.(node.id)\n        : node.variables.cfSsrClassName\n          ? resolveDesignValue(\n              (node.variables.cfSsrClassName as DesignValue).valuesByBreakpoint,\n              'cfSsrClassName',\n            )\n          : undefined,\n    };\n\n    const props = Object.entries(componentRegistration.definition.variables).reduce(\n      (acc, [variableName, variableDefinition]) => {\n        const variable = node.variables[variableName];\n        if (!variable) return acc;\n\n        switch (variable.type) {\n          case 'DesignValue':\n            acc[variableName] = resolveDesignValue(variable.valuesByBreakpoint, variableName);\n            break;\n          case 'BoundValue': {\n            const [, uuid] = variable.path.split('/');\n            const binding = entityStore.dataSource[uuid] as UnresolvedLink<'Entry' | 'Asset'>;\n\n            const value = transformBoundContentValue(\n              node.variables,\n              entityStore,\n              binding,\n              resolveDesignValue,\n              variableName,\n              variableDefinition,\n              variable.path,\n            );\n            acc[variableName] = value ?? variableDefinition.defaultValue;\n            break;\n          }\n\n          case 'HyperlinkValue': {\n            const binding = entityStore.dataSource[variable.linkTargetKey];\n            const hyperlinkEntry = entityStore.getEntryOrAsset(binding, variable.linkTargetKey);\n\n            const value = resolveHyperlinkPattern(\n              componentRegistration.definition.hyperlinkPattern ||\n                hyperlinkPattern ||\n                HYPERLINK_DEFAULT_PATTERN,\n              hyperlinkEntry as Entry,\n              locale,\n            );\n            if (value) {\n              acc[variableName] = value;\n            }\n            break;\n          }\n          case 'UnboundValue': {\n            const uuid = variable.key;\n            acc[variableName] =\n              entityStore.unboundValues[uuid]?.value ?? variableDefinition.defaultValue;\n            break;\n          }\n          case 'ComponentValue':\n            // We're rendering a pattern entry. Content cannot be set for ComponentValue type properties\n            // directly in the pattern so we can safely use the default value\n            // This can either a design (style) or a content variable\n            acc[variableName] = variableDefinition.defaultValue;\n            break;\n          default:\n            break;\n        }\n        return acc;\n      },\n      propMap,\n    );\n\n    if (componentRegistration.definition.slots) {\n      for (const slotId in componentRegistration.definition.slots) {\n        const slotNode = node.children.find((child) => child.slotId === slotId);\n        if (slotNode) {\n          props[slotId] = (\n            <CompositionBlock\n              node={slotNode}\n              locale={locale}\n              hyperlinkPattern={hyperlinkPattern}\n              entityStore={entityStore}\n              resolveDesignValue={resolveDesignValue}\n            />\n          );\n        }\n      }\n    }\n\n    return props;\n  }, [\n    componentRegistration,\n    isAssembly,\n    node.children,\n    node.variables,\n    resolveDesignValue,\n    entityStore,\n    hyperlinkPattern,\n    locale,\n  ]);\n\n  const className = useClassName({ props: nodeProps, node });\n\n  if (!componentRegistration) {\n    return null;\n  }\n\n  const { component } = componentRegistration;\n\n  const _getPatternChildNodeClassName = (childNodeId: string) => {\n    if (isAssembly) {\n      // @ts-expect-error -- property cfSsrClassName is a map (id to classNames) that is added during rendering in ssrStyles\n      const classesForNode = node.variables.cfSsrClassName[childNodeId];\n      if (classesForNode) {\n        return resolveDesignValue(\n          (classesForNode as DesignValue).valuesByBreakpoint,\n          'cfSsrClassName',\n        ) as string;\n      }\n      return;\n    }\n    return getPatternChildNodeClassName?.(childNodeId);\n  };\n\n  const children =\n    componentRegistration.definition.children === true\n      ? node.children.map((childNode: ComponentTreeNode, index) => {\n          return (\n            <CompositionBlock\n              getPatternChildNodeClassName={_getPatternChildNodeClassName}\n              node={childNode}\n              key={index}\n              locale={locale}\n              hyperlinkPattern={hyperlinkPattern}\n              entityStore={entityStore}\n              resolveDesignValue={resolveDesignValue}\n            />\n          );\n        })\n      : null;\n\n  if (\n    [CONTENTFUL_COMPONENTS.container.id, CONTENTFUL_COMPONENTS.section.id].includes(\n      node.definitionId,\n    )\n  ) {\n    return (\n      <ContentfulContainer\n        editorMode={false}\n        cfHyperlink={(nodeProps as StyleProps).cfHyperlink}\n        cfOpenInNewTab={(nodeProps as StyleProps).cfOpenInNewTab}\n        className={className}>\n        {children}\n      </ContentfulContainer>\n    );\n  }\n\n  if (node.definitionId === CONTENTFUL_COMPONENTS.columns.id) {\n    return (\n      <Columns editorMode={false} className={className}>\n        {children}\n      </Columns>\n    );\n  }\n\n  if (node.definitionId === CONTENTFUL_COMPONENTS.singleColumn.id) {\n    return (\n      <SingleColumn editorMode={false} className={className}>\n        {children}\n      </SingleColumn>\n    );\n  }\n\n  if (\n    node.definitionId === CONTENTFUL_COMPONENTS.image.id &&\n    node.variables.cfImageAsset?.type === 'UnboundValue'\n  ) {\n    return <PreviewUnboundImage node={node} nodeProps={nodeProps} component={component} />;\n  }\n\n  return React.createElement(\n    component,\n    {\n      ...sanitizeNodeProps(nodeProps),\n      className,\n    },\n    children ?? (typeof nodeProps.children === 'string' ? nodeProps.children : null),\n  );\n};\n"],"names":["_jsx"],"mappings":"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"}
+{"version":3,"file":"CompositionBlock.js","sources":["../../../../src/blocks/preview/CompositionBlock.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport type { UnresolvedLink } from 'contentful';\nimport {\n  EntityStore,\n  resolveHyperlinkPattern,\n  sanitizeNodeProps,\n} from '@contentful/experiences-core';\nimport {\n  CONTENTFUL_COMPONENTS,\n  HYPERLINK_DEFAULT_PATTERN,\n} from '@contentful/experiences-core/constants';\nimport type {\n  ComponentTreeNode,\n  DesignValue,\n  PrimitiveValue,\n  ResolveDesignValueType,\n  StyleProps,\n} from '@contentful/experiences-core/types';\nimport { createAssemblyRegistration, getComponentRegistration } from '../../core/componentRegistry';\nimport { checkIsAssemblyNode, transformBoundContentValue } from '@contentful/experiences-core';\nimport { useClassName } from '../../hooks/useClassName';\nimport {\n  Assembly,\n  Columns,\n  ContentfulContainer,\n  SingleColumn,\n} from '@contentful/experiences-components-react';\n\nimport { resolveAssembly } from '../../core/preview/assemblyUtils';\nimport { Entry } from 'contentful';\nimport PreviewUnboundImage from './PreviewUnboundImage';\n\ntype CompositionBlockProps = {\n  node: ComponentTreeNode;\n  locale: string;\n  entityStore: EntityStore;\n  hyperlinkPattern?: string | undefined;\n  resolveDesignValue: ResolveDesignValueType;\n  getPatternChildNodeClassName?: (childNodeId: string) => string | undefined;\n};\n\nexport const CompositionBlock = ({\n  node: rawNode,\n  locale,\n  entityStore,\n  hyperlinkPattern,\n  resolveDesignValue,\n  getPatternChildNodeClassName,\n}: CompositionBlockProps) => {\n  const isAssembly = useMemo(\n    () =>\n      checkIsAssemblyNode({\n        componentId: rawNode.definitionId,\n        usedComponents: entityStore.usedComponents,\n      }),\n    [entityStore.usedComponents, rawNode.definitionId],\n  );\n\n  const node = useMemo(() => {\n    return isAssembly\n      ? resolveAssembly({\n          node: rawNode,\n          entityStore,\n        })\n      : rawNode;\n  }, [entityStore, isAssembly, rawNode]);\n\n  const componentRegistration = useMemo(() => {\n    const registration = getComponentRegistration(node.definitionId as string);\n\n    if (isAssembly && !registration) {\n      return createAssemblyRegistration({\n        definitionId: node.definitionId as string,\n        component: Assembly,\n      });\n    }\n    return registration;\n  }, [isAssembly, node.definitionId]);\n\n  const nodeProps = useMemo(() => {\n    // In SSR, we store the className under breakpoints[0] which is resolved here to the actual string\n    const cfSsrClassNameValues = node.variables.cfSsrClassName as DesignValue | undefined;\n    const cfSsrClassName = resolveDesignValue(\n      cfSsrClassNameValues?.valuesByBreakpoint,\n      'cfSsrClassName',\n    );\n\n    // Don't enrich the assembly wrapper node with props\n    if (!componentRegistration || isAssembly) {\n      return { cfSsrClassName };\n    }\n\n    const propMap: Record<string, PrimitiveValue> = {\n      cfSsrClassName:\n        node.id && getPatternChildNodeClassName\n          ? getPatternChildNodeClassName(node.id)\n          : cfSsrClassName,\n    };\n\n    const props = Object.entries(componentRegistration.definition.variables).reduce(\n      (acc, [variableName, variableDefinition]) => {\n        const variable = node.variables[variableName];\n        if (!variable) return acc;\n\n        switch (variable.type) {\n          case 'DesignValue':\n            acc[variableName] = resolveDesignValue(variable.valuesByBreakpoint, variableName);\n            break;\n          case 'BoundValue': {\n            const [, uuid] = variable.path.split('/');\n            const binding = entityStore.dataSource[uuid] as UnresolvedLink<'Entry' | 'Asset'>;\n\n            const value = transformBoundContentValue(\n              node.variables,\n              entityStore,\n              binding,\n              resolveDesignValue,\n              variableName,\n              variableDefinition,\n              variable.path,\n            );\n            acc[variableName] = value ?? variableDefinition.defaultValue;\n            break;\n          }\n\n          case 'HyperlinkValue': {\n            const binding = entityStore.dataSource[variable.linkTargetKey];\n            const hyperlinkEntry = entityStore.getEntryOrAsset(binding, variable.linkTargetKey);\n\n            const value = resolveHyperlinkPattern(\n              componentRegistration.definition.hyperlinkPattern ||\n                hyperlinkPattern ||\n                HYPERLINK_DEFAULT_PATTERN,\n              hyperlinkEntry as Entry,\n              locale,\n            );\n            if (value) {\n              acc[variableName] = value;\n            }\n            break;\n          }\n          case 'UnboundValue': {\n            const uuid = variable.key;\n            acc[variableName] =\n              entityStore.unboundValues[uuid]?.value ?? variableDefinition.defaultValue;\n            break;\n          }\n          case 'ComponentValue':\n            // We're rendering a pattern entry. Content cannot be set for ComponentValue type properties\n            // directly in the pattern so we can safely use the default value\n            // This can either a design (style) or a content variable\n            acc[variableName] = variableDefinition.defaultValue;\n            break;\n          default:\n            break;\n        }\n        return acc;\n      },\n      propMap,\n    );\n\n    if (componentRegistration.definition.slots) {\n      for (const slotId in componentRegistration.definition.slots) {\n        const slotNode = node.children.find((child) => child.slotId === slotId);\n        if (slotNode) {\n          props[slotId] = (\n            <CompositionBlock\n              node={slotNode}\n              locale={locale}\n              hyperlinkPattern={hyperlinkPattern}\n              entityStore={entityStore}\n              resolveDesignValue={resolveDesignValue}\n            />\n          );\n        }\n      }\n    }\n\n    return props;\n  }, [\n    resolveDesignValue,\n    node.variables,\n    node.id,\n    node.children,\n    componentRegistration,\n    isAssembly,\n    getPatternChildNodeClassName,\n    entityStore,\n    hyperlinkPattern,\n    locale,\n  ]);\n\n  const className = useClassName({ props: nodeProps, node });\n\n  if (!componentRegistration) {\n    return null;\n  }\n\n  const { component } = componentRegistration;\n\n  // Retrieves the CSS class name for a given child node ID.\n  const _getPatternChildNodeClassName = (childNodeId: string) => {\n    if (isAssembly) {\n      // @ts-expect-error -- property cfSsrClassName is a map (id to classNames) that is added during rendering in ssrStyles\n      const classesForNode: DesignValue | undefined = node.variables.cfSsrClassName?.[childNodeId];\n      if (!classesForNode) return undefined;\n      return resolveDesignValue(classesForNode.valuesByBreakpoint, 'cfSsrClassName') as string;\n    }\n    return getPatternChildNodeClassName?.(childNodeId);\n  };\n\n  const children =\n    componentRegistration.definition.children === true\n      ? node.children.map((childNode: ComponentTreeNode, index) => {\n          return (\n            <CompositionBlock\n              getPatternChildNodeClassName={\n                isAssembly || getPatternChildNodeClassName\n                  ? _getPatternChildNodeClassName\n                  : undefined\n              }\n              node={childNode}\n              key={index}\n              locale={locale}\n              hyperlinkPattern={hyperlinkPattern}\n              entityStore={entityStore}\n              resolveDesignValue={resolveDesignValue}\n            />\n          );\n        })\n      : null;\n\n  if (\n    [CONTENTFUL_COMPONENTS.container.id, CONTENTFUL_COMPONENTS.section.id].includes(\n      node.definitionId,\n    )\n  ) {\n    return (\n      <ContentfulContainer\n        editorMode={false}\n        cfHyperlink={(nodeProps as StyleProps).cfHyperlink}\n        cfOpenInNewTab={(nodeProps as StyleProps).cfOpenInNewTab}\n        className={className}>\n        {children}\n      </ContentfulContainer>\n    );\n  }\n\n  if (node.definitionId === CONTENTFUL_COMPONENTS.columns.id) {\n    return (\n      <Columns editorMode={false} className={className}>\n        {children}\n      </Columns>\n    );\n  }\n\n  if (node.definitionId === CONTENTFUL_COMPONENTS.singleColumn.id) {\n    return (\n      <SingleColumn editorMode={false} className={className}>\n        {children}\n      </SingleColumn>\n    );\n  }\n\n  if (\n    node.definitionId === CONTENTFUL_COMPONENTS.image.id &&\n    node.variables.cfImageAsset?.type === 'UnboundValue'\n  ) {\n    return <PreviewUnboundImage node={node} nodeProps={nodeProps} component={component} />;\n  }\n\n  return React.createElement(\n    component,\n    {\n      ...sanitizeNodeProps(nodeProps),\n      className,\n    },\n    children ?? (typeof nodeProps.children === 'string' ? nodeProps.children : null),\n  );\n};\n"],"names":["_jsx"],"mappings":"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"}

package/dist/hooks/useBreakpoints.js.map

@@ -1 +1 @@
-{"version":3,"file":"useBreakpoints.js","sources":["../../../src/hooks/useBreakpoints.ts"],"sourcesContent":["import type {\n  ValuesByBreakpoint,\n  Breakpoint,\n  PrimitiveValue,\n  ResolveDesignValueType,\n} from '@contentful/experiences-core/types';\nimport {\n  mediaQueryMatcher,\n  getFallbackBreakpointIndex,\n  getActiveBreakpointIndex,\n  getValueForBreakpoint,\n} from '@contentful/experiences-core';\nimport { useCallback, useEffect, useState } from 'react';\n\n// TODO: In order to support integrations without React, we should extract this heavy logic into simple\n// functions that we can reuse in other frameworks.\n\n/*\n * Registers media query change listeners for each breakpoint (except for \"*\").\n * It will always assume the last matching media query in the list. It therefore,\n * assumes that the breakpoints are sorted beginning with the default value (query: \"*\")\n * and then decending by screen width. For mobile-first designs, the order would be ascending\n */\nexport const useBreakpoints = (breakpoints: Breakpoint[]) => {\n  const [mediaQueryMatchers, initialMediaQueryMatches] = mediaQueryMatcher(breakpoints);\n\n  const [mediaQueryMatches, setMediaQueryMatches] =\n    useState<Record<string, boolean>>(initialMediaQueryMatches);\n\n  const fallbackBreakpointIndex = getFallbackBreakpointIndex(breakpoints);\n\n  // Register event listeners to update the media query states\n  useEffect(() => {\n    const eventListeners = mediaQueryMatchers.map(({ id, signal }) => {\n      const onChange = () =>\n        setMediaQueryMatches((prev) => ({\n          ...prev,\n          [id]: signal.matches,\n        }));\n      signal.addEventListener('change', onChange);\n      return onChange;\n    });\n\n    return () => {\n      eventListeners.forEach((eventListener, index) => {\n        mediaQueryMatchers[index].signal.removeEventListener('change', eventListener);\n      });\n    };\n  }, [mediaQueryMatchers]);\n\n  const activeBreakpointIndex = getActiveBreakpointIndex(\n    breakpoints,\n    mediaQueryMatches,\n    fallbackBreakpointIndex,\n  );\n\n  const resolveDesignValue: ResolveDesignValueType = useCallback(\n    (valuesByBreakpoint: ValuesByBreakpoint, variableName: string): PrimitiveValue => {\n      return getValueForBreakpoint(\n        valuesByBreakpoint,\n        breakpoints,\n        activeBreakpointIndex,\n        variableName,\n      );\n    },\n    [activeBreakpointIndex, breakpoints],\n  );\n\n  return { resolveDesignValue };\n};\n"],"names":[],"mappings":";;;AAcA;AACA;AAEA;;;;;AAKG;AACU,MAAA,cAAc,GAAG,CAAC,WAAyB,KAAI;IAC1D,MAAM,CAAC,kBAAkB,EAAE,wBAAwB,CAAC,GAAG,iBAAiB,CAAC,WAAW,CAAC,CAAC;IAEtF,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAC7C,QAAQ,CAA0B,wBAAwB,CAAC,CAAC;AAE9D,IAAA,MAAM,uBAAuB,GAAG,0BAA0B,CAAC,WAAW,CAAC,CAAC;;IAGxE,SAAS,CAAC,MAAK;AACb,QAAA,MAAM,cAAc,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,KAAI;AAC/D,YAAA,MAAM,QAAQ,GAAG,MACf,oBAAoB,CAAC,CAAC,IAAI,MAAM;AAC9B,gBAAA,GAAG,IAAI;AACP,gBAAA,CAAC,EAAE,GAAG,MAAM,CAAC,OAAO;AACrB,aAAA,CAAC,CAAC,CAAC;AACN,YAAA,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;AAC5C,YAAA,OAAO,QAAQ,CAAC;AAClB,SAAC,CAAC,CAAC;AAEH,QAAA,OAAO,MAAK;YACV,cAAc,CAAC,OAAO,CAAC,CAAC,aAAa,EAAE,KAAK,KAAI;AAC9C,gBAAA,kBAAkB,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,aAAa,CAAC,CAAC;AAChF,aAAC,CAAC,CAAC;AACL,SAAC,CAAC;AACJ,KAAC,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAC;IAEzB,MAAM,qBAAqB,GAAG,wBAAwB,CACpD,WAAW,EACX,iBAAiB,EACjB,uBAAuB,CACxB,CAAC;IAEF,MAAM,kBAAkB,GAA2B,WAAW,CAC5D,CAAC,kBAAsC,EAAE,YAAoB,KAAoB;QAC/E,OAAO,qBAAqB,CAC1B,kBAAkB,EAClB,WAAW,EACX,qBAAqB,EACrB,YAAY,CACb,CAAC;AACJ,KAAC,EACD,CAAC,qBAAqB,EAAE,WAAW,CAAC,CACrC,CAAC;IAEF,OAAO,EAAE,kBAAkB,EAAE,CAAC;AAChC;;;;"}
+{"version":3,"file":"useBreakpoints.js","sources":["../../../src/hooks/useBreakpoints.ts"],"sourcesContent":["import type { Breakpoint, ResolveDesignValueType } from '@contentful/experiences-core/types';\nimport {\n  mediaQueryMatcher,\n  getFallbackBreakpointIndex,\n  getActiveBreakpointIndex,\n  getValueForBreakpoint,\n} from '@contentful/experiences-core';\nimport { useCallback, useEffect, useState } from 'react';\n\n// TODO: In order to support integrations without React, we should extract this heavy logic into simple\n// functions that we can reuse in other frameworks.\n\n/*\n * Registers media query change listeners for each breakpoint (except for \"*\").\n * It will always assume the last matching media query in the list. It therefore,\n * assumes that the breakpoints are sorted beginning with the default value (query: \"*\")\n * and then decending by screen width. For mobile-first designs, the order would be ascending\n */\nexport const useBreakpoints = (breakpoints: Breakpoint[]) => {\n  const [mediaQueryMatchers, initialMediaQueryMatches] = mediaQueryMatcher(breakpoints);\n\n  const [mediaQueryMatches, setMediaQueryMatches] =\n    useState<Record<string, boolean>>(initialMediaQueryMatches);\n\n  const fallbackBreakpointIndex = getFallbackBreakpointIndex(breakpoints);\n\n  // Register event listeners to update the media query states\n  useEffect(() => {\n    const eventListeners = mediaQueryMatchers.map(({ id, signal }) => {\n      const onChange = () =>\n        setMediaQueryMatches((prev) => ({\n          ...prev,\n          [id]: signal.matches,\n        }));\n      signal.addEventListener('change', onChange);\n      return onChange;\n    });\n\n    return () => {\n      eventListeners.forEach((eventListener, index) => {\n        mediaQueryMatchers[index].signal.removeEventListener('change', eventListener);\n      });\n    };\n  }, [mediaQueryMatchers]);\n\n  const activeBreakpointIndex = getActiveBreakpointIndex(\n    breakpoints,\n    mediaQueryMatches,\n    fallbackBreakpointIndex,\n  );\n\n  const resolveDesignValue: ResolveDesignValueType = useCallback(\n    (valuesByBreakpoint, variableName) => {\n      return getValueForBreakpoint(\n        valuesByBreakpoint,\n        breakpoints,\n        activeBreakpointIndex,\n        variableName,\n      );\n    },\n    [activeBreakpointIndex, breakpoints],\n  );\n\n  return { resolveDesignValue };\n};\n"],"names":[],"mappings":";;;AASA;AACA;AAEA;;;;;AAKG;AACU,MAAA,cAAc,GAAG,CAAC,WAAyB,KAAI;IAC1D,MAAM,CAAC,kBAAkB,EAAE,wBAAwB,CAAC,GAAG,iBAAiB,CAAC,WAAW,CAAC,CAAC;IAEtF,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAC7C,QAAQ,CAA0B,wBAAwB,CAAC,CAAC;AAE9D,IAAA,MAAM,uBAAuB,GAAG,0BAA0B,CAAC,WAAW,CAAC,CAAC;;IAGxE,SAAS,CAAC,MAAK;AACb,QAAA,MAAM,cAAc,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,KAAI;AAC/D,YAAA,MAAM,QAAQ,GAAG,MACf,oBAAoB,CAAC,CAAC,IAAI,MAAM;AAC9B,gBAAA,GAAG,IAAI;AACP,gBAAA,CAAC,EAAE,GAAG,MAAM,CAAC,OAAO;AACrB,aAAA,CAAC,CAAC,CAAC;AACN,YAAA,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;AAC5C,YAAA,OAAO,QAAQ,CAAC;AAClB,SAAC,CAAC,CAAC;AAEH,QAAA,OAAO,MAAK;YACV,cAAc,CAAC,OAAO,CAAC,CAAC,aAAa,EAAE,KAAK,KAAI;AAC9C,gBAAA,kBAAkB,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,aAAa,CAAC,CAAC;AAChF,aAAC,CAAC,CAAC;AACL,SAAC,CAAC;AACJ,KAAC,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAC;IAEzB,MAAM,qBAAqB,GAAG,wBAAwB,CACpD,WAAW,EACX,iBAAiB,EACjB,uBAAuB,CACxB,CAAC;IAEF,MAAM,kBAAkB,GAA2B,WAAW,CAC5D,CAAC,kBAAkB,EAAE,YAAY,KAAI;QACnC,OAAO,qBAAqB,CAC1B,kBAAkB,EAClB,WAAW,EACX,qBAAqB,EACrB,YAAY,CACb,CAAC;AACJ,KAAC,EACD,CAAC,qBAAqB,EAAE,WAAW,CAAC,CACrC,CAAC;IAEF,OAAO,EAAE,kBAAkB,EAAE,CAAC;AAChC;;;;"}

package/dist/index.d.ts

@@ -8,7 +8,7 @@ import * as _contentful_experiences_core_constants from '@contentful/experiences
 export { CF_STYLE_ATTRIBUTES, CONTENTFUL_COMPONENTS, LATEST_SCHEMA_VERSION } from '@contentful/experiences-core/constants';
 import { ContentfulClientApi } from 'contentful';
 
-declare const SDK_VERSION = "1.27.0-prerelease-20241213T0010-0475c78.0";
+declare const SDK_VERSION = "1.27.1-beta.0";
 
 type ExperienceRootProps = {
     experience?: Experience<EntityStore> | string | null;

package/dist/sdkVersion.js

@@ -1,4 +1,4 @@
-const SDK_VERSION = '1.27.0-prerelease-20241213T0010-0475c78.0';
+const SDK_VERSION = '1.27.1-beta.0';
 
 export { SDK_VERSION };
 //# sourceMappingURL=sdkVersion.js.map

package/dist/sdkVersion.js.map

@@ -1 +1 @@
-{"version":3,"file":"sdkVersion.js","sources":["../../src/sdkVersion.ts"],"sourcesContent":["export const SDK_VERSION = '1.27.0-prerelease-20241213T0010-0475c78.0';\n"],"names":[],"mappings":"AAAO,MAAM,WAAW,GAAG;;;;"}
+{"version":3,"file":"sdkVersion.js","sources":["../../src/sdkVersion.ts"],"sourcesContent":["export const SDK_VERSION = '1.27.1-beta.0';\n"],"names":[],"mappings":"AAAO,MAAM,WAAW,GAAG;;;;"}

package/dist/src/sdkVersion.d.ts

@@ -1 +1 @@
-export declare const SDK_VERSION = "1.27.0-prerelease-20241213T0010-0475c78.0";
+export declare const SDK_VERSION = "1.27.1-beta.0";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@contentful/experiences-sdk-react",
-  "version": "1.27.0-prerelease-20241213T0010-0475c78.0",
+  "version": "1.27.1-beta.0",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
   "typings": "./dist/src/index.d.ts",
@@ -41,11 +41,11 @@
     "depcruise": "depcruise src"
   },
   "dependencies": {
-    "@contentful/experiences-components-react": "1.27.0-prerelease-20241213T0010-0475c78.0",
-    "@contentful/experiences-core": "1.27.0-prerelease-20241213T0010-0475c78.0",
-    "@contentful/experiences-validators": "1.27.0-prerelease-20241213T0010-0475c78.0",
-    "@contentful/experiences-visual-editor-react": "1.27.0-prerelease-20241213T0010-0475c78.0",
-    "@contentful/rich-text-types": "^17.0.0",
+    "@contentful/experiences-components-react": "1.27.1-beta.0",
+    "@contentful/experiences-core": "1.27.1-beta.0",
+    "@contentful/experiences-validators": "1.27.1-beta.0",
+    "@contentful/experiences-visual-editor-react": "1.27.1-beta.0",
+    "@contentful/rich-text-types": "^16.2.1",
     "classnames": "^2.3.2",
     "csstype": "^3.1.2",
     "immer": "^10.0.3",
@@ -102,5 +102,5 @@
     "dist",
     "package.json"
   ],
-  "gitHead": "287456bb18dba7b8de66cf5fa8367ea8b2436563"
+  "gitHead": "3ceaf5fe82a35155ae7a88fbbcc9d6087abb42bb"
 }