@contentful/experiences-sdk-react 3.8.10 → 3.8.11-beta.0

package/dist/core/styles/createStylesheetsForBuiltInStyles.js.map

@@ -1 +1 @@
-{"version":3,"file":"createStylesheetsForBuiltInStyles.js","sources":["../../../../src/core/styles/createStylesheetsForBuiltInStyles.ts"],"sourcesContent":["import {\n  addMinHeightForEmptyStructures,\n  designTokensRegistry,\n  flattenDesignTokenRegistry,\n  maybePopulateDesignTokenValue,\n  stringifyCssProperties,\n  buildCfStyles,\n  transformVisibility,\n} from '@contentful/experiences-core';\nimport { Breakpoint, ComponentTreeNode, PrimitiveValue } from '@contentful/experiences-core/types';\nimport md5 from 'md5';\n\nexport type ResolvedStylesheetData = Array<{\n  className: string;\n  breakpointCondition: string;\n  css: string;\n  visibilityCss?: string;\n}>;\n\n/**\n * For each provided breakpoint, create the CSS code and a unique class name.\n *\n * **Example Output:**\n * ```\n * [\n *   { className: 'cfstyles-123', breakpointCondition: '*', css: 'margin:42px;' },\n *   { className: 'cfstyles-456', breakpointCondition: '<768px', css: 'margin:13px;' },\n * ]\n * ```\n */\nexport const createStylesheetsForBuiltInStyles = ({\n  designPropertiesByBreakpoint,\n  breakpoints,\n  node,\n  patternRootNodeIdsChain,\n}: {\n  designPropertiesByBreakpoint: Record<string, Record<string, PrimitiveValue>>;\n  breakpoints: Breakpoint[];\n  node: ComponentTreeNode;\n  patternRootNodeIdsChain?: Array<string>;\n}): ResolvedStylesheetData => {\n  const flattenedDesignTokens = flattenDesignTokenRegistry(designTokensRegistry);\n\n  // When the node is hidden for any breakpoint, we need to handle this separately with a disjunct media query.\n  const isAnyVisibilityValueHidden = Object.values(designPropertiesByBreakpoint).some(\n    (designProperties) => designProperties.cfVisibility === false,\n  );\n  // We always need an explicit value when using disjunct media queries\n  // Example: desktop uses \"false\" and tablet is undefined -> we need to set `display: none` for tablet as well.\n  let previousVisibilityValue: boolean | undefined;\n\n  const result: Array<{\n    className: string;\n    breakpointCondition: string;\n    css: string;\n    visibilityCss?: string;\n  }> = [];\n\n  for (const breakpoint of breakpoints) {\n    let visibilityCss: string | undefined;\n    const designProperties = designPropertiesByBreakpoint[breakpoint.id];\n    if (!designProperties && !isAnyVisibilityValueHidden) {\n      continue;\n    }\n\n    const designPropertiesWithResolvedDesignTokens = Object.entries(designProperties ?? {}).reduce(\n      (acc, [propertyName, value]) => ({\n        ...acc,\n        [propertyName]: maybePopulateDesignTokenValue(\n          propertyName,\n          value,\n          flattenedDesignTokens,\n        ) as string,\n      }),\n      {} as Record<string, PrimitiveValue>,\n    );\n    /* [Data Format] `designPropertiesWithResolvedDesignTokens` is a map of property name to plain design value:\n     * designPropertiesWithResolvedDesignTokens = {\n     *   cfMargin: '42px',\n     *   cfBackgroundColor: 'rgba(246, 246, 246, 1)',\n     * }\n     */\n\n    // Special case for visibility to override any custom `display` values but only for a specific breakpoint.\n    if (isAnyVisibilityValueHidden) {\n      const visibilityValue =\n        (designPropertiesWithResolvedDesignTokens.cfVisibility as boolean | undefined) ??\n        previousVisibilityValue;\n      previousVisibilityValue = visibilityValue;\n      const visibilityStyles = transformVisibility(visibilityValue);\n      visibilityCss = stringifyCssProperties(visibilityStyles);\n    }\n\n    // Convert CF-specific property names to CSS variables, e.g. `cfMargin` -> `margin`\n    const cfStyles = addMinHeightForEmptyStructures(\n      buildCfStyles(designPropertiesWithResolvedDesignTokens),\n      node,\n    );\n    /* [Data Format] `cfStyles` follows the shape of CSSProperties (camelCased CSS property names):\n     * cfStyles = {\n     *   margin: '42px',\n     *   backgroundColor: 'rgba(246, 246, 246, 1)',\n     * }\n     */\n\n    // Translate the map of CSSProperties into the final shape of CSS code for this specific breakpoint\n    const breakpointCss = stringifyCssProperties(cfStyles);\n    /* [Data Format] `breakpointCss`:\n     * breakpointCss = \"margin:42px;background-color:rgba(246, 246, 246, 1);\"\n     */\n\n    // When visibility is involved, include the breakpoint ID to prevent hash collisions between\n    // breakpoints that share the same (empty) CSS — otherwise convertResolvedDesignValuesToMediaQuery\n    // deduplicates them and the visibility media queries for narrower breakpoints are never emitted.\n    const breakpointSegment = isAnyVisibilityValueHidden ? breakpoint.id : '';\n    const styleHash = patternRootNodeIdsChain\n      ? md5(\n          [\n            ...patternRootNodeIdsChain,\n            node.id,\n            breakpointSegment,\n            breakpointCss,\n            visibilityCss,\n          ].join('-'),\n        )\n      : md5(`${node.id}-${breakpointSegment}-${breakpointCss}-${visibilityCss}`);\n\n    // Create a CSS className with internal prefix to make sure the value can be processed\n    const className = `cfstyles-${styleHash}`;\n\n    result.push({\n      className,\n      breakpointCondition: breakpoint.query,\n      css: breakpointCss,\n      visibilityCss,\n    });\n  }\n\n  return result;\n};\n"],"names":[],"mappings":";;;AAmBA;;;;;;;;;;AAUG;AACI,MAAM,iCAAiC,GAAG,CAAC,EAChD,4BAA4B,EAC5B,WAAW,EACX,IAAI,EACJ,uBAAuB,GAMxB,KAA4B;AAC3B,IAAA,MAAM,qBAAqB,GAAG,0BAA0B,CAAC,oBAAoB,CAAC,CAAC;;IAG/E,MAAM,0BAA0B,GAAG,MAAM,CAAC,MAAM,CAAC,4BAA4B,CAAC,CAAC,IAAI,CACjF,CAAC,gBAAgB,KAAK,gBAAgB,CAAC,YAAY,KAAK,KAAK,CAC9D,CAAC;;;AAGF,IAAA,IAAI,uBAA4C,CAAC;IAEjD,MAAM,MAAM,GAKP,EAAE,CAAC;AAER,IAAA,KAAK,MAAM,UAAU,IAAI,WAAW,EAAE;AACpC,QAAA,IAAI,aAAiC,CAAC;QACtC,MAAM,gBAAgB,GAAG,4BAA4B,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;AACrE,QAAA,IAAI,CAAC,gBAAgB,IAAI,CAAC,0BAA0B,EAAE;YACpD,SAAS;SACV;QAED,MAAM,wCAAwC,GAAG,MAAM,CAAC,OAAO,CAAC,gBAAgB,IAAI,EAAE,CAAC,CAAC,MAAM,CAC5F,CAAC,GAAG,EAAE,CAAC,YAAY,EAAE,KAAK,CAAC,MAAM;AAC/B,YAAA,GAAG,GAAG;YACN,CAAC,YAAY,GAAG,6BAA6B,CAC3C,YAAY,EACZ,KAAK,EACL,qBAAqB,CACZ;SACZ,CAAC,EACF,EAAoC,CACrC,CAAC;AACF;;;;;AAKG;;QAGH,IAAI,0BAA0B,EAAE;AAC9B,YAAA,MAAM,eAAe,GAClB,wCAAwC,CAAC,YAAoC;AAC9E,gBAAA,uBAAuB,CAAC;YAC1B,uBAAuB,GAAG,eAAe,CAAC;AAC1C,YAAA,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,eAAe,CAAC,CAAC;AAC9D,YAAA,aAAa,GAAG,sBAAsB,CAAC,gBAAgB,CAAC,CAAC;SAC1D;;QAGD,MAAM,QAAQ,GAAG,8BAA8B,CAC7C,aAAa,CAAC,wCAAwC,CAAC,EACvD,IAAI,CACL,CAAC;AACF;;;;;AAKG;;AAGH,QAAA,MAAM,aAAa,GAAG,sBAAsB,CAAC,QAAQ,CAAC,CAAC;AACvD;;AAEG;;;;AAKH,QAAA,MAAM,iBAAiB,GAAG,0BAA0B,GAAG,UAAU,CAAC,EAAE,GAAG,EAAE,CAAC;QAC1E,MAAM,SAAS,GAAG,uBAAuB;cACrC,GAAG,CACD;AACE,gBAAA,GAAG,uBAAuB;AAC1B,gBAAA,IAAI,CAAC,EAAE;gBACP,iBAAiB;gBACjB,aAAa;gBACb,aAAa;AACd,aAAA,CAAC,IAAI,CAAC,GAAG,CAAC,CACZ;AACH,cAAE,GAAG,CAAC,CAAA,EAAG,IAAI,CAAC,EAAE,CAAI,CAAA,EAAA,iBAAiB,IAAI,aAAa,CAAA,CAAA,EAAI,aAAa,CAAA,CAAE,CAAC,CAAC;;AAG7E,QAAA,MAAM,SAAS,GAAG,CAAY,SAAA,EAAA,SAAS,EAAE,CAAC;QAE1C,MAAM,CAAC,IAAI,CAAC;YACV,SAAS;YACT,mBAAmB,EAAE,UAAU,CAAC,KAAK;AACrC,YAAA,GAAG,EAAE,aAAa;YAClB,aAAa;AACd,SAAA,CAAC,CAAC;KACJ;AAED,IAAA,OAAO,MAAM,CAAC;AAChB;;;;"}
+{"version":3,"file":"createStylesheetsForBuiltInStyles.js","sources":["../../../../src/core/styles/createStylesheetsForBuiltInStyles.ts"],"sourcesContent":["import {\n  addMinHeightForEmptyStructures,\n  designTokensRegistry,\n  flattenDesignTokenRegistry,\n  maybePopulateDesignTokenValue,\n  stringifyCssProperties,\n  buildCfStyles,\n  transformVisibility,\n} from '@contentful/experiences-core';\nimport { Breakpoint, ComponentTreeNode, PrimitiveValue } from '@contentful/experiences-core/types';\nimport md5 from 'md5';\n\nexport type ResolvedStylesheetData = Array<{\n  className: string;\n  breakpointCondition: string;\n  css: string;\n  visibilityCss?: string;\n}>;\n\n/**\n * For each provided breakpoint, create the CSS code and a unique class name.\n *\n * **Example Output:**\n * ```\n * [\n *   { className: 'cfstyles-123', breakpointCondition: '*', css: 'margin:42px;' },\n *   { className: 'cfstyles-456', breakpointCondition: '<768px', css: 'margin:13px;' },\n * ]\n * ```\n */\nexport const createStylesheetsForBuiltInStyles = ({\n  designPropertiesByBreakpoint,\n  breakpoints,\n  node,\n  patternRootNodeIdsChain,\n}: {\n  designPropertiesByBreakpoint: Record<string, Record<string, PrimitiveValue>>;\n  breakpoints: Breakpoint[];\n  node: ComponentTreeNode;\n  patternRootNodeIdsChain?: Array<string>;\n}): ResolvedStylesheetData => {\n  const flattenedDesignTokens = flattenDesignTokenRegistry(designTokensRegistry);\n\n  // When the node is hidden for any breakpoint, we need to handle this separately with a disjunct media query.\n  const isAnyVisibilityValueHidden = Object.values(designPropertiesByBreakpoint).some(\n    (designProperties) => designProperties.cfVisibility === false,\n  );\n  // We always need an explicit value when using disjunct media queries\n  // Example: desktop uses \"false\" and tablet is undefined -> we need to set `display: none` for tablet as well.\n  let previousVisibilityValue: boolean | undefined;\n\n  const result: Array<{\n    className: string;\n    breakpointCondition: string;\n    css: string;\n    visibilityCss?: string;\n  }> = [];\n\n  for (const breakpoint of breakpoints) {\n    let visibilityCss: string | undefined;\n    const designProperties = designPropertiesByBreakpoint[breakpoint.id];\n    if (!designProperties && !isAnyVisibilityValueHidden) {\n      continue;\n    }\n\n    const designPropertiesWithResolvedDesignTokens = Object.entries(designProperties ?? {}).reduce(\n      (acc, [propertyName, value]) => ({\n        ...acc,\n        [propertyName]: maybePopulateDesignTokenValue(\n          propertyName,\n          value,\n          flattenedDesignTokens,\n        ) as string,\n      }),\n      {} as Record<string, PrimitiveValue>,\n    );\n    /* [Data Format] `designPropertiesWithResolvedDesignTokens` is a map of property name to plain design value:\n     * designPropertiesWithResolvedDesignTokens = {\n     *   cfMargin: '42px',\n     *   cfBackgroundColor: 'rgba(246, 246, 246, 1)',\n     * }\n     */\n\n    // Special case for visibility to override any custom `display` values but only for a specific breakpoint.\n    if (isAnyVisibilityValueHidden) {\n      const visibilityValue =\n        (designPropertiesWithResolvedDesignTokens.cfVisibility as boolean | undefined) ??\n        previousVisibilityValue;\n      previousVisibilityValue = visibilityValue;\n      const visibilityStyles = transformVisibility(visibilityValue);\n      visibilityCss = stringifyCssProperties(visibilityStyles);\n    }\n\n    // Convert CF-specific property names to CSS variables, e.g. `cfMargin` -> `margin`\n    const cfStyles = addMinHeightForEmptyStructures(\n      buildCfStyles(designPropertiesWithResolvedDesignTokens),\n      node,\n    );\n    /* [Data Format] `cfStyles` follows the shape of CSSProperties (camelCased CSS property names):\n     * cfStyles = {\n     *   margin: '42px',\n     *   backgroundColor: 'rgba(246, 246, 246, 1)',\n     * }\n     */\n\n    // Translate the map of CSSProperties into the final shape of CSS code for this specific breakpoint\n    const breakpointCss = stringifyCssProperties(cfStyles);\n    /* [Data Format] `breakpointCss`:\n     * breakpointCss = \"margin:42px;background-color:rgba(246, 246, 246, 1);\"\n     */\n\n    // When visibility is involved, include the breakpoint ID to prevent hash collisions between\n    // breakpoints that share the same (empty) CSS — otherwise convertResolvedDesignValuesToMediaQuery\n    // deduplicates them and the visibility media queries for narrower breakpoints are never emitted.\n    const breakpointSegment = isAnyVisibilityValueHidden ? breakpoint.id : '';\n    const styleHash = patternRootNodeIdsChain\n      ? md5(\n          [\n            ...patternRootNodeIdsChain,\n            node.id,\n            breakpointSegment,\n            breakpointCss,\n            visibilityCss,\n          ].join('-'),\n        )\n      : md5(`${node.id}-${breakpointSegment}-${breakpointCss}-${visibilityCss}`);\n\n    // Create a CSS className with internal prefix to make sure the value can be processed\n    const className = `cfstyles-${styleHash}`;\n\n    result.push({\n      className,\n      breakpointCondition: breakpoint.query,\n      css: breakpointCss,\n      visibilityCss,\n    });\n  }\n\n  return result;\n};\n"],"names":[],"mappings":";;;AAmBA;;;;;;;;;;AAUG;AACI,MAAM,iCAAiC,GAAG,CAAC,EAChD,4BAA4B,EAC5B,WAAW,EACX,IAAI,EACJ,uBAAuB,GAMxB,KAA4B;AAC3B,IAAA,MAAM,qBAAqB,GAAG,0BAA0B,CAAC,oBAAoB,CAAC;;IAG9E,MAAM,0BAA0B,GAAG,MAAM,CAAC,MAAM,CAAC,4BAA4B,CAAC,CAAC,IAAI,CACjF,CAAC,gBAAgB,KAAK,gBAAgB,CAAC,YAAY,KAAK,KAAK,CAC9D;;;AAGD,IAAA,IAAI,uBAA4C;IAEhD,MAAM,MAAM,GAKP,EAAE;AAEP,IAAA,KAAK,MAAM,UAAU,IAAI,WAAW,EAAE;AACpC,QAAA,IAAI,aAAiC;QACrC,MAAM,gBAAgB,GAAG,4BAA4B,CAAC,UAAU,CAAC,EAAE,CAAC;AACpE,QAAA,IAAI,CAAC,gBAAgB,IAAI,CAAC,0BAA0B,EAAE;YACpD;QACF;QAEA,MAAM,wCAAwC,GAAG,MAAM,CAAC,OAAO,CAAC,gBAAgB,IAAI,EAAE,CAAC,CAAC,MAAM,CAC5F,CAAC,GAAG,EAAE,CAAC,YAAY,EAAE,KAAK,CAAC,MAAM;AAC/B,YAAA,GAAG,GAAG;YACN,CAAC,YAAY,GAAG,6BAA6B,CAC3C,YAAY,EACZ,KAAK,EACL,qBAAqB,CACZ;SACZ,CAAC,EACF,EAAoC,CACrC;AACD;;;;;AAKG;;QAGH,IAAI,0BAA0B,EAAE;AAC9B,YAAA,MAAM,eAAe,GAClB,wCAAwC,CAAC,YAAoC;AAC9E,gBAAA,uBAAuB;YACzB,uBAAuB,GAAG,eAAe;AACzC,YAAA,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,eAAe,CAAC;AAC7D,YAAA,aAAa,GAAG,sBAAsB,CAAC,gBAAgB,CAAC;QAC1D;;QAGA,MAAM,QAAQ,GAAG,8BAA8B,CAC7C,aAAa,CAAC,wCAAwC,CAAC,EACvD,IAAI,CACL;AACD;;;;;AAKG;;AAGH,QAAA,MAAM,aAAa,GAAG,sBAAsB,CAAC,QAAQ,CAAC;AACtD;;AAEG;;;;AAKH,QAAA,MAAM,iBAAiB,GAAG,0BAA0B,GAAG,UAAU,CAAC,EAAE,GAAG,EAAE;QACzE,MAAM,SAAS,GAAG;cACd,GAAG,CACD;AACE,gBAAA,GAAG,uBAAuB;AAC1B,gBAAA,IAAI,CAAC,EAAE;gBACP,iBAAiB;gBACjB,aAAa;gBACb,aAAa;AACd,aAAA,CAAC,IAAI,CAAC,GAAG,CAAC;AAEf,cAAE,GAAG,CAAC,CAAA,EAAG,IAAI,CAAC,EAAE,CAAA,CAAA,EAAI,iBAAiB,IAAI,aAAa,CAAA,CAAA,EAAI,aAAa,CAAA,CAAE,CAAC;;AAG5E,QAAA,MAAM,SAAS,GAAG,CAAA,SAAA,EAAY,SAAS,EAAE;QAEzC,MAAM,CAAC,IAAI,CAAC;YACV,SAAS;YACT,mBAAmB,EAAE,UAAU,CAAC,KAAK;AACrC,YAAA,GAAG,EAAE,aAAa;YAClB,aAAa;AACd,SAAA,CAAC;IACJ;AAEA,IAAA,OAAO,MAAM;AACf;;"}

package/dist/hooks/useBreakpoints.js.map

@@ -1 +1 @@
-{"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 [mediaQueryMatches, setMediaQueryMatches] = useState<Record<string, boolean>>({});\n\n  // Register event listeners to update the media query states\n  useEffect(() => {\n    const [mediaQueryMatchers, initialMediaQueryMatches] = mediaQueryMatcher(breakpoints);\n\n    setMediaQueryMatches(initialMediaQueryMatches);\n\n    const eventListeners = mediaQueryMatchers.map(({ id, signal }) => {\n      const onChange = () =>\n        setMediaQueryMatches((prev) => ({\n          ...prev,\n          [id]: signal.matches,\n        }));\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  }, [breakpoints]);\n\n  const resolveDesignValue: ResolveDesignValueType = useCallback(\n    (valuesByBreakpoint, propertyName) => {\n      const fallbackBreakpointIndex = getFallbackBreakpointIndex(breakpoints);\n\n      const activeBreakpointIndex = getActiveBreakpointIndex(\n        breakpoints,\n        mediaQueryMatches,\n        fallbackBreakpointIndex,\n      );\n\n      return getValueForBreakpoint(\n        valuesByBreakpoint,\n        breakpoints,\n        activeBreakpointIndex,\n        fallbackBreakpointIndex,\n        propertyName,\n      );\n    },\n    [mediaQueryMatches, breakpoints],\n  );\n\n  return { resolveDesignValue };\n};\n"],"names":[],"mappings":";;;AASA;AACA;AAEA;;;;;AAKG;AACU,MAAA,cAAc,GAAG,CAAC,WAAyB,KAAI;IAC1D,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAA0B,EAAE,CAAC,CAAC;;IAGxF,SAAS,CAAC,MAAK;QACb,MAAM,CAAC,kBAAkB,EAAE,wBAAwB,CAAC,GAAG,iBAAiB,CAAC,WAAW,CAAC,CAAC;QAEtF,oBAAoB,CAAC,wBAAwB,CAAC,CAAC;AAE/C,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;AAEN,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,WAAW,CAAC,CAAC,CAAC;IAElB,MAAM,kBAAkB,GAA2B,WAAW,CAC5D,CAAC,kBAAkB,EAAE,YAAY,KAAI;AACnC,QAAA,MAAM,uBAAuB,GAAG,0BAA0B,CAAC,WAAW,CAAC,CAAC;QAExE,MAAM,qBAAqB,GAAG,wBAAwB,CACpD,WAAW,EACX,iBAAiB,EACjB,uBAAuB,CACxB,CAAC;AAEF,QAAA,OAAO,qBAAqB,CAC1B,kBAAkB,EAClB,WAAW,EACX,qBAAqB,EACrB,uBAAuB,EACvB,YAAY,CACb,CAAC;AACJ,KAAC,EACD,CAAC,iBAAiB,EAAE,WAAW,CAAC,CACjC,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 [mediaQueryMatches, setMediaQueryMatches] = useState<Record<string, boolean>>({});\n\n  // Register event listeners to update the media query states\n  useEffect(() => {\n    const [mediaQueryMatchers, initialMediaQueryMatches] = mediaQueryMatcher(breakpoints);\n\n    setMediaQueryMatches(initialMediaQueryMatches);\n\n    const eventListeners = mediaQueryMatchers.map(({ id, signal }) => {\n      const onChange = () =>\n        setMediaQueryMatches((prev) => ({\n          ...prev,\n          [id]: signal.matches,\n        }));\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  }, [breakpoints]);\n\n  const resolveDesignValue: ResolveDesignValueType = useCallback(\n    (valuesByBreakpoint, propertyName) => {\n      const fallbackBreakpointIndex = getFallbackBreakpointIndex(breakpoints);\n\n      const activeBreakpointIndex = getActiveBreakpointIndex(\n        breakpoints,\n        mediaQueryMatches,\n        fallbackBreakpointIndex,\n      );\n\n      return getValueForBreakpoint(\n        valuesByBreakpoint,\n        breakpoints,\n        activeBreakpointIndex,\n        fallbackBreakpointIndex,\n        propertyName,\n      );\n    },\n    [mediaQueryMatches, breakpoints],\n  );\n\n  return { resolveDesignValue };\n};\n"],"names":[],"mappings":";;;AASA;AACA;AAEA;;;;;AAKG;AACI,MAAM,cAAc,GAAG,CAAC,WAAyB,KAAI;IAC1D,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAA0B,EAAE,CAAC;;IAGvF,SAAS,CAAC,MAAK;QACb,MAAM,CAAC,kBAAkB,EAAE,wBAAwB,CAAC,GAAG,iBAAiB,CAAC,WAAW,CAAC;QAErF,oBAAoB,CAAC,wBAAwB,CAAC;AAE9C,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;AAEL,YAAA,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,QAAQ,CAAC;AAC3C,YAAA,OAAO,QAAQ;AACjB,QAAA,CAAC,CAAC;AAEF,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;AAC/E,YAAA,CAAC,CAAC;AACJ,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC;IAEjB,MAAM,kBAAkB,GAA2B,WAAW,CAC5D,CAAC,kBAAkB,EAAE,YAAY,KAAI;AACnC,QAAA,MAAM,uBAAuB,GAAG,0BAA0B,CAAC,WAAW,CAAC;QAEvE,MAAM,qBAAqB,GAAG,wBAAwB,CACpD,WAAW,EACX,iBAAiB,EACjB,uBAAuB,CACxB;AAED,QAAA,OAAO,qBAAqB,CAC1B,kBAAkB,EAClB,WAAW,EACX,qBAAqB,EACrB,uBAAuB,EACvB,YAAY,CACb;AACH,IAAA,CAAC,EACD,CAAC,iBAAiB,EAAE,WAAW,CAAC,CACjC;IAED,OAAO,EAAE,kBAAkB,EAAE;AAC/B;;"}

package/dist/hooks/useCustomFetch.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCustomFetch.js","sources":["../../../src/hooks/useCustomFetch.ts"],"sourcesContent":["import { useCallback } from 'react';\nimport { useFetchByBase } from './useFetchByBase';\nimport { useDetectCanvasMode } from './useDetectCanvasMode';\nimport { Experience } from '@contentful/experiences-core/types';\nimport { EntityStore } from '@contentful/experiences-core';\n\nexport type UseCustomFetchArgs = {\n  fetchFn: () => Promise<Experience<EntityStore> | undefined>;\n  /** The pattern being used to generate links for hyperlink properties **/\n  hyperlinkPattern?: string;\n};\n\n/**\n * A hook that allows specifying a custom fetch function to retrieve an experience with all its references.\n * @param options.fetchFn - A function that returns a promise resolving to an experience instance created with `createExperience()`\n * @param options.hyperlinkPattern - URL Pattern for generating links for hyperlink properties on nodes pointing to other experience pages\n * @returns loading state, error message, and the experience instance that needs to be passed to `<ExperienceRoot>`\n */\nexport const useCustomFetch = ({ fetchFn, hyperlinkPattern }: UseCustomFetchArgs) => {\n  const mode = useDetectCanvasMode({ isClientSide: typeof window !== 'undefined' });\n\n  const fetchMethod = useCallback(() => {\n    return fetchFn();\n    // we purposely don't want to include the client in the dependencies as it can cause infinite loops if the\n    // user creates the client in the component\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const fetchResult = useFetchByBase(fetchMethod, mode);\n\n  return { ...fetchResult, experience: { ...fetchResult.experience, hyperlinkPattern } };\n};\n"],"names":[],"mappings":";;;;AAYA;;;;;AAKG;AACU,MAAA,cAAc,GAAG,CAAC,EAAE,OAAO,EAAE,gBAAgB,EAAsB,KAAI;AAClF,IAAA,MAAM,IAAI,GAAG,mBAAmB,CAAC,EAAE,YAAY,EAAE,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC,CAAC;AAElF,IAAA,MAAM,WAAW,GAAG,WAAW,CAAC,MAAK;QACnC,OAAO,OAAO,EAAE,CAAC;;;;KAIlB,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,WAAW,GAAG,cAAc,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC;AAEtD,IAAA,OAAO,EAAE,GAAG,WAAW,EAAE,UAAU,EAAE,EAAE,GAAG,WAAW,CAAC,UAAU,EAAE,gBAAgB,EAAE,EAAE,CAAC;AACzF;;;;"}
+{"version":3,"file":"useCustomFetch.js","sources":["../../../src/hooks/useCustomFetch.ts"],"sourcesContent":["import { useCallback } from 'react';\nimport { useFetchByBase } from './useFetchByBase';\nimport { useDetectCanvasMode } from './useDetectCanvasMode';\nimport { Experience } from '@contentful/experiences-core/types';\nimport { EntityStore } from '@contentful/experiences-core';\n\nexport type UseCustomFetchArgs = {\n  fetchFn: () => Promise<Experience<EntityStore> | undefined>;\n  /** The pattern being used to generate links for hyperlink properties **/\n  hyperlinkPattern?: string;\n};\n\n/**\n * A hook that allows specifying a custom fetch function to retrieve an experience with all its references.\n * @param options.fetchFn - A function that returns a promise resolving to an experience instance created with `createExperience()`\n * @param options.hyperlinkPattern - URL Pattern for generating links for hyperlink properties on nodes pointing to other experience pages\n * @returns loading state, error message, and the experience instance that needs to be passed to `<ExperienceRoot>`\n */\nexport const useCustomFetch = ({ fetchFn, hyperlinkPattern }: UseCustomFetchArgs) => {\n  const mode = useDetectCanvasMode({ isClientSide: typeof window !== 'undefined' });\n\n  const fetchMethod = useCallback(() => {\n    return fetchFn();\n    // we purposely don't want to include the client in the dependencies as it can cause infinite loops if the\n    // user creates the client in the component\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const fetchResult = useFetchByBase(fetchMethod, mode);\n\n  return { ...fetchResult, experience: { ...fetchResult.experience, hyperlinkPattern } };\n};\n"],"names":[],"mappings":";;;;AAYA;;;;;AAKG;AACI,MAAM,cAAc,GAAG,CAAC,EAAE,OAAO,EAAE,gBAAgB,EAAsB,KAAI;AAClF,IAAA,MAAM,IAAI,GAAG,mBAAmB,CAAC,EAAE,YAAY,EAAE,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;AAEjF,IAAA,MAAM,WAAW,GAAG,WAAW,CAAC,MAAK;QACnC,OAAO,OAAO,EAAE;;;;IAIlB,CAAC,EAAE,EAAE,CAAC;IAEN,MAAM,WAAW,GAAG,cAAc,CAAC,WAAW,EAAE,IAAI,CAAC;AAErD,IAAA,OAAO,EAAE,GAAG,WAAW,EAAE,UAAU,EAAE,EAAE,GAAG,WAAW,CAAC,UAAU,EAAE,gBAAgB,EAAE,EAAE;AACxF;;"}

package/dist/hooks/useDetectCanvasMode.js

@@ -76,7 +76,7 @@ function inIframe() {
     try {
         return window.self !== window.top;
     }
-    catch (e) {
+    catch {
         return false;
     }
 }

package/dist/hooks/useDetectCanvasMode.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDetectCanvasMode.js","sources":["../../../src/hooks/useDetectCanvasMode.tsx"],"sourcesContent":["'use client';\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport {\n  doesMismatchMessageSchema,\n  sendMessage,\n  tryParseMessage,\n} from '@contentful/experiences-core';\nimport {\n  INCOMING_EVENTS,\n  OUTGOING_EVENTS,\n  StudioCanvasMode,\n} from '@contentful/experiences-core/constants';\nimport { sdkFeatures } from '../core/sdkFeatures';\n\ntype useDetectCanvasModeArgs = {\n  /** If running from a known client side only situation (ie: useFetchBySlug),\n   * set this to true to kick in editor mode check sooner (which avoids a render cycle) */\n  isClientSide?: boolean;\n};\n\nexport const useDetectCanvasMode = ({ isClientSide = false }: useDetectCanvasModeArgs = {}) => {\n  const [mounted, setMounted] = useState(false);\n  const receivedModeMessage = useRef(false);\n  const [mode, setMode] = useState<StudioCanvasMode>(() => {\n    // if we are client side and running in an iframe, then initialize to read only,\n    // Editor mode can be requested later.\n    if (isClientSide && inIframe()) {\n      return StudioCanvasMode.READ_ONLY;\n    } else {\n      return StudioCanvasMode.NONE;\n    }\n  });\n\n  const onMessage = useCallback((event: MessageEvent) => {\n    if (doesMismatchMessageSchema(event)) {\n      return;\n    }\n    const eventData = tryParseMessage(event);\n    const isRequestingCanvasMode =\n      eventData.eventType === INCOMING_EVENTS.RequestEditorMode ||\n      eventData.eventType === INCOMING_EVENTS.RequestReadOnlyMode;\n\n    if (!isRequestingCanvasMode) {\n      return;\n    }\n\n    const isEditorMode = eventData.eventType === INCOMING_EVENTS.RequestEditorMode;\n    const mode = isEditorMode ? StudioCanvasMode.EDITOR : StudioCanvasMode.READ_ONLY;\n\n    receivedModeMessage.current = true;\n    setMode(mode);\n\n    if (typeof window !== 'undefined') {\n      // Once we definitely know that we are in editor mode, we set this flag so future postMessage connect calls are not made\n      if (!window.__EB__) {\n        window.__EB__ = {};\n      }\n      window.__EB__.isReadOnlyMode = !isEditorMode;\n      window.__EB__.isEditorMode = isEditorMode;\n    }\n\n    window.removeEventListener('message', onMessage);\n  }, []);\n\n  useEffect(() => {\n    const handleHandshakeTimeout = () => {\n      if (!receivedModeMessage.current) {\n        setMode(StudioCanvasMode.NONE);\n      }\n    };\n\n    // Only run check after component is mounted on the client to avoid hydration ssr issues\n    if (mounted) {\n      // Double check if we are in editor mode by listening to postMessage events\n      if (typeof window !== 'undefined') {\n        window.addEventListener('message', onMessage);\n        sendMessage(OUTGOING_EVENTS.Connected, undefined);\n        sendMessage(OUTGOING_EVENTS.SDKFeatures, sdkFeatures);\n\n        // If in iframe, we wait long to avoid setting preview mode accidentally in editor mode\n        // when switching from v2 to v3\n        const handshakeDelay = inIframe() ? 2000 : 100;\n\n        // FIXME: This causes a race condition by setting the mode sometimes to NONE when\n        // reloading the canvas due to a save event.\n        const handshakeTimeout = setTimeout(handleHandshakeTimeout, handshakeDelay);\n\n        return () => {\n          window.removeEventListener('message', onMessage);\n          clearTimeout(handshakeTimeout);\n        };\n      }\n    } else {\n      setMounted(true);\n    }\n  }, [mode, mounted, onMessage]);\n\n  return mode;\n};\n\nfunction inIframe() {\n  try {\n    return window.self !== window.top;\n  } catch (e) {\n    return false;\n  }\n}\n"],"names":[],"mappings":";;;;;;AAoBO;;AAEL;;;;AAIE;;;;;;AAKF;AAEA;AACE;;;AAGA;;AAGE;;;;;AAOF;AAEA;;AAGA;;AAEE;AACE;;AAEF;AACA;;AAGF;;;;AAKE;AACE;;AAEJ;;;;AAKE;AACE;AACA;AACA;;;AAIA;;;;AAMA;AACE;;AAEF;;;;;;;AAON;AACF;AAEA;AACE;AACE;;;AAEA;;AAEJ;;"}
+{"version":3,"file":"useDetectCanvasMode.js","sources":["../../../src/hooks/useDetectCanvasMode.tsx"],"sourcesContent":["'use client';\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport {\n  doesMismatchMessageSchema,\n  sendMessage,\n  tryParseMessage,\n} from '@contentful/experiences-core';\nimport {\n  INCOMING_EVENTS,\n  OUTGOING_EVENTS,\n  StudioCanvasMode,\n} from '@contentful/experiences-core/constants';\nimport { sdkFeatures } from '../core/sdkFeatures';\n\ntype useDetectCanvasModeArgs = {\n  /** If running from a known client side only situation (ie: useFetchBySlug),\n   * set this to true to kick in editor mode check sooner (which avoids a render cycle) */\n  isClientSide?: boolean;\n};\n\nexport const useDetectCanvasMode = ({ isClientSide = false }: useDetectCanvasModeArgs = {}) => {\n  const [mounted, setMounted] = useState(false);\n  const receivedModeMessage = useRef(false);\n  const [mode, setMode] = useState<StudioCanvasMode>(() => {\n    // if we are client side and running in an iframe, then initialize to read only,\n    // Editor mode can be requested later.\n    if (isClientSide && inIframe()) {\n      return StudioCanvasMode.READ_ONLY;\n    } else {\n      return StudioCanvasMode.NONE;\n    }\n  });\n\n  const onMessage = useCallback((event: MessageEvent) => {\n    if (doesMismatchMessageSchema(event)) {\n      return;\n    }\n    const eventData = tryParseMessage(event);\n    const isRequestingCanvasMode =\n      eventData.eventType === INCOMING_EVENTS.RequestEditorMode ||\n      eventData.eventType === INCOMING_EVENTS.RequestReadOnlyMode;\n\n    if (!isRequestingCanvasMode) {\n      return;\n    }\n\n    const isEditorMode = eventData.eventType === INCOMING_EVENTS.RequestEditorMode;\n    const mode = isEditorMode ? StudioCanvasMode.EDITOR : StudioCanvasMode.READ_ONLY;\n\n    receivedModeMessage.current = true;\n    setMode(mode);\n\n    if (typeof window !== 'undefined') {\n      // Once we definitely know that we are in editor mode, we set this flag so future postMessage connect calls are not made\n      if (!window.__EB__) {\n        window.__EB__ = {};\n      }\n      window.__EB__.isReadOnlyMode = !isEditorMode;\n      window.__EB__.isEditorMode = isEditorMode;\n    }\n\n    window.removeEventListener('message', onMessage);\n  }, []);\n\n  useEffect(() => {\n    const handleHandshakeTimeout = () => {\n      if (!receivedModeMessage.current) {\n        setMode(StudioCanvasMode.NONE);\n      }\n    };\n\n    // Only run check after component is mounted on the client to avoid hydration ssr issues\n    if (mounted) {\n      // Double check if we are in editor mode by listening to postMessage events\n      if (typeof window !== 'undefined') {\n        window.addEventListener('message', onMessage);\n        sendMessage(OUTGOING_EVENTS.Connected, undefined);\n        sendMessage(OUTGOING_EVENTS.SDKFeatures, sdkFeatures);\n\n        // If in iframe, we wait long to avoid setting preview mode accidentally in editor mode\n        // when switching from v2 to v3\n        const handshakeDelay = inIframe() ? 2000 : 100;\n\n        // FIXME: This causes a race condition by setting the mode sometimes to NONE when\n        // reloading the canvas due to a save event.\n        const handshakeTimeout = setTimeout(handleHandshakeTimeout, handshakeDelay);\n\n        return () => {\n          window.removeEventListener('message', onMessage);\n          clearTimeout(handshakeTimeout);\n        };\n      }\n    } else {\n      setMounted(true);\n    }\n  }, [mode, mounted, onMessage]);\n\n  return mode;\n};\n\nfunction inIframe() {\n  try {\n    return window.self !== window.top;\n  } catch {\n    return false;\n  }\n}\n"],"names":[],"mappings":";;;;;;AAoBO;;AAEL;;;;AAIE;;;;;;AAKF;AAEA;AACE;;;AAGA;;AAGE;;;;;AAOF;AAEA;;AAGA;;AAEE;AACE;;AAEF;AACA;;AAGF;;;;AAKE;AACE;;AAEJ;;;;AAKE;AACE;AACA;AACA;;;AAIA;;;;AAMA;AACE;;AAEF;;;;;;;AAON;AACF;AAEA;AACE;AACE;;AACA;AACA;;AAEJ;;"}

package/dist/hooks/useFetchById.js.map

@@ -1 +1 @@
-{"version":3,"file":"useFetchById.js","sources":["../../../src/hooks/useFetchById.ts"],"sourcesContent":["import { useCallback } from 'react';\nimport type { ContentfulClientApi } from 'contentful';\nimport { useFetchByBase } from './useFetchByBase';\nimport { fetchById } from '@contentful/experiences-core';\nimport { useDetectCanvasMode } from './useDetectCanvasMode';\n\nexport type UseFetchByIdArgs = {\n  client: ContentfulClientApi<undefined>;\n  id: string;\n  experienceTypeId: string;\n  localeCode: string;\n  hyperlinkPattern?: string;\n};\n\nexport const useFetchById = ({\n  id,\n  localeCode,\n  client,\n  experienceTypeId,\n  hyperlinkPattern,\n}: UseFetchByIdArgs) => {\n  const mode = useDetectCanvasMode({ isClientSide: typeof window !== 'undefined' });\n\n  const fetchMethod = useCallback(() => {\n    return fetchById({ id, localeCode, client, experienceTypeId });\n    // we purposely don't want to include the client in the dependencies\n    // as it can cause infinite loops if the user creates the client in the component\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [id, localeCode, experienceTypeId]);\n\n  const fetchResult = useFetchByBase(fetchMethod, mode);\n\n  if (!fetchResult.experience) {\n    return fetchResult;\n  }\n\n  // enriches fetchResult.experience with the hyperlinkPattern, only when fetchResult.experience exists\n  return {\n    ...fetchResult,\n    experience: {\n      ...fetchResult.experience,\n      hyperlinkPattern,\n    },\n  };\n};\n"],"names":[],"mappings":";;;;;AAca,MAAA,YAAY,GAAG,CAAC,EAC3B,EAAE,EACF,UAAU,EACV,MAAM,EACN,gBAAgB,EAChB,gBAAgB,GACC,KAAI;AACrB,IAAA,MAAM,IAAI,GAAG,mBAAmB,CAAC,EAAE,YAAY,EAAE,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC,CAAC;AAElF,IAAA,MAAM,WAAW,GAAG,WAAW,CAAC,MAAK;AACnC,QAAA,OAAO,SAAS,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,gBAAgB,EAAE,CAAC,CAAC;;;;KAIhE,EAAE,CAAC,EAAE,EAAE,UAAU,EAAE,gBAAgB,CAAC,CAAC,CAAC;IAEvC,MAAM,WAAW,GAAG,cAAc,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC;AAEtD,IAAA,IAAI,CAAC,WAAW,CAAC,UAAU,EAAE;AAC3B,QAAA,OAAO,WAAW,CAAC;KACpB;;IAGD,OAAO;AACL,QAAA,GAAG,WAAW;AACd,QAAA,UAAU,EAAE;YACV,GAAG,WAAW,CAAC,UAAU;YACzB,gBAAgB;AACjB,SAAA;KACF,CAAC;AACJ;;;;"}
+{"version":3,"file":"useFetchById.js","sources":["../../../src/hooks/useFetchById.ts"],"sourcesContent":["import { useCallback } from 'react';\nimport type { ContentfulClientApi } from 'contentful';\nimport { useFetchByBase } from './useFetchByBase';\nimport { fetchById } from '@contentful/experiences-core';\nimport { useDetectCanvasMode } from './useDetectCanvasMode';\n\nexport type UseFetchByIdArgs = {\n  client: ContentfulClientApi<undefined>;\n  id: string;\n  experienceTypeId: string;\n  localeCode: string;\n  hyperlinkPattern?: string;\n};\n\nexport const useFetchById = ({\n  id,\n  localeCode,\n  client,\n  experienceTypeId,\n  hyperlinkPattern,\n}: UseFetchByIdArgs) => {\n  const mode = useDetectCanvasMode({ isClientSide: typeof window !== 'undefined' });\n\n  const fetchMethod = useCallback(() => {\n    return fetchById({ id, localeCode, client, experienceTypeId });\n    // we purposely don't want to include the client in the dependencies\n    // as it can cause infinite loops if the user creates the client in the component\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [id, localeCode, experienceTypeId]);\n\n  const fetchResult = useFetchByBase(fetchMethod, mode);\n\n  if (!fetchResult.experience) {\n    return fetchResult;\n  }\n\n  // enriches fetchResult.experience with the hyperlinkPattern, only when fetchResult.experience exists\n  return {\n    ...fetchResult,\n    experience: {\n      ...fetchResult.experience,\n      hyperlinkPattern,\n    },\n  };\n};\n"],"names":[],"mappings":";;;;;AAcO,MAAM,YAAY,GAAG,CAAC,EAC3B,EAAE,EACF,UAAU,EACV,MAAM,EACN,gBAAgB,EAChB,gBAAgB,GACC,KAAI;AACrB,IAAA,MAAM,IAAI,GAAG,mBAAmB,CAAC,EAAE,YAAY,EAAE,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;AAEjF,IAAA,MAAM,WAAW,GAAG,WAAW,CAAC,MAAK;AACnC,QAAA,OAAO,SAAS,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,gBAAgB,EAAE,CAAC;;;;IAIhE,CAAC,EAAE,CAAC,EAAE,EAAE,UAAU,EAAE,gBAAgB,CAAC,CAAC;IAEtC,MAAM,WAAW,GAAG,cAAc,CAAC,WAAW,EAAE,IAAI,CAAC;AAErD,IAAA,IAAI,CAAC,WAAW,CAAC,UAAU,EAAE;AAC3B,QAAA,OAAO,WAAW;IACpB;;IAGA,OAAO;AACL,QAAA,GAAG,WAAW;AACd,QAAA,UAAU,EAAE;YACV,GAAG,WAAW,CAAC,UAAU;YACzB,gBAAgB;AACjB,SAAA;KACF;AACH;;"}

package/dist/hooks/useFetchBySlug.js.map

@@ -1 +1 @@
-{"version":3,"file":"useFetchBySlug.js","sources":["../../../src/hooks/useFetchBySlug.ts"],"sourcesContent":["import { useCallback } from 'react';\nimport type { ContentfulClientApi } from 'contentful';\nimport { useFetchByBase } from './useFetchByBase';\nimport { fetchBySlug } from '@contentful/experiences-core';\nimport { useDetectCanvasMode } from './useDetectCanvasMode';\n\nexport type UseFetchBySlugArgs = {\n  client: ContentfulClientApi<undefined>;\n  slug: string;\n  experienceTypeId: string;\n  localeCode: string;\n  /** The pattern being used to generate links for hyperlink properties **/\n  hyperlinkPattern?: string;\n};\n\nexport const useFetchBySlug = ({\n  slug,\n  localeCode,\n  client,\n  experienceTypeId,\n  hyperlinkPattern,\n}: UseFetchBySlugArgs) => {\n  const mode = useDetectCanvasMode({ isClientSide: typeof window !== 'undefined' });\n\n  const fetchMethod = useCallback(() => {\n    return fetchBySlug({ slug, localeCode, client, experienceTypeId });\n    // we purposely don't want to include the client in the dependencies as it can cause infinite loops if the\n    // user creates the client in the component\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [slug, localeCode, experienceTypeId]);\n\n  const fetchResult = useFetchByBase(fetchMethod, mode);\n\n  if (!fetchResult.experience) {\n    return fetchResult;\n  }\n\n  // enriches fetchResult.experience with the hyperlinkPattern, only when fetchResult.experience exists\n  return {\n    ...fetchResult,\n    experience: {\n      ...fetchResult.experience,\n      hyperlinkPattern,\n    },\n  };\n};\n"],"names":[],"mappings":";;;;;AAea,MAAA,cAAc,GAAG,CAAC,EAC7B,IAAI,EACJ,UAAU,EACV,MAAM,EACN,gBAAgB,EAChB,gBAAgB,GACG,KAAI;AACvB,IAAA,MAAM,IAAI,GAAG,mBAAmB,CAAC,EAAE,YAAY,EAAE,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC,CAAC;AAElF,IAAA,MAAM,WAAW,GAAG,WAAW,CAAC,MAAK;AACnC,QAAA,OAAO,WAAW,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,EAAE,gBAAgB,EAAE,CAAC,CAAC;;;;KAIpE,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,gBAAgB,CAAC,CAAC,CAAC;IAEzC,MAAM,WAAW,GAAG,cAAc,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC;AAEtD,IAAA,IAAI,CAAC,WAAW,CAAC,UAAU,EAAE;AAC3B,QAAA,OAAO,WAAW,CAAC;KACpB;;IAGD,OAAO;AACL,QAAA,GAAG,WAAW;AACd,QAAA,UAAU,EAAE;YACV,GAAG,WAAW,CAAC,UAAU;YACzB,gBAAgB;AACjB,SAAA;KACF,CAAC;AACJ;;;;"}
+{"version":3,"file":"useFetchBySlug.js","sources":["../../../src/hooks/useFetchBySlug.ts"],"sourcesContent":["import { useCallback } from 'react';\nimport type { ContentfulClientApi } from 'contentful';\nimport { useFetchByBase } from './useFetchByBase';\nimport { fetchBySlug } from '@contentful/experiences-core';\nimport { useDetectCanvasMode } from './useDetectCanvasMode';\n\nexport type UseFetchBySlugArgs = {\n  client: ContentfulClientApi<undefined>;\n  slug: string;\n  experienceTypeId: string;\n  localeCode: string;\n  /** The pattern being used to generate links for hyperlink properties **/\n  hyperlinkPattern?: string;\n};\n\nexport const useFetchBySlug = ({\n  slug,\n  localeCode,\n  client,\n  experienceTypeId,\n  hyperlinkPattern,\n}: UseFetchBySlugArgs) => {\n  const mode = useDetectCanvasMode({ isClientSide: typeof window !== 'undefined' });\n\n  const fetchMethod = useCallback(() => {\n    return fetchBySlug({ slug, localeCode, client, experienceTypeId });\n    // we purposely don't want to include the client in the dependencies as it can cause infinite loops if the\n    // user creates the client in the component\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [slug, localeCode, experienceTypeId]);\n\n  const fetchResult = useFetchByBase(fetchMethod, mode);\n\n  if (!fetchResult.experience) {\n    return fetchResult;\n  }\n\n  // enriches fetchResult.experience with the hyperlinkPattern, only when fetchResult.experience exists\n  return {\n    ...fetchResult,\n    experience: {\n      ...fetchResult.experience,\n      hyperlinkPattern,\n    },\n  };\n};\n"],"names":[],"mappings":";;;;;AAeO,MAAM,cAAc,GAAG,CAAC,EAC7B,IAAI,EACJ,UAAU,EACV,MAAM,EACN,gBAAgB,EAChB,gBAAgB,GACG,KAAI;AACvB,IAAA,MAAM,IAAI,GAAG,mBAAmB,CAAC,EAAE,YAAY,EAAE,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;AAEjF,IAAA,MAAM,WAAW,GAAG,WAAW,CAAC,MAAK;AACnC,QAAA,OAAO,WAAW,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,EAAE,gBAAgB,EAAE,CAAC;;;;IAIpE,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,gBAAgB,CAAC,CAAC;IAExC,MAAM,WAAW,GAAG,cAAc,CAAC,WAAW,EAAE,IAAI,CAAC;AAErD,IAAA,IAAI,CAAC,WAAW,CAAC,UAAU,EAAE;AAC3B,QAAA,OAAO,WAAW;IACpB;;IAGA,OAAO;AACL,QAAA,GAAG,WAAW;AACd,QAAA,UAAU,EAAE;YACV,GAAG,WAAW,CAAC,UAAU;YACzB,gBAAgB;AACjB,SAAA;KACF;AACH;;"}

package/dist/hooks/useInitializeVisualEditor.js

@@ -1,5 +1,5 @@
 import { useState, useRef, useEffect } from 'react';
-import { runBreakpointsValidation, designTokensRegistry, breakpointsRegistry, sdkOptionsRegistry } from '@contentful/experiences-core';
+import { runBreakpointsValidation, sdkOptionsRegistry, breakpointsRegistry, designTokensRegistry } from '@contentful/experiences-core';
 import { runRegisteredComponentValidations, sendConnectedEventWithRegisteredComponents, sendRegisteredComponentsMessage, componentRegistry } from '../core/componentRegistry.js';
 import { INTERNAL_EVENTS, VISUAL_EDITOR_EVENTS } from '@contentful/experiences-core/constants';
 

package/dist/hooks/useInitializeVisualEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"useInitializeVisualEditor.js","sources":["../../../src/hooks/useInitializeVisualEditor.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport { EntityStore, breakpointsRegistry } from '@contentful/experiences-core';\nimport {\n  componentRegistry,\n  sendConnectedEventWithRegisteredComponents,\n  sendRegisteredComponentsMessage,\n  runRegisteredComponentValidations,\n} from '../core/componentRegistry';\nimport { INTERNAL_EVENTS, VISUAL_EDITOR_EVENTS } from '@contentful/experiences-core/constants';\nimport {\n  designTokensRegistry,\n  runBreakpointsValidation,\n  sdkOptionsRegistry,\n} from '@contentful/experiences-core';\n\ntype InitializeVisualEditorParams = {\n  initialLocale: string;\n  initialEntities?: EntityStore['entities'];\n};\n\nexport const useInitializeVisualEditor = (params: InitializeVisualEditorParams) => {\n  const { initialLocale, initialEntities } = params;\n  const [locale, setLocale] = useState<string>(initialLocale);\n  const hasConnectEventBeenSent = useRef(false);\n\n  // sends component definitions to the web app\n  // InternalEvents.COMPONENTS_REGISTERED is triggered by defineComponents function\n  useEffect(() => {\n    if (!hasConnectEventBeenSent.current) {\n      runRegisteredComponentValidations();\n      runBreakpointsValidation();\n      // sending CONNECT but with the registered components now\n      sendConnectedEventWithRegisteredComponents();\n      hasConnectEventBeenSent.current = true;\n    }\n\n    const onComponentsRegistered = () => {\n      runRegisteredComponentValidations();\n      sendRegisteredComponentsMessage();\n    };\n\n    if (typeof window !== 'undefined') {\n      window.addEventListener(INTERNAL_EVENTS.ComponentsRegistered, onComponentsRegistered);\n    }\n\n    return () => {\n      if (typeof window !== 'undefined') {\n        window.removeEventListener(INTERNAL_EVENTS.ComponentsRegistered, onComponentsRegistered);\n      }\n    };\n  }, []);\n\n  useEffect(() => {\n    setLocale(initialLocale);\n  }, [initialLocale]);\n\n  useEffect(() => {\n    const onVisualEditorReady = () => {\n      window.dispatchEvent(\n        new CustomEvent(INTERNAL_EVENTS.VisualEditorInitialize, {\n          detail: {\n            componentRegistry,\n            designTokens: designTokensRegistry,\n            breakpoints: breakpointsRegistry,\n            sdkOptions: sdkOptionsRegistry,\n            locale,\n            entities: initialEntities ?? [],\n          },\n        }),\n      );\n    };\n\n    window.addEventListener(VISUAL_EDITOR_EVENTS.Ready, onVisualEditorReady);\n    return () => {\n      window.removeEventListener(VISUAL_EDITOR_EVENTS.Ready, onVisualEditorReady);\n    };\n  }, [locale, initialEntities]);\n};\n"],"names":[],"mappings":";;;;;AAoBa,MAAA,yBAAyB,GAAG,CAAC,MAAoC,KAAI;AAChF,IAAA,MAAM,EAAE,aAAa,EAAE,eAAe,EAAE,GAAG,MAAM,CAAC;IAClD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAS,aAAa,CAAC,CAAC;AAC5D,IAAA,MAAM,uBAAuB,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;;;IAI9C,SAAS,CAAC,MAAK;AACb,QAAA,IAAI,CAAC,uBAAuB,CAAC,OAAO,EAAE;AACpC,YAAA,iCAAiC,EAAE,CAAC;AACpC,YAAA,wBAAwB,EAAE,CAAC;;AAE3B,YAAA,0CAA0C,EAAE,CAAC;AAC7C,YAAA,uBAAuB,CAAC,OAAO,GAAG,IAAI,CAAC;SACxC;QAED,MAAM,sBAAsB,GAAG,MAAK;AAClC,YAAA,iCAAiC,EAAE,CAAC;AACpC,YAAA,+BAA+B,EAAE,CAAC;AACpC,SAAC,CAAC;AAEF,QAAA,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE;YACjC,MAAM,CAAC,gBAAgB,CAAC,eAAe,CAAC,oBAAoB,EAAE,sBAAsB,CAAC,CAAC;SACvF;AAED,QAAA,OAAO,MAAK;AACV,YAAA,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE;gBACjC,MAAM,CAAC,mBAAmB,CAAC,eAAe,CAAC,oBAAoB,EAAE,sBAAsB,CAAC,CAAC;aAC1F;AACH,SAAC,CAAC;KACH,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,CAAC,MAAK;QACb,SAAS,CAAC,aAAa,CAAC,CAAC;AAC3B,KAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,SAAS,CAAC,MAAK;QACb,MAAM,mBAAmB,GAAG,MAAK;YAC/B,MAAM,CAAC,aAAa,CAClB,IAAI,WAAW,CAAC,eAAe,CAAC,sBAAsB,EAAE;AACtD,gBAAA,MAAM,EAAE;oBACN,iBAAiB;AACjB,oBAAA,YAAY,EAAE,oBAAoB;AAClC,oBAAA,WAAW,EAAE,mBAAmB;AAChC,oBAAA,UAAU,EAAE,kBAAkB;oBAC9B,MAAM;oBACN,QAAQ,EAAE,eAAe,IAAI,EAAE;AAChC,iBAAA;AACF,aAAA,CAAC,CACH,CAAC;AACJ,SAAC,CAAC;QAEF,MAAM,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,KAAK,EAAE,mBAAmB,CAAC,CAAC;AACzE,QAAA,OAAO,MAAK;YACV,MAAM,CAAC,mBAAmB,CAAC,oBAAoB,CAAC,KAAK,EAAE,mBAAmB,CAAC,CAAC;AAC9E,SAAC,CAAC;AACJ,KAAC,EAAE,CAAC,MAAM,EAAE,eAAe,CAAC,CAAC,CAAC;AAChC;;;;"}
+{"version":3,"file":"useInitializeVisualEditor.js","sources":["../../../src/hooks/useInitializeVisualEditor.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport { EntityStore, breakpointsRegistry } from '@contentful/experiences-core';\nimport {\n  componentRegistry,\n  sendConnectedEventWithRegisteredComponents,\n  sendRegisteredComponentsMessage,\n  runRegisteredComponentValidations,\n} from '../core/componentRegistry';\nimport { INTERNAL_EVENTS, VISUAL_EDITOR_EVENTS } from '@contentful/experiences-core/constants';\nimport {\n  designTokensRegistry,\n  runBreakpointsValidation,\n  sdkOptionsRegistry,\n} from '@contentful/experiences-core';\n\ntype InitializeVisualEditorParams = {\n  initialLocale: string;\n  initialEntities?: EntityStore['entities'];\n};\n\nexport const useInitializeVisualEditor = (params: InitializeVisualEditorParams) => {\n  const { initialLocale, initialEntities } = params;\n  const [locale, setLocale] = useState<string>(initialLocale);\n  const hasConnectEventBeenSent = useRef(false);\n\n  // sends component definitions to the web app\n  // InternalEvents.COMPONENTS_REGISTERED is triggered by defineComponents function\n  useEffect(() => {\n    if (!hasConnectEventBeenSent.current) {\n      runRegisteredComponentValidations();\n      runBreakpointsValidation();\n      // sending CONNECT but with the registered components now\n      sendConnectedEventWithRegisteredComponents();\n      hasConnectEventBeenSent.current = true;\n    }\n\n    const onComponentsRegistered = () => {\n      runRegisteredComponentValidations();\n      sendRegisteredComponentsMessage();\n    };\n\n    if (typeof window !== 'undefined') {\n      window.addEventListener(INTERNAL_EVENTS.ComponentsRegistered, onComponentsRegistered);\n    }\n\n    return () => {\n      if (typeof window !== 'undefined') {\n        window.removeEventListener(INTERNAL_EVENTS.ComponentsRegistered, onComponentsRegistered);\n      }\n    };\n  }, []);\n\n  useEffect(() => {\n    setLocale(initialLocale);\n  }, [initialLocale]);\n\n  useEffect(() => {\n    const onVisualEditorReady = () => {\n      window.dispatchEvent(\n        new CustomEvent(INTERNAL_EVENTS.VisualEditorInitialize, {\n          detail: {\n            componentRegistry,\n            designTokens: designTokensRegistry,\n            breakpoints: breakpointsRegistry,\n            sdkOptions: sdkOptionsRegistry,\n            locale,\n            entities: initialEntities ?? [],\n          },\n        }),\n      );\n    };\n\n    window.addEventListener(VISUAL_EDITOR_EVENTS.Ready, onVisualEditorReady);\n    return () => {\n      window.removeEventListener(VISUAL_EDITOR_EVENTS.Ready, onVisualEditorReady);\n    };\n  }, [locale, initialEntities]);\n};\n"],"names":[],"mappings":";;;;;AAoBO,MAAM,yBAAyB,GAAG,CAAC,MAAoC,KAAI;AAChF,IAAA,MAAM,EAAE,aAAa,EAAE,eAAe,EAAE,GAAG,MAAM;IACjD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAS,aAAa,CAAC;AAC3D,IAAA,MAAM,uBAAuB,GAAG,MAAM,CAAC,KAAK,CAAC;;;IAI7C,SAAS,CAAC,MAAK;AACb,QAAA,IAAI,CAAC,uBAAuB,CAAC,OAAO,EAAE;AACpC,YAAA,iCAAiC,EAAE;AACnC,YAAA,wBAAwB,EAAE;;AAE1B,YAAA,0CAA0C,EAAE;AAC5C,YAAA,uBAAuB,CAAC,OAAO,GAAG,IAAI;QACxC;QAEA,MAAM,sBAAsB,GAAG,MAAK;AAClC,YAAA,iCAAiC,EAAE;AACnC,YAAA,+BAA+B,EAAE;AACnC,QAAA,CAAC;AAED,QAAA,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE;YACjC,MAAM,CAAC,gBAAgB,CAAC,eAAe,CAAC,oBAAoB,EAAE,sBAAsB,CAAC;QACvF;AAEA,QAAA,OAAO,MAAK;AACV,YAAA,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE;gBACjC,MAAM,CAAC,mBAAmB,CAAC,eAAe,CAAC,oBAAoB,EAAE,sBAAsB,CAAC;YAC1F;AACF,QAAA,CAAC;IACH,CAAC,EAAE,EAAE,CAAC;IAEN,SAAS,CAAC,MAAK;QACb,SAAS,CAAC,aAAa,CAAC;AAC1B,IAAA,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC;IAEnB,SAAS,CAAC,MAAK;QACb,MAAM,mBAAmB,GAAG,MAAK;YAC/B,MAAM,CAAC,aAAa,CAClB,IAAI,WAAW,CAAC,eAAe,CAAC,sBAAsB,EAAE;AACtD,gBAAA,MAAM,EAAE;oBACN,iBAAiB;AACjB,oBAAA,YAAY,EAAE,oBAAoB;AAClC,oBAAA,WAAW,EAAE,mBAAmB;AAChC,oBAAA,UAAU,EAAE,kBAAkB;oBAC9B,MAAM;oBACN,QAAQ,EAAE,eAAe,IAAI,EAAE;AAChC,iBAAA;AACF,aAAA,CAAC,CACH;AACH,QAAA,CAAC;QAED,MAAM,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,KAAK,EAAE,mBAAmB,CAAC;AACxE,QAAA,OAAO,MAAK;YACV,MAAM,CAAC,mBAAmB,CAAC,oBAAoB,CAAC,KAAK,EAAE,mBAAmB,CAAC;AAC7E,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,CAAC,CAAC;AAC/B;;"}

package/dist/hooks/useInjectStylesheet.js.map

@@ -1 +1 @@
-{"version":3,"file":"useInjectStylesheet.js","sources":["../../../src/hooks/useInjectStylesheet.ts"],"sourcesContent":["import { useInsertionEffect } from 'react';\n\n/**\n * This hook injects the passed styles on the client side within a new <style> tag.\n *\n * @param css: The CSS string to be injected.\n */\nexport const useInjectStylesheet = (css?: string) => {\n  useInsertionEffect(() => {\n    if (!css) {\n      return;\n    }\n\n    const styleTag = document.createElement('style');\n    styleTag.setAttribute('type', 'text/css');\n    styleTag.innerHTML = css;\n\n    // This might cause an error with `document.head` being undefined, e.g. when the client-side\n    // hydration in SSR applications failed and thus the document is not initialized.\n    document.head.appendChild(styleTag);\n\n    return () => {\n      styleTag.parentNode?.removeChild(styleTag);\n    };\n  }, [css]);\n};\n"],"names":[],"mappings":";;AAEA;;;;AAIG;AACU,MAAA,mBAAmB,GAAG,CAAC,GAAY,KAAI;IAClD,kBAAkB,CAAC,MAAK;QACtB,IAAI,CAAC,GAAG,EAAE;YACR,OAAO;SACR;QAED,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;AACjD,QAAA,QAAQ,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;AAC1C,QAAA,QAAQ,CAAC,SAAS,GAAG,GAAG,CAAC;;;AAIzB,QAAA,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC;AAEpC,QAAA,OAAO,MAAK;AACV,YAAA,QAAQ,CAAC,UAAU,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;AAC7C,SAAC,CAAC;AACJ,KAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;AACZ;;;;"}
+{"version":3,"file":"useInjectStylesheet.js","sources":["../../../src/hooks/useInjectStylesheet.ts"],"sourcesContent":["import { useInsertionEffect } from 'react';\n\n/**\n * This hook injects the passed styles on the client side within a new <style> tag.\n *\n * @param css: The CSS string to be injected.\n */\nexport const useInjectStylesheet = (css?: string) => {\n  useInsertionEffect(() => {\n    if (!css) {\n      return;\n    }\n\n    const styleTag = document.createElement('style');\n    styleTag.setAttribute('type', 'text/css');\n    styleTag.innerHTML = css;\n\n    // This might cause an error with `document.head` being undefined, e.g. when the client-side\n    // hydration in SSR applications failed and thus the document is not initialized.\n    document.head.appendChild(styleTag);\n\n    return () => {\n      styleTag.parentNode?.removeChild(styleTag);\n    };\n  }, [css]);\n};\n"],"names":[],"mappings":";;AAEA;;;;AAIG;AACI,MAAM,mBAAmB,GAAG,CAAC,GAAY,KAAI;IAClD,kBAAkB,CAAC,MAAK;QACtB,IAAI,CAAC,GAAG,EAAE;YACR;QACF;QAEA,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC;AAChD,QAAA,QAAQ,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC;AACzC,QAAA,QAAQ,CAAC,SAAS,GAAG,GAAG;;;AAIxB,QAAA,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC;AAEnC,QAAA,OAAO,MAAK;AACV,YAAA,QAAQ,CAAC,UAAU,EAAE,WAAW,CAAC,QAAQ,CAAC;AAC5C,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;AACX;;"}

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import React from 'react';
 import * as _contentful_experiences_core from '@contentful/experiences-core';
 import { EntityStore, VisualEditorMode } from '@contentful/experiences-core';
 export { VisualEditorMode, createExperience, defineBreakpoints, defineDesignTokens, detachExperienceStyles, extractLeafLinksReferencedFromExperience, extractReferencesFromEntries, extractReferencesFromEntriesAsIds, fetchById, fetchBySlug, fetchExperienceEntry, fetchReferencedEntities, inMemoryEntities, isArrayOfLinks, isAsset, isEntry, isLink, isLinkToAsset, isLinkToEntry, localizeEntity, useInMemoryEntities } from '@contentful/experiences-core';
@@ -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 = "3.8.10";
+declare const SDK_VERSION = "3.8.11-beta.0";
 
 type ExperienceRootProps = {
     experience?: Experience<EntityStore> | string | null;
@@ -21,7 +21,7 @@ type ExperienceRootProps = {
      */
     debug?: boolean;
 };
-declare const ExperienceRoot: ({ locale, experience, visualEditorMode, debug, }: ExperienceRootProps) => react_jsx_runtime.JSX.Element | null;
+declare const ExperienceRoot: ({ locale, experience, visualEditorMode, debug, }: ExperienceRootProps) => React.JSX.Element | null;
 
 type UseFetchByIdArgs = {
     client: ContentfulClientApi<undefined>;

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/index.ts"],"sourcesContent":["import { enableDebug, disableDebug } from '@contentful/experiences-core';\nimport { SDK_VERSION } from './sdkVersion';\nexport { SDK_VERSION as version };\n\nexport { ExperienceRoot } from './ExperienceRoot';\nexport { useFetchById, useFetchBySlug, useCustomFetch } from './hooks';\nexport { defineComponents } from './core/componentRegistry';\nexport {\n  inMemoryEntities,\n  useInMemoryEntities,\n  defineDesignTokens,\n  defineBreakpoints,\n  VisualEditorMode,\n  fetchById,\n  fetchBySlug,\n  createExperience,\n  detachExperienceStyles,\n  fetchReferencedEntities,\n  fetchExperienceEntry,\n  localizeEntity,\n  isArrayOfLinks,\n  isLink,\n  isAsset,\n  isEntry,\n  isLinkToAsset,\n  isLinkToEntry,\n  // Early preload utilities\n  extractLeafLinksReferencedFromExperience,\n  extractReferencesFromEntries,\n  extractReferencesFromEntriesAsIds,\n} from '@contentful/experiences-core';\nexport {\n  CONTENTFUL_COMPONENTS,\n  LATEST_SCHEMA_VERSION,\n  CF_STYLE_ATTRIBUTES,\n} from '@contentful/experiences-core/constants';\nexport type {\n  Experience,\n  ComponentDefinition,\n  ComponentRegistration,\n} from '@contentful/experiences-core/types';\n\n// Simple state store to store a few things that are needed across the SDK\nif (typeof window !== 'undefined') {\n  if (!window.__EB__) {\n    window.__EB__ = {};\n  }\n  window.__EB__.sdkVersion = SDK_VERSION;\n  window.__EB__.enableDebug = enableDebug;\n  window.__EB__.disableDebug = disableDebug;\n}\n"],"names":[],"mappings":";;;;;;;;;;;AA0CA;AACA,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE;AACjC,IAAA,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE;AAClB,QAAA,MAAM,CAAC,MAAM,GAAG,EAAE,CAAC;KACpB;AACD,IAAA,MAAM,CAAC,MAAM,CAAC,UAAU,GAAG,WAAW,CAAC;AACvC,IAAA,MAAM,CAAC,MAAM,CAAC,WAAW,GAAG,WAAW,CAAC;AACxC,IAAA,MAAM,CAAC,MAAM,CAAC,YAAY,GAAG,YAAY,CAAC;AAC5C;;;;"}
+{"version":3,"file":"index.js","sources":["../../src/index.ts"],"sourcesContent":["import { enableDebug, disableDebug } from '@contentful/experiences-core';\nimport { SDK_VERSION } from './sdkVersion';\nexport { SDK_VERSION as version };\n\nexport { ExperienceRoot } from './ExperienceRoot';\nexport { useFetchById, useFetchBySlug, useCustomFetch } from './hooks';\nexport { defineComponents } from './core/componentRegistry';\nexport {\n  inMemoryEntities,\n  useInMemoryEntities,\n  defineDesignTokens,\n  defineBreakpoints,\n  VisualEditorMode,\n  fetchById,\n  fetchBySlug,\n  createExperience,\n  detachExperienceStyles,\n  fetchReferencedEntities,\n  fetchExperienceEntry,\n  localizeEntity,\n  isArrayOfLinks,\n  isLink,\n  isAsset,\n  isEntry,\n  isLinkToAsset,\n  isLinkToEntry,\n  // Early preload utilities\n  extractLeafLinksReferencedFromExperience,\n  extractReferencesFromEntries,\n  extractReferencesFromEntriesAsIds,\n} from '@contentful/experiences-core';\nexport {\n  CONTENTFUL_COMPONENTS,\n  LATEST_SCHEMA_VERSION,\n  CF_STYLE_ATTRIBUTES,\n} from '@contentful/experiences-core/constants';\nexport type {\n  Experience,\n  ComponentDefinition,\n  ComponentRegistration,\n} from '@contentful/experiences-core/types';\n\n// Simple state store to store a few things that are needed across the SDK\nif (typeof window !== 'undefined') {\n  if (!window.__EB__) {\n    window.__EB__ = {};\n  }\n  window.__EB__.sdkVersion = SDK_VERSION;\n  window.__EB__.enableDebug = enableDebug;\n  window.__EB__.disableDebug = disableDebug;\n}\n"],"names":[],"mappings":";;;;;;;;;;;AA0CA;AACA,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE;AACjC,IAAA,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE;AAClB,QAAA,MAAM,CAAC,MAAM,GAAG,EAAE;IACpB;AACA,IAAA,MAAM,CAAC,MAAM,CAAC,UAAU,GAAG,WAAW;AACtC,IAAA,MAAM,CAAC,MAAM,CAAC,WAAW,GAAG,WAAW;AACvC,IAAA,MAAM,CAAC,MAAM,CAAC,YAAY,GAAG,YAAY;AAC3C;;"}

package/dist/sdkVersion.js

@@ -1,4 +1,4 @@
-const SDK_VERSION = '3.8.10';
+const SDK_VERSION = '3.8.11-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 = '3.8.10';\n"],"names":[],"mappings":"AAAO,MAAM,WAAW,GAAG;;;;"}
+{"version":3,"file":"sdkVersion.js","sources":["../../src/sdkVersion.ts"],"sourcesContent":["export const SDK_VERSION = '3.8.11-beta.0';\n"],"names":[],"mappings":"AAAO,MAAM,WAAW,GAAG;;"}

package/dist/src/ExperienceRoot.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { VisualEditorMode } from '@contentful/experiences-core';
 import { EntityStore } from '@contentful/experiences-core';
 import type { Experience } from '@contentful/experiences-core/types';
@@ -12,5 +13,5 @@ type ExperienceRootProps = {
      */
     debug?: boolean;
 };
-export declare const ExperienceRoot: ({ locale, experience, visualEditorMode, debug, }: ExperienceRootProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const ExperienceRoot: ({ locale, experience, visualEditorMode, debug, }: ExperienceRootProps) => React.JSX.Element | null;
 export {};

package/dist/src/blocks/editor/VisualEditorInjectScript.d.ts

@@ -1,4 +1,5 @@
+import React from 'react';
 /**
  * This component injects the visual editor script into the page
  */
-export default function VisualEditorInjectScript(): import("react/jsx-runtime").JSX.Element;
+export default function VisualEditorInjectScript(): React.JSX.Element;

package/dist/src/blocks/preview/CompositionBlock.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { EntityStore } from '@contentful/experiences-core';
 import type { ComponentTreeNode, Parameter, ResolveDesignValueType } from '@contentful/experiences-core/types';
 type CompositionBlockProps = {
@@ -16,5 +17,5 @@ type CompositionBlockProps = {
      */
     patternRootNodeIdsChain?: Array<string>;
 };
-export declare const CompositionBlock: ({ node: rawNode, locale, entityStore, hyperlinkPattern, resolveDesignValue, getPatternChildNodeClassName, wrappingPatternIds: parentWrappingPatternIds, patternRootNodeIdsChain: parentPatternRootNodeIdsChain, rootPatternParameters, }: CompositionBlockProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const CompositionBlock: ({ node: rawNode, locale, entityStore, hyperlinkPattern, resolveDesignValue, getPatternChildNodeClassName, wrappingPatternIds: parentWrappingPatternIds, patternRootNodeIdsChain: parentPatternRootNodeIdsChain, rootPatternParameters, }: CompositionBlockProps) => React.JSX.Element | null;
 export {};

package/dist/src/blocks/preview/PreviewDeliveryRoot.d.ts

@@ -1,8 +1,9 @@
+import React from 'react';
 import { EntityStore } from '@contentful/experiences-core';
 import type { Experience } from '@contentful/experiences-core/types';
 type DeliveryRootProps = {
     experience: Experience<EntityStore>;
     locale: string;
 };
-export declare const PreviewDeliveryRoot: ({ locale, experience }: DeliveryRootProps) => import("react/jsx-runtime").JSX.Element | import("react/jsx-runtime").JSX.Element[] | null;
+export declare const PreviewDeliveryRoot: ({ locale, experience }: DeliveryRootProps) => React.JSX.Element | React.JSX.Element[] | null;
 export {};

package/dist/src/components/ErrorBoundary.d.ts

@@ -14,5 +14,5 @@ export declare class ErrorBoundary extends React.Component<{
         hasError: boolean;
     };
     componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
-    render(): import("react/jsx-runtime").JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/src/core/preview/PrebindingManager.d.ts

@@ -107,9 +107,9 @@ export declare class PrebindingManager {
         [k: string]: {
             contentTypes: string[];
             passToNodes: {
-                prebindingId: string;
-                parameterId: string;
                 nodeId: string;
+                parameterId: string;
+                prebindingId: string;
             }[];
             defaultSource?: {
                 type: "Entry";

package/dist/src/core/preview/__fixtures__.d.ts

@@ -7,9 +7,9 @@ export declare const l1: {
         parameterDefinitions: Record<string, {
             contentTypes: string[];
             passToNodes: {
-                prebindingId: string;
-                parameterId: string;
                 nodeId: string;
+                parameterId: string;
+                prebindingId: string;
             }[];
             defaultSource?: {
                 type: "Entry";
@@ -24,8 +24,8 @@ export declare const l1: {
             } | undefined;
         }>;
         variableMappings?: Record<string, {
-            type: "ContentTypeMapping";
             parameterId: string;
+            type: "ContentTypeMapping";
             pathsByContentType: Record<string, {
                 path: string;
             }>;
@@ -54,9 +54,9 @@ export declare const l2: {
         parameterDefinitions: Record<string, {
             contentTypes: string[];
             passToNodes: {
-                prebindingId: string;
-                parameterId: string;
                 nodeId: string;
+                parameterId: string;
+                prebindingId: string;
             }[];
             defaultSource?: {
                 type: "Entry";
@@ -71,8 +71,8 @@ export declare const l2: {
             } | undefined;
         }>;
         variableMappings?: Record<string, {
-            type: "ContentTypeMapping";
             parameterId: string;
+            type: "ContentTypeMapping";
             pathsByContentType: Record<string, {
                 path: string;
             }>;
@@ -101,9 +101,9 @@ export declare const l2_l1_1: {
         parameterDefinitions: Record<string, {
             contentTypes: string[];
             passToNodes: {
-                prebindingId: string;
-                parameterId: string;
                 nodeId: string;
+                parameterId: string;
+                prebindingId: string;
             }[];
             defaultSource?: {
                 type: "Entry";
@@ -118,8 +118,8 @@ export declare const l2_l1_1: {
             } | undefined;
         }>;
         variableMappings?: Record<string, {
-            type: "ContentTypeMapping";
             parameterId: string;
+            type: "ContentTypeMapping";
             pathsByContentType: Record<string, {
                 path: string;
             }>;
@@ -148,9 +148,9 @@ export declare const l2_l1_2: {
         parameterDefinitions: Record<string, {
             contentTypes: string[];
             passToNodes: {
-                prebindingId: string;
-                parameterId: string;
                 nodeId: string;
+                parameterId: string;
+                prebindingId: string;
             }[];
             defaultSource?: {
                 type: "Entry";
@@ -165,8 +165,8 @@ export declare const l2_l1_2: {
             } | undefined;
         }>;
         variableMappings?: Record<string, {
-            type: "ContentTypeMapping";
             parameterId: string;
+            type: "ContentTypeMapping";
             pathsByContentType: Record<string, {
                 path: string;
             }>;
@@ -195,9 +195,9 @@ export declare const l3: {
         parameterDefinitions: Record<string, {
             contentTypes: string[];
             passToNodes: {
-                prebindingId: string;
-                parameterId: string;
                 nodeId: string;
+                parameterId: string;
+                prebindingId: string;
             }[];
             defaultSource?: {
                 type: "Entry";
@@ -212,8 +212,8 @@ export declare const l3: {
             } | undefined;
         }>;
         variableMappings?: Record<string, {
-            type: "ContentTypeMapping";
             parameterId: string;
+            type: "ContentTypeMapping";
             pathsByContentType: Record<string, {
                 path: string;
             }>;
@@ -242,9 +242,9 @@ export declare const l3_l2_1: {
         parameterDefinitions: Record<string, {
             contentTypes: string[];
             passToNodes: {
-                prebindingId: string;
-                parameterId: string;
                 nodeId: string;
+                parameterId: string;
+                prebindingId: string;
             }[];
             defaultSource?: {
                 type: "Entry";
@@ -259,8 +259,8 @@ export declare const l3_l2_1: {
             } | undefined;
         }>;
         variableMappings?: Record<string, {
-            type: "ContentTypeMapping";
             parameterId: string;
+            type: "ContentTypeMapping";
             pathsByContentType: Record<string, {
                 path: string;
             }>;
@@ -289,9 +289,9 @@ export declare const l3_l2_2: {
         parameterDefinitions: Record<string, {
             contentTypes: string[];
             passToNodes: {
-                prebindingId: string;
-                parameterId: string;
                 nodeId: string;
+                parameterId: string;
+                prebindingId: string;
             }[];
             defaultSource?: {
                 type: "Entry";
@@ -306,8 +306,8 @@ export declare const l3_l2_2: {
             } | undefined;
         }>;
         variableMappings?: Record<string, {
-            type: "ContentTypeMapping";
             parameterId: string;
+            type: "ContentTypeMapping";
             pathsByContentType: Record<string, {
                 path: string;
             }>;
@@ -336,9 +336,9 @@ export declare const l3_l2_l1_1: {
         parameterDefinitions: Record<string, {
             contentTypes: string[];
             passToNodes: {
-                prebindingId: string;
-                parameterId: string;
                 nodeId: string;
+                parameterId: string;
+                prebindingId: string;
             }[];
             defaultSource?: {
                 type: "Entry";
@@ -353,8 +353,8 @@ export declare const l3_l2_l1_1: {
             } | undefined;
         }>;
         variableMappings?: Record<string, {
-            type: "ContentTypeMapping";
             parameterId: string;
+            type: "ContentTypeMapping";
             pathsByContentType: Record<string, {
                 path: string;
             }>;
@@ -383,9 +383,9 @@ export declare const l3_l2_l1_2: {
         parameterDefinitions: Record<string, {
             contentTypes: string[];
             passToNodes: {
-                prebindingId: string;
-                parameterId: string;
                 nodeId: string;
+                parameterId: string;
+                prebindingId: string;
             }[];
             defaultSource?: {
                 type: "Entry";
@@ -400,8 +400,8 @@ export declare const l3_l2_l1_2: {
             } | undefined;
         }>;
         variableMappings?: Record<string, {
-            type: "ContentTypeMapping";
             parameterId: string;
+            type: "ContentTypeMapping";
             pathsByContentType: Record<string, {
                 path: string;
             }>;
@@ -430,9 +430,9 @@ export declare const l3_l2_l1_3: {
         parameterDefinitions: Record<string, {
             contentTypes: string[];
             passToNodes: {
-                prebindingId: string;
-                parameterId: string;
                 nodeId: string;
+                parameterId: string;
+                prebindingId: string;
             }[];
             defaultSource?: {
                 type: "Entry";
@@ -447,8 +447,8 @@ export declare const l3_l2_l1_3: {
             } | undefined;
         }>;
         variableMappings?: Record<string, {
-            type: "ContentTypeMapping";
             parameterId: string;
+            type: "ContentTypeMapping";
             pathsByContentType: Record<string, {
                 path: string;
             }>;
@@ -477,9 +477,9 @@ export declare const l3_l2_l1_4: {
         parameterDefinitions: Record<string, {
             contentTypes: string[];
             passToNodes: {
-                prebindingId: string;
-                parameterId: string;
                 nodeId: string;
+                parameterId: string;
+                prebindingId: string;
             }[];
             defaultSource?: {
                 type: "Entry";
@@ -494,8 +494,8 @@ export declare const l3_l2_l1_4: {
             } | undefined;
         }>;
         variableMappings?: Record<string, {
-            type: "ContentTypeMapping";
             parameterId: string;
+            type: "ContentTypeMapping";
             pathsByContentType: Record<string, {
                 path: string;
             }>;

package/dist/src/sdkVersion.d.ts

@@ -1 +1 @@
-export declare const SDK_VERSION = "3.8.10";
+export declare const SDK_VERSION = "3.8.11-beta.0";

package/dist/test/components/Test.d.ts

@@ -1 +1,2 @@
-export declare const Test: () => import("react/jsx-runtime").JSX.Element;
+import React from 'react';
+export declare const Test: () => React.JSX.Element;

package/dist/utils/parseComponentProps.js.map

@@ -1 +1 @@
-{"version":3,"file":"parseComponentProps.js","sources":["../../../src/utils/parseComponentProps.ts"],"sourcesContent":["import { isCfStyleAttribute, debug } from '@contentful/experiences-core';\nimport {\n  BoundComponentPropertyTypes,\n  BoundValue,\n  Breakpoint,\n  ComponentDefinition,\n  ComponentDefinitionVariable,\n  ComponentDefinitionVariableType,\n  ComponentTreeNode,\n  DesignValue,\n  PrimitiveValue,\n  ResolveDesignValueType,\n} from '@contentful/experiences-core/types';\nimport { convertResolvedDesignValuesToMediaQuery } from '../core/styles/convertResolvedDesignValuesToMediaQuery';\nimport { createStylesheetsForBuiltInStyles } from '../core/styles/createStylesheetsForBuiltInStyles';\n\n// TODO: Test this for nested patterns as the name might be just a random hash without the actual name (needs to be validated).\n/**\n * Checks if prop is a \"siamese\" prop. So far we have only one such prop: `cfBackgroundImageUrl`.\n * It is considered \"siamese\" because despite being a content variable, it always goes in pair\n * (is coupled) with the `cfBackgroundImageOptions` design variable. Without presence of the\n * `cfBackgroundImageUrl` the `cfBackgroundImageOptions` is useless (and is not going to be\n * rendered by the styleTransformers.ts#transformBackgroundImageUrl()).\n *\n * Because of this coupling, we need to create an \"ephemeral\" cfBackgroundImageUrl style(!) prop.\n */\nconst isSpecialCaseCssProp = (propName: string) => {\n  return propName === 'cfBackgroundImageUrl' || propName.startsWith('cfBackgroundImageUrl_');\n};\n\n/**\n * The previous logic of prop mapping was too complex and mixed different ues cases together.\n * In this function, I aim to simplify the logic by focusing on the following specific cases FOR PREVIEW/DELIVERY MODES\n * 1) Any non `DesignValue` props should be resolved and returned as is\n * 2) Some exceptions like `cfImageAsset` and `cfBackgroundImageUrl` (BoundValue) should be handled separately\n * and be resolved for the default breakpoint only (cause we don't allow binding per breakpoint anyway)\n * 3) Those DesignValue props which can be converted to CSS should be grouped and resolved into a CSS media query\n * for each breakpoint\n * 4) Those DesignValue props which can NOT be converted to CSS (custom design props) should be resolved dynamically\n * for each breakpoint\n */\ntype ResolveBoundValueType = (data: {\n  propertyName: string;\n  dataType: ComponentDefinitionVariableType;\n  binding: BoundValue;\n}) => BoundComponentPropertyTypes;\n\nexport const parseComponentProps = ({\n  breakpoints,\n  componentDefinition,\n  patternRootNodeIdsChain,\n  node,\n  resolveDesignValue,\n  resolveBoundValue,\n  resolveHyperlinkValue,\n  resolveUnboundValue,\n  resolveComponentValue,\n}: {\n  breakpoints: Breakpoint[];\n  mainBreakpoint: Breakpoint;\n  componentDefinition: ComponentDefinition;\n  patternRootNodeIdsChain: Array<string>;\n  node: ComponentTreeNode;\n  resolveDesignValue: ResolveDesignValueType;\n  resolveBoundValue: ResolveBoundValueType;\n  resolveHyperlinkValue: (data: { linkTargetKey: string }) => string | null;\n  resolveUnboundValue: (data: {\n    mappingKey: string;\n    defaultValue: ComponentDefinitionVariable['defaultValue'];\n  }) => PrimitiveValue;\n  /**\n   * This method will be called to resolve the values for components that are native (not from nested pattern) to the previewed pattern\n   * Nested pattern's components are going to be resolved by the `resolvePattern` method from `assemblyUtils` file\n   * @param data\n   * @returns\n   */\n  resolveComponentValue: (data: {\n    propertyName: string;\n    mappingKey: string;\n    dataType: ComponentDefinitionVariableType;\n    resolveBoundValue: ResolveBoundValueType;\n  }) => PrimitiveValue;\n}) => {\n  const styleProps: Record<string, DesignValue['valuesByBreakpoint']> = {};\n  const customDesignProps: Record<string, PrimitiveValue> = {};\n  const contentProps: Record<string, PrimitiveValue> = {};\n\n  debug.log(\n    '[experiences-sdk-react::parseComponentProps] Parsing component props for node with id: ',\n    node.id,\n  );\n\n  for (const [propName, propDefinition] of Object.entries(componentDefinition.variables)) {\n    const propertyValue = node.variables[propName];\n    if (!propertyValue) continue;\n\n    switch (propertyValue.type) {\n      case 'DesignValue': {\n        if (isCfStyleAttribute(propName)) {\n          // for such properties we know how to convert them to CSS, so we will build a media query from it below after the loop is over\n          styleProps[propName] = propertyValue.valuesByBreakpoint;\n        } else {\n          // for custom design props, the value will be resolved with the javascript per breakpoint at runtime\n          customDesignProps[propName] = resolveDesignValue(propertyValue.valuesByBreakpoint);\n        }\n        break;\n      }\n      case 'BoundValue': {\n        const boundValue = resolveBoundValue({\n          propertyName: propName,\n          dataType: propDefinition.type as ComponentDefinitionVariableType,\n          binding: propertyValue,\n        });\n\n        const propValue = boundValue ?? propDefinition.defaultValue;\n\n        if (isSpecialCaseCssProp(propName)) {\n          // styleProps[propName] = { [mainBreakpoint.id]: propValue };\n          // Here we create kind of \"fake\" style property out of a bound value.\n          // As bound values are breakpoint-universal (they apply to all breakpoints),\n          // but styleProps are breakpoint-specific, we need to ensure that\n          // semantically our \"fake\" emphemeral style property will be universall as well,\n          // by expanding it to all the breakpoints. This is important as\n          // styleTransformers.ts#transformBackgroundImageUrl() expects\n          // cfBackgroundImageUrl to be present for all breakpoints\n          // where cfBackgroundImageOptions is present.\n          styleProps[propName] = Object.fromEntries(breakpoints.map((b) => [b.id, propValue]));\n        } else {\n          contentProps[propName] = propValue;\n        }\n        break;\n      }\n\n      case 'HyperlinkValue': {\n        const hyperlink = resolveHyperlinkValue({\n          linkTargetKey: propertyValue.linkTargetKey,\n        });\n        if (hyperlink) {\n          contentProps[propName] = hyperlink;\n        }\n        break;\n      }\n      case 'UnboundValue': {\n        const unboundValue = resolveUnboundValue({\n          mappingKey: propertyValue.key,\n          defaultValue: propDefinition.defaultValue,\n        });\n\n        if (isSpecialCaseCssProp(propName)) {\n          styleProps[propName] = Object.fromEntries(breakpoints.map((b) => [b.id, unboundValue]));\n        } else {\n          contentProps[propName] = unboundValue;\n        }\n        break;\n      }\n      case 'ComponentValue': {\n        // This can either be a design (style) or a content property.\n        // Where prebinding is used, we resolve like they are a BoundValue.\n        const propValue =\n          resolveComponentValue({\n            propertyName: propName,\n            mappingKey: propertyValue.key,\n            dataType: propDefinition.type,\n            resolveBoundValue,\n          }) ?? propDefinition.defaultValue;\n\n        if (isSpecialCaseCssProp(propName)) {\n          styleProps[propName] = Object.fromEntries(breakpoints.map((b) => [b.id, propValue]));\n        } else {\n          contentProps[propName] = propValue;\n        }\n        break;\n      }\n      default:\n        break;\n    }\n  }\n  /* [Data Format] After resolving all properties, `styleProps` contains solely the plain design values\n   * styleProps = {\n   *   cfMargin: { desktop: '42px', tablet: '13px' },\n   *   cfBackgroundColor: { desktop: 'rgba(246, 246, 246, 1)' },\n   *   cfBackgroundImage: { desktop: 'url(https://example.com/image.jpg)' }\n   * }\n   */\n\n  const stylePropsIndexedByBreakpoint = Object.entries(styleProps).reduce<\n    Record<string, Record<string, PrimitiveValue>>\n  >((acc, [propName, valuesByBreakpoint]) => {\n    for (const [breakpointId, value] of Object.entries(valuesByBreakpoint)) {\n      if (!acc[breakpointId]) {\n        acc[breakpointId] = {};\n      }\n\n      acc[breakpointId][propName] = value;\n    }\n\n    return acc;\n  }, {});\n  /* [Data Format] `stylePropsIndexedByBreakpoint` contains the plain design values grouped by breakpoint\n   * stylePropsIndexedByBreakpoint = {\n   *   desktop: {\n   *     cfMargin: '42px',\n   *     cfBackgroundColor: 'rgba(246, 246, 246, 1)',\n   *     cfBackgroundImage: 'url(https://example.com/image.jpg)'\n   *   },\n   *   tablet: {\n   *     cfMargin: '13px'\n   *   }\n   * }\n   */\n\n  const stylesheetData = createStylesheetsForBuiltInStyles({\n    designPropertiesByBreakpoint: stylePropsIndexedByBreakpoint,\n    breakpoints,\n    node,\n    patternRootNodeIdsChain,\n  });\n  /* [Data Format] Stylesheet data provides objects containing `className`, `breakpointCondition`, and `css`.\n   * stylesheetData = [{\n   *    className: 'uniqueMD5Hash',\n   *    breakpointCondition: '<768px',\n   *    css: 'margin:13px;'\n   *    visibilityCss: 'display:none !important;'\n   *  }, ...]\n   */\n  const mediaQuery = convertResolvedDesignValuesToMediaQuery(stylesheetData);\n  /* [Data Format] `mediaQuery` is a joined string of all media query CSS code\n   * mediaQuery = \".cfstyles-123{margin:42px;}@media(max-width:768px){.cfstyles-456{margin:13px;}}\"\n   */\n  return {\n    styleProps,\n    mediaQuery,\n    customDesignProps,\n    contentProps,\n  };\n};\n"],"names":[],"mappings":";;;;AAgBA;AACA;;;;;;;;AAQG;AACH,MAAM,oBAAoB,GAAG,CAAC,QAAgB,KAAI;IAChD,OAAO,QAAQ,KAAK,sBAAsB,IAAI,QAAQ,CAAC,UAAU,CAAC,uBAAuB,CAAC,CAAC;AAC7F,CAAC,CAAC;AAmBW,MAAA,mBAAmB,GAAG,CAAC,EAClC,WAAW,EACX,mBAAmB,EACnB,uBAAuB,EACvB,IAAI,EACJ,kBAAkB,EAClB,iBAAiB,EACjB,qBAAqB,EACrB,mBAAmB,EACnB,qBAAqB,GA0BtB,KAAI;IACH,MAAM,UAAU,GAAsD,EAAE,CAAC;IACzE,MAAM,iBAAiB,GAAmC,EAAE,CAAC;IAC7D,MAAM,YAAY,GAAmC,EAAE,CAAC;IAExD,KAAK,CAAC,GAAG,CACP,yFAAyF,EACzF,IAAI,CAAC,EAAE,CACR,CAAC;AAEF,IAAA,KAAK,MAAM,CAAC,QAAQ,EAAE,cAAc,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,mBAAmB,CAAC,SAAS,CAAC,EAAE;QACtF,MAAM,aAAa,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC;AAC/C,QAAA,IAAI,CAAC,aAAa;YAAE,SAAS;AAE7B,QAAA,QAAQ,aAAa,CAAC,IAAI;YACxB,KAAK,aAAa,EAAE;AAClB,gBAAA,IAAI,kBAAkB,CAAC,QAAQ,CAAC,EAAE;;AAEhC,oBAAA,UAAU,CAAC,QAAQ,CAAC,GAAG,aAAa,CAAC,kBAAkB,CAAC;iBACzD;qBAAM;;oBAEL,iBAAiB,CAAC,QAAQ,CAAC,GAAG,kBAAkB,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC;iBACpF;gBACD,MAAM;aACP;YACD,KAAK,YAAY,EAAE;gBACjB,MAAM,UAAU,GAAG,iBAAiB,CAAC;AACnC,oBAAA,YAAY,EAAE,QAAQ;oBACtB,QAAQ,EAAE,cAAc,CAAC,IAAuC;AAChE,oBAAA,OAAO,EAAE,aAAa;AACvB,iBAAA,CAAC,CAAC;AAEH,gBAAA,MAAM,SAAS,GAAG,UAAU,IAAI,cAAc,CAAC,YAAY,CAAC;AAE5D,gBAAA,IAAI,oBAAoB,CAAC,QAAQ,CAAC,EAAE;;;;;;;;;;oBAUlC,UAAU,CAAC,QAAQ,CAAC,GAAG,MAAM,CAAC,WAAW,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;iBACtF;qBAAM;AACL,oBAAA,YAAY,CAAC,QAAQ,CAAC,GAAG,SAAS,CAAC;iBACpC;gBACD,MAAM;aACP;YAED,KAAK,gBAAgB,EAAE;gBACrB,MAAM,SAAS,GAAG,qBAAqB,CAAC;oBACtC,aAAa,EAAE,aAAa,CAAC,aAAa;AAC3C,iBAAA,CAAC,CAAC;gBACH,IAAI,SAAS,EAAE;AACb,oBAAA,YAAY,CAAC,QAAQ,CAAC,GAAG,SAAS,CAAC;iBACpC;gBACD,MAAM;aACP;YACD,KAAK,cAAc,EAAE;gBACnB,MAAM,YAAY,GAAG,mBAAmB,CAAC;oBACvC,UAAU,EAAE,aAAa,CAAC,GAAG;oBAC7B,YAAY,EAAE,cAAc,CAAC,YAAY;AAC1C,iBAAA,CAAC,CAAC;AAEH,gBAAA,IAAI,oBAAoB,CAAC,QAAQ,CAAC,EAAE;oBAClC,UAAU,CAAC,QAAQ,CAAC,GAAG,MAAM,CAAC,WAAW,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC;iBACzF;qBAAM;AACL,oBAAA,YAAY,CAAC,QAAQ,CAAC,GAAG,YAAY,CAAC;iBACvC;gBACD,MAAM;aACP;YACD,KAAK,gBAAgB,EAAE;;;gBAGrB,MAAM,SAAS,GACb,qBAAqB,CAAC;AACpB,oBAAA,YAAY,EAAE,QAAQ;oBACtB,UAAU,EAAE,aAAa,CAAC,GAAG;oBAC7B,QAAQ,EAAE,cAAc,CAAC,IAAI;oBAC7B,iBAAiB;AAClB,iBAAA,CAAC,IAAI,cAAc,CAAC,YAAY,CAAC;AAEpC,gBAAA,IAAI,oBAAoB,CAAC,QAAQ,CAAC,EAAE;oBAClC,UAAU,CAAC,QAAQ,CAAC,GAAG,MAAM,CAAC,WAAW,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC;iBACtF;qBAAM;AACL,oBAAA,YAAY,CAAC,QAAQ,CAAC,GAAG,SAAS,CAAC;iBACpC;gBACD,MAAM;aACP;SAGF;KACF;AACD;;;;;;AAMG;IAEH,MAAM,6BAA6B,GAAG,MAAM,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC,MAAM,CAErE,CAAC,GAAG,EAAE,CAAC,QAAQ,EAAE,kBAAkB,CAAC,KAAI;AACxC,QAAA,KAAK,MAAM,CAAC,YAAY,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,kBAAkB,CAAC,EAAE;AACtE,YAAA,IAAI,CAAC,GAAG,CAAC,YAAY,CAAC,EAAE;AACtB,gBAAA,GAAG,CAAC,YAAY,CAAC,GAAG,EAAE,CAAC;aACxB;YAED,GAAG,CAAC,YAAY,CAAC,CAAC,QAAQ,CAAC,GAAG,KAAK,CAAC;SACrC;AAED,QAAA,OAAO,GAAG,CAAC;KACZ,EAAE,EAAE,CAAC,CAAC;AACP;;;;;;;;;;;AAWG;IAEH,MAAM,cAAc,GAAG,iCAAiC,CAAC;AACvD,QAAA,4BAA4B,EAAE,6BAA6B;QAC3D,WAAW;QACX,IAAI;QACJ,uBAAuB;AACxB,KAAA,CAAC,CAAC;AACH;;;;;;;AAOG;AACH,IAAA,MAAM,UAAU,GAAG,uCAAuC,CAAC,cAAc,CAAC,CAAC;AAC3E;;AAEG;IACH,OAAO;QACL,UAAU;QACV,UAAU;QACV,iBAAiB;QACjB,YAAY;KACb,CAAC;AACJ;;;;"}
+{"version":3,"file":"parseComponentProps.js","sources":["../../../src/utils/parseComponentProps.ts"],"sourcesContent":["import { isCfStyleAttribute, debug } from '@contentful/experiences-core';\nimport {\n  BoundComponentPropertyTypes,\n  BoundValue,\n  Breakpoint,\n  ComponentDefinition,\n  ComponentDefinitionVariable,\n  ComponentDefinitionVariableType,\n  ComponentTreeNode,\n  DesignValue,\n  PrimitiveValue,\n  ResolveDesignValueType,\n} from '@contentful/experiences-core/types';\nimport { convertResolvedDesignValuesToMediaQuery } from '../core/styles/convertResolvedDesignValuesToMediaQuery';\nimport { createStylesheetsForBuiltInStyles } from '../core/styles/createStylesheetsForBuiltInStyles';\n\n// TODO: Test this for nested patterns as the name might be just a random hash without the actual name (needs to be validated).\n/**\n * Checks if prop is a \"siamese\" prop. So far we have only one such prop: `cfBackgroundImageUrl`.\n * It is considered \"siamese\" because despite being a content variable, it always goes in pair\n * (is coupled) with the `cfBackgroundImageOptions` design variable. Without presence of the\n * `cfBackgroundImageUrl` the `cfBackgroundImageOptions` is useless (and is not going to be\n * rendered by the styleTransformers.ts#transformBackgroundImageUrl()).\n *\n * Because of this coupling, we need to create an \"ephemeral\" cfBackgroundImageUrl style(!) prop.\n */\nconst isSpecialCaseCssProp = (propName: string) => {\n  return propName === 'cfBackgroundImageUrl' || propName.startsWith('cfBackgroundImageUrl_');\n};\n\n/**\n * The previous logic of prop mapping was too complex and mixed different ues cases together.\n * In this function, I aim to simplify the logic by focusing on the following specific cases FOR PREVIEW/DELIVERY MODES\n * 1) Any non `DesignValue` props should be resolved and returned as is\n * 2) Some exceptions like `cfImageAsset` and `cfBackgroundImageUrl` (BoundValue) should be handled separately\n * and be resolved for the default breakpoint only (cause we don't allow binding per breakpoint anyway)\n * 3) Those DesignValue props which can be converted to CSS should be grouped and resolved into a CSS media query\n * for each breakpoint\n * 4) Those DesignValue props which can NOT be converted to CSS (custom design props) should be resolved dynamically\n * for each breakpoint\n */\ntype ResolveBoundValueType = (data: {\n  propertyName: string;\n  dataType: ComponentDefinitionVariableType;\n  binding: BoundValue;\n}) => BoundComponentPropertyTypes;\n\nexport const parseComponentProps = ({\n  breakpoints,\n  componentDefinition,\n  patternRootNodeIdsChain,\n  node,\n  resolveDesignValue,\n  resolveBoundValue,\n  resolveHyperlinkValue,\n  resolveUnboundValue,\n  resolveComponentValue,\n}: {\n  breakpoints: Breakpoint[];\n  mainBreakpoint: Breakpoint;\n  componentDefinition: ComponentDefinition;\n  patternRootNodeIdsChain: Array<string>;\n  node: ComponentTreeNode;\n  resolveDesignValue: ResolveDesignValueType;\n  resolveBoundValue: ResolveBoundValueType;\n  resolveHyperlinkValue: (data: { linkTargetKey: string }) => string | null;\n  resolveUnboundValue: (data: {\n    mappingKey: string;\n    defaultValue: ComponentDefinitionVariable['defaultValue'];\n  }) => PrimitiveValue;\n  /**\n   * This method will be called to resolve the values for components that are native (not from nested pattern) to the previewed pattern\n   * Nested pattern's components are going to be resolved by the `resolvePattern` method from `assemblyUtils` file\n   * @param data\n   * @returns\n   */\n  resolveComponentValue: (data: {\n    propertyName: string;\n    mappingKey: string;\n    dataType: ComponentDefinitionVariableType;\n    resolveBoundValue: ResolveBoundValueType;\n  }) => PrimitiveValue;\n}) => {\n  const styleProps: Record<string, DesignValue['valuesByBreakpoint']> = {};\n  const customDesignProps: Record<string, PrimitiveValue> = {};\n  const contentProps: Record<string, PrimitiveValue> = {};\n\n  debug.log(\n    '[experiences-sdk-react::parseComponentProps] Parsing component props for node with id: ',\n    node.id,\n  );\n\n  for (const [propName, propDefinition] of Object.entries(componentDefinition.variables)) {\n    const propertyValue = node.variables[propName];\n    if (!propertyValue) continue;\n\n    switch (propertyValue.type) {\n      case 'DesignValue': {\n        if (isCfStyleAttribute(propName)) {\n          // for such properties we know how to convert them to CSS, so we will build a media query from it below after the loop is over\n          styleProps[propName] = propertyValue.valuesByBreakpoint;\n        } else {\n          // for custom design props, the value will be resolved with the javascript per breakpoint at runtime\n          customDesignProps[propName] = resolveDesignValue(propertyValue.valuesByBreakpoint);\n        }\n        break;\n      }\n      case 'BoundValue': {\n        const boundValue = resolveBoundValue({\n          propertyName: propName,\n          dataType: propDefinition.type as ComponentDefinitionVariableType,\n          binding: propertyValue,\n        });\n\n        const propValue = boundValue ?? propDefinition.defaultValue;\n\n        if (isSpecialCaseCssProp(propName)) {\n          // styleProps[propName] = { [mainBreakpoint.id]: propValue };\n          // Here we create kind of \"fake\" style property out of a bound value.\n          // As bound values are breakpoint-universal (they apply to all breakpoints),\n          // but styleProps are breakpoint-specific, we need to ensure that\n          // semantically our \"fake\" emphemeral style property will be universall as well,\n          // by expanding it to all the breakpoints. This is important as\n          // styleTransformers.ts#transformBackgroundImageUrl() expects\n          // cfBackgroundImageUrl to be present for all breakpoints\n          // where cfBackgroundImageOptions is present.\n          styleProps[propName] = Object.fromEntries(breakpoints.map((b) => [b.id, propValue]));\n        } else {\n          contentProps[propName] = propValue;\n        }\n        break;\n      }\n\n      case 'HyperlinkValue': {\n        const hyperlink = resolveHyperlinkValue({\n          linkTargetKey: propertyValue.linkTargetKey,\n        });\n        if (hyperlink) {\n          contentProps[propName] = hyperlink;\n        }\n        break;\n      }\n      case 'UnboundValue': {\n        const unboundValue = resolveUnboundValue({\n          mappingKey: propertyValue.key,\n          defaultValue: propDefinition.defaultValue,\n        });\n\n        if (isSpecialCaseCssProp(propName)) {\n          styleProps[propName] = Object.fromEntries(breakpoints.map((b) => [b.id, unboundValue]));\n        } else {\n          contentProps[propName] = unboundValue;\n        }\n        break;\n      }\n      case 'ComponentValue': {\n        // This can either be a design (style) or a content property.\n        // Where prebinding is used, we resolve like they are a BoundValue.\n        const propValue =\n          resolveComponentValue({\n            propertyName: propName,\n            mappingKey: propertyValue.key,\n            dataType: propDefinition.type,\n            resolveBoundValue,\n          }) ?? propDefinition.defaultValue;\n\n        if (isSpecialCaseCssProp(propName)) {\n          styleProps[propName] = Object.fromEntries(breakpoints.map((b) => [b.id, propValue]));\n        } else {\n          contentProps[propName] = propValue;\n        }\n        break;\n      }\n      default:\n        break;\n    }\n  }\n  /* [Data Format] After resolving all properties, `styleProps` contains solely the plain design values\n   * styleProps = {\n   *   cfMargin: { desktop: '42px', tablet: '13px' },\n   *   cfBackgroundColor: { desktop: 'rgba(246, 246, 246, 1)' },\n   *   cfBackgroundImage: { desktop: 'url(https://example.com/image.jpg)' }\n   * }\n   */\n\n  const stylePropsIndexedByBreakpoint = Object.entries(styleProps).reduce<\n    Record<string, Record<string, PrimitiveValue>>\n  >((acc, [propName, valuesByBreakpoint]) => {\n    for (const [breakpointId, value] of Object.entries(valuesByBreakpoint)) {\n      if (!acc[breakpointId]) {\n        acc[breakpointId] = {};\n      }\n\n      acc[breakpointId][propName] = value;\n    }\n\n    return acc;\n  }, {});\n  /* [Data Format] `stylePropsIndexedByBreakpoint` contains the plain design values grouped by breakpoint\n   * stylePropsIndexedByBreakpoint = {\n   *   desktop: {\n   *     cfMargin: '42px',\n   *     cfBackgroundColor: 'rgba(246, 246, 246, 1)',\n   *     cfBackgroundImage: 'url(https://example.com/image.jpg)'\n   *   },\n   *   tablet: {\n   *     cfMargin: '13px'\n   *   }\n   * }\n   */\n\n  const stylesheetData = createStylesheetsForBuiltInStyles({\n    designPropertiesByBreakpoint: stylePropsIndexedByBreakpoint,\n    breakpoints,\n    node,\n    patternRootNodeIdsChain,\n  });\n  /* [Data Format] Stylesheet data provides objects containing `className`, `breakpointCondition`, and `css`.\n   * stylesheetData = [{\n   *    className: 'uniqueMD5Hash',\n   *    breakpointCondition: '<768px',\n   *    css: 'margin:13px;'\n   *    visibilityCss: 'display:none !important;'\n   *  }, ...]\n   */\n  const mediaQuery = convertResolvedDesignValuesToMediaQuery(stylesheetData);\n  /* [Data Format] `mediaQuery` is a joined string of all media query CSS code\n   * mediaQuery = \".cfstyles-123{margin:42px;}@media(max-width:768px){.cfstyles-456{margin:13px;}}\"\n   */\n  return {\n    styleProps,\n    mediaQuery,\n    customDesignProps,\n    contentProps,\n  };\n};\n"],"names":[],"mappings":"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"}