worksafe-component-library - npm Package Compare versions

Comparing version 1.3.0 to 1.4.0

.storybook/config.js

@@ -9,12 +9,22 @@ import { configure, addDecorator } from '@storybook/vue';
 
-import Vue from 'vue';
-// import Vuex from 'vuex'; // Vue plugins
+import Vue from 'vue'
+import Vuex from 'vuex' // Vue plugins
 
 // Import your custom components.
-import AppTheme from '../src/components/Containers/AppTheme/index.vue';
+import AppTheme from '../src/components/Containers/AppTheme/index.vue'
 
-
 // Install Vue plugins.
-// Vue.use(Vuex);
+Vue.use(Vuex)
 
+const $store = () => new Vuex.Store({
+  state: {
+    menuMobileIsOpened: false
+  },
+  mutations: {
+    setMenuMobileIsOpened (state, value) {
+      state.menuMobileIsOpened = value
+    }
+  }
+})
+
 // Register custom components.
@@ -21,0 +31,0 @@ Vue.component('app-theme', AppTheme);

.storybook/webpack.config.js

@@ -43,2 +43,2 @@ const path = require('path')
   }
-}
+}

docs/overview/5-Changelog.md

 # Changelog
 
+- v1.4.0 (9 Apr 2018)
+    - Update some components per document landing page requirements
+    - Update some components for design polish
+        + Fix many issues with heading and paragraph spacing
+        + Fix Card heading space
+        + Fix Key Statistics top space
+        + Fix Quote excerpt top and bottom space
+        + Fix Video heading appearing when no title
+        + Fix navigation top space
+        + Fix checklist space with and without a heading
+    - Fix bug with short row of cards and add story for this
+    - Add swipe interactions for curated cards component using slick slider
 - v1.3.0 (3 Apr 2018)
@@ -4,0 +16,0 @@ - Fix a bug where empty card lists crash pages

package.json

 {
   "name": "worksafe-component-library",
-  "version": "1.3.0",
+  "version": "1.4.0",
   "description": "A Vue.js component library for use in WorkSafe family websites",
@@ -25,2 +25,4 @@ "main": "./src/index.js",
   "dependencies": {
+    "jquery": "^3.3.1",
+    "slick-carousel": "^1.8.1",
     "vue": "^2.5.13",
@@ -36,3 +38,3 @@ "vue-form-generator": "^2.2.0"
     "@storybook/addon-options": "^3.3.9",
-    "@storybook/addon-storyshots": "rc",
+    "@storybook/addon-storyshots": "^3.4.0-rc.4",
     "@storybook/vue": "^3.3.6",
@@ -70,2 +72,3 @@ "babel-core": "^6.26.0",
     "vue-template-compiler": "^2.5.13",
+    "vuex": "^3.0.1",
     "webpack": "^3.10.0",
@@ -72,0 +75,0 @@ "webpack-dev-server": "^2.10.0"

src/components/Content/CuratedContent/stories.js

@@ -28,5 +28,21 @@ import { storiesOf } from '@storybook/vue'
     uri: '#'
+  },
+  {
+    text: 'Here\'s yet another card',
+    uri: '#'
   }
 ]
 
+const cardsShort = [
+  {
+    text: 'Here\'s a card',
+    uri: '#'
+  },
+  {
+    text: 'How about a second card',
+    uri: '#',
+    image: 'https://picsum.photos/654/344'
+  }
+]
+
 const seeMore = {
@@ -41,3 +57,3 @@ uri: 'curated-content',
     components: { CuratedContent },
-    template: '<curated-content title="Curated group of content" :seeMore="seeMore" :cards="cards"></curated-content>',
+    template: '<curated-content title="Curated group of content" :seeMore="seeMore" :cards="cards" :sliderKey="1"></curated-content>',
     data () {
@@ -50,1 +66,11 @@ return {
   }))
+  .add('Short row', () => ({
+    components: { CuratedContent },
+    template: '<curated-content title="Curated group of content" :seeMore="seeMore" :cards="cardsShort" :sliderKey="1"></curated-content>',
+    data () {
+      return {
+        cardsShort,
+        seeMore
+      }
+    }
+  }))

src/components/Content/KeyStatistics/stories.js

@@ -7,3 +7,3 @@ import { storiesOf } from '@storybook/vue'
 
-const items = [
+const items3 = [
   {
@@ -23,12 +23,40 @@ field_title: '701',
 
+const items4 = [
+  {
+    field_title: 'Accessibility',
+    field_plain_body: 'Not accessible'
+  },
+  {
+    field_title: 'Reading level',
+    field_plain_body: 'Medium'
+  },
+  {
+    field_title: 'Length',
+    field_plain_body: '71 pages'
+  },
+  {
+    field_title: 'Last updated',
+    field_plain_body: 'March 2018'
+  }
+]
+
 storiesOf('Components/Content/KeyStatistics', module)
   .addDecorator(withReadme(readme))
-  .add('Default text', () => ({
+  .add('With 3 columns', () => ({
     components: { KeyStatistics },
-    template: '<key-statistics :items="items"></key-statistics>',
+    template: '<key-statistics :items="items3"></key-statistics>',
     data () {
       return {
-        items
+        items3
       }
     }
   }))
+  .add('With 4 columns', () => ({
+    components: { KeyStatistics },
+    template: '<key-statistics :items="items4"></key-statistics>',
+    data () {
+      return {
+        items4
+      }
+    }
+  }))

src/components/Global/AppNavigation/stories.js

@@ -6,2 +6,3 @@ import { storiesOf } from '@storybook/vue'
 import readme from './README.md'
+import store from '../../../../.storybook/store'
 
@@ -815,2 +816,3 @@ const bigMenu = [
     template: '<app-navigation :menu="bigMenu"></app-navigation>',
+    store,
     data () {
@@ -825,2 +827,3 @@ return {
     template: '<app-navigation :menu="smallMenu"></app-navigation>',
+    store,
     data () {
@@ -827,0 +830,0 @@ return {

src/components/SubComponents/ButtonLink/stories.js

@@ -11,11 +11,15 @@ import { storiesOf } from '@storybook/vue'
     components: { ButtonLink },
-    template: '<button-link text="Assess your suuuuuuuuper risky risks" link="today.design"></button-link>'
+    template: '<button-link text="Assess your suuuuuuuuper risky risks" link="/about-us"></button-link>'
   }))
   .add('Different colored button', () => ({
     components: { ButtonLink },
-    template: '<button-link text="Different" link="today.design"></button-link>'
+    template: '<button-link text="Different" link="/about-us"></button-link>'
   }))
   .add('Alternate button', () => ({
     components: { ButtonLink },
-    template: '<button-link text="Alternative" link="today.design"></button-link>'
+    template: '<button-link text="Alternative" link="/about-us"></button-link>'
   }))
+  .add('External link', () => ({
+    components: { ButtonLink },
+    template: '<button-link text="Alternative" link="http://today.design"></button-link>'
+  }))

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

1050077

increased by2.1%

Number of package files

178

increased by3.49%

Lines of code

3135

increased by2.79%

Worsened metrics

Dependency count

4

increased by100%

Dev dependency count

38

increased by2.7%

Dependency changes

• + Addedjquery@^3.3.1

• + Addedslick-carousel@^1.8.1

• + Addedjquery@3.7.1(transitive)

• + Addedslick-carousel@1.8.1(transitive)