Merge pull request #20 from CalderaWP/master

Add button field type #19
CalderaWP · Jul 26, 2018 · 625b0e2 · 625b0e2
2 parents 8282f37 + 5f805b8
commit 625b0e2
Show file tree

Hide file tree

Showing 8 changed files with 44 additions and 341 deletions.
diff --git a/src/components/RenderGroup.js b/src/components/RenderGroup.js
@@ -108,6 +108,5 @@ RenderGroup.classNames = {
 	fieldGroup: 'caldera-config-group',
 	fieldWrapper: 'caldera-config-field',
 	input: 'field-config',
-	button: 'caldera-config-button',
 
 };
diff --git a/src/components/__snapshots__/renderGroup.test.js.snap b/src/components/__snapshots__/renderGroup.test.js.snap
@@ -1,66 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`The render group component Button fields inside render groups Button RenderGroup snapshots Renders a regular button 1`] = `
-<div
-  className="caldera-config-field-setup"
->
-  <div
-    className="caldera-config-group"
-  >
-    <div
-      className="caldera-config-field"
-    >
-      <label
-        htmlFor="RendersARegularButtonSnapShotTest"
-      >
-        Submit
-      </label>
-      <button
-        aria-describedby={null}
-        className="field-config field-config caldera-config-button"
-        disabled={false}
-        id="RendersARegularButtonSnapShotTest"
-        onBlur={undefined}
-        onClick={[Function]}
-        onFocus={undefined}
-      />
-    </div>
-  </div>
-</div>
-`;
-
-exports[`The render group component Button fields inside render groups Button RenderGroup snapshots Renders a submit input 1`] = `
-<div
-  className="caldera-config-field-setup"
->
-  <div
-    className="caldera-config-group"
-  >
-    <div
-      className="caldera-config-field"
-    >
-      <label
-        htmlFor="cf-button-example"
-      >
-        Submit
-      </label>
-      <input
-        aria-describedby={null}
-        className="field-config field-config caldera-config-button"
-        disabled={false}
-        id="cf-button-example"
-        onBlur={undefined}
-        onClick={[Function]}
-        onFocus={undefined}
-        required={undefined}
-        type="submit"
-        value={undefined}
-      />
-    </div>
-  </div>
-</div>
-`;
-
 exports[`The render group component Rendering with fields Does not error when passed empty array of fields 1`] = `
 <div
   className="caldera-config-field-setup"

diff --git a/src/components/fields/FieldInner.js b/src/components/fields/FieldInner.js
@@ -6,8 +6,6 @@ import {ariaDescribedbyAttr} from './util';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import {RenderGroup} from '../RenderGroup';
-import {Button} from "./button/Button";
-
 /**
  * Creates the field inside of a field group
  *
@@ -33,58 +31,44 @@ export const FieldInner = (props) => {
 	 */
 	function inputClassName() {
 		return classNames([
-				props.fieldClassName,
-				RenderGroup.classNames.input
-			]
+			props.fieldClassName,
+			RenderGroup.classNames.input
+		]
 		);
 	}
 
-	switch (props.type) {
-		case 'select':
-		case 'dropdown':
-			const options = Array.isArray(props.options) ? props.options : [];
-			return (
-				<SelectField
-					id={props.id}
-					fieldClassName={inputClassName()}
-					ariaDescribedbyAttr={ariaIdAttr()}
-					value={props.value}
-					onValueChange={props.onValueChange}
-					inputType={props.inputType}
-					options={options}
-					disabled={props.disabled}
-					onBlur={props.onBlur}
-					onFocus={props.onFocus}
-				/>
-			);
-		case 'button' :
-			return (
-				<Button
-					onClick={props.onClick}
-					id={props.id}
-					fieldClassName={inputClassName()}
-					ariaDescribedbyAttr={ariaIdAttr()}
-					value={props.value}
-					inputType={props.inputType}
-					disabled={props.disabled}
-					onBlur={props.onBlur}
-					onFocus={props.onFocus}
-				/>
-			);
-		default:
-		case 'input':
-			return (
-				<Input
-					id={props.id}
-					fieldClassName={inputClassName()}
-					ariaDescribedbyAttr={ariaIdAttr()}
-					value={props.value}
-					onValueChange={props.onValueChange}
-					inputType={props.inputType}
-					disabled={props.disabled}
-					onBlur={props.onBlur}
-					onFocus={props.onFocus}
-				/>);
+	switch( props.type ){
+	case 'select':
+	case 'dropdown':
+		const options = Array.isArray(props.options) ? props.options : [];
+		return (
+			<SelectField
+				id={props.id}
+				fieldClassName={inputClassName()}
+				ariaDescribedbyAttr={ariaIdAttr()}
+				value={props.value}
+				onValueChange={props.onValueChange}
+				inputType={props.inputType}
+				options={options}
+				disabled={props.disabled}
+				onBlur={props.onBlur}
+				onFocus={props.onFocus}
+			/>
+		);
+	default:
+	case 'input':
+		return (
+			<Input
+				id={props.id}
+				fieldClassName={inputClassName()}
+				ariaDescribedbyAttr={ariaIdAttr()}
+				value={props.value}
+				onValueChange={props.onValueChange}
+				inputType={props.inputType}
+				disabled={props.disabled}
+				onBlur={props.onBlur}
+				onFocus={props.onFocus}
+			/>);
 	}
 
 };

diff --git a/src/components/fields/button/Button.js b/src/components/fields/button/Button.js
diff --git a/src/components/fields/button/Button.test.js b/src/components/fields/button/Button.test.js
diff --git a/src/components/fields/button/__snapshots__/Button.test.js.snap b/src/components/fields/button/__snapshots__/Button.test.js.snap