@mindvalley/design-system 3.2.5 → 3.3.0

package/dist/icons/ui-icons/type-size-filled.svg

@@ -1,6 +1,5 @@
 <svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <g fill="#000">
-    <path d="M3 3.5c-.414 0-.797.14-1.079.421-.28.282-.421.665-.421 1.079v2c0 .414.14.797.421 1.079.282.28.665.421 1.079.421.414 0 .797-.14 1.079-.421.28-.282.421-.665.421-1.079v-.5h3v11H7c-.414 0-.797.14-1.079.421-.28.282-.421.665-.421 1.079 0 .414.14.797.421 1.079.282.28.665.421 1.079.421h4c.414 0 .797-.14 1.079-.421.28-.282.421-.665.421-1.079 0-.414-.14-.797-.421-1.079-.282-.28-.665-.421-1.079-.421h-.5v-11h3V7c0 .414.14.797.421 1.079.282.28.665.421 1.079.421.414 0 .797-.14 1.079-.421.28-.282.421-.665.421-1.079V5c0-.414-.14-.797-.421-1.079-.282-.28-.665-.421-1.079-.421H3Z"/>
-    <path d="M13 9.5c-.414 0-.797.14-1.079.421-.28.282-.421.665-.421 1.079v1c0 .414.14.797.421 1.079.282.28.665.421 1.079.421.414 0 .797-.14 1.079-.421a1.41 1.41 0 0 0 .347-.579H15.5v5H15c-.414 0-.797.14-1.079.421-.28.282-.421.665-.421 1.079 0 .414.14.797.421 1.079.282.28.665.421 1.079.421h4c.414 0 .797-.14 1.079-.421.28-.282.421-.665.421-1.079 0-.414-.14-.797-.421-1.079-.282-.28-.665-.421-1.079-.421h-.5v-5h1.074c.069.218.184.415.347.579.282.28.665.421 1.079.421.414 0 .797-.14 1.079-.421.28-.282.421-.665.421-1.079v-1c0-.414-.14-.797-.421-1.079-.282-.28-.665-.421-1.079-.421h-8Z"/>
+  <g fill-rule="evenodd" clip-rule="evenodd" fill="#000">
+    <path d="M6.18 4.87 1 19.13h2.68l1.08-3.2h5.66l1.12 3.2h2.66L8.9 4.87H6.18Zm-.68 8.84 1.9-5.6.14-.78.14.78 1.96 5.6H5.5ZM14.31 16.776c0 1.504 1.024 2.464 3.008 2.464 1.904 0 3.136-.88 3.76-2.08l.224 1.84h1.696v-6.208c0-1.968-1.088-3.216-4.064-3.216-2.624 0-4.176 1.392-4.32 3.472h2.16c.064-1.168.752-1.84 2.272-1.84 1.424 0 1.936.48 1.936 1.248 0 .752-.672.976-2.304 1.184-1.744.272-2.384.384-3.168.88-.752.464-1.2 1.232-1.2 2.256Zm6.688-1.936c0 1.328-1.152 2.784-2.96 2.784-.976 0-1.44-.416-1.44-1.152 0-.432.16-.704.544-.96.416-.272.88-.4 2-.576.832-.128 1.472-.304 1.856-.592v.496Z"/>
   </g>
 </svg>

package/dist/icons/ui-icons/type-size-outlined.svg

@@ -1,6 +1,5 @@
 <svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <g fill="#000">
-    <path d="M3 4h12c.6 0 1 .4 1 1v2c0 .6-.4 1-1 1s-1-.4-1-1V6h-4v12h1c.6 0 1 .4 1 1s-.4 1-1 1H7c-.6 0-1-.4-1-1s.4-1 1-1h1V6H4v1c0 .6-.4 1-1 1s-1-.4-1-1V5c0-.6.4-1 1-1Z"/>
-    <path d="M13 10h8c.6 0 1 .4 1 1v1c0 .6-.4 1-1 1s-1-.4-1-1h-2v6h1c.6 0 1 .4 1 1s-.4 1-1 1h-4c-.6 0-1-.4-1-1s.4-1 1-1h1v-6h-2c0 .6-.4 1-1 1s-1-.4-1-1v-1c0-.6.4-1 1-1Z"/>
+  <g fill-rule="evenodd" clip-rule="evenodd" fill="#000">
+    <path d="M6.69 4.89 1.75 19.11h1.9l1.2-3.58h5.72l1.24 3.58h1.88L8.59 4.89h-1.9Zm-1.3 9.04 2.18-6.52.08-.48.08.48 2.28 6.52H5.39ZM14.28 16.934c0 1.472.976 2.384 2.848 2.384 1.888 0 3.184-1.024 3.76-2.384l.176 2.176h1.184v-6.4c0-1.808-1.04-2.96-3.696-2.96-2.448 0-3.888 1.312-4 3.216v.176h1.488v-.176c.064-1.232.912-2.048 2.576-2.048 1.6 0 2.224.608 2.224 1.584v.016c0 .848-.848 1.04-2.352 1.296-1.696.304-2.384.48-3.088.928a2.515 2.515 0 0 0-1.12 2.144v.048Zm6.576-1.984c0 1.536-1.312 3.2-3.264 3.2-1.136 0-1.712-.528-1.712-1.392v-.032c0-.544.208-.944.624-1.248.48-.336 1.024-.496 2.304-.72.96-.192 1.68-.368 2.048-.72v.912Z"/>
   </g>
 </svg>

package/dist/icons/ui-icons/unarchive-filled.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M3 2a2 2 0 0 0-2 2v3a2 2 0 0 0 2 2v10a3 3 0 0 0 3 3h2a1 1 0 1 0 0-2H6a1 1 0 0 1-1-1V9h14v10a1 1 0 0 1-1 1h-2a1 1 0 1 0 0 2h2a3 3 0 0 0 3-3V9a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2H3Zm9.7 9.286a.996.996 0 0 0-.697-.286h-.006a.997.997 0 0 0-.697.286l-.008.008-3 2.999a1 1 0 1 0 1.415 1.414L11 14.414V21a1 1 0 1 0 2 0v-6.586l1.293 1.293a1 1 0 0 0 1.414-1.414l-3-3-.007-.007Z" fill="#000"/>
+</svg>

package/dist/icons/ui-icons/unarchive-outlined.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M1 4a2 2 0 0 1 2-2h18a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2v10a3 3 0 0 1-3 3h-2a1 1 0 1 1 0-2h2a1 1 0 0 0 1-1V9H5v10a1 1 0 0 0 1 1h2a1 1 0 1 1 0 2H6a3 3 0 0 1-3-3V9a2 2 0 0 1-2-2V4Zm19 3h1V4H3v3h17Zm-7.617 4.076a.996.996 0 0 1 .318.21l.007.008 3 2.999a1 1 0 0 1-1.415 1.414L13 14.414V21a1 1 0 1 1-2 0v-6.586l-1.293 1.293a1 1 0 0 1-1.414-1.414l3-3 .007-.007a.997.997 0 0 1 .697-.286h.006c.134 0 .263.027.38.076Z" fill="#000"/>
+</svg>

package/dist/icons/ui-icons/unmute-filled.svg

@@ -1 +1 @@
-<svg/>
+<svg></svg>

package/dist/icons/ui-icons/unmute-outlined.svg

@@ -1 +1 @@
-<svg/>
+<svg></svg>

package/dist/index.js

@@ -1,2 +1,2 @@
-!function(e,f){"object"==typeof exports&&"object"==typeof module?module.exports=f():"function"==typeof define&&define.amd?define([],f):"object"==typeof exports?exports.mvDesignSystem=f():e.mvDesignSystem=f()}(this,(()=>(()=>{var e={907:e=>{e.exports={"cool-grey-100":"#f9f9f9","cool-grey-150":"#f3f4f6","cool-grey-200":"#ebedef","cool-grey-250":"#dfe1e5","cool-grey-300":"#ced1d7","cool-grey-350":"#b3b8c1","cool-grey-400":"#979ca5","cool-grey-450":"#71767f","cool-grey-500":"#595e67","cool-grey-550":"#41464f","cool-grey-600":"#292d38","cool-grey-650":"#181d26","cool-grey-700":"#0f131a","purple-50":"#f8efff","purple-100":"#f5e7ff","purple-200":"#eed8fe","purple-300":"#e0b8fe","purple-400":"#d299fe","purple-500":"#ba62fd","purple-600":"#7a12d4","purple-700":"#680fb4","purple-800":"#4f0c8a","purple-900":"#37085f","green-50":"#e8f9f1","green-100":"#dcf6ea","green-200":"#c5efdd","green-300":"#97e3c1","green-400":"#69d7a6","green-500":"#18c176","green-600":"#159f65","green-700":"#128756","green-800":"#0e6742","green-900":"#09482d","teal-50":"#ebfafb","teal-100":"#e1f8f9","teal-200":"#cdf3f5","teal-300":"#a5eaed","teal-400":"#7de0e4","teal-500":"#37d0d6","teal-600":"#1e9094","teal-700":"#1a7a7e","teal-800":"#145e60","teal-900":"#0e4143","blue-50":"#ebf5ff","blue-100":"#e0f0ff","blue-200":"#cce6ff","blue-300":"#a3d3ff","blue-400":"#7abfff","blue-500":"#329dff","blue-600":"#005cff","blue-700":"#1c3bd4","blue-800":"#1832b4","blue-900":"#12268a","red-50":"#feeded","red-100":"#fde3e3","red-200":"#fcd1d1","red-300":"#faacac","red-400":"#f78787","red-500":"#f34747","red-600":"#d8273a","red-700":"#b82131","red-800":"#8c1926","red-900":"#61121a","orange-50":"#fff4e9","orange-100":"#ffefdd","orange-200":"#ffe4c7","orange-300":"#ffce9a","orange-400":"#ffb96d","orange-500":"#ff931f","orange-600":"#ed6325","orange-700":"#c9541f","orange-800":"#9a4018","orange-900":"#6b2d11","yellow-50":"#fefae8","yellow-100":"#fef7dc","yellow-200":"#fcf1c5","yellow-300":"#fae797","yellow-400":"#f8dc69","yellow-500":"#f5c918","yellow-600":"#e8ad11","yellow-700":"#c5930e","yellow-800":"#97700b","yellow-900":"#684e08","aqua-50":"#eaf7ff","aqua-100":"#dff4ff","aqua-200":"#caecff","aqua-300":"#a0ddff","aqua-400":"#76ceff","aqua-500":"#2cb3ff","aqua-600":"#1b9ce6","aqua-700":"#1785c3","aqua-800":"#126596","aqua-900":"#0c4668","pink-50":"#feeaf3","pink-100":"#fedfec","pink-200":"#fdcae0","pink-300":"#fca0c7","pink-400":"#fa76af","pink-500":"#f72c84","pink-600":"#df1a6f","pink-700":"#be165e","pink-800":"#911148","pink-900":"#640c32","purple-500-90a":"rgba(186, 98, 253, 0.9)","purple-500-20a":"rgba(186, 98, 253, 0.2)","purple-600-10a":"rgba(122, 18, 212, 0.1)","white-90a":"rgba(255, 255, 255, 0.9)","white-24a":"rgba(255, 255, 255, 0.24)","white-12a":"rgba(255, 255, 255, 0.12)","white-70a":"rgba(255, 255, 255, 0.7)","white-18a":"rgba(255, 255, 255, 0.18)","white-10a":"rgba(255, 255, 255, 0.1)","white-8a":"rgba(255, 255, 255, 0.08)","black-18a":"rgba(0, 0, 0, 0.18)","black-8a":"rgba(0, 0, 0, 0.08)","black-70a":"rgba(0, 0, 0, 0.7)","black-12a":"rgba(0, 0, 0, 0.12)","black-6a":"rgba(0, 0, 0, 0.06)","black-4a":"rgba(0, 0, 0, 0.04)","purple-tint":"#9b37f2",black:"#000000",white:"#ffffff"}}},f={};function a(r){var l=f[r];if(void 0!==l)return l.exports;var o=f[r]={exports:{}};return e[r](o,o.exports,a),o.exports}a.n=e=>{var f=e&&e.__esModule?()=>e.default:()=>e;return a.d(f,{a:f}),f},a.d=(e,f)=>{for(var r in f)a.o(f,r)&&!a.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:f[r]})},a.o=(e,f)=>Object.prototype.hasOwnProperty.call(e,f),a.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var r={};return(()=>{"use strict";a.r(r),a.d(r,{colors:()=>e});var e=a(907)})(),r})()));
+!function(e,f){"object"==typeof exports&&"object"==typeof module?module.exports=f():"function"==typeof define&&define.amd?define([],f):"object"==typeof exports?exports.mvDesignSystem=f():e.mvDesignSystem=f()}(this,(()=>(()=>{var e={917:e=>{e.exports={"cool-grey-100":"#f9f9f9","cool-grey-150":"#f3f4f6","cool-grey-200":"#ebedef","cool-grey-250":"#dfe1e5","cool-grey-300":"#ced1d7","cool-grey-350":"#b3b8c1","cool-grey-400":"#979ca5","cool-grey-450":"#71767f","cool-grey-500":"#595e67","cool-grey-550":"#41464f","cool-grey-600":"#292d38","cool-grey-650":"#181d26","cool-grey-700":"#0f131a","purple-50":"#f8efff","purple-100":"#f5e7ff","purple-200":"#eed8fe","purple-300":"#e0b8fe","purple-400":"#d299fe","purple-500":"#ba62fd","purple-600":"#7a12d4","purple-700":"#680fb4","purple-800":"#4f0c8a","purple-900":"#37085f","green-50":"#e8f9f1","green-100":"#dcf6ea","green-200":"#c5efdd","green-300":"#97e3c1","green-400":"#69d7a6","green-500":"#18c176","green-600":"#159f65","green-700":"#128756","green-800":"#0e6742","green-900":"#09482d","teal-50":"#ebfafb","teal-100":"#e1f8f9","teal-200":"#cdf3f5","teal-300":"#a5eaed","teal-400":"#7de0e4","teal-500":"#37d0d6","teal-600":"#1e9094","teal-700":"#1a7a7e","teal-800":"#145e60","teal-900":"#0e4143","blue-50":"#ebf5ff","blue-100":"#e0f0ff","blue-200":"#cce6ff","blue-300":"#a3d3ff","blue-400":"#7abfff","blue-500":"#329dff","blue-600":"#005cff","blue-700":"#1c3bd4","blue-800":"#1832b4","blue-900":"#12268a","red-50":"#feeded","red-100":"#fde3e3","red-200":"#fcd1d1","red-300":"#faacac","red-400":"#f78787","red-500":"#f34747","red-600":"#d8273a","red-700":"#b82131","red-800":"#8c1926","red-900":"#61121a","orange-50":"#fff4e9","orange-100":"#ffefdd","orange-200":"#ffe4c7","orange-300":"#ffce9a","orange-400":"#ffb96d","orange-500":"#ff931f","orange-600":"#ed6325","orange-700":"#c9541f","orange-800":"#9a4018","orange-900":"#6b2d11","yellow-50":"#fefae8","yellow-100":"#fef7dc","yellow-200":"#fcf1c5","yellow-300":"#fae797","yellow-400":"#f8dc69","yellow-500":"#f5c918","yellow-600":"#e8ad11","yellow-700":"#c5930e","yellow-800":"#97700b","yellow-900":"#684e08","aqua-50":"#eaf7ff","aqua-100":"#dff4ff","aqua-200":"#caecff","aqua-300":"#a0ddff","aqua-400":"#76ceff","aqua-500":"#2cb3ff","aqua-600":"#1b9ce6","aqua-700":"#1785c3","aqua-800":"#126596","aqua-900":"#0c4668","pink-50":"#feeaf3","pink-100":"#fedfec","pink-200":"#fdcae0","pink-300":"#fca0c7","pink-400":"#fa76af","pink-500":"#f72c84","pink-600":"#df1a6f","pink-700":"#be165e","pink-800":"#911148","pink-900":"#640c32","purple-500-90a":"rgba(186, 98, 253, 0.9)","purple-500-20a":"rgba(186, 98, 253, 0.2)","purple-600-10a":"rgba(122, 18, 212, 0.1)","white-90a":"rgba(255, 255, 255, 0.9)","white-24a":"rgba(255, 255, 255, 0.24)","white-12a":"rgba(255, 255, 255, 0.12)","white-70a":"rgba(255, 255, 255, 0.7)","white-18a":"rgba(255, 255, 255, 0.18)","white-10a":"rgba(255, 255, 255, 0.1)","white-8a":"rgba(255, 255, 255, 0.08)","black-18a":"rgba(0, 0, 0, 0.18)","black-8a":"rgba(0, 0, 0, 0.08)","black-70a":"rgba(0, 0, 0, 0.7)","black-12a":"rgba(0, 0, 0, 0.12)","black-6a":"rgba(0, 0, 0, 0.06)","black-4a":"rgba(0, 0, 0, 0.04)","purple-tint":"#9b37f2",black:"#000000",white:"#ffffff"}}},f={};function a(r){var l=f[r];if(void 0!==l)return l.exports;var o=f[r]={exports:{}};return e[r](o,o.exports,a),o.exports}a.n=e=>{var f=e&&e.__esModule?()=>e.default:()=>e;return a.d(f,{a:f}),f},a.d=(e,f)=>{for(var r in f)a.o(f,r)&&!a.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:f[r]})},a.o=(e,f)=>Object.prototype.hasOwnProperty.call(e,f),a.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var r={};return(()=>{"use strict";a.r(r),a.d(r,{colors:()=>e});var e=a(917)})(),r})()));
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","mappings":"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","sources":["webpack://mvDesignSystem/webpack/universalModuleDefinition","webpack://mvDesignSystem/./src/build/js/mindvalley/colors.js","webpack://mvDesignSystem/webpack/bootstrap","webpack://mvDesignSystem/webpack/runtime/compat get default export","webpack://mvDesignSystem/webpack/runtime/define property getters","webpack://mvDesignSystem/webpack/runtime/hasOwnProperty shorthand","webpack://mvDesignSystem/webpack/runtime/make namespace object"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory();\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"mvDesignSystem\"] = factory();\n\telse\n\t\troot[\"mvDesignSystem\"] = factory();\n})(this, () => {\nreturn ","/**\n * Do not edit directly\n * Generated on Mon, 15 Jul 2024 03:29:07 GMT\n */\n\nmodule.exports = {\n  \"cool-grey-100\": \"#f9f9f9\",\n  \"cool-grey-150\": \"#f3f4f6\",\n  \"cool-grey-200\": \"#ebedef\",\n  \"cool-grey-250\": \"#dfe1e5\",\n  \"cool-grey-300\": \"#ced1d7\",\n  \"cool-grey-350\": \"#b3b8c1\",\n  \"cool-grey-400\": \"#979ca5\",\n  \"cool-grey-450\": \"#71767f\",\n  \"cool-grey-500\": \"#595e67\",\n  \"cool-grey-550\": \"#41464f\",\n  \"cool-grey-600\": \"#292d38\",\n  \"cool-grey-650\": \"#181d26\",\n  \"cool-grey-700\": \"#0f131a\",\n  \"purple-50\": \"#f8efff\",\n  \"purple-100\": \"#f5e7ff\",\n  \"purple-200\": \"#eed8fe\",\n  \"purple-300\": \"#e0b8fe\",\n  \"purple-400\": \"#d299fe\",\n  \"purple-500\": \"#ba62fd\",\n  \"purple-600\": \"#7a12d4\",\n  \"purple-700\": \"#680fb4\",\n  \"purple-800\": \"#4f0c8a\",\n  \"purple-900\": \"#37085f\",\n  \"green-50\": \"#e8f9f1\",\n  \"green-100\": \"#dcf6ea\",\n  \"green-200\": \"#c5efdd\",\n  \"green-300\": \"#97e3c1\",\n  \"green-400\": \"#69d7a6\",\n  \"green-500\": \"#18c176\",\n  \"green-600\": \"#159f65\",\n  \"green-700\": \"#128756\",\n  \"green-800\": \"#0e6742\",\n  \"green-900\": \"#09482d\",\n  \"teal-50\": \"#ebfafb\",\n  \"teal-100\": \"#e1f8f9\",\n  \"teal-200\": \"#cdf3f5\",\n  \"teal-300\": \"#a5eaed\",\n  \"teal-400\": \"#7de0e4\",\n  \"teal-500\": \"#37d0d6\",\n  \"teal-600\": \"#1e9094\",\n  \"teal-700\": \"#1a7a7e\",\n  \"teal-800\": \"#145e60\",\n  \"teal-900\": \"#0e4143\",\n  \"blue-50\": \"#ebf5ff\",\n  \"blue-100\": \"#e0f0ff\",\n  \"blue-200\": \"#cce6ff\",\n  \"blue-300\": \"#a3d3ff\",\n  \"blue-400\": \"#7abfff\",\n  \"blue-500\": \"#329dff\",\n  \"blue-600\": \"#005cff\",\n  \"blue-700\": \"#1c3bd4\",\n  \"blue-800\": \"#1832b4\",\n  \"blue-900\": \"#12268a\",\n  \"red-50\": \"#feeded\",\n  \"red-100\": \"#fde3e3\",\n  \"red-200\": \"#fcd1d1\",\n  \"red-300\": \"#faacac\",\n  \"red-400\": \"#f78787\",\n  \"red-500\": \"#f34747\",\n  \"red-600\": \"#d8273a\",\n  \"red-700\": \"#b82131\",\n  \"red-800\": \"#8c1926\",\n  \"red-900\": \"#61121a\",\n  \"orange-50\": \"#fff4e9\",\n  \"orange-100\": \"#ffefdd\",\n  \"orange-200\": \"#ffe4c7\",\n  \"orange-300\": \"#ffce9a\",\n  \"orange-400\": \"#ffb96d\",\n  \"orange-500\": \"#ff931f\",\n  \"orange-600\": \"#ed6325\",\n  \"orange-700\": \"#c9541f\",\n  \"orange-800\": \"#9a4018\",\n  \"orange-900\": \"#6b2d11\",\n  \"yellow-50\": \"#fefae8\",\n  \"yellow-100\": \"#fef7dc\",\n  \"yellow-200\": \"#fcf1c5\",\n  \"yellow-300\": \"#fae797\",\n  \"yellow-400\": \"#f8dc69\",\n  \"yellow-500\": \"#f5c918\",\n  \"yellow-600\": \"#e8ad11\",\n  \"yellow-700\": \"#c5930e\",\n  \"yellow-800\": \"#97700b\",\n  \"yellow-900\": \"#684e08\",\n  \"aqua-50\": \"#eaf7ff\",\n  \"aqua-100\": \"#dff4ff\",\n  \"aqua-200\": \"#caecff\",\n  \"aqua-300\": \"#a0ddff\",\n  \"aqua-400\": \"#76ceff\",\n  \"aqua-500\": \"#2cb3ff\",\n  \"aqua-600\": \"#1b9ce6\",\n  \"aqua-700\": \"#1785c3\",\n  \"aqua-800\": \"#126596\",\n  \"aqua-900\": \"#0c4668\",\n  \"pink-50\": \"#feeaf3\",\n  \"pink-100\": \"#fedfec\",\n  \"pink-200\": \"#fdcae0\",\n  \"pink-300\": \"#fca0c7\",\n  \"pink-400\": \"#fa76af\",\n  \"pink-500\": \"#f72c84\",\n  \"pink-600\": \"#df1a6f\",\n  \"pink-700\": \"#be165e\",\n  \"pink-800\": \"#911148\",\n  \"pink-900\": \"#640c32\",\n  \"purple-500-90a\": \"rgba(186, 98, 253, 0.9)\",\n  \"purple-500-20a\": \"rgba(186, 98, 253, 0.2)\",\n  \"purple-600-10a\": \"rgba(122, 18, 212, 0.1)\",\n  \"white-90a\": \"rgba(255, 255, 255, 0.9)\",\n  \"white-24a\": \"rgba(255, 255, 255, 0.24)\",\n  \"white-12a\": \"rgba(255, 255, 255, 0.12)\",\n  \"white-70a\": \"rgba(255, 255, 255, 0.7)\",\n  \"white-18a\": \"rgba(255, 255, 255, 0.18)\",\n  \"white-10a\": \"rgba(255, 255, 255, 0.1)\",\n  \"white-8a\": \"rgba(255, 255, 255, 0.08)\",\n  \"black-18a\": \"rgba(0, 0, 0, 0.18)\",\n  \"black-8a\": \"rgba(0, 0, 0, 0.08)\",\n  \"black-70a\": \"rgba(0, 0, 0, 0.7)\",\n  \"black-12a\": \"rgba(0, 0, 0, 0.12)\",\n  \"black-6a\": \"rgba(0, 0, 0, 0.06)\",\n  \"black-4a\": \"rgba(0, 0, 0, 0.04)\",\n  \"purple-tint\": \"#9b37f2\",\n  \"black\": \"#000000\",\n  \"white\": \"#ffffff\"\n};\n","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// getDefaultExport function for compatibility with non-harmony modules\n__webpack_require__.n = (module) => {\n\tvar getter = module && module.__esModule ?\n\t\t() => (module['default']) :\n\t\t() => (module);\n\t__webpack_require__.d(getter, { a: getter });\n\treturn getter;\n};","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};"],"names":["root","factory","exports","module","define","amd","this","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","undefined","__webpack_modules__","n","getter","__esModule","d","a","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","prototype","hasOwnProperty","call","r","Symbol","toStringTag","value"],"sourceRoot":""}
+{"version":3,"file":"index.js","mappings":"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","sources":["webpack://mvDesignSystem/webpack/universalModuleDefinition","webpack://mvDesignSystem/./src/build/js/mindvalley/colors.js","webpack://mvDesignSystem/webpack/bootstrap","webpack://mvDesignSystem/webpack/runtime/compat get default export","webpack://mvDesignSystem/webpack/runtime/define property getters","webpack://mvDesignSystem/webpack/runtime/hasOwnProperty shorthand","webpack://mvDesignSystem/webpack/runtime/make namespace object"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory();\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"mvDesignSystem\"] = factory();\n\telse\n\t\troot[\"mvDesignSystem\"] = factory();\n})(this, () => {\nreturn ","/**\n * Do not edit directly\n * Generated on Tue, 22 Oct 2024 03:26:43 GMT\n */\n\nmodule.exports = {\n  \"cool-grey-100\": \"#f9f9f9\",\n  \"cool-grey-150\": \"#f3f4f6\",\n  \"cool-grey-200\": \"#ebedef\",\n  \"cool-grey-250\": \"#dfe1e5\",\n  \"cool-grey-300\": \"#ced1d7\",\n  \"cool-grey-350\": \"#b3b8c1\",\n  \"cool-grey-400\": \"#979ca5\",\n  \"cool-grey-450\": \"#71767f\",\n  \"cool-grey-500\": \"#595e67\",\n  \"cool-grey-550\": \"#41464f\",\n  \"cool-grey-600\": \"#292d38\",\n  \"cool-grey-650\": \"#181d26\",\n  \"cool-grey-700\": \"#0f131a\",\n  \"purple-50\": \"#f8efff\",\n  \"purple-100\": \"#f5e7ff\",\n  \"purple-200\": \"#eed8fe\",\n  \"purple-300\": \"#e0b8fe\",\n  \"purple-400\": \"#d299fe\",\n  \"purple-500\": \"#ba62fd\",\n  \"purple-600\": \"#7a12d4\",\n  \"purple-700\": \"#680fb4\",\n  \"purple-800\": \"#4f0c8a\",\n  \"purple-900\": \"#37085f\",\n  \"green-50\": \"#e8f9f1\",\n  \"green-100\": \"#dcf6ea\",\n  \"green-200\": \"#c5efdd\",\n  \"green-300\": \"#97e3c1\",\n  \"green-400\": \"#69d7a6\",\n  \"green-500\": \"#18c176\",\n  \"green-600\": \"#159f65\",\n  \"green-700\": \"#128756\",\n  \"green-800\": \"#0e6742\",\n  \"green-900\": \"#09482d\",\n  \"teal-50\": \"#ebfafb\",\n  \"teal-100\": \"#e1f8f9\",\n  \"teal-200\": \"#cdf3f5\",\n  \"teal-300\": \"#a5eaed\",\n  \"teal-400\": \"#7de0e4\",\n  \"teal-500\": \"#37d0d6\",\n  \"teal-600\": \"#1e9094\",\n  \"teal-700\": \"#1a7a7e\",\n  \"teal-800\": \"#145e60\",\n  \"teal-900\": \"#0e4143\",\n  \"blue-50\": \"#ebf5ff\",\n  \"blue-100\": \"#e0f0ff\",\n  \"blue-200\": \"#cce6ff\",\n  \"blue-300\": \"#a3d3ff\",\n  \"blue-400\": \"#7abfff\",\n  \"blue-500\": \"#329dff\",\n  \"blue-600\": \"#005cff\",\n  \"blue-700\": \"#1c3bd4\",\n  \"blue-800\": \"#1832b4\",\n  \"blue-900\": \"#12268a\",\n  \"red-50\": \"#feeded\",\n  \"red-100\": \"#fde3e3\",\n  \"red-200\": \"#fcd1d1\",\n  \"red-300\": \"#faacac\",\n  \"red-400\": \"#f78787\",\n  \"red-500\": \"#f34747\",\n  \"red-600\": \"#d8273a\",\n  \"red-700\": \"#b82131\",\n  \"red-800\": \"#8c1926\",\n  \"red-900\": \"#61121a\",\n  \"orange-50\": \"#fff4e9\",\n  \"orange-100\": \"#ffefdd\",\n  \"orange-200\": \"#ffe4c7\",\n  \"orange-300\": \"#ffce9a\",\n  \"orange-400\": \"#ffb96d\",\n  \"orange-500\": \"#ff931f\",\n  \"orange-600\": \"#ed6325\",\n  \"orange-700\": \"#c9541f\",\n  \"orange-800\": \"#9a4018\",\n  \"orange-900\": \"#6b2d11\",\n  \"yellow-50\": \"#fefae8\",\n  \"yellow-100\": \"#fef7dc\",\n  \"yellow-200\": \"#fcf1c5\",\n  \"yellow-300\": \"#fae797\",\n  \"yellow-400\": \"#f8dc69\",\n  \"yellow-500\": \"#f5c918\",\n  \"yellow-600\": \"#e8ad11\",\n  \"yellow-700\": \"#c5930e\",\n  \"yellow-800\": \"#97700b\",\n  \"yellow-900\": \"#684e08\",\n  \"aqua-50\": \"#eaf7ff\",\n  \"aqua-100\": \"#dff4ff\",\n  \"aqua-200\": \"#caecff\",\n  \"aqua-300\": \"#a0ddff\",\n  \"aqua-400\": \"#76ceff\",\n  \"aqua-500\": \"#2cb3ff\",\n  \"aqua-600\": \"#1b9ce6\",\n  \"aqua-700\": \"#1785c3\",\n  \"aqua-800\": \"#126596\",\n  \"aqua-900\": \"#0c4668\",\n  \"pink-50\": \"#feeaf3\",\n  \"pink-100\": \"#fedfec\",\n  \"pink-200\": \"#fdcae0\",\n  \"pink-300\": \"#fca0c7\",\n  \"pink-400\": \"#fa76af\",\n  \"pink-500\": \"#f72c84\",\n  \"pink-600\": \"#df1a6f\",\n  \"pink-700\": \"#be165e\",\n  \"pink-800\": \"#911148\",\n  \"pink-900\": \"#640c32\",\n  \"purple-500-90a\": \"rgba(186, 98, 253, 0.9)\",\n  \"purple-500-20a\": \"rgba(186, 98, 253, 0.2)\",\n  \"purple-600-10a\": \"rgba(122, 18, 212, 0.1)\",\n  \"white-90a\": \"rgba(255, 255, 255, 0.9)\",\n  \"white-24a\": \"rgba(255, 255, 255, 0.24)\",\n  \"white-12a\": \"rgba(255, 255, 255, 0.12)\",\n  \"white-70a\": \"rgba(255, 255, 255, 0.7)\",\n  \"white-18a\": \"rgba(255, 255, 255, 0.18)\",\n  \"white-10a\": \"rgba(255, 255, 255, 0.1)\",\n  \"white-8a\": \"rgba(255, 255, 255, 0.08)\",\n  \"black-18a\": \"rgba(0, 0, 0, 0.18)\",\n  \"black-8a\": \"rgba(0, 0, 0, 0.08)\",\n  \"black-70a\": \"rgba(0, 0, 0, 0.7)\",\n  \"black-12a\": \"rgba(0, 0, 0, 0.12)\",\n  \"black-6a\": \"rgba(0, 0, 0, 0.06)\",\n  \"black-4a\": \"rgba(0, 0, 0, 0.04)\",\n  \"purple-tint\": \"#9b37f2\",\n  \"black\": \"#000000\",\n  \"white\": \"#ffffff\"\n};\n","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// getDefaultExport function for compatibility with non-harmony modules\n__webpack_require__.n = (module) => {\n\tvar getter = module && module.__esModule ?\n\t\t() => (module['default']) :\n\t\t() => (module);\n\t__webpack_require__.d(getter, { a: getter });\n\treturn getter;\n};","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};"],"names":["root","factory","exports","module","define","amd","this","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","undefined","__webpack_modules__","n","getter","__esModule","d","a","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","prototype","hasOwnProperty","call","r","Symbol","toStringTag","value"],"sourceRoot":""}

package/docs/USAGE.md

@@ -70,6 +70,7 @@ and override the redefined colors using the b2b specific colors.
 ```
 
 ## Why the override?
+
 Both brands share color names, but their hues and shades are distinct. For instance, the reds, blues, teals, and purples in b2b differ. Therefore, the override is necessary to guarantee that a developer working on b2b receives the specific shades of colors associated with b2b.
 
 Here is full list of [b2b colors](https://www.figma.com/file/1EPj7v5H5JhP2d0v2h8QeC/B2B-Foundations?type=design&node-id=1-395&mode=design&t=SY5HTy1zbFO5p80n-0)
@@ -259,11 +260,13 @@ Since the typography classes are responsive, you don't need to add media queries
 ```
 
 #### Configuring the brand
+
 The Mindvalley design system also supports multiple brands, including the core Mindvalley brand and a B2B (business-to-business) brand. Each brand has its own set of typography tokens that can be used to ensure consistency across different projects and platforms.
 
 To configure the typography for a specific brand within your TailwindCSS setup, you will need to adjust your `tailwind.config.js` file to include the brand-specific typography tokens.
 
 Here's how you can configure the brand:
+
 1. In your `tailwind.config.js` file, require and configure the typography plugin with the brand option.
 
 For the core Mindvalley brand:
@@ -279,6 +282,7 @@ module.exports = {
   // ...
 }
 ```
+
 This is the same as the default config and ends up rendering typography classes for Mindvalley's core
 design. You can omit this if you are working with just the normal Mindvalley brand.
 
@@ -296,15 +300,14 @@ module.exports = {
 }
 ```
 
-This configuration will generate the necessary CSS classes for typography based on the tokens defined for each brand. 
-You can then use these classes in your HTML or JSX files to apply the correct typography styles for the brand 
+This configuration will generate the necessary CSS classes for typography based on the tokens defined for each brand.
+You can then use these classes in your HTML or JSX files to apply the correct typography styles for the brand
 you are working on.
 
 Note: B2b brand builds on top of the core brand typography with an additional specific typography style. As such we have to have both options added to the brands config list for both to be included.
 
 Browse [B2B foundations figma file](https://www.figma.com/file/1EPj7v5H5JhP2d0v2h8QeC/B2B-Foundations?type=design&node-id=139-11&mode=design&t=SY5HTy1zbFO5p80n-0) to see the specific typography.
 
-
 #### Configuring the Prefix
 
 To customize the class names further, you can prepend a prefix to all typography class names generated by the plugin. This is particularly useful for specific naming conventions.
@@ -332,7 +335,6 @@ When using `mv-type--`, the generated CSS class will look like this:
 }
 ```
 
-
 #### Configuring the breakpoint
 
 By default, the plugin uses the `lg` breakpoint from the [screen size configuration](https://tailwindcss.com/docs/screens) in your Tailwind configuration. If you have a different configuration or naming convention for your Tailwind breakpoints, you can specify the identifier of the desired breakpoint using the `breakingPoint` option in the plugin configuration.
@@ -417,13 +419,67 @@ You will have to have the mindvalley design system npm package installed to acce
 
 With the package installed you can now access the icons with these access methods.
 
-a) **Recommended method (category-specific directories)**
+a) **Recommended method (brand + category-specific directories)**
+
+This is the updated and recommended method. It involves accessing icons and sprites from brands > category-specific organized directories.
+Icons are also organized by brand.
+
+```sh
+├── dist
+│    │── brands
+│    │   ├── b2b
+│    │   │   └── icons
+│    │   │       ├── sprites
+│    │   │       │   └── ui-icons.svg
+│    │   │       └── ui-icons
+│    │   │           ├── activity-filled.svg
+│    │   │           ├── activity-outlined.svg
+│    │   │           ├── ...
+│    │   │           └── zoom-out-outlined.svg
+│    │   │ 
+│    │   └── mindvalley
+│    │       └── icons
+│    │            ├── brand-icons
+│    │            │   ├── aging-filled.svg
+│    │            │   ├── aging-outlined.svg
+│    │            │   └── ...
+│    │            ├── categories
+│    │            │   ├── icon-body.svg
+│    │            │   ├── icon-career.svg
+│    │            │   └── ...
+│    │            ├── ui-icons
+│    │            │   ├── activity-filled.svg
+│    │            │   ├── ...
+│    │            │   └── zoom-out-outlined.svg
+│    │            ├── sprites
+│    │            │   ├── ui-icons.svg
+│    │            │   ├── brand-icons.svg
+│    │            │   └── categories.svg
+
+```
 
-This is the updated and recommended method. It involves accessing icons and sprites from category-specific organized directories.
+And here are the path conventions to follow:
+
+- Path to an individual icon: `@mindvalley/design-system/dist/brands/<brand>/icons/<category>/<icon-name>.svg`
+- Path to combined sprite icons: `@mindvalley/design-system/dist/brands/<brand>/icons/sprites/<category-sprite>.svg`
+
+For example:
+
+- Individual B2B UI icon: `@mindvalley/design-system/dist/brands/b2b/icons/ui-icons/activity-filled.svg`
+- Mindvalley brand icons sprite: `@mindvalley/design-system/dist/brands/mindvalley/icons/sprites/brand-icons.svg`
+
+For a detailed overview of the available icons in each category and brand, refer to the following:
+
+1. [B2B Icons](icons/brands/b2b/ui-icons.md)
+2. [Mindvalley brand Icons](icons/brands/mindvalley/icons/brand-icons.md)
+3. [Mindvalley categories Icons](icons/brands/mindvalley/icons/categories.md)
+4. [Mindvalley UI Icons](icons/brands/mindvalley/icons/ui-icons.md)
+
+b) **Legacy Method (a) (To be deprecated) - category-specific directories with no brand**
 
 Below is the organized file tree, showcasing the intuitive structuring of icons in category-specific folders and sprites:
 
-```txt
+```sh
 dist
 ├── icons
 │   └── categories 
@@ -457,11 +513,11 @@ And here are the path conventions to follow:
 
 For a detailed overview of the available icons in each category, refer to the following:
 
-1. [Brand Icons](icons/brand-icons.md)
-2. [UI Icons](icons/ui-icons.md)
-3. [Categories](icons/categories.md)
+1. [Mindvalley Brand Icons](icons/brands/mindvalley/icons/brand-icons.md)
+2. [Mindvalley UI Icons](icons/brands/mindvalley/icons/ui-icons.md)
+3. [Mindvalley Categories Icons](icons/brands/mindvalley/icons/categories.md)
 
-b) **Legacy Method (To be deprecated) - combined directory/sprite**
+b) **Legacy Method (b) (To be deprecated) - combined directory/sprite**
 
 This initial method involves using the combined `svg-defs.svg` sprite file or from the `svg` folder which is combination of UI icons and category icons.
 
@@ -502,13 +558,13 @@ There are plenty of JS libries to use here but the recommended one is [vue-svg-s
 
 Start by installing it:
 
-```
+```sh
 npm i vue-svg-sprite
 ```
 
 or
 
-```
+```sh
 yarn add vue-svg-sprite
 ```