@worksafevictoria/wcl7.5 1.0.0

package/src/mock/control-selectable-cards.js

@@ -0,0 +1,58 @@
+export const mockSelectableCards = [
+  {
+    name: 'Bolt',
+    icon:
+      'https://content-dev-v2.api.worksafe.vic.gov.au/sites/default/files/icons/icon%201%20object.svg',
+    value: '0.2500',
+    units: 'kg'
+  },
+  {
+    name: 'Screwdriver',
+    icon:
+      'https://content-dev-v2.api.worksafe.vic.gov.au/sites/default/files/icons/icon%202%20object.svg',
+    value: '0.2600',
+    units: 'kg'
+  },
+  {
+    name: 'Hammer',
+    icon:
+      'https://content-dev-v2.api.worksafe.vic.gov.au/sites/default/files/icons/icon%201%20object.svg',
+    value: '0.5',
+    units: 'kg'
+  },
+  {
+    name: 'Electric drill',
+    icon:
+      'https://content-dev-v2.api.worksafe.vic.gov.au/sites/default/files/icons/icon%202%20object.svg',
+    value: '2',
+    units: 'kg'
+  },
+  {
+    name: 'Sledge Hammer',
+    icon:
+      'https://content-dev-v2.api.worksafe.vic.gov.au/sites/default/files/icons/icon%201%20object.svg',
+    value: '5',
+    units: 'kg'
+  },
+  {
+    name: 'Scaffolding platform',
+    icon:
+      'https://content-dev-v2.api.worksafe.vic.gov.au/sites/default/files/icons/icon%202%20object.svg',
+    value: '50',
+    units: 'kg'
+  },
+  {
+    name: 'Anvil',
+    icon:
+      'https://content-dev-v2.api.worksafe.vic.gov.au/sites/default/files/icons/icon%201%20object.svg',
+    value: '75',
+    units: 'kg'
+  },
+  {
+    name: 'Window pane',
+    icon:
+      'https://content-dev-v2.api.worksafe.vic.gov.au/sites/default/files/icons/icon%201%20object.svg',
+    value: '250',
+    units: 'kg'
+  }
+]

package/src/mock/jest.svgtransformer.js

@@ -0,0 +1,7 @@
+const path = require('path')
+
+module.exports = {
+  process(src, filename) {
+    return `module.exports = ${JSON.stringify(path.basename(filename))};`
+  }
+}

package/src/mock/list-group.js

@@ -0,0 +1,46 @@
+const listGroupTempData = {
+  title: 'Laws and regulations',
+  links: [
+    {
+      title: 'List group item heading 1',
+      text:
+        'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.',
+      url: 'www.example.com'
+    },
+    {
+      title: 'List group item heading 2',
+      text:
+        'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+    },
+    {
+      title: 'List group item heading 3',
+      text:
+        'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+    }
+  ]
+}
+
+const listGroupTempDataAr = {
+  title: 'القوانين والأنظمة',
+  rtl: 'true',
+  links: [
+    {
+      title: 'قائمة عنصر المجموعة',
+      text:
+        'بعض الأمثلة السريعة للنص الذي سيتم بناؤه على علامة التبويب 1 وتشكيل الجزء الأكبر من محتوى البطاقة.',
+      url: 'www.example.com'
+    },
+    {
+      title: 'قائمة عنصر المجموعة',
+      text:
+        'بعض الأمثلة السريعة للنص الذي سيتم بناؤه على علامة التبويب 1 وتشكيل الجزء الأكبر من محتوى البطاقة.'
+    },
+    {
+      title: 'قائمة عنصر المجموعة',
+      text:
+        'بعض الأمثلة السريعة للنص الذي سيتم بناؤه على علامة التبويب 1 وتشكيل الجزء الأكبر من محتوى البطاقة.'
+    }
+  ]
+}
+
+export { listGroupTempData, listGroupTempDataAr }

package/src/mock/proof-points.js

@@ -0,0 +1,55 @@
+const itemListDefault = [
+  {
+    heading: 'Proof point 1',
+    description:
+      'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+    img: '../../../assets/icons/key.svg'
+  },
+  {
+    heading: 'Proof point 2',
+    description:
+      'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+    img: '../../../assets/icons/key.svg'
+  },
+  {
+    heading: 'Proof point 3',
+    description:
+      'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+    img: '../../../assets/icons/key.svg'
+  },
+  {
+    heading: 'Proof point 4',
+    description:
+      'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+    img: '../../../assets/icons/key.svg'
+  }
+]
+
+const itemListAr = [
+  {
+    heading: 'نقطة إثبات 1',
+    description:
+      'لكن لا بد أن أوضح لك أن كل هذه الأفكار المغلوطة حول استنكار  النشوة وتمجيد الألم نشأت بالفعل، وسأعرض لك التفاصيل لتكتشف حقيقة وأساس تلك السعادة البشرية، ',
+    img: '../../../assets/icons/key.svg'
+  },
+  {
+    heading: 'نقطة إثبات 2',
+    description:
+      'لكن لا بد أن أوضح لك أن كل هذه الأفكار المغلوطة حول استنكار  النشوة وتمجيد الألم نشأت بالفعل، وسأعرض لك التفاصيل لتكتشف حقيقة وأساس تلك السعادة البشرية، ',
+    img: '../../../assets/icons/key.svg'
+  },
+  {
+    heading: 'نقطة إثبات 3',
+    description:
+      'لكن لا بد أن أوضح لك أن كل هذه الأفكار المغلوطة حول استنكار  النشوة وتمجيد الألم نشأت بالفعل، وسأعرض لك التفاصيل لتكتشف حقيقة وأساس تلك السعادة البشرية، ',
+    img: '../../../assets/icons/key.svg'
+  },
+  {
+    heading: 'نقطة إثبات 4',
+    description:
+      'لكن لا بد أن أوضح لك أن كل هذه الأفكار المغلوطة حول استنكار  النشوة وتمجيد الألم نشأت بالفعل، وسأعرض لك التفاصيل لتكتشف حقيقة وأساس تلك السعادة البشرية، ',
+    img: '../../../assets/icons/key.svg'
+  }
+]
+
+export { itemListDefault, itemListAr }

package/src/mock/related-info.js

@@ -0,0 +1,44 @@
+const taxonomyTagsList = [
+  {
+    name: 'Arts and creative',
+    url: '/arts'
+  },
+  {
+    name: 'Bullying',
+    url: '/bullying'
+  },
+  {
+    name: 'Construction',
+    url: '/construction'
+  },
+  {
+    name: 'Fatigue',
+    url: '/fatigue'
+  },
+  {
+    name: 'Gendered violence',
+    url: '/gendered-violence'
+  },
+  {
+    name: 'Manufacturing',
+    url: '/manufacturing'
+  },
+  {
+    name: 'Mental health',
+    url: '/mental-health'
+  },
+  {
+    name: 'Stress',
+    url: '/work-related-stress'
+  },
+  {
+    name: 'WorkWell',
+    url: '/workwell'
+  },
+  {
+    name: 'Work-related violence',
+    url: '/work-related-violence'
+  }
+]
+
+export { taxonomyTagsList }

package/src/mock/selectable-cards.js

@@ -0,0 +1,48 @@
+export const mockSelectableCards = [
+  {
+    name: 'Road or track',
+    icon:
+      '<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">\n    <g fill="none">\n        <path fill="#000" d="M2.92 11.398c.384 0 .696.292.696.652v1.645c0 .72.622 1.305 1.39 1.305.767 0 1.389-.584 1.389-1.305V12.05c0-.36.31-.652.695-.652h2.053c.349-.003.661-.202.793-.505.131-.302.057-.65-.19-.88L8.193 8.11c-.019-.024-.019-.055 0-.078.017-.024.05-.033.079-.023.384.118.804-.027 1.015-.35.21-.324.158-.741-.129-1.009l-2.12-2.462c-.018-.02-.019-.049-.003-.07.017-.021.046-.03.072-.02.4.127.839-.033 1.043-.38.205-.346.117-.78-.209-1.031L5.512.209C5.381.076 5.196 0 5.002 0c-.193 0-.378.076-.51.21L2.044 2.691c-.316.254-.397.681-.195 1.022.202.341.632.501 1.029.383.026-.012.057-.005.075.016.018.021.019.051.001.072L.87 6.665c-.28.268-.327.68-.118 1 .21.319.625.463 1.006.35.029-.01.061-.001.079.023.018.023.018.055 0 .078L.254 10.014c-.248.232-.322.58-.188.884.133.303.449.5.798.5h2.057zM29.984 24.425c-.02-.025-.02-.06-.001-.084.019-.025.053-.034.082-.021.42.14.88-.024 1.117-.395.236-.371.186-.854-.121-1.17l-2.333-2.858c-.02-.024-.02-.057 0-.081.018-.026.05-.036.08-.025.434.133.903-.055 1.123-.45.22-.395.13-.889-.215-1.183l-2.719-2.939c-.13-.14-.312-.219-.504-.219-.191 0-.374.08-.504.219l-2.745 2.946c-.352.294-.444.795-.22 1.194.225.398.704.583 1.141.439.029-.012.062-.003.081.022.019.024.019.058 0 .083l-2.292 2.872c-.303.317-.35.799-.114 1.167.237.37.696.531 1.115.393.029-.012.062-.003.08.022.02.024.02.058 0 .083l-1.757 2.227c-.271.27-.353.674-.206 1.026.147.351.493.58.877.581h2.508c.38 0 .686.305.686.68v1.685c0 .752.615 1.361 1.373 1.361s1.372-.61 1.372-1.36V28.94c0-.376.307-.68.686-.68h2.479c.384-.001.73-.232.876-.584.146-.353.063-.758-.21-1.026l-1.735-2.226z"/>\n        <path fill="#000" d="M31.753 3.155c-.15-.127-.349-.18-.541-.144C16.75 5.777 5.062 16.67 1.024 31.144c-.055.203-.014.42.11.589.125.168.319.267.525.267h10.55c.273.003.519-.166.62-.424 1.776-4.605 4.712-8.647 8.51-11.715.162-.13.255-.33.252-.54-.004-.643.266-1.257.74-1.68l2.59-2.866c.371-.423.904-.66 1.46-.65.55.001 1.077.237 1.451.652l.477.53c.18.2.46.271.71.179.812-.3 1.64-.565 2.485-.785.292-.076.496-.345.496-.654V3.674c-.002-.202-.093-.392-.247-.519z"/>\n        <path fill="#FFF" d="M7.957 27.878c-.26.566-.506 1.139-.735 1.72-.095.242-.329.402-.589.402-.08-.001-.158-.017-.232-.048-.325-.13-.485-.499-.357-.826.238-.605.492-1.2.76-1.783.156-.302.522-.427.83-.284.307.144.447.506.318.82h.005zM12.84 21.197c-.882 1.103-1.699 2.256-2.447 3.45-.137.22-.38.353-.642.353-.139 0-.275-.037-.393-.11-.353-.214-.464-.669-.247-1.017.778-1.242 1.627-2.44 2.543-3.59.166-.208.432-.313.699-.276.266.038.492.212.593.457.1.245.06.525-.106.733zM17.736 15.237c-.94.81-1.835 1.676-2.683 2.595-.25.235-.627.222-.863-.029-.237-.25-.254-.654-.04-.927.882-.957 1.814-1.86 2.791-2.704.176-.167.423-.217.644-.13.22.088.377.299.41.549.03.25-.068.498-.259.646zM24.637 11.184c-1.215.513-2.396 1.087-3.536 1.72-.113.063-.245.097-.379.096-.321.004-.606-.182-.694-.454-.089-.273.04-.563.316-.71 1.186-.66 2.415-1.258 3.68-1.79.348-.124.744.012.906.31.162.298.034.656-.293.818v.01zM29.51 9.363c-.577.183-1.146.383-1.706.6-.064.024-.13.037-.198.037-.297-.002-.549-.245-.598-.575-.048-.33.12-.653.4-.763.585-.227 1.178-.434 1.78-.623.214-.085.453-.029.62.147.165.176.23.441.17.689-.062.247-.241.436-.464.488h-.004z"/>\n    </g>\n</svg>\n',
+    description:
+      'Good surface, no bumps, potholes, wheel ruts, centre raise, or imperfections',
+    points: 1
+  },
+  {
+    name: 'Farm track, path or driveway',
+    icon:
+      '<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">\n    <g>\n        <path d="M27.545 17h4.137c.176 0 .318-.15.318-.333V14c0-.552-.427-1-.955-1h-5.727c-.176 0-.318.15-.318.333v9.334c0 .184.142.333.318.333h5.727c.528 0 .955-.448.955-1v-2.667c0-.184-.142-.333-.318-.333h-4.137c-.527 0-.954-.448-.954-1s.427-1 .954-1zM11.501 0C5.15 0 0 5.223 0 11.667c0 6.443 5.15 11.666 11.501 11.666.087 0 .171-.035.233-.097.061-.063.096-.148.096-.236v-3.333c0-.184-.147-.334-.329-.334-.582 0-1.162-.065-1.73-.194-.53-.122-.863-.657-.743-1.195s.647-.876 1.177-.755c.426.095.86.144 1.296.144.088 0 .171-.034.233-.097.062-.062.096-.147.096-.236v-3.333c0-.184-.147-.334-.329-.334-.907 0-1.643-.746-1.643-1.666 0-.92.736-1.667 1.643-1.667.908 0 1.643.746 1.643 1.667V31c0 .265.104.52.289.707.185.188.436.293.697.293l7.887-.021c.26 0 .511-.106.696-.294.184-.187.287-.441.287-.706V11.667C22.993 5.227 17.85.009 11.501 0zM6.023 15.481c-.488.242-1.076.036-1.315-.458-.814-1.702-.982-3.648-.47-5.467.095-.345.366-.612.708-.7.343-.087.706.018.951.277.245.258.335.63.236.974-.144.507-.217 1.032-.218 1.56-.003.858.19 1.706.561 2.477.238.496.035 1.095-.453 1.337zm8.064-10.028c-.064.257-.227.478-.451.613-.225.135-.494.175-.747.109-1.293-.332-2.66-.187-3.859.408-.487.24-1.075.036-1.315-.457s-.042-1.09.442-1.337c1.62-.806 3.47-1.002 5.219-.552.253.066.47.23.604.459.133.228.172.5.107.757zm4.972 23.867c0 .552-.441 1-.986 1-.544 0-.985-.448-.985-1v-5.372c0-.552.441-1 .985-1 .545 0 .986.448.986 1v5.372zm0-12.281c0 .552-.441 1-.986 1-.544 0-.985-.448-.985-1v-5.05c0-.552.441-1 .985-1 .545 0 .986.448.986 1v5.05z"/>\n    </g>\n</svg>\n',
+    description:
+      'May include wheel ruts, pot holes, centre section raised or other imperfections',
+    points: 3
+  },
+  {
+    name: 'Slippery or shifting surface',
+    icon:
+      '<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">\n    <g>\n        <path d="M31.609 16.942c.52-.52.52-1.364 0-1.885L16.942.39c-.52-.52-1.364-.52-1.885 0L.39 15.057c-.52.52-.52 1.365 0 1.885L15.057 31.61c.52.52 1.365.52 1.885 0L31.61 16.942zm-8.921 5.151c-.07.07-.168.105-.267.096-.1-.01-.19-.066-.244-.15l-.012-.017c-.434-.64-1.156-1.022-1.93-1.022-.183 0-.333-.15-.333-.334 0-.184.15-.333.334-.333.552 0 1-.448 1-1s-.448-1-1-1c-1.289 0-2.334 1.045-2.334 2.333 0 1.289 1.045 2.334 2.334 2.334.11 0 .214.055.276.146.072.109.168.2.28.267.087.053.145.144.157.246.012.102-.023.203-.096.275l-4.612 4.612c-.062.063-.147.098-.236.098s-.173-.035-.236-.098L3.454 16.236c-.062-.063-.098-.148-.098-.236 0-.089.036-.174.098-.236l12.31-12.31c.062-.062.147-.098.236-.098.088 0 .173.036.236.098l12.309 12.31c.063.062.098.147.098.236 0 .088-.035.173-.098.236l-5.857 5.857z"/>\n        <path d="M11.505 9.561v.016l-.4 1.828c-.013.063-.044.12-.09.165l-.666.667c-.46.469-.707 1.106-.683 1.763.002.83.447 1.597 1.167 2.012.103.06.166.169.167.288v1.033c0 .552.447 1 1 1 .552 0 1-.448 1-1v-.667c0-.184.149-.333.333-.333h5.333c.184 0 .334.15.334.333v.667c0 .552.447 1 1 1 .552 0 1-.448 1-1v-1.037c0-.119.062-.228.164-.288.74-.448 1.186-1.256 1.169-2.122.001-.618-.244-1.212-.683-1.649l-.666-.667c-.045-.045-.076-.102-.091-.164l-.387-1.78V9.61c-.187-1.125-1.162-1.948-2.302-1.944h-4.408c-1.123-.008-2.089.791-2.291 1.895zm7.036.427V10l.133.596c.02.098-.005.2-.068.277-.063.077-.157.122-.257.123h-4.697c-.1 0-.195-.046-.258-.123-.063-.078-.088-.18-.068-.277l.134-.644V9.94c.029-.159.167-.274.328-.274h4.408c.18.002.33.142.345.322zM12.23 21c-.184 0-.333-.15-.333-.334 0-.184.15-.333.333-.333.553 0 1-.448 1-1s-.447-1-1-1c-1.288 0-2.333 1.045-2.333 2.333 0 1.289 1.045 2.334 2.333 2.334.118 0 .227.062.287.162.29.462.897.606 1.364.325.466-.282.621-.886.348-1.358-.424-.699-1.181-1.126-1.999-1.13z"/>\n    </g>\n</svg>\n',
+    description: 'Sandy or muddy terrain (with or without track)',
+    points: 4
+  },
+  {
+    name: 'Sloped ground',
+    icon:
+      '<svg xmlns="http://www.w3.org/2000/svg" width="31" height="31" viewBox="0 0 31 31">\n    <path d="M30.71 14.8L16.2.29c-.186-.186-.438-.29-.7-.29-.262 0-.514.104-.7.29L.29 14.8c-.186.186-.29.437-.29.7 0 .262.104.514.29.699l14.51 14.51c.186.186.438.291.7.291.262 0 .514-.105.7-.29l14.51-14.511c.186-.185.29-.437.29-.7 0-.262-.104-.513-.29-.698zm-9.933 2.92c0 .219-.087.429-.242.583-.155.155-.365.242-.584.241l-8.905-.01c-.382 0-.715-.264-.802-.637-.087-.373.094-.756.437-.926l8.908-4.429c.256-.125.557-.11.798.04.242.15.389.414.39.698v4.44z"/>\n</svg>\n',
+    description: 'Hill, rise, waterway embankment',
+    points: 5
+  },
+  {
+    name: 'Paddock or area with obstacles',
+    icon:
+      '<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">\n    <g>\n        <path d="M31.333 19.979h-2.666c-.369 0-.667-.299-.667-.667v-.666c0-.369.298-.667.667-.667h2c.237 0 .457-.127.576-.332.12-.206.12-.46.002-.665l-1.674-2.934c-.087-.153-.086-.34.002-.492.089-.152.251-.246.427-.246.242 0 .466-.132.583-.344.118-.212.11-.471-.018-.676l-3.333-5.334c-.13-.184-.34-.293-.565-.293-.225 0-.436.11-.566.293l-3.333 5.334c-.128.205-.135.464-.018.676.118.212.341.344.583.344.176 0 .339.094.427.246.088.152.09.34.003.492l-1.675 2.934c-.118.206-.117.46.002.665.12.205.34.332.577.332h2c.368 0 .666.298.666.667v1.106c0 .304-.205.57-.5.646-2.612.74-5.041 2.018-7.13 3.753-.095.076-.14.197-.12.317.021.12.105.218.22.258 2.922.91 5.542 2.595 7.58 4.878.399.48.617 1.084.617 1.708 0 .368.298.667.667.667h4.666c.369 0 .667-.299.667-.667V20.646c0-.369-.298-.667-.667-.667z" transform="translate(0 .01)"/>\n        <path d="M11.273 25.404c-.344-.031-.608-.32-.606-.666v-2.092c0-.369.298-.667.666-.667h4.054c.497 0 .953-.277 1.183-.718.23-.441.194-.974-.091-1.38l-2.718-3.882c-.093-.133-.105-.308-.03-.452.075-.145.225-.235.388-.235.486 0 .935-.265 1.169-.691.234-.427.217-.948-.044-1.358l-3.017-4.74c-.177-.281-.12-.65.133-.864.494-.423.61-1.141.276-1.699L9.239.302C9.109.112 8.895 0 8.667 0c-.23 0-.443.113-.572.302L4.7 5.959c-.334.558-.218 1.275.276 1.699.255.214.311.584.134.865l-3.023 4.741c-.26.411-.277.931-.043 1.358.235.426.683.69 1.17.69.162 0 .312.09.387.235.075.144.064.319-.03.452L.855 19.88c-.286.407-.32.94-.091 1.381.23.441.685.718 1.183.718H6c.368 0 .667.298.667.667v2.312c0 .318-.227.592-.54.653-2.093.418-4.077 1.262-5.83 2.48-.185.123-.297.332-.297.555v2.666c0 .368.298.667.667.667h22.666c.26 0 .495-.15.605-.384.11-.235.074-.512-.093-.71-3.096-3.715-8.697-5.13-12.572-5.48z" transform="translate(0 .01)"/>\n    </g>\n</svg>\n',
+    description:
+      'Potential for obstacles such as rocks, timber, rabbit warren, stock, clumped grass, foliage',
+    points: 5
+  },
+  {
+    name: 'Loading ramp',
+    icon:
+      '<svg xmlns="http://www.w3.org/2000/svg" width="32" height="12" viewBox="0 0 32 12">\n    <g>\n        <path d="M8.625 0v5.167c0 .184-.149.333-.333.333L1.333 8C.597 8 0 8.597 0 9.333c0 .737.597 1.334 1.333 1.334l17.628-2.5c.184 0 .334-.15.334-.334 0-2.577 2.089-4.666 4.666-4.666 2.578 0 4.667 2.089 4.667 4.666 0 .184.15.334.333.334h1.334c.199 0 .767-2.723 1.705-8.167H8.625z"/>\n        <path d="M20.882 6.56c-.516 1.245-.231 2.678.722 3.632.954.953 2.387 1.238 3.633.722s2.058-1.731 2.058-3.08c0-1.84-1.493-3.333-3.334-3.333-1.348 0-2.563.812-3.08 2.058z"/>\n    </g>\n</svg>\n',
+    description:
+      'Driven via a rated and sufficiently long ramp onto transport such as a ute or trailer',
+    points: 5
+  }
+]

package/src/mock/statistics.js

@@ -0,0 +1,63 @@
+const statistics = [
+  {
+    heading: 'statistics 1',
+    description:
+      'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+    img: '../../../assets/icons/key.svg',
+    statistic: '100%'
+  },
+  {
+    heading: 'statistics 2',
+    description:
+      'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+    img: '../../../assets/icons/key.svg',
+    statistic: '10,000'
+  },
+  {
+    heading: 'statistics 3',
+    description:
+      'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+    img: '../../../assets/icons/key.svg',
+    statistic: '3 of 10'
+  },
+  {
+    heading: 'statistics 4',
+    description:
+      'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+    img: '../../../assets/icons/key.svg',
+    statistic: '$500'
+  }
+]
+
+const statisticsAr = [
+  {
+    heading: 'نقطة إثبات 1',
+    description:
+      'لكن لا بد أن أوضح لك أن كل هذه الأفكار المغلوطة حول استنكار  النشوة وتمجيد الألم نشأت بالفعل، وسأعرض لك التفاصيل لتكتشف حقيقة وأساس تلك السعادة البشرية، ',
+    img: '../../../assets/icons/key.svg',
+    statistic: '100%'
+  },
+  {
+    heading: 'نقطة إثبات 2',
+    description:
+      'لكن لا بد أن أوضح لك أن كل هذه الأفكار المغلوطة حول استنكار  النشوة وتمجيد الألم نشأت بالفعل، وسأعرض لك التفاصيل لتكتشف حقيقة وأساس تلك السعادة البشرية، ',
+    img: '../../../assets/icons/key.svg',
+    statistic: '10,000'
+  },
+  {
+    heading: 'نقطة إثبات 3',
+    description:
+      'لكن لا بد أن أوضح لك أن كل هذه الأفكار المغلوطة حول استنكار  النشوة وتمجيد الألم نشأت بالفعل، وسأعرض لك التفاصيل لتكتشف حقيقة وأساس تلك السعادة البشرية، ',
+    img: '../../../assets/icons/key.svg',
+    statistic: '3 من 10'
+  },
+  {
+    heading: 'نقطة إثبات 4',
+    description:
+      'لكن لا بد أن أوضح لك أن كل هذه الأفكار المغلوطة حول استنكار  النشوة وتمجيد الألم نشأت بالفعل، وسأعرض لك التفاصيل لتكتشف حقيقة وأساس تلك السعادة البشرية، ',
+    img: '../../../assets/icons/key.svg',
+    statistic: '$500'
+  }
+]
+
+export { statistics, statisticsAr }

package/src/mock/styleMock.js

@@ -0,0 +1 @@
+module.exports = {}

package/src/mock/tabbed-cards.js

@@ -0,0 +1,197 @@
+import cake from '../components/Paragraphs/TabbedCards/TempIcons/cake-black-18dp.svg?raw'
+import tag from '../components/Paragraphs/TabbedCards/TempIcons/tag_faces-black-18dp.svg?raw'
+import commute from '../components/Paragraphs/TabbedCards/TempIcons/commute-black-18dp.svg?raw'
+import extinguisher from '../components/Paragraphs/TabbedCards/TempIcons/fire_extinguisher-black-18dp.svg?raw'
+import breakfast from '../components/Paragraphs/TabbedCards/TempIcons/free_breakfast-black-18dp.svg?raw'
+import portrait from '../components/Paragraphs/TabbedCards/TempIcons/portrait-black-18dp.svg?raw'
+import storefront from '../components/Paragraphs/TabbedCards/TempIcons/storefront-black-18dp.svg?raw'
+
+const tabbedCardsMockLinks = [
+  {
+    title: 'Coronavirus (COVID-19)',
+    icon: cake,
+    text:
+      "Some quick example text to build on the Tab 1 and make up the bulk of the card's content.",
+    links: [
+      {
+        title: 'List group item heading 1',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      },
+      {
+        title: 'List group item heading 2',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      },
+      {
+        title: 'List group item heading 3',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      }
+    ]
+  },
+  {
+    title: 'Laws and regulations',
+    icon:
+      'https://content-staging-v2.api.worksafe.vic.gov.au/core/misc/menu-expanded.png',
+    text:
+      "Some quick example text to build on the Tab 1 and make up the bulk of the card's content.",
+    links: [
+      {
+        title: 'List group item heading 1',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      },
+      {
+        title: 'List group item heading 2',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      },
+      {
+        title: 'List group item heading 3',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      }
+    ]
+  },
+  {
+    title: 'القوانين والأنظمة',
+    icon: tag,
+    rtl: true,
+    text:
+      'بعض الأمثلة السريعة للنص الذي سيتم بناؤه على علامة التبويب 1 وتشكيل الجزء الأكبر من محتوى البطاقة.',
+    links: [
+      {
+        title: 'قائمة عنصر المجموعة',
+        text:
+          'بعض الأمثلة السريعة للنص الذي سيتم بناؤه على علامة التبويب 1 وتشكيل الجزء الأكبر من محتوى البطاقة.'
+      },
+      {
+        title: 'قائمة عنصر المجموعة',
+        text:
+          'بعض الأمثلة السريعة للنص الذي سيتم بناؤه على علامة التبويب 1 وتشكيل الجزء الأكبر من محتوى البطاقة.'
+      },
+      {
+        title: 'قائمة عنصر المجموعة',
+        text:
+          'بعض الأمثلة السريعة للنص الذي سيتم بناؤه على علامة التبويب 1 وتشكيل الجزء الأكبر من محتوى البطاقة.'
+      }
+    ]
+  },
+  {
+    title: 'Essentials for every workplace',
+    icon: commute,
+    text:
+      "Some quick example text to build on the Tab 1 and make up the bulk of the card's content.",
+    links: [
+      {
+        title: 'List group item heading 1',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      },
+      {
+        title: 'List group item heading 2',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      },
+      {
+        title: 'List group item heading 3',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      }
+    ]
+  },
+  {
+    title: 'Ladders, heights and falls',
+    icon: extinguisher,
+    text:
+      "Some quick example text to build on the Tab 1 and make up the bulk of the card's content.",
+    links: [
+      {
+        title: 'List group item heading 1',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      },
+      {
+        title: 'List group item heading 2',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      },
+      {
+        title: 'List group item heading 3',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      }
+    ]
+  },
+  {
+    title: 'Manual handling',
+    icon: breakfast,
+    text:
+      "Some quick example text to build on the Tab 1 and make up the bulk of the card's content.",
+    links: [
+      {
+        title: 'List group item heading 1',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      },
+      {
+        title: 'List group item heading 2',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      },
+      {
+        title: 'List group item heading 3',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      }
+    ]
+  },
+  {
+    title: 'Fireworks and pyrotechnics',
+    icon: portrait,
+    text:
+      "Some quick example text to build on the Tab 1 and make up the bulk of the card's content.",
+    links: [
+      {
+        title: 'List group item heading 1',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      },
+      {
+        title: 'List group item heading 2',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      },
+      {
+        title: 'List group item heading 3',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      }
+    ]
+  },
+  {
+    title: 'Manual handling',
+    icon: storefront,
+    text:
+      "Some quick example text to build on the Tab 1 and make up the bulk of the card's content.",
+    links: [
+      {
+        title: 'List group item heading 1',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      },
+      {
+        title: 'List group item heading 2',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      },
+      {
+        title: 'List group item heading 3',
+        text:
+          'Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.'
+      }
+    ]
+  }
+]
+export { tabbedCardsMockLinks }

package/src/mock/task-finder.js

@@ -0,0 +1,68 @@
+const taskFinderTempData = [
+  {
+    text: 'Related topics',
+    children: [
+      { text: 'Dangerous goods', url: '/dangerous-goods' },
+      { text: 'Fatigue', url: '/fatigue' },
+      { text: 'Noise', url: '/noise' }
+    ]
+  },
+  {
+    text: 'Related industries',
+    children: [
+      { text: 'Construction', url: '/construction' },
+      { text: 'Manufacturing', url: '/manufacturing' },
+      { text: 'Mining and quarries', url: '/mining-and-quarries' }
+    ]
+  },
+  {
+    text: 'Make a claim',
+    url: '/before-claim'
+  },
+  {
+    text: 'Google',
+    url: 'http://www.google.com'
+  }
+]
+
+const taskFinderTempTitle = 'Task Finder'
+
+const taskFinderTempText =
+  'Mauris non tempor quam, et lacinia sapien. Mauris accumsan eros eget libero posuere vulputate. Etiam elit elit, elementum sed varius at, adipiscing vitae est. Sed nec felis pellentesque, lacinia dui sed, ultricies sapien. Pellentesque orci lectus, consectetur vel pos.'
+
+const taskFinderTempDataAr = [
+  {
+    text: 'مواضيع',
+    children: [
+      { text: 'بضائع خطيرة', url: '/dangerous-goods' },
+      { text: 'تعب', url: '/fatigue' },
+      { text: 'ضجيج', url: '/noise' }
+    ]
+  },
+  {
+    text: 'صناعة',
+    children: [
+      { text: 'اعمال بناء', url: '/construction' },
+      { text: 'صناعة', url: '/manufacturing' },
+      { text: 'التعدين', url: '/mining-and-quarries' }
+    ]
+  },
+  {
+    text: 'ادعاء',
+    url: '/before-claim'
+  }
+]
+
+const taskFinderTempTitleAr = 'مكتشف المهام'
+
+const taskFinderTempTextAr =
+  'يجب على أصحاب العمل أيضاً التشاور مع الموظفين وممثلي الصحة والسلامة (HSRs)، بقدر ما يكون ذلك عملياً، في الأمور المتعلقة بالصحة أو السلامة التي تؤثر عليهم مباشرةً أو التي من المحتمل أن تؤثر عليهم بشكل مباشر، بما في ذلك التشاور بشأن القرارات المتعلقة بكيفية التحكم في المخاطر المرتبطة بفيروس كورونا في مكان العمل.'
+
+export {
+  taskFinderTempData,
+  taskFinderTempTitle,
+  taskFinderTempText,
+  taskFinderTempDataAr,
+  taskFinderTempTitleAr,
+  taskFinderTempTextAr
+}