@alpaca-headless/alpaca-headless 1.0.3819 → 1.0.3822

package/dist/components/Placeholder.js

@@ -1,4 +1,3 @@
-import { createElement as _createElement } from "react";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import "server-only";
 import Slot from "./Slot";
@@ -107,10 +106,10 @@ export async function Placeholder({ name, content, tag, className, description,
 }
 export function renderPlaceholder(wrap, componentsWithProps, placeholderData, context, description) {
     const renderMarkers = context.isEditing || context.isPreview;
-    return wrap(_jsxs(_Fragment, { children: [renderMarkers && (_jsx("script", { "data-placeholder-start": placeholderData.key, "data-description": description })), componentsWithProps.map(({ Component, data, props }) => {
-                var _a, _b, _c, _d, _e, _f, _g;
-                return (_jsx(_Fragment, { children: _jsxs(ErrorBoundary, { FallbackComponent: ErrorFallback, children: [renderMarkers && (_jsx("script", { "data-component-start": data.id, "data-itemid": ((_b = (_a = data._editor) === null || _a === void 0 ? void 0 : _a.linkedComponentItem) === null || _b === void 0 ? void 0 : _b.id) ||
-                                    data.id, "data-typeid": data.templateId, "data-version": (_d = (_c = data._editor) === null || _c === void 0 ? void 0 : _c.linkedComponentItem) === null || _d === void 0 ? void 0 : _d.version, "data-layoutid": (_f = (_e = data._editor) === null || _e === void 0 ? void 0 : _e.hostingPageItem) === null || _f === void 0 ? void 0 : _f.id })), _createElement(Component, Object.assign({}, props, { key: data.id })), renderMarkers && _jsx("script", { "data-component-end": data.id })] }, "EB" + data.id + ((_g = data.rendering) === null || _g === void 0 ? void 0 : _g.revision)) }));
+    return wrap(_jsxs(_Fragment, { children: [renderMarkers && (_jsx("script", { "data-placeholder-start": placeholderData.key, "data-description": description })), componentsWithProps.map(({ Component, data, props }, index) => {
+                var _a, _b, _c, _d, _e, _f;
+                return (_jsx(React.Fragment, { children: _jsxs(ErrorBoundary, { FallbackComponent: ErrorFallback, children: [renderMarkers && (_jsx("script", { "data-component-start": data.id, "data-itemid": ((_b = (_a = data._editor) === null || _a === void 0 ? void 0 : _a.linkedComponentItem) === null || _b === void 0 ? void 0 : _b.id) ||
+                                    data.id, "data-typeid": data.templateId, "data-version": (_d = (_c = data._editor) === null || _c === void 0 ? void 0 : _c.linkedComponentItem) === null || _d === void 0 ? void 0 : _d.version, "data-layoutid": (_f = (_e = data._editor) === null || _e === void 0 ? void 0 : _e.hostingPageItem) === null || _f === void 0 ? void 0 : _f.id })), _jsx(Component, Object.assign({}, props)), renderMarkers && _jsx("script", { "data-component-end": data.id })] }) }, index));
             }), placeholderData.hasMore && (_jsx(Suspense, { children: _jsx(LazyPlaceholder, { placeholder: placeholderData, context: context }) })), renderMarkers && _jsx("script", { "data-placeholder-end": placeholderData.key })] }));
 }
 function ComponentNotFound({ component }) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alpaca-headless/alpaca-headless",
-  "version": "1.0.3819",
+  "version": "1.0.3822",
   "type": "module",
   "description": "Alpaca Headless",
   "main": "dist/index.js",

package/src/components/Placeholder.tsx

@@ -209,12 +209,11 @@ export function renderPlaceholder(
         />
       )}
 
-      {componentsWithProps.map(({ Component, data, props }) => {
+      {componentsWithProps.map(({ Component, data, props }, index) => {
         return (
-          <>
+          <React.Fragment key={index}>
             <ErrorBoundary
               FallbackComponent={ErrorFallback}
-              key={"EB" + data.id + (data as ComponentData).rendering?.revision}
             >
               {renderMarkers && (
                 <script
@@ -233,10 +232,10 @@ export function renderPlaceholder(
                   }
                 />
               )}
-              <Component {...props} key={data.id} />
+              <Component {...props}  />
               {renderMarkers && <script data-component-end={data.id}></script>}
             </ErrorBoundary>
-          </>
+          </React.Fragment>
         );
       })}
       {placeholderData.hasMore && (