feat(link): support the changes from Strapi 5.30.x (#21)

Author: cyp3rius

.nvmrc

@@ -1 +1 @@
-v20.12.0
+v20

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sensinum/astro-strapi-blocks",
-  "version": "1.2.4",
+  "version": "1.2.5",
   "description": "Astro components for Strapi Block Field",
   "keywords": ["astro", "strapi", "blocks", "components", "astro-component", "withastro", "astro-loader", "content-layer", "astro-integration"],
   "type": "module",

src/components/blocks/items/StrapiBlockLinkItem.astro

@@ -6,12 +6,14 @@ import type { StrapiBlockTextItem, StrapiBlockTextNodePartial } from "../../../t
 
 type Props = {
     url: string;
+    target?: string;
+    rel?: string;
     class?: string;
     data: Array<StrapiBlockTextItem>;
     theme: StrapiBlockTextNodePartial;
 };
 
-const { data, url, class: classes = "", theme = {} as StrapiBlockTextNodePartial } = Astro.props;
+const { data, url, target = "", rel = "", class: classes = "", theme = {} as StrapiBlockTextNodePartial } = Astro.props;
 
 ---
 
@@ -20,6 +22,8 @@ const { data, url, class: classes = "", theme = {} as StrapiBlockTextNodePartial
         <a
             class={classes}
             href={url}
+            target={target}
+            rel={rel}
         >
             {data.map((item: StrapiBlockTextItem) => (
                 <Text data={item} theme={theme} />

src/components/blocks/items/StrapiBlockNode.astro

@@ -1,24 +1,40 @@
 ---
-import Text from './StrapiBlockTextItem.astro';
-import Link from './StrapiBlockLinkItem.astro';
-import type { StrapiBlockTextItem, StrapiBlockLinkItem, StrapiBlockNode, StrapiBlockTextNodePartial } from '../../../types';
+import Text from "./StrapiBlockTextItem.astro";
+import Link from "./StrapiBlockLinkItem.astro";
+import type {
+    StrapiBlockTextItem,
+    StrapiBlockLinkItem,
+    StrapiBlockNode,
+    StrapiBlockTextNodePartial,
+} from "../../../types";
 
 type Props = {
     data: Array<StrapiBlockNode>;
     theme: StrapiBlockTextNodePartial;
-}
+};
 
 const { data, theme = {} as StrapiBlockTextNodePartial } = Astro.props;
-
 ---
-{ data.map((item: StrapiBlockNode) => {
-    if ((item as StrapiBlockTextItem)?.text) {
-        return (<Text data={item as StrapiBlockTextItem} theme={theme} />);
-    }
 
-    if ((item as StrapiBlockLinkItem)?.url) {
-        return (<Link class={theme.link.join(' ')} url={(item as StrapiBlockLinkItem)?.url} data={(item as StrapiBlockLinkItem).children} theme={theme} />);
-    }
+{
+    data.map((item: StrapiBlockNode) => {
+        if ((item as StrapiBlockTextItem)?.text) {
+            return <Text data={item as StrapiBlockTextItem} theme={theme} />;
+        }
 
-    return null;
-}) }
+        if ((item as StrapiBlockLinkItem)?.url) {
+            return (
+                <Link
+                    class={theme.link.join(" ")}
+                    url={(item as StrapiBlockLinkItem)?.url}
+                    target={(item as StrapiBlockLinkItem)?.target}
+                    rel={(item as StrapiBlockLinkItem)?.rel}
+                    data={(item as StrapiBlockLinkItem).children}
+                    theme={theme}
+                />
+            );
+        }
+
+        return null;
+    })
+}

src/types/strapi.ts

@@ -31,6 +31,8 @@ export type StrapiBlockTextItem = {
 
 export type StrapiBlockLinkItem = {
     url: string;
+    target?: string;
+    rel?: string;
     type: 'link';
     children: Array<StrapiBlockTextItem>;
 };