@worksafevictoria/wcl7.5 1.1.0-beta.9 → 1.1.0-beta.91

package/src/components/SubComponents/FormInstance/stories/date.stories.js

@@ -0,0 +1,76 @@
+import FormInstance from '../index.vue'
+import date from './mocks/date.json'
+import datetime from './mocks/datetime.json'
+import time from './mocks/time.json'
+import datelist from './mocks/datelist.json'
+
+export default {
+    title: 'Form/Date Controls',
+    component: FormInstance,
+    argTypes: {
+      preview: {
+        control: 'boolean',
+        defaultValue: true,
+        table: {
+          disable: true
+        }
+      },
+      contentApiUrl: {
+        control: 'text',
+       defaultValue: process.env.CONTENT_API_URL
+      },
+      processID: {
+        control: 'text',
+        defaultValue: 'proc-id-form-date-controls',
+        table: {
+          disable: true
+        }
+      },
+      formid: {
+        control: 'string',
+        defaultValue: '',
+        table: {
+          disable: true
+        }
+      },
+      type: {
+        control: 'text',
+        defaultValue: '',
+        table: {
+          disable: true
+        }
+      },
+      webFormJson: {
+        control: 'object'
+      }
+    },
+    args: {
+      processID: 'proc-id-form-date-controls',
+      preview: true,
+      contentApiUrl:process.env.CONTENT_API_URL
+    }
+  }
+
+export const Date = {}
+Date.args = {
+  type: 'date',
+  webFormJson: date
+}
+
+export const DateTime = {}
+DateTime.args = {
+  type: 'datetime',
+  webFormJson: datetime
+}
+
+export const Time = {}
+Time.args = {
+  type: 'webform_time',
+  webFormJson: time
+}
+
+export const DateList = {}
+DateList.args = {
+  type: 'date_list',
+  webFormJson: datelist
+}

package/src/components/SubComponents/FormInstance/stories/fileupload.stories.js

@@ -0,0 +1,57 @@
+import FormInstance from '../index.vue'
+import fileupload from './mocks/fileupload.json'
+
+export default {
+    title: 'Form/File Upload',
+    component: FormInstance,
+    argTypes: {
+      preview: {
+        control: 'boolean',
+        defaultValue: true,
+        table: {
+          disable: true
+        }
+      },
+      contentApiUrl: {
+        control: 'text',
+       defaultValue: process.env.CONTENT_API_URL
+      },
+      processID: {
+        control: 'text',
+        defaultValue: 'proc-id-form-advanced-controls',
+        table: {
+          disable: true
+        }
+      },
+      formid: {
+        control: 'string',
+        defaultValue: '',
+        table: {
+          disable: true
+        }
+      },
+      type: {
+        control: 'text',
+        defaultValue: '',
+        table: {
+          disable: true
+        }
+      },
+      webFormJson: {
+        control: 'object'
+      }
+    },
+    args: {
+      processID: 'proc-id-form-advanced-controls',
+      preview: true,
+      contentApiUrl:process.env.CONTENT_API_URL
+  
+    }
+  }
+
+export const FileUpload = {args : {
+    type: 'managed_file',
+    webFormJson: fileupload,
+  
+  }
+}

package/src/components/SubComponents/FormInstance/stories/form-alert.stories.js

@@ -0,0 +1,93 @@
+import FormAlert from '../components/alert/index.vue'
+import wizard from './mocks/wizard.json'
+import FormInstance from '../index.vue'
+
+// export default Meta('Alerts')
+export default {
+    title: 'Form/Alerts',
+    component: FormInstance,
+    argTypes: {
+      preview: {
+        control: 'boolean',
+        defaultValue: true,
+        table: {
+          disable: true
+        }
+      },
+      contentApiUrl: {
+        control: 'text',
+       defaultValue: process.env.CONTENT_API_URL
+      },
+      processID: {
+        control: 'text',
+        defaultValue: 'proc-id-form-alerts',
+        table: {
+          disable: true
+        }
+      },
+      formid: {
+        control: 'string',
+        defaultValue: '',
+        table: {
+          disable: true
+        }
+      },
+      type: {
+        control: 'text',
+        defaultValue: '',
+        table: {
+          disable: true
+        }
+      },
+      webFormJson: {
+        control: 'object'
+      }
+    },
+    args: {
+      processID: 'proc-id-form-alerts',
+      preview: true,
+      contentApiUrl:process.env.CONTENT_API_URL
+    }
+  }
+
+const ErrorForm = (args, { argTypes }) => ({
+  components: { FormAlert, FormInstance },
+  props: Object.keys(argTypes),
+  data() {
+    return {
+      webformJSON: wizard
+    }
+  },
+  template: `
+        <div>
+        <form-alert
+                v-bind="$props"
+                :message="'submission error'"
+                :fields="[{
+                    label: 'field label 5',
+                    elementClass: 'custom-formio-8',
+                    error: 'the selection is not unique'
+                }]"
+                :is-error="true"
+            />
+            <form-alert
+                v-bind="$props"
+                :message="'submission success'"
+                :is-error="false"
+            />
+            </form-alert>
+            <form-instance
+                v-bind="$props"
+                :formid="'formid'"
+                :content-api-url="'contentApiUrl'"
+                :web-form-json="webformJSON"
+                :preview="true"
+            />
+        </div>
+      `
+})
+
+export const Error = {}
+ErrorForm.args = {
+  webformJSON: wizard
+}

package/src/components/SubComponents/FormInstance/stories/index.stories.js

@@ -0,0 +1,63 @@
+import FormInstance from '../index.vue'
+import jahd from './mocks/jahd.json'
+import quad from './mocks/quad.json'
+
+export default {
+    title: 'Form/Full Form',
+    component: FormInstance,
+    argTypes: {
+      preview: {
+        control: 'boolean',
+        defaultValue: true,
+        table: {
+          disable: true
+        }
+      },
+      contentApiUrl: {
+        control: 'text',
+       defaultValue: process.env.CONTENT_API_URL
+      },
+      processID: {
+        control: 'text',
+        defaultValue: 'proc-id-form-full-form',
+        table: {
+          disable: true
+        }
+      },
+      formid: {
+        control: 'string',
+        defaultValue: '',
+        table: {
+          disable: true
+        }
+      },
+      type: {
+        control: 'text',
+        defaultValue: '',
+        table: {
+          disable: true
+        }
+      },
+      webFormJson: {
+        control: 'object'
+      }
+    },
+    args: {
+      processID: 'proc-id-form-full-form',
+      preview: true,
+      contentApiUrl:process.env.CONTENT_API_URL
+    }
+}
+
+export const CustomValidation = {}
+CustomValidation.args = {
+  type: 'Jobs At Home Day',
+  webFormJson: jahd
+}
+
+export const CustomStyles = {}
+CustomStyles.args = {
+  type: 'Quad Bikes',
+  webFormJson: quad
+}
+

package/src/components/SubComponents/FormInstance/stories/layout.stories.js

@@ -0,0 +1,85 @@
+import FormInstance from '../index.vue'
+import container from './mocks/container.json'
+import section from './mocks/section.json'
+import table from './mocks/table.json'
+import details from './mocks/details.json'
+import fieldset from './mocks/fieldset.json'
+import flexbox from './mocks/flexbox.json'
+
+
+export default {
+    title: 'Form/Layout Controls',
+    component: FormInstance,
+    argTypes: {
+      preview: {
+        control: 'boolean',
+        defaultValue: true,
+        table: {
+          disable: true
+        }
+      },
+      contentApiUrl: {
+        control: 'text',
+       defaultValue: process.env.CONTENT_API_URL
+      },
+      processID: {
+        control: 'text',
+        defaultValue: 'proc-id-form-layout-controls',
+        table: {
+          disable: true
+        }
+      },
+      formid: {
+        control: 'string',
+        defaultValue: '',
+        table: {
+          disable: true
+        }
+      },
+      type: {
+        control: 'text',
+        defaultValue: '',
+        table: {
+          disable: true
+        }
+      },
+      webFormJson: {
+        control: 'object'
+      }
+    },
+    args: {
+      processID: 'proc-id-form-layout-controls',
+      preview: true,
+      contentApiUrl:process.env.CONTENT_API_URL
+    }
+  }
+
+export const Container = {}
+Container.args = {
+  webFormJson: container
+}
+
+export const Details = {}
+Details.args = {
+  webFormJson: details
+}
+
+export const Fieldset = {}
+Fieldset.args = {
+  webFormJson: fieldset
+}
+
+export const Flexbox = {}
+Flexbox.args = {
+  webFormJson: flexbox
+}
+
+export const Section = {}
+Section.args = {
+  webFormJson: section
+}
+
+export const Table = {}
+Table.args = {
+  webFormJson: table
+}

package/src/components/SubComponents/FormInstance/stories/markup.stories.js

@@ -0,0 +1,91 @@
+import FormInstance from '../index.vue'
+import advancedhtml from './mocks/advancedhtml.json'
+import basichtml from './mocks/basichtml.json'
+import horizontalrule from './mocks/horizontalrule.json'
+import label from './mocks/label.json'
+import message from './mocks/message.json'
+import more from './mocks/more.json'
+
+// export default Meta('Markup Controls')
+export default {
+    title: 'Form/Markup Controls',
+    component: FormInstance,
+    argTypes: {
+      preview: {
+        control: 'boolean',
+        defaultValue: true,
+        table: {
+          disable: true
+        }
+      },
+      contentApiUrl: {
+        control: 'text',
+       defaultValue: process.env.CONTENT_API_URL
+      },
+      processID: {
+        control: 'text',
+        defaultValue: 'proc-id-form-markup-controls',
+        table: {
+          disable: true
+        }
+      },
+      formid: {
+        control: 'string',
+        defaultValue: '',
+        table: {
+          disable: true
+        }
+      },
+      type: {
+        control: 'text',
+        defaultValue: '',
+        table: {
+          disable: true
+        }
+      },
+      webFormJson: {
+        control: 'object'
+      }
+    },
+    args: {
+      processID: 'proc-id-form-markup-controls',
+      preview: true,
+      contentApiUrl:process.env.CONTENT_API_URL
+    }
+  }
+
+export const AdvancedHTML = {}
+AdvancedHTML.args = {
+  type: 'processed_text',
+  webFormJson: advancedhtml
+}
+
+export const BasicHTML = {}
+BasicHTML.args = {
+  type: 'webform_markup',
+  webFormJson: basichtml
+}
+
+export const HorizontalRule = {}
+HorizontalRule.args = {
+  type: 'webform_horizontal_rule',
+  webFormJson: horizontalrule
+}
+
+export const Label = {}
+Label.args = {
+  type: 'label',
+  webFormJson: label
+}
+
+export const Message = {}
+Message.args = {
+  type: 'webform_message',
+  webFormJson: message
+}
+
+export const More = {}
+More.args = {
+  type: 'webform_more',
+  webFormJson: more
+}