Grouped and multiple inputs. Scrollable edit form.

pieter-berkel · Jan 22, 2024 · 504bba2 · 504bba2
1 parent 133c58f
commit 504bba2
Show file tree

Hide file tree

Showing 14 changed files with 390 additions and 154 deletions.
diff --git a/examples/next/CHANGELOG.md b/examples/next/CHANGELOG.md
@@ -1,5 +1,13 @@
 # next-example
 
+## 0.1.11
+
+### Patch Changes
+
+- Updated dependencies
+  - @simple-builder/react@1.0.10
+  - @simple-builder/server@1.0.10
+
 ## 0.1.10
 
 ### Patch Changes

diff --git a/examples/next/app/[[...slug]]/builder-registery.ts b/examples/next/app/[[...slug]]/builder-registery.ts
@@ -60,21 +60,55 @@ builder.register(
         friendlyName: "Titel",
         defaultValue: "Hello World",
       },
+      {
+        type: "grouped",
+        name: "link",
+        multiple: true,
+        friendlyName: "Knop met link",
+        defaultValue: [
+          {
+            label: "Lees meer",
+            href: "/",
+          },
+        ],
+        inputs: [
+          {
+            type: "string",
+            name: "label",
+            friendlyName: "Label",
+          },
+          {
+            type: "string",
+            name: "href",
+            friendlyName: "Link",
+          },
+          {
+            type: "color",
+            name: "bg",
+            friendlyName: "Achtergrond",
+          },
+          {
+            type: "boolean",
+            name: "desc",
+            friendlyName: "Ja of Nee",
+          },
+        ],
+      },
     ],
     defaultStyles: {
       desktop: {
         color: "#ffffff",
         background: "#cecece",
-        margin: "0 16px",
-        padding: "0 24px",
+        // margin: "0 32px",
+        // padding: "0 24px",
         "border-radius": "25px",
         overflow: "hidden",
       },
-      mobile: {
-        "border-radius": "0px",
-        padding: "0px",
-        margin: "0px",
-      },
+      // mobile: {
+      //   "border-radius": "0px",
+      //   padding: "0px",
+      //   margin: "0px",
+      // },
     },
   },
 );

diff --git a/examples/next/components/hero.tsx b/examples/next/components/hero.tsx
@@ -1,11 +1,22 @@
+import Link from "next/link";
+
 type HeroProps = {
   title: string;
+  link: {
+    label: string;
+    href: string;
+  }[];
 };
 
 export const Hero = (props: HeroProps) => {
   return (
-    <div className="flex items-center justify-center min-h-[350px] relative">
+    <div className="flex flex-col gap-6 items-center justify-center min-h-[350px] relative">
       <h1 className="text-3xl font-bold text-center">{props.title}</h1>
+      {(props.link || []).map((link) => (
+        <Link href={link.href} key={link.href}>
+          {link.label}
+        </Link>
+      ))}
     </div>
   );
 };
diff --git a/examples/next/package.json b/examples/next/package.json
@@ -1,6 +1,6 @@
 {
   "name": "next-example",
-  "version": "0.1.10",
+  "version": "0.1.11",
   "private": true,
   "scripts": {
     "dev": "next dev",

diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md
@@ -1,5 +1,13 @@
 # @simple-builder/react
 
+## 1.0.10
+
+### Patch Changes
+
+- Grouped and multiple inputs. Scrollable edit form.
+- Updated dependencies
+  - @simple-builder/server@1.0.10
+
 ## 1.0.9
 
 ### Patch Changes

diff --git a/packages/react/package.json b/packages/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@simple-builder/react",
-  "version": "1.0.9",
+  "version": "1.0.10",
   "private": false,
   "description": "React package for the simple builder package.",
   "repository": "https://github.com/pieter-berkel/simple-builder.git",
@@ -37,6 +37,7 @@
     "@radix-ui/react-dialog": "^1.0.5",
     "@radix-ui/react-label": "^2.0.2",
     "@radix-ui/react-popover": "^1.0.7",
+    "@radix-ui/react-scroll-area": "^1.0.5",
     "@radix-ui/react-slot": "^1.0.2",
     "@radix-ui/react-switch": "^1.0.3",
     "@radix-ui/react-tabs": "^1.0.4",