@worksafevictoria/wcl7.5 1.1.0-beta.95 → 1.1.0-beta.96

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@worksafevictoria/wcl7.5",
-  "version": "1.1.0-beta.95",
+  "version": "1.1.0-beta.96",
   "main": "src/index.js",
   "license": "MIT",
   "repository": {

package/src/components/Common/CardGrid/index.vue

@@ -11,7 +11,7 @@
     :title-tag="titleTag"
     class="card-grid"
     :content-class="contentClass"
-    :class="`cardGrid-${$.uid}`"
+    :class="`cardGrid-${gridId}`"
     :card-browse-content="cardBrowseContent"
   >
     <template v-if="$slots.gridHeaderRight" v-slot:headerRight>
@@ -30,7 +30,7 @@
       >
         <column
           v-for="(item, index) in cards"
-          :key="`${redrawCounter}-${index}-${$.uid}`"
+          :key="`${redrawCounter}-${index}-${gridId}`"
           ref="cardColumns"
           :lg="largeViewPort"
           :md="mediumViewPort"
@@ -55,7 +55,7 @@
 import Row from './../../Containers/Row/index.vue'
 import Column from './../../Containers/Column/index.vue'
 import SectionGroup from './../../Containers/SectionGroup/index.vue'
-import debounce from 'lodash/debounce'
+import { debounce } from 'lodash'
 
 export default {
   name: 'CardGrid',
@@ -158,6 +158,10 @@ export default {
       type: Boolean,
       default: false,
     },
+    gridId: {
+      type: String,
+      default: 'default',
+    },
   },
   data() {
     return {

package/src/components/Global/BackToTop/index.vue

@@ -12,23 +12,23 @@
 <script>
 import Icon from '../../SubComponents/Icon/index.vue'
 import ChevUp from '../../../assets/icons/chev-up.svg?raw'
-import debounce from 'lodash/debounce'
+import { debounce } from 'lodash'
 
 export default {
   name: 'BackToTop',
   components: {
-    Icon
+    Icon,
   },
   props: {
     storybook: {
       type: Boolean,
-      default: false
-    }
+      default: false,
+    },
   },
   data() {
     return {
       ChevUp,
-      showBackToTop: false
+      showBackToTop: false,
     }
   },
   computed: {
@@ -38,7 +38,7 @@ export default {
       } else {
         return this.showBackToTop
       }
-    }
+    },
   },
   mounted() {
     this.handleDebouncedScroll = debounce(this.showHideBtbBtn, 100)
@@ -57,8 +57,8 @@ export default {
     },
     showHideBtbBtn() {
       this.showBackToTop = window.scrollY > window.innerHeight / 2
-    }
-  }
+    },
+  },
 }
 </script>
 

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

@@ -1,7 +1,7 @@
 <template>
   <div
     v-if="tabbedCards.length > 0 && loaded"
-    :ref="`tabbedCards-${uid}`"
+    :ref="`tabbedCards-${tabbedCards[0].cardid}`"
     class="tabbed-cards"
   >
     <div v-for="(r, rIndex) in rows" :key="rIndex">
@@ -40,8 +40,7 @@
             :is-expandable="true"
           />
         </template>
-        <template
-          v-slot:cardGridFooter >
+        <template v-slot:cardGridFooter>
           <column
             v-if="selectedRow === rIndex && selectedCard"
             class="listgroup-column"
@@ -105,13 +104,12 @@ export default {
       screenWidth: 0,
       loaded: false,
       tabList: null,
-      uid: Math.random().toString(36).slice(2, 11)
     }
   },
   computed: {
     rows() {
-      let r = Math.ceil(this.tabbedCards.length / this.cols);
-      return r;
+      let r = Math.ceil(this.tabbedCards.length / this.cols)
+      return r
     },
     cols() {
       if (this.screenWidth < 575.98) {
@@ -140,7 +138,7 @@ export default {
   },
   methods: {
     getCardIdPrefix(rIndex, cardIndex) {
-      const cardPrefix = `tabbedcards-${this.uid}-r-${rIndex}`
+      const cardPrefix = `tabbedcards-${this.tabbedCards[0].cardid}-r-${rIndex}`
       if (cardIndex !== null && cardIndex !== undefined) {
         return `${cardPrefix}-${cardIndex}`
       }
@@ -152,10 +150,11 @@ export default {
       return rows.slice(start, end)
     },
     checkSelectedCard(card) {
-      return JSON.stringify(card) === JSON.stringify(this.selectedCard);
+      return JSON.stringify(card) === JSON.stringify(this.selectedCard)
     },
     setCurrentRow(rowIndex, card) {
-      const sameCardSelected = this.checkSelectedCard(card.selectedCard) || !card.selectedCard
+      const sameCardSelected =
+        this.checkSelectedCard(card.selectedCard) || !card.selectedCard
 
       this.selectedCard = null
       this.selectedRow = null

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

@@ -16,14 +16,11 @@
         <b-tabs v-model="tabIndex">
           <b-tab
             v-for="(item, index) in items"
-            :key="`${index}-${$.uid}`"
+            :key="`${index}-${item.cardId}`"
             :title="item.title"
             :title-link-class="`tab-item-${index}-${$.uid}`"
           >
-            <rich-text
-              :content="item.content.value"
-              :without-container="true"
-            />
+            <rich-text :content="item" :without-container="true" />
           </b-tab>
         </b-tabs>
       </template>

package/src/components/SubComponents/FormAddressPostcode/index.vue

@@ -41,7 +41,8 @@
 </template>
 <script>
 import axios from 'axios'
-import debounce from 'lodash/debounce'
+import { debounce } from 'lodash'
+
 import { detectBrowser } from '../../../../lib/detect-browser'
 import { BSpinner } from 'bootstrap-vue-next'