worksafe-component-library - npm Package Compare versions

Comparing version 1.5.0 to 1.5.1

docs/overview/5-Changelog.md

 # Changelog
 
 - vX
+- v1.5.1
+    - Add Action Complete component
+    - Tidy up some svgs
+    - Give Modals and their Action How To story some layout attention
 - v1.5.0
@@ -5,0 +9,0 @@ - Add link to Curated Content header

package.json

 {
   "name": "worksafe-component-library",
-  "version": "1.5.0",
+  "version": "1.5.1",
   "description": "A Vue.js component library for use in WorkSafe family websites",
@@ -5,0 +5,0 @@ "main": "./src/index.js",

src/components/Content/ActionSteps/stories.js

@@ -8,6 +8,4 @@ import { storiesOf } from '@storybook/vue'
 const topic = 'bullying'
-const text = "I've completed this step"
+const checkLabel = "I've completed this step"
 
-// const title = 'Asbestos should be identified by a suitable person who:'
-
 const blocksVideo = [
@@ -99,3 +97,3 @@ {
     components: { ActionSteps },
-    template: '<action-steps :blocks="blocksVideo" :step="1" :topic="topic" :text="text"></action-steps>',
+    template: '<action-steps :blocks="blocksVideo" :step="1" :topic="topic" :labelCheck="labelCheck"></action-steps>',
     data () {
@@ -105,3 +103,3 @@ return {
         topic,
-        text
+        checkLabel
       }
@@ -113,3 +111,3 @@ }
     components: { ActionSteps },
-    template: '<action-steps :blocks="blocksChecklist" :step="2" :topic="topic" :text="text"></action-steps>',
+    template: '<action-steps :blocks="blocksChecklist" :step="2" :topic="topic" :labelCheck="labelCheck"></action-steps>',
     data () {
@@ -119,3 +117,3 @@ return {
         topic,
-        text
+        checkLabel
       }
@@ -127,3 +125,3 @@ }
     components: { ActionSteps },
-    template: '<action-steps :blocks="blocksText" :step="3" :topic="topic" :text="text"></action-steps>',
+    template: '<action-steps :blocks="blocksText" :step="3" :topic="topic" :labelCheck="labelCheck"></action-steps>',
     data () {
@@ -133,3 +131,3 @@ return {
         topic,
-        text
+        checkLabel
       }
@@ -146,3 +144,3 @@ }
         topic,
-        text
+        checkLabel
       }
@@ -159,5 +157,5 @@ }
         topic,
-        text
+        checkLabel
       }
     }
   }))

src/components/Global/Modal/stories.js

@@ -5,4 +5,111 @@ import { storiesOf } from '@storybook/vue'
 import Modal from './index.vue'
+import ActionSteps from '../../Content/ActionSteps/index.vue'
+import ActionHeader from '../../Content/ActionHeader/index.vue'
+import ActionComplete from '../../Content/ActionComplete/index.vue'
+
 import readme from './README.md'
 
+const title = 'Understand what a mentally healthy workplace looks like and start raising awareness'
+
+const topicFirst = 'Get clear on what \'mental health\' means'
+const topicSecond = 'Learn what makes a mentally healthy workplace'
+const topicThird = 'Start a conversation in your workplace about mental health'
+
+const footer = 'Understand what a mentally healthy workplace looks like and start raising awareness'
+
+const tabs = [
+  {
+    'title': 'How to',
+    'url': '/how-to',
+    'isActive': true
+  },
+  {
+    'title': 'More info',
+    'url': '/more-info'
+  },
+  {
+    'title': 'Other resources',
+    'url': '/other-resources'
+  }
+]
+
+const checkLabel = "I've completed this step"
+const checkAction = "I've completed this action"
+
+const blocksFirst = [
+  {
+    'type': 'richText',
+    'data': `
+      <p>People use the words 'mental health' to mean a lot of different things.</p>
+      <p>So the best place to start improving mental health and wellbeing in your workplace is to get clear on what it really means.</p>
+      <p>The information and video below describe what mental health is and why it's important in your workplace.</p>
+      <p>We know this topic is complex so there's a great 3-page document in the other resources section.</p>
+    `
+  },
+  {
+    'type': 'cards',
+    'data': [
+      {
+        'text': 'Understanding mental health in the workplace: Tipsheet',
+        'uri': '/'
+      }
+    ]
+  },
+  {
+    'type': 'video',
+    'data': 'MufQvK4MRLk'
+  }
+]
+
+const blocksSecond = [
+  {
+    'type': 'richText',
+    'data': '<p>The dot points below represent what a mentally healthy workplace practices. As you continue through the tool, you\'ll be given practical steps and guidance that will bring you closer to creating a mentally healthy workplace.</p>'
+  },
+  {
+    type: 'checklist',
+    data: [
+      {
+        'value': 'Balance: a workplace that recognises the need for balance between the demands of work, family and personal life'
+      },
+      {
+        'value': 'Workload management: a workplace where employees are given enough time to do the tasks and responsibilities assigned to them'
+      },
+      {
+        'value': 'Organisational culture: a workplace that shows trust, honesty and fairness'
+      },
+      {
+        'value': 'Clear leadership and expectations: a workplace where there is effective leadership so that employees know what they need to do, where their work fits in with the rest of the organisation, and whether there are any changes coming up'
+      }
+    ]
+  }
+]
+
+const blocksThird = [
+  {
+    'type': 'richText',
+    'data': `
+      <p>Now that you have a basic understanding of what mental health is, and what a mentally healthy workplace looks like, you can start to make it happen!</p>
+      <p>Sharing information about health and wellbeing and having conversations with your staff is a great way to get the message across that it is considered as a priority in your workplace. Having these conversations in a non-judgemental way helps you build trust within your team. It makes them feel like it would be okay to talk to you when problems come up.</p>
+      <p>Employees feel valued because it shows them that their employer cares about their wellbeing.</p>
+      <p>There are many ways you can talk to your employees about mental health and what that means in your workplace. Try out some of these suggestions for raising awareness in your workplace.</p>
+      <p>At meetings with your supervisors or staff:</p>
+    `
+  },
+  {
+    'type': 'checklist',
+    'data': [
+      {
+        'value': 'Tell everyone about your commitment to making mental health a business priority'
+      },
+      {
+        'value': 'Ask everyone for suggestions about what topics related to mental health they would be interested in'
+      },
+      {
+        'value': 'Ask everyone for their suggestions on how to keep making your workplace mentally healthy, then agree to act on at least some of them'
+      }
+    ]
+  }
+]
+
 storiesOf('Components/Global/Modal', module)
@@ -20,1 +127,40 @@ .addDecorator(withReadme(readme))
   }))
+  .add('Action: How To', () => ({
+    components: {
+      Modal,
+      ActionHeader,
+      ActionSteps,
+      ActionComplete
+    },
+    template:
+      `<div>
+        <Button @click="openModal">Open Modal</Button>
+        <modal title="Modal" ref="dialog">
+          <action-header :title="title" :tabs="tabs" />
+          <action-steps :blocks="blocksFirst" :step="1" :topic="topicFirst" :checkLabel="checkLabel" />
+          <action-steps :blocks="blocksSecond" :step="2" :topic="topicSecond" :checkLabel="checkLabel" />
+          <action-steps :blocks="blocksThird" :step="3" :topic="topicThird" :checkLabel="checkLabel" />
+          <action-complete :checkLabel="checkAction" :title="footer" />
+        </modal>
+      </div>`,
+    methods: {
+      openModal () {
+        this.$refs.dialog.open()
+      }
+    },
+    data () {
+      return {
+        title,
+        topicFirst,
+        topicSecond,
+        topicThird,
+        checkLabel,
+        checkAction,
+        tabs,
+        blocksFirst,
+        blocksSecond,
+        blocksThird,
+        footer
+      }
+    }
+  }))

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1123819

increased by3.13%

Number of package files

207

increased by3.5%

Lines of code

3529

increased by4.04%

No dependency changes