@blerp/design 1.0.206 → 1.0.208

package/dist/index.cjs.js

@@ -18,6 +18,7 @@ var reactPalette = require('react-palette');
 var _typeof = require('@babel/runtime/helpers/typeof');
 var KeyboardArrowRightRoundedIcon = require('@mui/icons-material/KeyboardArrowRightRounded');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+require('@mui/system');
 var KeyboardArrowDownRoundedIcon = require('@mui/icons-material/KeyboardArrowDownRounded');
 var CloseRoundedIcon = require('@mui/icons-material/CloseRounded');
 var FileUploadRoundedIcon = require('@mui/icons-material/FileUploadRounded');
@@ -1879,7 +1880,7 @@ var BlerpListViewPremium$1 = function BlerpListViewPremium(_ref) {
       position: "relative",
       top: "1px",
       "& svg": {
-        color: "white.main"
+        color: "white.override"
       }
     }
   }, /*#__PURE__*/React__default['default'].createElement(Tooltip, {
@@ -2719,7 +2720,6 @@ CollectionListViewPremium$1.propTypes = {
 function ownKeys$5(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread$5(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$5(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$5(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
 var colors = {
   white: "#ffffff",
   waxing: "#F3F3F3",
@@ -2840,6 +2840,10 @@ var lightPalette = {
     main: colors.waxing,
     override: colors.waxing
   },
+  grey1: {
+    main: colors.grey1,
+    override: colors.grey1
+  },
   grey2: {
     main: colors.grey2,
     override: colors.grey2
@@ -2864,6 +2868,14 @@ var lightPalette = {
     main: colors.grey7,
     override: colors.grey7
   },
+  grey8: {
+    main: colors.grey8,
+    override: colors.grey8
+  },
+  grey9: {
+    main: colors.grey9,
+    override: colors.grey9
+  },
   notBlack: {
     light: colors.notBlack,
     main: colors.notBlack,
@@ -2932,29 +2944,41 @@ var darkPalette = {
     main: colors.notBlack,
     override: colors.waxwing
   },
+  grey1: {
+    main: colors.grey9Dark,
+    override: colors.grey1Dark
+  },
   grey2: {
-    main: colors.grey7,
-    override: colors.grey2
+    main: colors.grey8Dark,
+    override: colors.grey2Dark
   },
   grey3: {
-    main: colors.grey6,
-    override: colors.grey3
+    main: colors.grey7Dark,
+    override: colors.grey3Dark
   },
   grey4: {
-    main: colors.grey5,
-    override: colors.grey4
+    main: colors.grey6Dark,
+    override: colors.grey4Dark
   },
   grey5: {
-    main: colors.grey4,
-    override: colors.grey5
+    main: colors.grey5Dark,
+    override: colors.grey5Dark
   },
   grey6: {
-    main: colors.grey3,
-    override: colors.grey6
+    main: colors.grey4Dark,
+    override: colors.grey6Dark
   },
   grey7: {
-    main: colors.grey2,
-    override: colors.grey7
+    main: colors.grey3Dark,
+    override: colors.grey7Dark
+  },
+  grey8: {
+    main: colors.grey2Dark,
+    override: colors.grey8Dark
+  },
+  grey9: {
+    main: colors.grey1Dark,
+    override: colors.grey9Dark
   },
   notBlack: {
     light: colors.waxwing,

package/dist/index.esm.js

@@ -15,6 +15,7 @@ import { usePalette } from 'react-palette';
 import _typeof from '@babel/runtime/helpers/typeof';
 import KeyboardArrowRightRoundedIcon from '@mui/icons-material/KeyboardArrowRightRounded';
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import '@mui/system';
 import KeyboardArrowDownRoundedIcon from '@mui/icons-material/KeyboardArrowDownRounded';
 import CloseRoundedIcon from '@mui/icons-material/CloseRounded';
 import FileUploadRoundedIcon from '@mui/icons-material/FileUploadRounded';
@@ -1810,7 +1811,7 @@ var BlerpListViewPremium$1 = function BlerpListViewPremium(_ref) {
       position: "relative",
       top: "1px",
       "& svg": {
-        color: "white.main"
+        color: "white.override"
       }
     }
   }, /*#__PURE__*/React__default.createElement(Tooltip, {
@@ -2650,7 +2651,6 @@ CollectionListViewPremium$1.propTypes = {
 function ownKeys$5(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread$5(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$5(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$5(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
 var colors = {
   white: "#ffffff",
   waxing: "#F3F3F3",
@@ -2771,6 +2771,10 @@ var lightPalette = {
     main: colors.waxing,
     override: colors.waxing
   },
+  grey1: {
+    main: colors.grey1,
+    override: colors.grey1
+  },
   grey2: {
     main: colors.grey2,
     override: colors.grey2
@@ -2795,6 +2799,14 @@ var lightPalette = {
     main: colors.grey7,
     override: colors.grey7
   },
+  grey8: {
+    main: colors.grey8,
+    override: colors.grey8
+  },
+  grey9: {
+    main: colors.grey9,
+    override: colors.grey9
+  },
   notBlack: {
     light: colors.notBlack,
     main: colors.notBlack,
@@ -2863,29 +2875,41 @@ var darkPalette = {
     main: colors.notBlack,
     override: colors.waxwing
   },
+  grey1: {
+    main: colors.grey9Dark,
+    override: colors.grey1Dark
+  },
   grey2: {
-    main: colors.grey7,
-    override: colors.grey2
+    main: colors.grey8Dark,
+    override: colors.grey2Dark
   },
   grey3: {
-    main: colors.grey6,
-    override: colors.grey3
+    main: colors.grey7Dark,
+    override: colors.grey3Dark
   },
   grey4: {
-    main: colors.grey5,
-    override: colors.grey4
+    main: colors.grey6Dark,
+    override: colors.grey4Dark
   },
   grey5: {
-    main: colors.grey4,
-    override: colors.grey5
+    main: colors.grey5Dark,
+    override: colors.grey5Dark
   },
   grey6: {
-    main: colors.grey3,
-    override: colors.grey6
+    main: colors.grey4Dark,
+    override: colors.grey6Dark
   },
   grey7: {
-    main: colors.grey2,
-    override: colors.grey7
+    main: colors.grey3Dark,
+    override: colors.grey7Dark
+  },
+  grey8: {
+    main: colors.grey2Dark,
+    override: colors.grey8Dark
+  },
+  grey9: {
+    main: colors.grey1Dark,
+    override: colors.grey9Dark
   },
   notBlack: {
     light: colors.waxwing,

package/dist/index.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@mui/material'), require('@babel/runtime/helpers/slicedToArray'), require('prop-types'), require('react'), require('react-color-extractor'), require('styled-components'), require('@babel/runtime/helpers/taggedTemplateLiteral'), require('@mui/icons-material'), require('@mui/icons-material/BookmarkOutlined'), require('@mui/icons-material/LockRounded'), require('@mui/icons-material/BookmarkAddOutlined'), require('@mui/icons-material/MoreHorizRounded'), require('react-palette'), require('@babel/runtime/helpers/typeof'), require('@mui/icons-material/KeyboardArrowRightRounded'), require('@babel/runtime/helpers/defineProperty'), require('@mui/icons-material/KeyboardArrowDownRounded'), require('@mui/icons-material/CloseRounded'), require('@mui/icons-material/FileUploadRounded'), require('@babel/runtime/helpers/extends'), require('@babel/runtime/helpers/asyncToGenerator'), require('@babel/runtime/regenerator'), require('react-avatar-editor'), require('react-dropzone'), require('@mui/icons-material/InsertPhotoRounded'), require('@mui/material/styles'), require('@mui/material/Slide'), require('@mui/material/Fade'), require('react-lottie'), require('@mui/icons-material/AddRounded'), require('@mui/icons-material/Facebook'), require('@mui/icons-material/Instagram'), require('@mui/icons-material/ModeEditRounded'), require('@mui/icons-material/PersonAddRounded'), require('@mui/icons-material/Pinterest'), require('@mui/icons-material/Twitter'), require('@mui/icons-material/YouTube'), require('@mui/icons-material/PersonRemoveRounded'), require('@babel/runtime/helpers/toConsumableArray'), require('@mui/icons-material/FilterAltRounded'), require('@mui/icons-material/MenuRounded'), require('@mui/icons-material/ViewModuleRounded'), require('@mui/icons-material/SettingsRounded'), require('@mui/icons-material/SortRounded'), require('@mui/icons-material/ChevronRightRounded'), require('@mui/icons-material/PersonRounded'), require('@mui/icons-material/SearchRounded'), require('@mui/icons-material/BookmarkRemoveOutlined'), require('@mui/icons-material/VisibilityOffRounded')) :
-    typeof define === 'function' && define.amd ? define(['exports', '@mui/material', '@babel/runtime/helpers/slicedToArray', 'prop-types', 'react', 'react-color-extractor', 'styled-components', '@babel/runtime/helpers/taggedTemplateLiteral', '@mui/icons-material', '@mui/icons-material/BookmarkOutlined', '@mui/icons-material/LockRounded', '@mui/icons-material/BookmarkAddOutlined', '@mui/icons-material/MoreHorizRounded', 'react-palette', '@babel/runtime/helpers/typeof', '@mui/icons-material/KeyboardArrowRightRounded', '@babel/runtime/helpers/defineProperty', '@mui/icons-material/KeyboardArrowDownRounded', '@mui/icons-material/CloseRounded', '@mui/icons-material/FileUploadRounded', '@babel/runtime/helpers/extends', '@babel/runtime/helpers/asyncToGenerator', '@babel/runtime/regenerator', 'react-avatar-editor', 'react-dropzone', '@mui/icons-material/InsertPhotoRounded', '@mui/material/styles', '@mui/material/Slide', '@mui/material/Fade', 'react-lottie', '@mui/icons-material/AddRounded', '@mui/icons-material/Facebook', '@mui/icons-material/Instagram', '@mui/icons-material/ModeEditRounded', '@mui/icons-material/PersonAddRounded', '@mui/icons-material/Pinterest', '@mui/icons-material/Twitter', '@mui/icons-material/YouTube', '@mui/icons-material/PersonRemoveRounded', '@babel/runtime/helpers/toConsumableArray', '@mui/icons-material/FilterAltRounded', '@mui/icons-material/MenuRounded', '@mui/icons-material/ViewModuleRounded', '@mui/icons-material/SettingsRounded', '@mui/icons-material/SortRounded', '@mui/icons-material/ChevronRightRounded', '@mui/icons-material/PersonRounded', '@mui/icons-material/SearchRounded', '@mui/icons-material/BookmarkRemoveOutlined', '@mui/icons-material/VisibilityOffRounded'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['react-awesome-buttons'] = {}, global.material, global._slicedToArray, global.PropTypes, global.React, global.reactColorExtractor, global.styled, global._taggedTemplateLiteral, global.iconsMaterial, global.BookmarkOutlinedIcon, global.LockRoundedIcon, global.BookmarkAddOutlinedIcon, global.MoreHorizRoundedIcon, global.reactPalette, global._typeof, global.KeyboardArrowRightRoundedIcon, global._defineProperty, global.KeyboardArrowDownRoundedIcon, global.CloseRoundedIcon, global.FileUploadRoundedIcon, global._extends, global._asyncToGenerator, global._regeneratorRuntime, global.AvatarEditor, global.Dropzone, global.InsertPhotoRoundedIcon, global.styles, global.Slide, global.Fade, global.Lottie, global.AddRoundedIcon, global.FacebookIcon, global.InstagramIcon, global.ModeEditRoundedIcon, global.PersonAddRoundedIcon, global.PinterestIcon, global.TwitterIcon, global.YouTubeIcon, global.PersonRemoveRoundedIcon, global._toConsumableArray, null, global.MenuRoundedIcon, global.ViewModuleRoundedIcon, null, global.SortRoundedIcon, global.ChevronRightRoundedIcon, global.PersonRoundedIcon, global.SearchRoundedIcon, global.BookmarkRemoveOutlinedIcon, global.VisibilityOffRoundedIcon));
-}(this, (function (exports, material, _slicedToArray, PropTypes, React, reactColorExtractor, styled, _taggedTemplateLiteral, iconsMaterial, BookmarkOutlinedIcon, LockRoundedIcon, BookmarkAddOutlinedIcon, MoreHorizRoundedIcon, reactPalette, _typeof, KeyboardArrowRightRoundedIcon, _defineProperty, KeyboardArrowDownRoundedIcon, CloseRoundedIcon, FileUploadRoundedIcon, _extends, _asyncToGenerator, _regeneratorRuntime, AvatarEditor, Dropzone, InsertPhotoRoundedIcon, styles, Slide, Fade, Lottie, AddRoundedIcon, FacebookIcon, InstagramIcon, ModeEditRoundedIcon, PersonAddRoundedIcon, PinterestIcon, TwitterIcon, YouTubeIcon, PersonRemoveRoundedIcon, _toConsumableArray, FilterAltRounded, MenuRoundedIcon, ViewModuleRoundedIcon, SettingsRounded, SortRoundedIcon, ChevronRightRoundedIcon, PersonRoundedIcon, SearchRoundedIcon, BookmarkRemoveOutlinedIcon, VisibilityOffRoundedIcon) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@mui/material'), require('@babel/runtime/helpers/slicedToArray'), require('prop-types'), require('react'), require('react-color-extractor'), require('styled-components'), require('@babel/runtime/helpers/taggedTemplateLiteral'), require('@mui/icons-material'), require('@mui/icons-material/BookmarkOutlined'), require('@mui/icons-material/LockRounded'), require('@mui/icons-material/BookmarkAddOutlined'), require('@mui/icons-material/MoreHorizRounded'), require('react-palette'), require('@babel/runtime/helpers/typeof'), require('@mui/icons-material/KeyboardArrowRightRounded'), require('@babel/runtime/helpers/defineProperty'), require('@mui/system'), require('@mui/icons-material/KeyboardArrowDownRounded'), require('@mui/icons-material/CloseRounded'), require('@mui/icons-material/FileUploadRounded'), require('@babel/runtime/helpers/extends'), require('@babel/runtime/helpers/asyncToGenerator'), require('@babel/runtime/regenerator'), require('react-avatar-editor'), require('react-dropzone'), require('@mui/icons-material/InsertPhotoRounded'), require('@mui/material/styles'), require('@mui/material/Slide'), require('@mui/material/Fade'), require('react-lottie'), require('@mui/icons-material/AddRounded'), require('@mui/icons-material/Facebook'), require('@mui/icons-material/Instagram'), require('@mui/icons-material/ModeEditRounded'), require('@mui/icons-material/PersonAddRounded'), require('@mui/icons-material/Pinterest'), require('@mui/icons-material/Twitter'), require('@mui/icons-material/YouTube'), require('@mui/icons-material/PersonRemoveRounded'), require('@babel/runtime/helpers/toConsumableArray'), require('@mui/icons-material/FilterAltRounded'), require('@mui/icons-material/MenuRounded'), require('@mui/icons-material/ViewModuleRounded'), require('@mui/icons-material/SettingsRounded'), require('@mui/icons-material/SortRounded'), require('@mui/icons-material/ChevronRightRounded'), require('@mui/icons-material/PersonRounded'), require('@mui/icons-material/SearchRounded'), require('@mui/icons-material/BookmarkRemoveOutlined'), require('@mui/icons-material/VisibilityOffRounded')) :
+    typeof define === 'function' && define.amd ? define(['exports', '@mui/material', '@babel/runtime/helpers/slicedToArray', 'prop-types', 'react', 'react-color-extractor', 'styled-components', '@babel/runtime/helpers/taggedTemplateLiteral', '@mui/icons-material', '@mui/icons-material/BookmarkOutlined', '@mui/icons-material/LockRounded', '@mui/icons-material/BookmarkAddOutlined', '@mui/icons-material/MoreHorizRounded', 'react-palette', '@babel/runtime/helpers/typeof', '@mui/icons-material/KeyboardArrowRightRounded', '@babel/runtime/helpers/defineProperty', '@mui/system', '@mui/icons-material/KeyboardArrowDownRounded', '@mui/icons-material/CloseRounded', '@mui/icons-material/FileUploadRounded', '@babel/runtime/helpers/extends', '@babel/runtime/helpers/asyncToGenerator', '@babel/runtime/regenerator', 'react-avatar-editor', 'react-dropzone', '@mui/icons-material/InsertPhotoRounded', '@mui/material/styles', '@mui/material/Slide', '@mui/material/Fade', 'react-lottie', '@mui/icons-material/AddRounded', '@mui/icons-material/Facebook', '@mui/icons-material/Instagram', '@mui/icons-material/ModeEditRounded', '@mui/icons-material/PersonAddRounded', '@mui/icons-material/Pinterest', '@mui/icons-material/Twitter', '@mui/icons-material/YouTube', '@mui/icons-material/PersonRemoveRounded', '@babel/runtime/helpers/toConsumableArray', '@mui/icons-material/FilterAltRounded', '@mui/icons-material/MenuRounded', '@mui/icons-material/ViewModuleRounded', '@mui/icons-material/SettingsRounded', '@mui/icons-material/SortRounded', '@mui/icons-material/ChevronRightRounded', '@mui/icons-material/PersonRounded', '@mui/icons-material/SearchRounded', '@mui/icons-material/BookmarkRemoveOutlined', '@mui/icons-material/VisibilityOffRounded'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['react-awesome-buttons'] = {}, global.material, global._slicedToArray, global.PropTypes, global.React, global.reactColorExtractor, global.styled, global._taggedTemplateLiteral, global.iconsMaterial, global.BookmarkOutlinedIcon, global.LockRoundedIcon, global.BookmarkAddOutlinedIcon, global.MoreHorizRoundedIcon, global.reactPalette, global._typeof, global.KeyboardArrowRightRoundedIcon, global._defineProperty, null, global.KeyboardArrowDownRoundedIcon, global.CloseRoundedIcon, global.FileUploadRoundedIcon, global._extends, global._asyncToGenerator, global._regeneratorRuntime, global.AvatarEditor, global.Dropzone, global.InsertPhotoRoundedIcon, global.styles, global.Slide, global.Fade, global.Lottie, global.AddRoundedIcon, global.FacebookIcon, global.InstagramIcon, global.ModeEditRoundedIcon, global.PersonAddRoundedIcon, global.PinterestIcon, global.TwitterIcon, global.YouTubeIcon, global.PersonRemoveRoundedIcon, global._toConsumableArray, null, global.MenuRoundedIcon, global.ViewModuleRoundedIcon, null, global.SortRoundedIcon, global.ChevronRightRoundedIcon, global.PersonRoundedIcon, global.SearchRoundedIcon, global.BookmarkRemoveOutlinedIcon, global.VisibilityOffRoundedIcon));
+}(this, (function (exports, material, _slicedToArray, PropTypes, React, reactColorExtractor, styled, _taggedTemplateLiteral, iconsMaterial, BookmarkOutlinedIcon, LockRoundedIcon, BookmarkAddOutlinedIcon, MoreHorizRoundedIcon, reactPalette, _typeof, KeyboardArrowRightRoundedIcon, _defineProperty, system, KeyboardArrowDownRoundedIcon, CloseRoundedIcon, FileUploadRoundedIcon, _extends, _asyncToGenerator, _regeneratorRuntime, AvatarEditor, Dropzone, InsertPhotoRoundedIcon, styles, Slide, Fade, Lottie, AddRoundedIcon, FacebookIcon, InstagramIcon, ModeEditRoundedIcon, PersonAddRoundedIcon, PinterestIcon, TwitterIcon, YouTubeIcon, PersonRemoveRoundedIcon, _toConsumableArray, FilterAltRounded, MenuRoundedIcon, ViewModuleRoundedIcon, SettingsRounded, SortRoundedIcon, ChevronRightRoundedIcon, PersonRoundedIcon, SearchRoundedIcon, BookmarkRemoveOutlinedIcon, VisibilityOffRoundedIcon) { 'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -1831,7 +1831,7 @@
           position: "relative",
           top: "1px",
           "& svg": {
-            color: "white.main"
+            color: "white.override"
           }
         }
       }, /*#__PURE__*/React__default['default'].createElement(Tooltip, {
@@ -2671,7 +2671,6 @@
     function ownKeys$5(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
     function _objectSpread$5(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$5(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$5(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
     var colors = {
       white: "#ffffff",
       waxing: "#F3F3F3",
@@ -2792,6 +2791,10 @@
         main: colors.waxing,
         override: colors.waxing
       },
+      grey1: {
+        main: colors.grey1,
+        override: colors.grey1
+      },
       grey2: {
         main: colors.grey2,
         override: colors.grey2
@@ -2816,6 +2819,14 @@
         main: colors.grey7,
         override: colors.grey7
       },
+      grey8: {
+        main: colors.grey8,
+        override: colors.grey8
+      },
+      grey9: {
+        main: colors.grey9,
+        override: colors.grey9
+      },
       notBlack: {
         light: colors.notBlack,
         main: colors.notBlack,
@@ -2884,29 +2895,41 @@
         main: colors.notBlack,
         override: colors.waxwing
       },
+      grey1: {
+        main: colors.grey9Dark,
+        override: colors.grey1Dark
+      },
       grey2: {
-        main: colors.grey7,
-        override: colors.grey2
+        main: colors.grey8Dark,
+        override: colors.grey2Dark
       },
       grey3: {
-        main: colors.grey6,
-        override: colors.grey3
+        main: colors.grey7Dark,
+        override: colors.grey3Dark
       },
       grey4: {
-        main: colors.grey5,
-        override: colors.grey4
+        main: colors.grey6Dark,
+        override: colors.grey4Dark
       },
       grey5: {
-        main: colors.grey4,
-        override: colors.grey5
+        main: colors.grey5Dark,
+        override: colors.grey5Dark
       },
       grey6: {
-        main: colors.grey3,
-        override: colors.grey6
+        main: colors.grey4Dark,
+        override: colors.grey6Dark
       },
       grey7: {
-        main: colors.grey2,
-        override: colors.grey7
+        main: colors.grey3Dark,
+        override: colors.grey7Dark
+      },
+      grey8: {
+        main: colors.grey2Dark,
+        override: colors.grey8Dark
+      },
+      grey9: {
+        main: colors.grey1Dark,
+        override: colors.grey9Dark
       },
       notBlack: {
         light: colors.waxwing,

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@blerp/design",
-    "version": "1.0.206",
+    "version": "1.0.208",
     "description": "Blerp UI",
     "main": "dist/index.cjs.js",
     "scripts": {