From e1f55c7d3db22190dc1ff5bc2e284db1e00bfc58 Mon Sep 17 00:00:00 2001
From: Jeroen Reijs <jeroen.reijs@bettyblocks.com>
Date: Wed, 3 Jun 2020 11:25:13 +0200
Subject: [PATCH 1/2] fis: add stepper icon (#208)

---
 package.json           | 2 +-
 src/prefabs/step.js    | 2 +-
 src/prefabs/stepper.js | 2 +-
 yarn.lock              | 8 ++++----
 4 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/package.json b/package.json
index 53844c92d..16f53e794 100644
--- a/package.json
+++ b/package.json
@@ -5,7 +5,7 @@
   "license": "UNLICENSED",
   "private": false,
   "devDependencies": {
-    "@betty-blocks/cli": "^23.2.4",
+    "@betty-blocks/cli": "^23.4.0",
     "@commitlint/cli": "^8.3.5",
     "@commitlint/config-angular": "^8.3.4",
     "@commitlint/prompt-cli": "^8.3.5",
diff --git a/src/prefabs/step.js b/src/prefabs/step.js
index 17b822aeb..0d53af712 100644
--- a/src/prefabs/step.js
+++ b/src/prefabs/step.js
@@ -1,6 +1,6 @@
 (() => ({
   name: 'Step',
-  icon: 'ContainerIcon',
+  icon: 'StepperIcon',
   category: 'NAVIGATION',
   structure: [
     {
diff --git a/src/prefabs/stepper.js b/src/prefabs/stepper.js
index 9869eb658..413d8daca 100644
--- a/src/prefabs/stepper.js
+++ b/src/prefabs/stepper.js
@@ -1,6 +1,6 @@
 (() => ({
   name: 'Stepper',
-  icon: 'ContainerIcon',
+  icon: 'StepperIcon',
   category: 'NAVIGATION',
   structure: [
     {
diff --git a/yarn.lock b/yarn.lock
index 0cf6c7b41..4fe1a5c49 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -134,10 +134,10 @@
     lodash "^4.17.13"
     to-fast-properties "^2.0.0"
 
-"@betty-blocks/cli@^23.2.4":
-  version "23.2.4"
-  resolved "https://registry.yarnpkg.com/@betty-blocks/cli/-/cli-23.2.4.tgz#d20d28baaa000ade90d14e410747dd90d42626fc"
-  integrity sha512-9K/0lI3qL6epHWhz1JTXWJMy3zkRLx6AZy/a8910IslLX/7iADEY2HqU20WbBOBb1C5RVfz4OI2QSDpE+R2klw==
+"@betty-blocks/cli@^23.4.0":
+  version "23.4.0"
+  resolved "https://registry.yarnpkg.com/@betty-blocks/cli/-/cli-23.4.0.tgz#02a2336bca59f06d97ae6523a903869ab7f09ffe"
+  integrity sha512-0aW+GmZrUtt2WH+52eaH4kh47CNxiXkalqr7zzDkIf3C/bcAS3F4W6XnmGvEL3su8RBuPqMJOcbmufiv/qA0sA==
   dependencies:
     "@azure/ms-rest-js" "^2.0.4"
     "@azure/storage-blob" "^10.3.0"

From f46443f491a0130b163a1b9b29a88e98793e7a4c Mon Sep 17 00:00:00 2001
From: Anton van den Berg <anton@Antons-MacBook-Pro.local>
Date: Thu, 4 Jun 2020 09:57:55 +0200
Subject: [PATCH 2/2] feat: add hidden input component

---
 src/components/hiddenInput.js | 56 +++++++++++++++++++++++++++++++++++
 src/prefabs/hiddenInput.js    | 37 +++++++++++++++++++++++
 2 files changed, 93 insertions(+)
 create mode 100644 src/components/hiddenInput.js
 create mode 100644 src/prefabs/hiddenInput.js

diff --git a/src/components/hiddenInput.js b/src/components/hiddenInput.js
new file mode 100644
index 000000000..200917e58
--- /dev/null
+++ b/src/components/hiddenInput.js
@@ -0,0 +1,56 @@
+(() => ({
+  name: 'HiddenInput',
+  type: 'CONTENT_COMPONENT',
+  allowedTypes: [],
+  orientation: 'HORIZONTAL',
+  jsx: (() => {
+    const { defaultValue, required, disabled, actionInputId } = options;
+
+    const { getActionInput, useText, env } = B;
+    const isDev = env === 'dev';
+    const [currentValue, setCurrentValue] = useState(useText(defaultValue));
+    const actionInput = getActionInput(actionInputId);
+
+    useEffect(() => {
+      if (isDev) {
+        setCurrentValue(useText(defaultValue));
+      }
+    }, [isDev, defaultValue]);
+
+    const InputCmp = (
+      <input
+        className={isDev && classes.pristine}
+        type={isDev ? 'text' : 'hidden'}
+        name={actionInput && actionInput.name}
+        value={isDev ? currentValue || '{{ hidden input }}' : currentValue}
+        required={required}
+        disabled={disabled}
+      />
+    );
+
+    return isDev ? <div className={classes.root}>{InputCmp}</div> : InputCmp;
+  })(),
+  styles: () => () => ({
+    root: {
+      '& > *': {
+        pointerEvents: 'none',
+      },
+    },
+    pristine: {
+      borderWidth: '0.0625rem',
+      borderColor: '#AFB5C8',
+      borderStyle: 'dashed',
+      backgroundColor: '#F0F1F5',
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'center',
+      minHeight: '2rem',
+      width: '100%',
+      fontSize: '0.75rem',
+      color: '#262A3A',
+      textTransform: 'uppercase',
+      boxSizing: 'border-box',
+      textAlign: 'center',
+    },
+  }),
+}))();
diff --git a/src/prefabs/hiddenInput.js b/src/prefabs/hiddenInput.js
new file mode 100644
index 000000000..7393c84b2
--- /dev/null
+++ b/src/prefabs/hiddenInput.js
@@ -0,0 +1,37 @@
+(() => ({
+  name: 'HiddenInput',
+  icon: 'HiddenInputIcon',
+  category: 'FORM',
+  structure: [
+    {
+      name: 'HiddenInput',
+      options: [
+        {
+          value: [],
+          label: 'Value',
+          key: 'defaultValue',
+          type: 'VARIABLE',
+        },
+        {
+          value: '',
+          label: 'Input',
+          key: 'actionInputId',
+          type: 'ACTION_INPUT',
+        },
+        {
+          value: false,
+          label: 'Required',
+          key: 'required',
+          type: 'TOGGLE',
+        },
+        {
+          type: 'TOGGLE',
+          label: 'Disabled',
+          key: 'disabled',
+          value: false,
+        },
+      ],
+      descendants: [],
+    },
+  ],
+}))();