@worksafevictoria/wcl7.5 1.1.12 → 1.1.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@worksafevictoria/wcl7.5",
-  "version": "1.1.12",
+  "version": "1.1.13",
   "main": "src/index.js",
   "license": "MIT",
   "repository": {

package/src/components/Paragraphs/TabbedCards/index.stories.js

@@ -4,33 +4,14 @@ import { tabbedCardsMockLinks } from '../../../mock/tabbed-cards'
 export default {
   title: 'Paragraphs/TabbedCards',
   component: TabbedCards,
-  argTypes: {
-    description: {
-      control: 'text',
-      defaultValue: 'Tabbed cards h2 heading'
-    },
-    heading: {
-      control: 'text',
-      defaultValue: 'Tabbed cards h2 heading'
-    },
-    tabbedCards: {
-      control: 'object',
-      defaultValue: tabbedCardsMockLinks
-    },
-    workwell: {
-      control: 'boolean',
-      defaultValue: false
-    }
+  tags: ['autodocs'],
+  args: {
+    description: 'Tabbed cards h2 heading',
+    heading: 'Tabbed cards h2 heading',
+    tabbedCards: tabbedCardsMockLinks,
+    workwell: false,
+    rtl: false
   }
 }
 
-const Template = (args, { argTypes }) => ({
-  components: { TabbedCards },
-  props: Object.keys(argTypes),
-  template: `
-    <tabbed-cards 
-      v-bind="$props"
-    /> `
-})
-
-export const Default = Template.bind({})
+export const Default = {}

package/src/components/Paragraphs/TabbedCards/index.vue

@@ -20,7 +20,7 @@
         :content-class="`tabbed-cards-content`"
         class="tabbed-cards__grid"
         @selected="(card, cardIndex) => setCurrentRow(rIndex, card)"
-        @focussed="focussed($event)"
+        @focusin="focussed($event)"
       >
         <template v-slot:cardItem="{ card }">
           <card-grid-item
@@ -46,8 +46,7 @@
         >
           <column class="listgroup-column">
             <div ref="listgroup" class="tabbed-cards__listGroup">
-              <component
-                :is="ListGroupComponent"
+              <list-group
                 :list="selectedCard.links"
                 :title="selectedCard.linksTitle"
                 :title-tag="selectedCard.linksTag"
@@ -69,10 +68,11 @@ import CardGrid from './../../Common/CardGrid/index.vue'
 import CardGridItem from './../../Common/CardGridItem/index.vue'
 import Column from './../../Containers/Column/index.vue'
 import Icon from './../../SubComponents/Icon/index.vue'
+import ListGroup from './../../Paragraphs/ListGroup/index.vue'
 
 export default {
   name: 'TabbedCards',
-  components: { CardGrid, CardGridItem, Icon, Column },
+  components: { CardGrid, CardGridItem, Icon, Column, ListGroup },
   props: {
     heading: {
       type: String,
@@ -120,19 +120,15 @@ export default {
       } else {
         return 3
       }
-    },
-    ListGroupComponent() {
-      //List group component import to fix storybook bug
-      return () => import('./../ListGroup/index.vue')
     }
   },
   mounted() {
     window.addEventListener('resize', this.updateScreenWidth)
     this.screenWidth = document.documentElement.clientWidth
-    this.$root.$on('last-focus-out', () => {
+    /* this.$root.$on('last-focus-out', () => {
       this.selectedCard = null
       this.selectedRow = null
-    })
+    }) */
     this.loaded = true
   },
   beforeDestroy() {
@@ -193,9 +189,7 @@ export default {
     },
     focussed(ev) {
       if (ev.shiftKey) {
-        let prevTabbedCard = ev.target?.parentElement?.parentElement?.previousSibling?.getElementsByTagName(
-          'button'
-        )[0]
+        let prevTabbedCard = ev.target?.parentElement?.parentElement?.previousSibling?.getElementsByTagName('button')[0]
         if (
           prevTabbedCard &&
           prevTabbedCard.getAttribute('aria-expanded') === 'true'
@@ -209,17 +203,13 @@ export default {
       }
       const lG = this.$refs.listgroup
       const isListGroupOpen = Array.isArray(lG) && lG.length > 0
-      const cardIsSelected = ev.target.parentElement.classList.contains(
-        'isSelected'
-      )
+      const cardIsSelected = ev.target.parentElement.classList.contains('isSelected')
       if (cardIsSelected && isListGroupOpen) {
         ev.preventDefault()
         lG[0].getElementsByTagName('button')[0].focus()
       } else if (!cardIsSelected && isListGroupOpen) {
         ev.preventDefault()
-        let nextTabbedCard = ev.target?.parentElement?.parentElement?.nextSibling?.getElementsByTagName(
-          'button'
-        )[0]
+        let nextTabbedCard = ev.target?.parentElement?.parentElement?.nextSibling?.getElementsByTagName('button')[0]
         if (nextTabbedCard) {
           nextTabbedCard.focus()
         } else {