diff --git a/fixtures/webstudio-custom-template/app/__generated__/[sitemap.xml]._index.tsx b/fixtures/webstudio-custom-template/app/__generated__/[sitemap.xml]._index.tsx
index 5e4d20aaec15..0cc85277fb84 100644
--- a/fixtures/webstudio-custom-template/app/__generated__/[sitemap.xml]._index.tsx
+++ b/fixtures/webstudio-custom-template/app/__generated__/[sitemap.xml]._index.tsx
@@ -35,7 +35,7 @@ const Page = ({ system: system }: { system: any }) => {
         tag={"urlset"}
         xmlns={"http://www.sitemaps.org/schemas/sitemap/0.9"}
       >
-        {sitemapxml?.data?.map((url: any, index: number) => (
+        {sitemapxml?.data?.map?.((url: any, index: number) => (
           <Fragment key={index}>
             <XmlNode tag={"url"}>
               <XmlNode tag={"loc"}>
diff --git a/fixtures/webstudio-remix-vercel/app/__generated__/[resources]._index.tsx b/fixtures/webstudio-remix-vercel/app/__generated__/[resources]._index.tsx
index 5aa5c2e5d698..192c01a3fbb9 100644
--- a/fixtures/webstudio-remix-vercel/app/__generated__/[resources]._index.tsx
+++ b/fixtures/webstudio-remix-vercel/app/__generated__/[resources]._index.tsx
@@ -33,7 +33,7 @@ const Page = ({}: { system: any }) => {
   let list = useResource("list_1");
   return (
     <Body className={`w-body`}>
-      {list?.data?.map((collectionItem: any, index: number) => (
+      {list?.data?.map?.((collectionItem: any, index: number) => (
         <Fragment key={index}>
           <Box className={`w-box`}>
             <HtmlEmbed code={collectionItem?.name} className={`w-html-embed`} />
diff --git a/fixtures/webstudio-remix-vercel/app/__generated__/[sitemap.xml]._index.tsx b/fixtures/webstudio-remix-vercel/app/__generated__/[sitemap.xml]._index.tsx
index 0a37dd532259..6fe73ffb71e3 100644
--- a/fixtures/webstudio-remix-vercel/app/__generated__/[sitemap.xml]._index.tsx
+++ b/fixtures/webstudio-remix-vercel/app/__generated__/[sitemap.xml]._index.tsx
@@ -45,7 +45,7 @@ const Page = ({ system: system }: { system: any }) => {
             path: "/olegs-test",
             lastModified: "2024-05-07",
           },
-        ]?.map((url: any, index: number) => (
+        ]?.map?.((url: any, index: number) => (
           <Fragment key={index}>
             <XmlNode tag={"url"}>
               <XmlNode tag={"loc"}>
diff --git a/packages/react-sdk/src/component-generator.test.tsx b/packages/react-sdk/src/component-generator.test.tsx
index 2367cf829d28..711234f7625e 100644
--- a/packages/react-sdk/src/component-generator.test.tsx
+++ b/packages/react-sdk/src/component-generator.test.tsx
@@ -458,7 +458,7 @@ test("generate collection component as map", () => {
   ).toEqual(
     validateJSX(
       clear(`
-    {data?.map((element: any, index: number) =>
+    {data?.map?.((element: any, index: number) =>
     <Fragment key={index}>
     <Label />
     <Button
@@ -636,7 +636,7 @@ test("avoid generating collection parameter variable as state", () => {
     const Page = () => {
     let [data, set$data] = useVariableState<any>(["apple","orange","mango"])
     return <Body>
-    {data?.map((element: any, index: number) =>
+    {data?.map?.((element: any, index: number) =>
     <Fragment key={index}>
     </Fragment>
     )}
@@ -854,7 +854,7 @@ let [condition, set$condition] = useVariableState<any>(false)
 return <Body>
 {(condition) &&
 <>
-{[]?.map((collectionItem: any, index: number) =>
+{[]?.map?.((collectionItem: any, index: number) =>
 <Fragment key={index}>
 </Fragment>
 )}
diff --git a/packages/react-sdk/src/component-generator.ts b/packages/react-sdk/src/component-generator.ts
index 154a7f2a2d3a..87a5899ec2a6 100644
--- a/packages/react-sdk/src/component-generator.ts
+++ b/packages/react-sdk/src/component-generator.ts
@@ -251,8 +251,9 @@ export const generateJsxElement = ({
       return "";
     }
     const indexVariable = scope.getName(`${instance.id}-index`, "index");
-    // fix implicit any error
-    generatedElement += `{${collectionDataValue}?.map((${collectionItemValue}: any, ${indexVariable}: number) =>\n`;
+    // collection can be nullable or invalid type
+    // fix implicitly on published sites
+    generatedElement += `{${collectionDataValue}?.map?.((${collectionItemValue}: any, ${indexVariable}: number) =>\n`;
     generatedElement += `<Fragment key={${indexVariable}}>\n`;
     generatedElement += children;
     generatedElement += `</Fragment>\n`;
