Initial commit

Co-Authored-By: kotte <14197736+mrtamagotchi@users.noreply.github.com>
Co-Authored-By: mikaeltellhed <2311083+mikaeltellhed@users.noreply.github.com>
Co-Authored-By: Tore Knudsen <18231882+torekndsn@users.noreply.github.com>
Co-Authored-By: Michael Cartner <32543275+michaelcartner@users.noreply.github.com>

nodes/_overview.tsx

@@ -0,0 +1,65 @@
+import React from 'react'
+import { Section } from '../src/components/layout/Section/Section'
+import { Text } from '../src/components/typography/Text/Text'
+import { Grid, GridLayout } from '../src/components/layout/Grid/Grid'
+import { NodeCard, NodeType } from '../src/components/cards/NodeCard/NodeCard'
+import { getNodePageData } from '../static/data/nodeData'
+
+function recursiveRender(data) {
+    if ('title' in data) {
+        return (
+            <Section key={data.key} title={data.title} linkLabel={false}>
+                {data.description && (
+                    <Text>
+                        <span
+                            dangerouslySetInnerHTML={{
+                                __html: data.description,
+                            }}
+                        />
+                    </Text>
+                )}
+                <Grid layout={GridLayout.Fifths}>
+                    {data.items.map(recursiveRender)}
+                </Grid>
+            </Section>
+        )
+    } else {
+        return <NodeCard {...data} />
+    }
+}
+
+export function NodeReferenceListing() {
+    return <div>{getNodePageData().map(recursiveRender)}</div>
+}
+
+export function NodeColorGuide({ text }) {
+    return (
+        <Section title="Node colors" linkLabel={null}>
+            <Grid layout={GridLayout.Grid_2_3}>
+                <Text>{text}</Text>
+
+                <div>
+                    <Grid layout={GridLayout.Thirds}>
+                        <NodeCard
+                            label="Visual nodes"
+                            nodeType={NodeType.Visual}
+                        />
+                        <NodeCard label="Data nodes" nodeType={NodeType.Data} />
+                        <NodeCard
+                            label="Custom code nodes"
+                            nodeType={NodeType.Custom}
+                        />
+                        <NodeCard
+                            label="Logic nodes"
+                            nodeType={NodeType.Logic}
+                        />
+                        <NodeCard
+                            label="Connection nodes"
+                            nodeType={NodeType.Connection}
+                        />
+                    </Grid>
+                </div>
+            </Grid>
+        </Section>
+    )
+}