@digigov/form 0.13.2 → 1.0.0-6b93ebf2

package/Questions/index.mdx

@@ -14,12 +14,14 @@ import {
   TableDataCell,
 } from '@digigov/react-core';
 
-import LeadText from "@site/src/components/LeadText";
+import LeadText from '@site/src/components/LeadText';
 
-<LeadText>Question pages are used to ask users meaningful questions needed by
-your GOV.GR service, or even gather data about their persona or their
-application status. Use step questions to make bigger forms less scary and
-easier to fill out.</LeadText>
+<LeadText>
+  Question pages are used to ask users meaningful questions needed by your
+  GOV.GR service, or even gather data about their persona or their application
+  status. Use step questions to make bigger forms less scary and easier to fill
+  out.
+</LeadText>
 
 ## Introduction to Question pages
 
@@ -94,10 +96,10 @@ const steps = [
           primary: 'Birthday',
         },
         type: 'date',
-        required: true
-      }
-    ]
-  }
+        required: true,
+      },
+    ],
+  },
 ];
 
 export default function Index() {
@@ -152,18 +154,13 @@ Each step can be defined using a `Step` React component and all steps should be
 place inside a `Questions` component, that will provide the steps subcomponents
 the required state.
 
-First, you declare an array called `steps` and then you pass it to `<Questions
-/>` as a prop. Then for each step you can declare a `<Step />` component and
+First, you declare an array called `steps` and then you pass it to `<Questions />` as a prop. Then for each step you can declare a `<Step />` component and
 its subsequent subcomponents that you customise as needed, like the step title,
 description or form. You can also add components that are not form-specific,
 adding paragraphs or other custom components.
 
 ```jsx
-<Questions
-  name="example"
-  steps={steps}
-  onSubmit={(data) => doSomething(data)}
->
+<Questions name="example" steps={steps} onSubmit={(data) => doSomething(data)}>
   {/* more steps could be rendered here ... */}
   <Step name="age">
     <StepTitle />
@@ -181,21 +178,21 @@ adding paragraphs or other custom components.
 Steps can be described using `StepInterface` interface declared as a JSON
 object. The most basic properties are the following:
 
-* `name` - a unique identifier, must be different for each step
-* `title` - the main questions title that communicates to the users what this
+- `name` - a unique identifier, must be different for each step
+- `title` - the main questions title that communicates to the users what this
   question page is about, rendered by `StepTitle`
-* `fields` - an array that describes each input field that will be rendered in
+- `fields` - an array that describes each input field that will be rendered in
   the `StepForm`. Each fields implements the `FieldSpec` interface as a JSON object.
 
 ```json title="step-name.json"
 {
-  name: 'name',
-  title: 'What is your name?',
-  fields: [
+  "name": "name",
+  "title": "What is your name?",
+  "fields": [
     {
-      key: 'name',
-      type: 'string',
-      required: true,
+      "key": "name",
+      "type": "string",
+      "required": true
     }
   ]
 }
@@ -264,7 +261,7 @@ const steps = [
 
 For example, you may use a form to determine if citizens are adults or not, and
 we want to ask users different questions according to their persona. We can use
-a branch between the `age` step and the other two steps.  
+a branch between the `age` step and the other two steps.
 
 ```jsx live
 import React from 'react';
@@ -292,11 +289,11 @@ const steps = [
         key: 'age',
         type: 'int',
         required: true,
-      }
+      },
     ],
     nextStep: (data) => {
       return data.age < 18 ? 'citizen-adult' : 'citizen-underage';
-    }
+    },
   },
   {
     name: 'citizen-underage',
@@ -309,17 +306,17 @@ const steps = [
         extra: {
           options: [
             {
-              label: {primary: "Yes"},
+              label: { primary: 'Yes' },
               value: 'yes',
             },
             {
-              label: {primary: "No"},
+              label: { primary: 'No' },
               value: 'no',
-            }
-          ]
-        }
-      }
-    ]
+            },
+          ],
+        },
+      },
+    ],
   },
   {
     name: 'citizen-adult',
@@ -332,17 +329,17 @@ const steps = [
         extra: {
           options: [
             {
-              label: {primary: "Yes"},
+              label: { primary: 'Yes' },
               value: 'yes',
             },
             {
-              label: {primary: "No"},
+              label: { primary: 'No' },
               value: 'no',
-            }
-          ]
-        }
-      }
-    ]
+            },
+          ],
+        },
+      },
+    ],
   },
 ];
 
@@ -396,7 +393,7 @@ export default function Index() {
 }
 ```
 
-## Prop types 
+## Prop types
 
 <TableContainer>
   <Table>
@@ -409,7 +406,7 @@ export default function Index() {
     </TableHead>
     <TableBody>
       <TableRow>
-        <TableDataCell>Πρώτες 6 εβδομάδες   </TableDataCell>
+        <TableDataCell>Πρώτες 6 εβδομάδες </TableDataCell>
         <TableDataCell> €109.80 / εβδομάδα</TableDataCell>
         <TableDataCell> €69.80 / εβδομάδα</TableDataCell>
       </TableRow>

package/Questions/index.spec.js

@@ -6,10 +6,10 @@ var React = _interopRequireWildcard(require("react"));
 
 var _enzyme = require("enzyme");
 
-var _Questions = _interopRequireWildcard(require("@digigov/form/Questions"));
-
 var _form = require("@digigov/form");
 
+var _Questions = _interopRequireWildcard(require("@digigov/form/Questions"));
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }