feat(components): Added support for debug mode to DraftConfigurator

packages/components/src/DraftConfigurator/DraftSettingDebug/index.js

@@ -0,0 +1,4 @@
+import React from 'react'
+import PatternOptionBool from '../PatternOptionBool'
+
+export default (props) => <PatternOptionBool {...props} name="debug" />

packages/components/src/DraftConfigurator/DraftSettingDebug/stories.js

@@ -0,0 +1,22 @@
+import React from 'react'
+import { storiesOf } from '@storybook/react'
+import Sa from '.'
+
+const props = {
+  raiseEvent: (type, data) => console.log(`Action of type ${type} triggered, data passed is`, data),
+  updateValue: (name, value) => console.log(`Updated setting ${name}, value is now: ${value}`),
+  name: 'sa',
+  dflt: 'dflt',
+  title: 'Seam allowance',
+  desc:
+    "This is the seam allowance description. I'm wrapped in a p tag. This component only sets the CSS class on a non-default value. It's up to you to supply the CSS to style it.",
+  labels: {
+    none: 'No seam allowance',
+    dflt: 'Standard seam allowance',
+    custom: 'Custom seam allowance'
+  }
+}
+
+storiesOf('Low level/DraftSettingSa', module)
+  .add('Metric', () => <Sa {...props} units="metric" />)
+  .add('Imperial', () => <Sa {...props} units="imperial" />)

packages/components/src/DraftConfigurator/DraftSettings/index.js

@@ -5,6 +5,7 @@ import DraftSettingMargin from '../DraftSettingMargin'
 import DraftSettingComplete from '../DraftSettingComplete'
 import DraftSettingPaperless from '../DraftSettingPaperless'
 import DraftSettingAdvanced from '../DraftSettingAdvanced'
+import DraftSettingDebug from '../DraftSettingDebug'
 import DraftSettingUnits from '../DraftSettingUnits'
 import DraftSettingLanguage from '../DraftSettingLanguage'
 import DraftSettingOnly from '../DraftSettingOnly'
@@ -41,7 +42,8 @@ const DraftSettings = ({
     },
     paperless: noyes,
     advanced: hideshow,
-    complete: hideshow
+    complete: hideshow,
+    debug: noyes
   }
   // Methods
   const toggleGroup = (group) => {
@@ -65,6 +67,8 @@ const DraftSettings = ({
         return 2
       case 'units':
         return units
+      case 'debug':
+        return false
       default:
         return false
     }
@@ -103,7 +107,8 @@ const DraftSettings = ({
       <DraftSettingUnits {...addProps('units')} list={metricimperial} />,
       <DraftSettingComplete {...addProps('complete')} />,
       <DraftSettingMargin {...addProps('margin')} />,
-      <DraftSettingOnly {...addProps('only')} />
+      <DraftSettingOnly {...addProps('only')} />,
+      <DraftSettingDebug {...addProps('debug')} />
     ]
   }
 

packages/i18n/src/locales/en/settings.yml

@@ -33,3 +33,7 @@ complete:
 layout:
   title: Layout
   description: Controls how the individual pattern parts are placed on your pattern
+
+debug:
+  title: Debug
+  description: Enable debug to gain additional info about how your pattern was created