@superdispatch/ui 0.33.0 → 0.35.0

package/dist-src/theme/Color.js

@@ -3,9 +3,10 @@
 //   - To update a color, modify the hex or rgba value associated with the desired color name.
 
 export var Color;
-// `ColorLightInternal`: Represents the color palette for light themes.
-//    - Similar to `Color`, but specifically tailored for light theme usage.
-//    - Update colors by changing the associated value
+
+// `ColorDark`: Represents the color palette for dark themes.
+//     - Tailored for dark theme usage.
+//     - Update colors by modifying the associated values.
 (function (Color) {
   Color["White"] = "#fff";
   Color["White50"] = "rgba(255, 255, 255, 0.5)";
@@ -66,6 +67,7 @@ export var Color;
   Color["Silver200"] = "#F3F5F8";
   Color["Silver400"] = "#E1E5EA";
   Color["Silver500"] = "#C4CDD5";
+  Color["Silver400Alpha30"] = "rgba(225, 229, 234, 0.3)";
   Color["Blue50"] = "#EBF4FF";
   Color["Blue300"] = "#0070F5";
   Color["Blue500"] = "#0063DB";
@@ -77,6 +79,7 @@ export var Color;
   Color["Purple500"] = "#473ABB";
   Color["Red50"] = "#FFEDEB";
   Color["Red300"] = "#E5230D";
+  Color["Red300Aplha20"] = "rgba(229, 35, 13, 0.2)";
   Color["Red500"] = "#C31909";
   Color["Teal50"] = "#E3F6FC";
   Color["Teal300"] = "#007EAB";
@@ -85,256 +88,180 @@ export var Color;
   Color["Yellow300"] = "#E8671C";
   Color["Yellow500"] = "#B84807";
 })(Color || (Color = {}));
-export var ColorLightInternal;
-// `ColorDarkInternal`: Represents the color palette for dark themes.
-//     - Tailored for dark theme usage.
-//     - Update colors by modifying the associated values.
-(function (ColorLightInternal) {
-  ColorLightInternal["White"] = "#fff";
-  ColorLightInternal["White50"] = "rgba(255, 255, 255, 0.5)";
-  ColorLightInternal["White40"] = "rgba(255, 255, 255, 0.4)";
-  ColorLightInternal["White20"] = "rgba(255, 255, 255, 0.2)";
-  ColorLightInternal["White10"] = "rgba(255, 255, 255, 0.1)";
-  ColorLightInternal["White08"] = "rgba(255, 255, 255, 0.08)";
-  ColorLightInternal["Transparent"] = "rgba(0, 0, 0, 0)";
-  ColorLightInternal["Black"] = "#000";
-  ColorLightInternal["Black50"] = "rgba(0, 0, 0, 0.5)";
-  ColorLightInternal["Black20"] = "rgba(0, 0, 0, 0.2)";
-  ColorLightInternal["Dark30"] = "rgba(143, 148, 158, 0.3)";
-  ColorLightInternal["Blue30"] = "rgba(0, 112, 245, 0.3)";
-  ColorLightInternal["Green30"] = "rgba(3, 135, 47, 0.3)";
-  ColorLightInternal["Red30"] = "rgba(229, 35, 13, 0.3)";
-  ColorLightInternal["Silver30"] = "rgba(225, 229, 234, 0.3)";
-  ColorLightInternal["Blue10"] = "rgba(0, 112, 245, 0.1)";
-  ColorLightInternal["Red10"] = "rgba(195, 25, 9, 0.1)";
-  ColorLightInternal["Grey100"] = "#8F949E";
-  ColorLightInternal["Grey200"] = "#6A707C";
-  ColorLightInternal["Grey300"] = "#5B6371";
-  ColorLightInternal["Grey400"] = "#323C4E";
-  ColorLightInternal["Grey450"] = "#222F44";
-  ColorLightInternal["Grey500"] = "#192334";
-  ColorLightInternal["Dark200"] = "#6A707C";
-  ColorLightInternal["Dark400"] = "#323C4E";
-  ColorLightInternal["Dark450"] = "#222F44";
-  ColorLightInternal["Silver100"] = "#F6F7F8";
-  ColorLightInternal["Silver300"] = "#E8ECF0";
-  ColorLightInternal["Blue75"] = "#CCE5FF";
-  ColorLightInternal["Blue100"] = "#A8D1FF";
-  ColorLightInternal["Blue200"] = "#66ADFF";
-  ColorLightInternal["Blue400"] = "#0063DB";
-  ColorLightInternal["Green75"] = "#C8F4D1";
-  ColorLightInternal["Green100"] = "#90EAAE";
-  ColorLightInternal["Green200"] = "#5DDA87";
-  ColorLightInternal["Green400"] = "#1E8F46";
-  ColorLightInternal["Purple75"] = "#DCDBF5";
-  ColorLightInternal["Purple100"] = "#CBC8EE";
-  ColorLightInternal["Purple200"] = "#A7A1E8";
-  ColorLightInternal["Purple400"] = "#473ABB";
-  ColorLightInternal["Red75"] = "#FDD9D3";
-  ColorLightInternal["Red100"] = "#FDC2BA";
-  ColorLightInternal["Red200"] = "#FE988B";
-  ColorLightInternal["Red400"] = "#D9210D";
-  ColorLightInternal["Teal75"] = "#BEEDF9";
-  ColorLightInternal["Teal100"] = "#91E3F8";
-  ColorLightInternal["Teal200"] = "#61D3EF";
-  ColorLightInternal["Teal400"] = "#008DB8";
-  ColorLightInternal["Yellow75"] = "#FFF1C2";
-  ColorLightInternal["Yellow100"] = "#FFE494";
-  ColorLightInternal["Yellow200"] = "#FFDC6B";
-  ColorLightInternal["Yellow400"] = "#FFA91F";
-  ColorLightInternal["Dark50"] = "rgba(25, 35, 52, 0.5)";
-  ColorLightInternal["Dark100"] = "#8F949E";
-  ColorLightInternal["Dark300"] = "#5B6371";
-  ColorLightInternal["Dark500"] = "#192334";
-  ColorLightInternal["Silver200"] = "#F3F5F8";
-  ColorLightInternal["Silver400"] = "#E1E5EA";
-  ColorLightInternal["Silver500"] = "#C4CDD5";
-  ColorLightInternal["Blue50"] = "#EBF4FF";
-  ColorLightInternal["Blue300"] = "#0070F5";
-  ColorLightInternal["Blue500"] = "#0063DB";
-  ColorLightInternal["Green50"] = "#ECF9EF";
-  ColorLightInternal["Green300"] = "#03872F";
-  ColorLightInternal["Green500"] = "#007A29";
-  ColorLightInternal["Purple50"] = "#EFEEFC";
-  ColorLightInternal["Purple300"] = "#6559CF";
-  ColorLightInternal["Purple500"] = "#473ABB";
-  ColorLightInternal["Red50"] = "#FFEDEB";
-  ColorLightInternal["Red300"] = "#E5230D";
-  ColorLightInternal["Red500"] = "#C31909";
-  ColorLightInternal["Teal50"] = "#E3F6FC";
-  ColorLightInternal["Teal300"] = "#007EAB";
-  ColorLightInternal["Teal500"] = "#00678A";
-  ColorLightInternal["Yellow50"] = "#FFF7DC";
-  ColorLightInternal["Yellow300"] = "#E8671C";
-  ColorLightInternal["Yellow500"] = "#B84807";
-})(ColorLightInternal || (ColorLightInternal = {}));
-export var ColorDarkInternal;
+export var ColorDark;
 
-// `ColorV2`: Represents a newer version of the color palette using CSS variables.
+// `ColorDynamic`: Represents a newer version of the color palette using CSS variables.
 //   - Designed for more dynamic theming using CSS custom properties.
 //   - Update colors by changing the CSS variable references.
-(function (ColorDarkInternal) {
-  ColorDarkInternal["White"] = "#fff";
-  ColorDarkInternal["White50"] = "rgba(255, 255, 255, 0.5)";
-  ColorDarkInternal["White40"] = "rgba(255, 255, 255, 0.4)";
-  ColorDarkInternal["White20"] = "rgba(255, 255, 255, 0.2)";
-  ColorDarkInternal["White10"] = "rgba(255, 255, 255, 0.1)";
-  ColorDarkInternal["White08"] = "rgba(255, 255, 255, 0.08)";
-  ColorDarkInternal["Transparent"] = "rgba(0, 0, 0, 0)";
-  ColorDarkInternal["Black"] = "#000";
-  ColorDarkInternal["Black50"] = "rgba(0, 0, 0, 0.5)";
-  ColorDarkInternal["Black20"] = "rgba(0, 0, 0, 0.2)";
-  ColorDarkInternal["Dark30"] = "rgba(143, 148, 158, 0.3)";
-  ColorDarkInternal["Blue30"] = "rgba(0, 112, 245, 0.3)";
-  ColorDarkInternal["Green30"] = "rgba(3, 135, 47, 0.3)";
-  ColorDarkInternal["Red30"] = "rgba(229, 35, 13, 0.3)";
-  ColorDarkInternal["Silver30"] = "rgba(225, 229, 234, 0.3)";
-  ColorDarkInternal["Blue10"] = "rgba(0, 112, 245, 0.1)";
-  ColorDarkInternal["Red10"] = "rgba(195, 25, 9, 0.1)";
-  ColorDarkInternal["Grey100"] = "#8F949E";
-  ColorDarkInternal["Grey200"] = "#6A707C";
-  ColorDarkInternal["Grey300"] = "#5B6371";
-  ColorDarkInternal["Grey400"] = "#323C4E";
-  ColorDarkInternal["Grey450"] = "#222F44";
-  ColorDarkInternal["Grey500"] = "#192334";
-  ColorDarkInternal["Dark200"] = "#6A707C";
-  ColorDarkInternal["Dark400"] = "#323C4E";
-  ColorDarkInternal["Dark450"] = "#222F44";
-  ColorDarkInternal["Silver100"] = "#F6F7F8";
-  ColorDarkInternal["Silver300"] = "#E8ECF0";
-  ColorDarkInternal["Blue75"] = "#CCE5FF";
-  ColorDarkInternal["Blue100"] = "#A8D1FF";
-  ColorDarkInternal["Blue200"] = "#66ADFF";
-  ColorDarkInternal["Blue400"] = "#0063DB";
-  ColorDarkInternal["Green75"] = "#C8F4D1";
-  ColorDarkInternal["Green100"] = "#90EAAE";
-  ColorDarkInternal["Green200"] = "#5DDA87";
-  ColorDarkInternal["Green400"] = "#1E8F46";
-  ColorDarkInternal["Purple75"] = "#DCDBF5";
-  ColorDarkInternal["Purple100"] = "#CBC8EE";
-  ColorDarkInternal["Purple200"] = "#A7A1E8";
-  ColorDarkInternal["Purple400"] = "#473ABB";
-  ColorDarkInternal["Red75"] = "#FDD9D3";
-  ColorDarkInternal["Red100"] = "#FDC2BA";
-  ColorDarkInternal["Red200"] = "#FE988B";
-  ColorDarkInternal["Red400"] = "#D9210D";
-  ColorDarkInternal["Teal75"] = "#BEEDF9";
-  ColorDarkInternal["Teal100"] = "#91E3F8";
-  ColorDarkInternal["Teal200"] = "#61D3EF";
-  ColorDarkInternal["Teal400"] = "#008DB8";
-  ColorDarkInternal["Yellow75"] = "#FFF1C2";
-  ColorDarkInternal["Yellow100"] = "#FFE494";
-  ColorDarkInternal["Yellow200"] = "#FFDC6B";
-  ColorDarkInternal["Yellow400"] = "#FFA91F";
-  ColorDarkInternal["Dark50"] = "rgba(25, 35, 52, 0.5)";
-  ColorDarkInternal["Dark100"] = "#6E7A8A";
-  ColorDarkInternal["Dark300"] = "#AEB4BD";
-  ColorDarkInternal["Dark500"] = "#FFFFFF";
-  ColorDarkInternal["Silver200"] = "#0D1017";
-  ColorDarkInternal["Silver400"] = "#30373D";
-  ColorDarkInternal["Silver500"] = "#47505B";
-  ColorDarkInternal["Blue50"] = "#0E2947";
-  ColorDarkInternal["Blue300"] = "#0070F5";
-  ColorDarkInternal["Blue500"] = "#55ADFF";
-  ColorDarkInternal["Green50"] = "#092E16";
-  ColorDarkInternal["Green300"] = "#03872F";
-  ColorDarkInternal["Green500"] = "#5EE18A";
-  ColorDarkInternal["Purple50"] = "#262247";
-  ColorDarkInternal["Purple300"] = "#6559CF";
-  ColorDarkInternal["Purple500"] = "#BFA0FF";
-  ColorDarkInternal["Red50"] = "#3D0A06";
-  ColorDarkInternal["Red300"] = "#E5230D";
-  ColorDarkInternal["Red500"] = "#FF6359";
-  ColorDarkInternal["Teal50"] = "#11333D";
-  ColorDarkInternal["Teal300"] = "#007EAB";
-  ColorDarkInternal["Teal500"] = "#31C7F5";
-  ColorDarkInternal["Yellow50"] = "#33200A";
-  ColorDarkInternal["Yellow300"] = "#E8671C";
-  ColorDarkInternal["Yellow500"] = "#FCA542";
-})(ColorDarkInternal || (ColorDarkInternal = {}));
-export var ColorV2;
-(function (ColorV2) {
-  ColorV2["White"] = "var(--sd-white)";
-  ColorV2["White50"] = "var(--sd-white-50)";
-  ColorV2["White40"] = "var(--sd-white-40)";
-  ColorV2["White20"] = "var(--sd-white-20)";
-  ColorV2["White10"] = "var(--sd-white-10)";
-  ColorV2["White08"] = "var(--sd-white-08)";
-  ColorV2["Transparent"] = "var(--sd-transparent)";
-  ColorV2["Black"] = "var(--sd-black)";
-  ColorV2["Black50"] = "var(--sd-black-50)";
-  ColorV2["Black20"] = "var(--sd-black-20)";
-  ColorV2["Dark30"] = "var(--sd-dark-30)";
-  ColorV2["Blue30"] = "var(--sd-blue-30)";
-  ColorV2["Green30"] = "var(--sd-green-30)";
-  ColorV2["Red30"] = "var(--sd-red-30)";
-  ColorV2["Silver30"] = "var(--sd-silver-30)";
-  ColorV2["Blue10"] = "var(--sd-blue-10)";
-  ColorV2["Red10"] = "var(--sd-red-10)";
-  ColorV2["Grey100"] = "var(--sd-grey-100)";
-  ColorV2["Grey200"] = "var(--sd-grey-200)";
-  ColorV2["Grey300"] = "var(--sd-grey-300)";
-  ColorV2["Grey400"] = "var(--sd-grey-400)";
-  ColorV2["Grey450"] = "var(--sd-grey-450)";
-  ColorV2["Grey500"] = "var(--sd-grey-500)";
-  ColorV2["Dark200"] = "var(--sd-dark-200)";
-  ColorV2["Dark400"] = "var(--sd-dark-400)";
-  ColorV2["Dark450"] = "var(--sd-dark-450)";
-  ColorV2["Silver100"] = "var(--sd-silver-100)";
-  ColorV2["Silver300"] = "var(--sd-silver-300)";
-  ColorV2["Blue75"] = "var(--sd-blue-75)";
-  ColorV2["Blue100"] = "var(--sd-blue-100)";
-  ColorV2["Blue200"] = "var(--sd-blue-200)";
-  ColorV2["Blue400"] = "var(--sd-blue-400)";
-  ColorV2["Green75"] = "var(--sd-green-75)";
-  ColorV2["Green100"] = "var(--sd-green-100)";
-  ColorV2["Green200"] = "var(--sd-green-200)";
-  ColorV2["Green400"] = "var(--sd-green-400)";
-  ColorV2["Purple75"] = "var(--sd-purple-75)";
-  ColorV2["Purple100"] = "var(--sd-purple-100)";
-  ColorV2["Purple200"] = "var(--sd-purple-200)";
-  ColorV2["Purple400"] = "var(--sd-purple-400)";
-  ColorV2["Red75"] = "var(--sd-red-75)";
-  ColorV2["Red100"] = "var(--sd-red-100)";
-  ColorV2["Red200"] = "var(--sd-red-200)";
-  ColorV2["Red400"] = "var(--sd-red-400)";
-  ColorV2["Teal75"] = "var(--sd-teal-75)";
-  ColorV2["Teal100"] = "var(--sd-teal-100)";
-  ColorV2["Teal200"] = "var(--sd-teal-200)";
-  ColorV2["Teal400"] = "var(--sd-teal-400)";
-  ColorV2["Yellow75"] = "var(--sd-yellow-75)";
-  ColorV2["Yellow100"] = "var(--sd-yellow-100)";
-  ColorV2["Yellow200"] = "var(--sd-yellow-200)";
-  ColorV2["Yellow400"] = "var(--sd-yellow-400)";
-  ColorV2["Dark50"] = "var(--sd-dark-50)";
-  ColorV2["Dark100"] = "var(--sd-dark-100)";
-  ColorV2["Dark300"] = "var(--sd-dark-300)";
-  ColorV2["Dark500"] = "var(--sd-dark-500)";
-  ColorV2["Silver200"] = "var(--sd-silver-200)";
-  ColorV2["Silver400"] = "var(--sd-silver-400)";
-  ColorV2["Silver500"] = "var(--sd-silver-500)";
-  ColorV2["Blue50"] = "var(--sd-blue-50)";
-  ColorV2["Blue300"] = "var(--sd-blue-300)";
-  ColorV2["Blue500"] = "var(--sd-blue-500)";
-  ColorV2["Green50"] = "var(--sd-green-50)";
-  ColorV2["Green300"] = "var(--sd-green-300)";
-  ColorV2["Green500"] = "var(--sd-green-500)";
-  ColorV2["Purple50"] = "var(--sd-purple-50)";
-  ColorV2["Purple300"] = "var(--sd-purple-300)";
-  ColorV2["Purple500"] = "var(--sd-purple-500)";
-  ColorV2["Red50"] = "var(--sd-red-50)";
-  ColorV2["Red300"] = "var(--sd-red-300)";
-  ColorV2["Red500"] = "var(--sd-red-500)";
-  ColorV2["Teal50"] = "var(--sd-teal-50)";
-  ColorV2["Teal300"] = "var(--sd-teal-300)";
-  ColorV2["Teal500"] = "var(--sd-teal-500)";
-  ColorV2["Yellow50"] = "var(--sd-yellow-50)";
-  ColorV2["Yellow300"] = "var(--sd-yellow-300)";
-  ColorV2["Yellow500"] = "var(--sd-yellow-500)";
-})(ColorV2 || (ColorV2 = {}));
+(function (ColorDark) {
+  ColorDark["White"] = "#151B22";
+  ColorDark["White50"] = "rgba(21, 27, 34, 0.5)";
+  ColorDark["White40"] = "rgba(21, 27, 34, 0.4)";
+  ColorDark["White20"] = "rgba(21, 27, 34, 0.2)";
+  ColorDark["White10"] = "rgba(21, 27, 34, 0.1)";
+  ColorDark["White08"] = "rgba(21, 27, 34, 0.08)";
+  ColorDark["Transparent"] = "rgba(0, 0, 0, 0)";
+  ColorDark["Black"] = "#000";
+  ColorDark["Black50"] = "rgba(0, 0, 0, 0.5)";
+  ColorDark["Black20"] = "rgba(0, 0, 0, 0.2)";
+  ColorDark["Dark30"] = "rgba(143, 148, 158, 0.3)";
+  ColorDark["Blue30"] = "rgba(0, 112, 245, 0.3)";
+  ColorDark["Green30"] = "rgba(3, 135, 47, 0.3)";
+  ColorDark["Red30"] = "rgba(229, 35, 13, 0.3)";
+  ColorDark["Silver30"] = "rgba(225, 229, 234, 0.3)";
+  ColorDark["Blue10"] = "rgba(0, 112, 245, 0.1)";
+  ColorDark["Red10"] = "rgba(195, 25, 9, 0.1)";
+  ColorDark["Grey100"] = "#8F949E";
+  ColorDark["Grey200"] = "#6A707C";
+  ColorDark["Grey300"] = "#5B6371";
+  ColorDark["Grey400"] = "#323C4E";
+  ColorDark["Grey450"] = "#222F44";
+  ColorDark["Grey500"] = "#192334";
+  ColorDark["Dark200"] = "#6A707C";
+  ColorDark["Dark400"] = "#323C4E";
+  ColorDark["Dark450"] = "#222F44";
+  ColorDark["Silver100"] = "#F6F7F8";
+  ColorDark["Silver300"] = "#E8ECF0";
+  ColorDark["Blue75"] = "#CCE5FF";
+  ColorDark["Blue100"] = "#A8D1FF";
+  ColorDark["Blue200"] = "#66ADFF";
+  ColorDark["Blue400"] = "#0063DB";
+  ColorDark["Green75"] = "#C8F4D1";
+  ColorDark["Green100"] = "#90EAAE";
+  ColorDark["Green200"] = "#5DDA87";
+  ColorDark["Green400"] = "#1E8F46";
+  ColorDark["Purple75"] = "#DCDBF5";
+  ColorDark["Purple100"] = "#CBC8EE";
+  ColorDark["Purple200"] = "#A7A1E8";
+  ColorDark["Purple400"] = "#473ABB";
+  ColorDark["Red75"] = "#FDD9D3";
+  ColorDark["Red100"] = "#FDC2BA";
+  ColorDark["Red200"] = "#FE988B";
+  ColorDark["Red400"] = "#D9210D";
+  ColorDark["Teal75"] = "#BEEDF9";
+  ColorDark["Teal100"] = "#91E3F8";
+  ColorDark["Teal200"] = "#61D3EF";
+  ColorDark["Teal400"] = "#008DB8";
+  ColorDark["Yellow75"] = "#FFF1C2";
+  ColorDark["Yellow100"] = "#FFE494";
+  ColorDark["Yellow200"] = "#FFDC6B";
+  ColorDark["Yellow400"] = "#FFA91F";
+  ColorDark["Dark50"] = "rgba(25, 35, 52, 0.5)";
+  ColorDark["Dark100"] = "#6E7A8A";
+  ColorDark["Dark300"] = "#AEB4BD";
+  ColorDark["Dark500"] = "#FFFFFF";
+  ColorDark["Silver200"] = "#0D1017";
+  ColorDark["Silver400"] = "#30373D";
+  ColorDark["Silver500"] = "#47505B";
+  ColorDark["Silver400Alpha30"] = "rgba(48, 55, 61, 0.3)";
+  ColorDark["Blue50"] = "#0E2947";
+  ColorDark["Blue300"] = "#0070F5";
+  ColorDark["Blue500"] = "#55ADFF";
+  ColorDark["Green50"] = "#092E16";
+  ColorDark["Green300"] = "#03872F";
+  ColorDark["Green500"] = "#5EE18A";
+  ColorDark["Purple50"] = "#262247";
+  ColorDark["Purple300"] = "#6559CF";
+  ColorDark["Purple500"] = "#BFA0FF";
+  ColorDark["Red50"] = "#3D0A06";
+  ColorDark["Red300"] = "#E5230D";
+  ColorDark["Red300Aplha20"] = "rgba(233, 27, 12, 0.3)";
+  ColorDark["Red500"] = "#FF6359";
+  ColorDark["Teal50"] = "#11333D";
+  ColorDark["Teal300"] = "#007EAB";
+  ColorDark["Teal500"] = "#31C7F5";
+  ColorDark["Yellow50"] = "#33200A";
+  ColorDark["Yellow300"] = "#E8671C";
+  ColorDark["Yellow500"] = "#FCA542";
+})(ColorDark || (ColorDark = {}));
+export var ColorDynamic;
+(function (ColorDynamic) {
+  ColorDynamic["White"] = "var(--sd-white)";
+  ColorDynamic["White50"] = "var(--sd-white-50)";
+  ColorDynamic["White40"] = "var(--sd-white-40)";
+  ColorDynamic["White20"] = "var(--sd-white-20)";
+  ColorDynamic["White10"] = "var(--sd-white-10)";
+  ColorDynamic["White08"] = "var(--sd-white-08)";
+  ColorDynamic["Transparent"] = "var(--sd-transparent)";
+  ColorDynamic["Black"] = "var(--sd-black)";
+  ColorDynamic["Black50"] = "var(--sd-black-50)";
+  ColorDynamic["Black20"] = "var(--sd-black-20)";
+  ColorDynamic["Dark30"] = "var(--sd-dark-30)";
+  ColorDynamic["Blue30"] = "var(--sd-blue-30)";
+  ColorDynamic["Green30"] = "var(--sd-green-30)";
+  ColorDynamic["Red30"] = "var(--sd-red-30)";
+  ColorDynamic["Silver30"] = "var(--sd-silver-30)";
+  ColorDynamic["Blue10"] = "var(--sd-blue-10)";
+  ColorDynamic["Red10"] = "var(--sd-red-10)";
+  ColorDynamic["Grey100"] = "var(--sd-grey-100)";
+  ColorDynamic["Grey200"] = "var(--sd-grey-200)";
+  ColorDynamic["Grey300"] = "var(--sd-grey-300)";
+  ColorDynamic["Grey400"] = "var(--sd-grey-400)";
+  ColorDynamic["Grey450"] = "var(--sd-grey-450)";
+  ColorDynamic["Grey500"] = "var(--sd-grey-500)";
+  ColorDynamic["Dark200"] = "var(--sd-dark-200)";
+  ColorDynamic["Dark400"] = "var(--sd-dark-400)";
+  ColorDynamic["Dark450"] = "var(--sd-dark-450)";
+  ColorDynamic["Silver100"] = "var(--sd-silver-100)";
+  ColorDynamic["Silver300"] = "var(--sd-silver-300)";
+  ColorDynamic["Blue75"] = "var(--sd-blue-75)";
+  ColorDynamic["Blue100"] = "var(--sd-blue-100)";
+  ColorDynamic["Blue200"] = "var(--sd-blue-200)";
+  ColorDynamic["Blue400"] = "var(--sd-blue-400)";
+  ColorDynamic["Green75"] = "var(--sd-green-75)";
+  ColorDynamic["Green100"] = "var(--sd-green-100)";
+  ColorDynamic["Green200"] = "var(--sd-green-200)";
+  ColorDynamic["Green400"] = "var(--sd-green-400)";
+  ColorDynamic["Purple75"] = "var(--sd-purple-75)";
+  ColorDynamic["Purple100"] = "var(--sd-purple-100)";
+  ColorDynamic["Purple200"] = "var(--sd-purple-200)";
+  ColorDynamic["Purple400"] = "var(--sd-purple-400)";
+  ColorDynamic["Red75"] = "var(--sd-red-75)";
+  ColorDynamic["Red100"] = "var(--sd-red-100)";
+  ColorDynamic["Red200"] = "var(--sd-red-200)";
+  ColorDynamic["Red400"] = "var(--sd-red-400)";
+  ColorDynamic["Teal75"] = "var(--sd-teal-75)";
+  ColorDynamic["Teal100"] = "var(--sd-teal-100)";
+  ColorDynamic["Teal200"] = "var(--sd-teal-200)";
+  ColorDynamic["Teal400"] = "var(--sd-teal-400)";
+  ColorDynamic["Yellow75"] = "var(--sd-yellow-75)";
+  ColorDynamic["Yellow100"] = "var(--sd-yellow-100)";
+  ColorDynamic["Yellow200"] = "var(--sd-yellow-200)";
+  ColorDynamic["Yellow400"] = "var(--sd-yellow-400)";
+  ColorDynamic["Dark50"] = "var(--sd-dark-50)";
+  ColorDynamic["Dark100"] = "var(--sd-dark-100)";
+  ColorDynamic["Dark300"] = "var(--sd-dark-300)";
+  ColorDynamic["Dark500"] = "var(--sd-dark-500)";
+  ColorDynamic["Silver200"] = "var(--sd-silver-200)";
+  ColorDynamic["Silver400"] = "var(--sd-silver-400)";
+  ColorDynamic["Silver500"] = "var(--sd-silver-500)";
+  ColorDynamic["Silver400Alpha30"] = "var(--sd-silver-400-alpha-30)";
+  ColorDynamic["Blue50"] = "var(--sd-blue-50)";
+  ColorDynamic["Blue300"] = "var(--sd-blue-300)";
+  ColorDynamic["Blue500"] = "var(--sd-blue-500)";
+  ColorDynamic["Green50"] = "var(--sd-green-50)";
+  ColorDynamic["Green300"] = "var(--sd-green-300)";
+  ColorDynamic["Green500"] = "var(--sd-green-500)";
+  ColorDynamic["Purple50"] = "var(--sd-purple-50)";
+  ColorDynamic["Purple300"] = "var(--sd-purple-300)";
+  ColorDynamic["Purple500"] = "var(--sd-purple-500)";
+  ColorDynamic["Red50"] = "var(--sd-red-50)";
+  ColorDynamic["Red300"] = "var(--sd-red-300)";
+  ColorDynamic["Red500"] = "var(--sd-red-500)";
+  ColorDynamic["Red300Aplha20"] = "var(--sd-red-300-alpha-20)";
+  ColorDynamic["Teal50"] = "var(--sd-teal-50)";
+  ColorDynamic["Teal300"] = "var(--sd-teal-300)";
+  ColorDynamic["Teal500"] = "var(--sd-teal-500)";
+  ColorDynamic["Yellow50"] = "var(--sd-yellow-50)";
+  ColorDynamic["Yellow300"] = "var(--sd-yellow-300)";
+  ColorDynamic["Yellow500"] = "var(--sd-yellow-500)";
+})(ColorDynamic || (ColorDynamic = {}));
 export function isColorProp(name) {
   return typeof name == 'string' && Object.prototype.hasOwnProperty.call(Color, name);
 }
-export function isColorPropV2(name) {
-  return typeof name == 'string' && Object.prototype.hasOwnProperty.call(ColorV2, name);
+export function isColorDynamicProp(name) {
+  return typeof name == 'string' && Object.prototype.hasOwnProperty.call(ColorDynamic, name);
+}
+export function isColorPropDark(name) {
+  return typeof name == 'string' && Object.prototype.hasOwnProperty.call(ColorDark, name);
 }

package/dist-src/theme/GlobalStyles.js

@@ -1,9 +1,9 @@
 import { createGlobalStyle } from 'styled-components';
-import { ColorDarkInternal, ColorLightInternal } from "./Color.js";
+import { Color, ColorDark } from "./Color.js";
 export var GlobalStyles = /*#__PURE__*/createGlobalStyle(_ref => {
   var {
     theme
   } = _ref;
-  var color = theme.palette.type === 'dark' ? ColorDarkInternal : ColorLightInternal;
-  return "\n    :root{\n      --sd-white: ".concat(color.White, ";\n      --sd-white-50: ").concat(color.White50, ";\n      --sd-white-40: ").concat(color.White40, ";\n      --sd-white-20: ").concat(color.White20, ";\n      --sd-white-10: ").concat(color.White10, ";\n      --sd-white-08: ").concat(color.White08, ";\n      --sd-transparent: ").concat(color.Transparent, ";\n\n      --sd-black: ").concat(color.Black, ";\n      --sd-black-50: ").concat(color.Black50, ";\n      --sd-black-20: ").concat(color.Black20, ";\n\n      --sd-dark-30: ").concat(color.Dark30, ";\n      --sd-blue-30: ").concat(color.Blue30, ";\n      --sd-green-30: ").concat(color.Green30, ";\n      --sd-red-30: ").concat(color.Red30, ";\n      --sd-silver-30: ").concat(color.Silver30, ";\n\n      --sd-blue-10: ").concat(color.Blue10, ";\n      --sd-red-10: ").concat(color.Red10, ";\n\n      /* Legacy Neutral Colors */\n      --sd-grey-100: ").concat(color.Grey100, "; /* @deprecated Use Dark100 */\n      --sd-grey-200: ").concat(color.Grey200, "; /* @deprecated Use Dark200 */\n      --sd-grey-300: ").concat(color.Grey300, "; /* @deprecated Use Dark300 */\n      --sd-grey-400: ").concat(color.Grey400, "; /* @deprecated Use Dark400 */\n      --sd-grey-450: ").concat(color.Grey450, "; /* @deprecated Use Dark450 */\n      --sd-grey-500: ").concat(color.Grey500, "; /* @deprecated Use Dark500 */\n\n      --sd-dark-200: ").concat(color.Dark200, "; /* @deprecated */\n      --sd-dark-400: ").concat(color.Dark400, "; /* @deprecated */\n      --sd-dark-450: ").concat(color.Dark450, "; /* @deprecated */\n\n      --sd-silver-100: ").concat(color.Silver100, "; /* @deprecated */\n      --sd-silver-300: ").concat(color.Silver300, "; /* @deprecated */\n\n      /* Legacy Extended Palette */\n      --sd-blue-75: ").concat(color.Blue75, "; /* @deprecated */\n      --sd-blue-100: ").concat(color.Blue100, "; /* @deprecated */\n      --sd-blue-200: ").concat(color.Blue200, "; /* @deprecated */\n      --sd-blue-400: ").concat(color.Blue400, "; /* @deprecated */\n\n      --sd-green-75: ").concat(color.Green75, "; /* @deprecated */\n      --sd-green-100: ").concat(color.Green100, "; /* @deprecated */\n      --sd-green-200: ").concat(color.Green200, "; /* @deprecated */\n      --sd-green-400: ").concat(color.Green400, "; /* @deprecated */\n\n      --sd-purple-75: ").concat(color.Purple75, "; /* @deprecated */\n      --sd-purple-100: ").concat(color.Purple100, "; /* @deprecated */\n      --sd-purple-200: ").concat(color.Purple200, "; /* @deprecated */\n      --sd-purple-400: ").concat(color.Purple400, "; /* @deprecated */\n\n      --sd-red-75: ").concat(color.Red75, "; /* @deprecated */\n      --sd-red-100: ").concat(color.Red100, "; /* @deprecated */\n      --sd-red-200: ").concat(color.Red200, "; /* @deprecated */\n      --sd-red-400: ").concat(color.Red400, "; /* @deprecated */\n\n      --sd-teal-75: ").concat(color.Teal75, "; /* @deprecated */\n      --sd-teal-100: ").concat(color.Teal100, "; /* @deprecated */\n      --sd-teal-200: ").concat(color.Teal200, "; /* @deprecated */\n      --sd-teal-400: ").concat(color.Teal400, "; /* @deprecated */\n\n      --sd-yellow-75: ").concat(color.Yellow75, "; /* @deprecated */\n      --sd-yellow-100: ").concat(color.Yellow100, "; /* @deprecated */\n      --sd-yellow-200: ").concat(color.Yellow200, "; /* @deprecated */\n      --sd-yellow-400: ").concat(color.Yellow400, "; /* @deprecated */\n      --sd-dark-50: ").concat(color.Dark50, ";\n      /* extended palette */\n    \n      --sd-blue-50: ").concat(color.Blue50, ";\n      --sd-blue-500: ").concat(color.Blue500, ";\n      --sd-blue-300: ").concat(color.Blue300, ";\n      --sd-green-300: ").concat(color.Green300, ";\n      --sd-green-500: ").concat(color.Green500, ";\n      --sd-green-50: ").concat(color.Green50, ";\n      --sd-yellow-300: ").concat(color.Yellow300, ";\n      --sd-yellow-500: ").concat(color.Yellow500, ";\n      --sd-yellow-50: ").concat(color.Yellow50, ";\n      --sd-red-300: ").concat(color.Red300, ";\n      --sd-red-500: ").concat(color.Red500, ";\n      --sd-red-50: ").concat(color.Red50, ";\n      --sd-purple-300: ").concat(color.Purple300, ";\n      --sd-purple-500: ").concat(color.Purple500, ";\n      --sd-purple-50: ").concat(color.Purple50, ";\n      --sd-teal-300: ").concat(color.Teal300, ";\n      --sd-teal-500: ").concat(color.Teal500, ";\n      --sd-teal-50: ").concat(color.Teal50, ";\n      --sd-silver-500: ").concat(color.Silver500, ";\n      --sd-silver-200: ").concat(color.Silver200, ";\n      --sd-silver-400: ").concat(color.Silver400, ";\n      --sd-dark-100: ").concat(color.Dark100, ";\n      --sd-dark-300: ").concat(color.Dark300, ";\n      --sd-dark-500: ").concat(color.Dark500, ";\n    }\n  ");
+  var color = theme.palette.type === 'dark' ? ColorDark : Color;
+  return "\n    :root{\n      --sd-white: ".concat(color.White, ";\n      --sd-white-50: ").concat(color.White50, ";\n      --sd-white-40: ").concat(color.White40, ";\n      --sd-white-20: ").concat(color.White20, ";\n      --sd-white-10: ").concat(color.White10, ";\n      --sd-white-08: ").concat(color.White08, ";\n      --sd-transparent: ").concat(color.Transparent, ";\n\n      --sd-black: ").concat(color.Black, ";\n      --sd-black-50: ").concat(color.Black50, ";\n      --sd-black-20: ").concat(color.Black20, ";\n\n      --sd-dark-30: ").concat(color.Dark30, ";\n      --sd-blue-30: ").concat(color.Blue30, ";\n      --sd-green-30: ").concat(color.Green30, ";\n      --sd-red-30: ").concat(color.Red30, ";\n      --sd-red-300-alpha-20: ").concat(color.Red300Aplha20, ";\n      --sd-silver-30: ").concat(color.Silver30, ";\n\n      --sd-blue-10: ").concat(color.Blue10, ";\n      --sd-red-10: ").concat(color.Red10, ";\n\n      /* Legacy Neutral Colors */\n      --sd-grey-100: ").concat(color.Grey100, "; /* @deprecated Use Dark100 */\n      --sd-grey-200: ").concat(color.Grey200, "; /* @deprecated Use Dark200 */\n      --sd-grey-300: ").concat(color.Grey300, "; /* @deprecated Use Dark300 */\n      --sd-grey-400: ").concat(color.Grey400, "; /* @deprecated Use Dark400 */\n      --sd-grey-450: ").concat(color.Grey450, "; /* @deprecated Use Dark450 */\n      --sd-grey-500: ").concat(color.Grey500, "; /* @deprecated Use Dark500 */\n\n      --sd-dark-200: ").concat(color.Dark200, "; /* @deprecated */\n      --sd-dark-400: ").concat(color.Dark400, "; /* @deprecated */\n      --sd-dark-450: ").concat(color.Dark450, "; /* @deprecated */\n\n      --sd-silver-100: ").concat(color.Silver100, "; /* @deprecated */\n      --sd-silver-300: ").concat(color.Silver300, "; /* @deprecated */\n\n      /* Legacy Extended Palette */\n      --sd-blue-75: ").concat(color.Blue75, "; /* @deprecated */\n      --sd-blue-100: ").concat(color.Blue100, "; /* @deprecated */\n      --sd-blue-200: ").concat(color.Blue200, "; /* @deprecated */\n      --sd-blue-400: ").concat(color.Blue400, "; /* @deprecated */\n\n      --sd-green-75: ").concat(color.Green75, "; /* @deprecated */\n      --sd-green-100: ").concat(color.Green100, "; /* @deprecated */\n      --sd-green-200: ").concat(color.Green200, "; /* @deprecated */\n      --sd-green-400: ").concat(color.Green400, "; /* @deprecated */\n\n      --sd-purple-75: ").concat(color.Purple75, "; /* @deprecated */\n      --sd-purple-100: ").concat(color.Purple100, "; /* @deprecated */\n      --sd-purple-200: ").concat(color.Purple200, "; /* @deprecated */\n      --sd-purple-400: ").concat(color.Purple400, "; /* @deprecated */\n\n      --sd-red-75: ").concat(color.Red75, "; /* @deprecated */\n      --sd-red-100: ").concat(color.Red100, "; /* @deprecated */\n      --sd-red-200: ").concat(color.Red200, "; /* @deprecated */\n      --sd-red-400: ").concat(color.Red400, "; /* @deprecated */\n\n      --sd-teal-75: ").concat(color.Teal75, "; /* @deprecated */\n      --sd-teal-100: ").concat(color.Teal100, "; /* @deprecated */\n      --sd-teal-200: ").concat(color.Teal200, "; /* @deprecated */\n      --sd-teal-400: ").concat(color.Teal400, "; /* @deprecated */\n\n      --sd-yellow-75: ").concat(color.Yellow75, "; /* @deprecated */\n      --sd-yellow-100: ").concat(color.Yellow100, "; /* @deprecated */\n      --sd-yellow-200: ").concat(color.Yellow200, "; /* @deprecated */\n      --sd-yellow-400: ").concat(color.Yellow400, "; /* @deprecated */\n      --sd-dark-50: ").concat(color.Dark50, ";\n      /* extended palette */\n    \n      --sd-blue-50: ").concat(color.Blue50, ";\n      --sd-blue-500: ").concat(color.Blue500, ";\n      --sd-blue-300: ").concat(color.Blue300, ";\n      --sd-green-300: ").concat(color.Green300, ";\n      --sd-green-500: ").concat(color.Green500, ";\n      --sd-green-50: ").concat(color.Green50, ";\n      --sd-yellow-300: ").concat(color.Yellow300, ";\n      --sd-yellow-500: ").concat(color.Yellow500, ";\n      --sd-yellow-50: ").concat(color.Yellow50, ";\n      --sd-red-300: ").concat(color.Red300, ";\n      --sd-red-500: ").concat(color.Red500, ";\n      --sd-red-50: ").concat(color.Red50, ";\n      --sd-purple-300: ").concat(color.Purple300, ";\n      --sd-purple-500: ").concat(color.Purple500, ";\n      --sd-purple-50: ").concat(color.Purple50, ";\n      --sd-teal-300: ").concat(color.Teal300, ";\n      --sd-teal-500: ").concat(color.Teal500, ";\n      --sd-teal-50: ").concat(color.Teal50, ";\n      --sd-silver-500: ").concat(color.Silver500, ";\n      --sd-silver-200: ").concat(color.Silver200, ";\n      --sd-silver-400: ").concat(color.Silver400, ";\n      --sd-silver-400-alpha-30: ").concat(color.Silver400Alpha30, ";\n      --sd-dark-100: ").concat(color.Dark100, ";\n      --sd-dark-300: ").concat(color.Dark300, ";\n      --sd-dark-500: ").concat(color.Dark500, ";\n    }\n  ");
 });

package/dist-src/theme/ThemeProvider.js

@@ -30,33 +30,41 @@ import { overrideTextField } from "../text-field/TextFieldOverrides.js";
 import { overrideToolbar } from "../toolbar/ToolbarOverrides.js";
 import { overrideTooltip } from "../tooltip/TooltipOverrides.js";
 import { createTypographyOptions, overrideTypography } from "../typography/TypographyOverrides.js";
-import { Color } from "./Color.js";
+import { Color, ColorDark } from "./Color.js";
 import { GlobalStyles } from "./GlobalStyles.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 function createSuperDispatchTheme(type) {
   var breakpoints = createBreakpoints({});
+  var color = type === 'dark' ? ColorDark : Color;
   var theme = createTheme({
     breakpoints,
     palette: {
       type,
       primary: {
-        main: Color.Blue300
+        main: color.Blue300
       },
       error: {
-        main: Color.Red300
+        main: color.Red300
       },
       action: {
-        hover: Color.Silver100,
-        selected: Color.Silver300,
-        disabled: Color.Silver400
+        hover: color.Silver200,
+        selected: color.Blue50,
+        disabled: color.Silver400
       },
       text: {
-        primary: Color.Dark500,
-        secondary: Color.Dark300,
-        hint: Color.Dark100,
-        disabled: Color.Dark100
+        primary: color.Dark500,
+        secondary: color.Dark300,
+        hint: color.Dark100,
+        disabled: color.Dark100
       },
-      divider: Color.Silver400
+      common: {
+        white: color.White,
+        black: color.Black
+      },
+      divider: color.Silver400,
+      background: {
+        paper: color.White
+      }
     },
     typography: createTypographyOptions(breakpoints),
     props: {},

package/dist-src/tooltip/TooltipOverrides.js

@@ -1,5 +1,5 @@
 import _objectSpread from "@babel/runtime/helpers/objectSpread2";
-import { ColorV2 } from "../theme/Color.js";
+import { ColorDynamic } from "../theme/Color.js";
 export function overrideTooltip(theme) {
   theme.props.MuiTooltip = {
     arrow: true
@@ -7,7 +7,7 @@ export function overrideTooltip(theme) {
   theme.overrides.MuiTooltip = {
     tooltip: _objectSpread(_objectSpread({}, theme.typography.body2), {}, {
       padding: theme.spacing(1, 1.5),
-      backgroundColor: ColorV2.Dark500
+      backgroundColor: ColorDynamic.Dark500
     }),
     popperArrow: {
       '&[x-placement*="top"] $arrow': {
@@ -32,7 +32,7 @@ export function overrideTooltip(theme) {
       }
     },
     arrow: {
-      color: ColorV2.Dark500,
+      color: ColorDynamic.Dark500,
       fontSize: theme.spacing(1)
     }
   };

package/dist-src/typography/TypographyOverrides.js

@@ -1,4 +1,4 @@
-import { ColorV2 } from "../theme/Color.js";
+import { ColorDynamic } from "../theme/Color.js";
 export function createTypographyOptions(breakpoints) {
   var xsOnly = breakpoints.only('xs');
   return {
@@ -109,10 +109,10 @@ export function overrideTypography(theme) {
   };
   theme.overrides.MuiTypography = {
     colorError: {
-      color: ColorV2.Red500
+      color: ColorDynamic.Red500
     },
     colorPrimary: {
-      color: ColorV2.Blue500
+      color: ColorDynamic.Blue500
     }
   };
 }