Allow specifying a separate label for Key in keyvaluelist inputs (#43)

`label` can now accept either a `string`, as before, or a more complex
object of `{key: string; value: string}` to allow defining labels for
both labels in `keyvaluelist` collection inputs.

`key` is only passed on to the server if `collection` is set to `keyvaluelist`
though it will accept both forms - `key` is dropped at submission-time.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@prismatic-io/spectral",
-  "version": "5.3.0",
+  "version": "5.3.1",
   "description": "Utility library for building Prismatic components",
   "keywords": [
     "prismatic"

src/index.ts

@@ -37,12 +37,24 @@ import {
 
 const convertInput = (
   key: string,
-  { default: defaultValue, type, ...rest }: InputFieldDefinition
+  {
+    default: defaultValue,
+    type,
+    label,
+    collection,
+    ...rest
+  }: InputFieldDefinition
 ): InputField => ({
   ...rest,
+  key,
   type,
   default: defaultValue ?? InputFieldDefaultMap[type],
-  key,
+  collection,
+  label: typeof label === "string" ? label : label.value,
+  keyLabel:
+    collection === "keyvaluelist" && typeof label === "object"
+      ? label.key
+      : undefined,
 });
 
 /**

src/types/Inputs.ts

@@ -13,7 +13,7 @@ interface BaseInputFieldDefinition {
   /** Data type the InputField will collect. */
   type: InputFieldType;
   /** Interface label of the InputField. */
-  label: string;
+  label: { key: string; value: string } | string;
   /** Collection type of the InputField */
   collection?: InputFieldCollection;
   /** Text to show as the InputField placeholder. */

src/types/server-types.ts

@@ -185,6 +185,8 @@ interface DefaultInputField {
   key: string;
   /** Interface label of the InputField. */
   label: string;
+  /** Interface label of the Key if the InputField is a 'keyvaluelist'. */
+  keyLabel?: string;
   /** Data type the InputField will collect. */
   type: InputFieldType;
   /** Collection type of the InputField */