@sprinklrjs/spaceweb-themes 12.33.2 → 14.11.3

package/styles/tokens.scss

@@ -118,7 +118,7 @@ $dictionaryTokens: (
   height-11: 4.4rem,
   height-12: 4.8rem,
   height-auto: auto,
-  height-1.5: 0.6rem,
+  'height-1.5': 0.6rem,
   height-full: 100%,
   height-screen: 100vh,
   spacing-0: 0,
@@ -134,7 +134,7 @@ $dictionaryTokens: (
   spacing-10: 4rem,
   spacing-11: 4.4rem,
   spacing-12: 4.8rem,
-  spacing-1.5: 0.6rem,
+  'spacing-1.5': 0.6rem,
   width-0: 0,
   width-1: 0.4rem,
   width-2: 0.8rem,
@@ -149,7 +149,7 @@ $dictionaryTokens: (
   width-11: 4.4rem,
   width-12: 4.8rem,
   width-auto: auto,
-  width-1.5: 0.6rem,
+  'width-1.5': 0.6rem,
   width-1/2: 50%,
   width-1/3: 33.333333%,
   width-2/3: 66.666667%,
@@ -187,7 +187,7 @@ $dictionaryTokens: (
   margin-11: 4.4rem,
   margin-12: 4.8rem,
   margin-auto: auto,
-  margin-1.5: 0.6rem,
+  'margin-1.5': 0.6rem,
   margin--1: -0.4rem,
   margin--2: -0.8rem,
   margin--3: -1.2rem,
@@ -200,7 +200,7 @@ $dictionaryTokens: (
   margin--10: -4rem,
   margin--11: -4.4rem,
   margin--12: -4.8rem,
-  margin--1.5: -0.6rem,
+  'margin--1.5': -0.6rem,
   padding-0: 0,
   padding-1: 0.4rem,
   padding-2: 0.8rem,
@@ -214,7 +214,7 @@ $dictionaryTokens: (
   padding-10: 4rem,
   padding-11: 4.4rem,
   padding-12: 4.8rem,
-  padding-1.5: 0.6rem,
+  'padding-1.5': 0.6rem,
   maxHeight-full: 100%,
   maxHeight-screen: 100vh,
   minHeight-0: 0,

package/types.d.ts

@@ -3,7 +3,6 @@
  */
 import { StyleObject } from 'styletron-react';
 import HyperspaceLightTheme from './hyperspace/light/theme';
-import SpaceLightTheme from './space/light/theme';
 export declare type ThemeClassNames = {
   [className: string]: {
     [rule: string]: string | number | StyleObject | undefined;
@@ -31,103 +30,89 @@ type buttonGroupCommonProps = {
   containerBorderRadius?: string;
 };
 
-export declare type Theme = Omit<typeof HyperspaceLightTheme | typeof SpaceLightTheme, 'density'> & {
-  density?: Density;
-} & {
-  button?: {
-    primary?: {
-      color?: string;
-      hoverColor?: string;
-      activeColor?: string;
-      disabledColor?: string;
-
-      backgroundColor?: string;
-      hoverBackgroundColor?: string;
-      activeBackgroundColor?: string;
-      disabledBackgroundColor?: string;
+type inputCommonProps = {
+  borderRadius?: string;
+  paddingX?: string;
+  paddingY?: string;
+  fontSize?: string;
+  lineHeight?: string;
+};
 
-      borderColor?: string;
-      hoverBorderColor?: string;
-      activeBorderColor?: string;
-      disabledBorderColor?: string;
+type buttonStyleParams = {
+  color?: string;
+  hoverColor?: string;
+  activeColor?: string;
+  disabledColor?: string;
 
-      background?: string;
-      hoverBackground?: string;
-      activeBackground?: string;
-      disabledBackground?: string;
+  backgroundColor?: string;
+  hoverBackgroundColor?: string;
+  activeBackgroundColor?: string;
+  disabledBackgroundColor?: string;
 
-      disabledOpacity?: string;
+  borderColor?: string;
+  hoverBorderColor?: string;
+  activeBorderColor?: string;
+  disabledBorderColor?: string;
 
-    };
-    secondary?: {
-      color?: string;
-      hoverColor?: string;
-      activeColor?: string;
-      disabledColor?: string;
+  background?: string;
+  hoverBackground?: string;
+  activeBackground?: string;
+  disabledBackground?: string;
 
-      backgroundColor?: string;
-      hoverBackgroundColor?: string;
-      activeBackgroundColor?: string;
-      disabledBackgroundColor?: string;
+  disabledOpacity?: string;
+};
 
-      borderColor?: string;
-      hoverBorderColor?: string;
-      activeBorderColor?: string;
-      disabledBorderColor?: string;
+type buttonSizeParams = {
+  minWidth?: string;
+  paddingY?: string;
+  paddingX?: string;
+  borderRadius?: string;
+  fontStyles?: {
+    fontSize?: string;
+    lineHeight?: string;
+    fontWeight?: number;
+  };
+};
 
-      background?: string;
-      hoverBackground?: string;
-      activeBackground?: string;
-      disabledBackground?: string;
+type iconButtonSizeParams = { buttonSize?: number; iconSize?: number; squareBorderRadius?: number };
 
-      disabledOpacity?: string;
-    };
-    tertiary?: {
-      color?: string;
-      hoverColor?: string;
-      activeColor?: string;
-      disabledColor?: string;
+type color = { color?: string; hoverColor?: string; activeColor?: string; disabledColor?: string };
 
-      backgroundColor?: string;
-      hoverBackgroundColor?: string;
-      activeBackgroundColor?: string;
-      disabledBackgroundColor?: string;
-
-      borderColor?: string;
-      hoverBorderColor?: string;
-      activeBorderColor?: string;
-      disabledBorderColor?: string;
+type backgroundColor = {
+  backgroundColor?: string;
+  hoverBackgroundColor?: string;
+  activeBackgroundColor?: string;
+  disabledBackgroundColor?: string;
+};
 
-      background?: string;
-      hoverBackground?: string;
-      activeBackground?: string;
-      disabledBackground?: string;
+type borderColor = {
+  borderColor?: string;
+  hoverBorderColor?: string;
+  activeBorderColor?: string;
+  disabledBorderColor?: string;
+};
 
-      disabledOpacity?: string;
-    };
-    minimal?: {
+export declare type Theme = Omit<typeof HyperspaceLightTheme, 'density'> & {
+  density?: Density;
+} & {
+  button?: null | {
+    borderRadius?: string;
+    variantSecondary?: {
       color?: string;
-      hoverColor?: string;
-      activeColor?: string;
-      disabledColor?: string;
-
-      backgroundColor?: string;
       hoverBackgroundColor?: string;
       activeBackgroundColor?: string;
-      disabledBackgroundColor?: string;
-
-      borderColor?: string;
-      hoverBorderColor?: string;
-      activeBorderColor?: string;
-      disabledBorderColor?: string;
-
-      background?: string;
-      hoverBackground?: string;
-      activeBackground?: string;
-      disabledBackground?: string;
-
-      disabledOpacity?: string;
     };
+    sizeXxxs?: buttonSizeParams;
+    sizeXxs?: buttonSizeParams;
+    sizeXs?: buttonSizeParams;
+    sizeSm?: Omit<buttonSizeParams, 'borderRadius'>;
+    sizeMd?: Omit<buttonSizeParams, 'borderRadius'>;
+    sizeLg?: Omit<buttonSizeParams, 'borderRadius'>;
+    sizeXl?: Omit<buttonSizeParams, 'borderRadius'>;
+    primary?: buttonStyleParams;
+    secondary?: buttonStyleParams;
+    tertiary?: buttonStyleParams;
+    minimal?: buttonStyleParams;
   };
   search?: {
     sizeXxs?: searchCommonProps;
@@ -142,6 +127,71 @@ export declare type Theme = Omit<typeof HyperspaceLightTheme | typeof SpaceLight
     sizeMd?: buttonGroupCommonProps;
     sizeLg?: buttonGroupCommonProps;
   };
+  input?: null | {
+    fontWeight?: number;
+    borderRadius?: string;
+    disabledBorderColor?: string;
+    sizeXxxs?: inputCommonProps;
+    sizeXs?: inputCommonProps;
+    sizeSm?: inputCommonProps;
+    sizeMd?: inputCommonProps;
+    sizeLg?: inputCommonProps;
+  };
+  formControl?: {
+    labelFontStyles?: {
+      fontSize?: string;
+      lineHeight?: string;
+      fontWeight?: number;
+    };
+  };
+  list?: null | {
+    selectedEnhancerBackground: string;
+    hoverBackgroundColor: string;
+  };
+  link?: null | {
+    fontSize?: string;
+    lineHeight?: string;
+  };
+  tag?: null | {
+    actionButtonBorderRadius?: string;
+    avatarMarginLeft?: string;
+  };
+  iconButton?: null | {
+    minWidth?: string;
+    sizeXxxxs?: iconButtonSizeParams;
+    sizeXxxs?: iconButtonSizeParams;
+    sizeXxs?: iconButtonSizeParams;
+    sizeXs?: iconButtonSizeParams;
+    sizeSm?: Omit<iconButtonSizeParams, 'squareBorderRadius'>;
+    sizeMd?: Omit<iconButtonSizeParams, 'squareBorderRadius'>;
+    sizeLg?: Omit<iconButtonSizeParams, 'squareBorderRadius'>;
+    sizeXl?: Omit<iconButtonSizeParams, 'squareBorderRadius'>;
+    shapeRound?: color & backgroundColor;
+    shapeRoundBordered?: backgroundColor & borderColor & Omit<color, 'color'>;
+    shapeSquare?: color & backgroundColor & { borderRadius?: string };
+    shapeSquareBordered?: Omit<color, 'color'> & backgroundColor & borderColor;
+  };
+  tab?: null | {
+    variantDefault?: {
+      fontStyles?: {
+        fontSize?: string;
+        lineHeight?: string;
+        fontWeight?: number;
+      };
+      positionTopStyles?: {
+        marginLeft?: string;
+        marginRight?: string;
+      };
+      positionLeftStyles?: {
+        marginTop?: string;
+        marginBottom?: string;
+      };
+      positionRightStyles?: {
+        marginTop?: string;
+        marginBottom?: string;
+      };
+    };
+  };
 };
 export declare type ThemeModule = {
   classes: ThemeClassNames;

package/utilities.css

@@ -51,23 +51,11 @@
 .group:hover .group-hover\:bg-transparent {
   background-color: transparent;
 }
-.group:hover .group-hover\:spr-ui-01 {
-  background-color: var(--spr-ui-01, #ffffff);
-}
 .group:hover .group-hover\:spr-ui-02 {
   background-color: var(--spr-ui-02, #f8f8fa);
 }
-.group:hover .group-hover\:spr-ui-03 {
-  background-color: var(--spr-ui-03, #dbdbdb);
-}
 .group:hover .group-hover\:spr-ui-04 {
-  background-color: var(--spr-ui-04, #0e61f6);
-}
-.group:hover .group-hover\:spr-ui-05 {
-  background-color: var(--spr-ui-05, #eef0f1);
-}
-.group:hover .group-hover\:spr-ui-06 {
-  background-color: var(--spr-ui-06, #e6e6e9);
+  background-color: var(--spr-ui-04, #1250de);
 }
 .group:hover .group-hover\:spr-ui-focus {
   background-color: var(--spr-ui-focus, rgba(8, 40, 204, 0.07));
@@ -81,23 +69,17 @@
 .group:hover .group-hover\:spr-ui-hover-reverse {
   background-color: var(--spr-ui-hover-reverse, rgba(255, 255, 255, 0.1));
 }
-.group:hover .group-hover\:spr-support-error {
-  background-color: var(--spr-support-error, #c70f5c);
-}
 .group:hover .group-hover\:spr-support-error-highlight {
-  background-color: var(--spr-support-error-highlight, rgba(199, 15, 92, 0.2));
-}
-.group:hover .group-hover\:spr-support-success {
-  background-color: var(--spr-support-success, #6ac96e);
+  background-color: var(--spr-support-error-highlight, rgba(220, 38, 37, 0.2));
 }
 .group:hover .group-hover\:spr-support-success-highlight {
-  background-color: var(--spr-support-success-highlight, rgba(106, 201, 110, 0.2));
-}
-.group:hover .group-hover\:spr-support-warning {
-  background-color: var(--spr-support-warning, #f3bf24);
+  background-color: var(--spr-support-success-highlight, rgba(23, 135, 64, 0.2));
 }
 .group:hover .group-hover\:spr-support-warning-highlight {
-  background-color: var(--spr-support-warning-highlight, rgba(243, 191, 36, 0.2));
+  background-color: var(--spr-support-warning-highlight, rgba(235, 179, 5, 0.2));
+}
+.group:hover .group-hover\:spr-bg-success-highlight-2 {
+  background-color: var(--spr-bg-success-highlight-2, #87efac);
 }
 .group:hover .group-hover\:spr-clr-blue-highlight {
   background-color: var(--spr-clr-blue-highlight, #e8f0fe);
@@ -120,29 +102,17 @@
 .group:hover .group-hover\:spr-overlay {
   background-color: var(--spr-overlay, rgba(10, 10, 20, 0.9));
 }
-.group:hover .group-hover\:spr-tooltip-01 {
-  background-color: var(--spr-tooltip-01, #0a0a14);
-}
-.group:hover .group-hover\:spr-highlight {
-  background-color: var(--spr-highlight, rgba(255, 231, 173, 0.7));
-}
 .group:hover .group-hover\:spr-favourite {
   background-color: var(--spr-favourite, #ff9f21);
 }
 .group:hover .group-hover\:spr-notification {
   background-color: var(--spr-notification, #de336a);
 }
-.group:hover .group-hover\:spr-interactive-01 {
-  background-color: var(--spr-interactive-01, #0e61f6);
-}
-.group:hover .group-hover\:spr-interactive-hover {
-  background-color: var(--spr-interactive-hover, #1858ce);
-}
 .group:hover .group-hover\:spr-interactive-disable {
   background-color: var(--spr-interactive-disable, rgba(255, 255, 255, 0.6));
 }
 .group:hover .group-hover\:spr-interactive-02 {
-  background-color: var(--spr-interactive-02, #dbdbdb);
+  background-color: var(--spr-interactive-02, #e3e4e6);
 }
 .group:hover .group-hover\:spr-clr-blue {
   background-color: var(--spr-clr-blue, #2ea2fb);
@@ -216,20 +186,137 @@
 .group:hover .group-hover\:spr-clr-lt-violet {
   background-color: var(--spr-clr-lt-violet, #e4dff2);
 }
+.group:hover .group-hover\:spr-text-disable {
+  color: var(--spr-text-disable, rgba(28, 28, 31, 0.33));
+}
+.group:hover .group-hover\:spr-text-magenta {
+  color: var(--spr-text-magenta, #cb1cce);
+}
+.group:hover .group-hover\:spr-bg-primary {
+  background-color: var(--spr-bg-primary, #ffffff);
+}
+.group:hover .group-hover\:spr-bg-secondary {
+  background-color: var(--spr-bg-secondary, #ecedee);
+}
+.group:hover .group-hover\:spr-bg-tertiary {
+  background-color: var(--spr-bg-tertiary, #e3e4e6);
+}
+.group:hover .group-hover\:spr-bg-quaternary {
+  background-color: var(--spr-bg-quaternary, #f5f6f7);
+}
+.group:hover .group-hover\:spr-bg-quinary {
+  background-color: var(--spr-bg-quinary, #d8d9db);
+}
+.group:hover .group-hover\:spr-bg-inverse {
+  background-color: var(--spr-bg-inverse, #1e2022);
+}
+.group:hover .group-hover\:spr-bg-error {
+  background-color: var(--spr-bg-error, #dc2625);
+}
+.group:hover .group-hover\:spr-bg-error-highlight {
+  background-color: var(--spr-bg-error-highlight, #fee2e1);
+}
+.group:hover .group-hover\:spr-bg-success {
+  background-color: var(--spr-bg-success, #15823d);
+}
+.group:hover .group-hover\:spr-bg-success-highlight {
+  background-color: var(--spr-bg-success-highlight, #dcfce7);
+}
+.group:hover .group-hover\:spr-bg-warning {
+  background-color: var(--spr-bg-warning, #ebb305);
+}
+.group:hover .group-hover\:spr-bg-warning-highlight {
+  background-color: var(--spr-bg-warning-highlight, #fef9c3);
+}
+.group:hover .group-hover\:spr-bg-neutral {
+  background-color: var(--spr-bg-neutral, #94969a);
+}
+.group:hover .group-hover\:spr-bg-overlay {
+  background-color: var(--spr-bg-overlay, rgba(18, 18, 20, 0.66));
+}
+.group:hover .group-hover\:spr-bg-white {
+  background-color: var(--spr-bg-white, #ffffff);
+}
+.group:hover .group-hover\:spr-highlight {
+  background-color: var(--spr-highlight, #fef9c3);
+}
+.group:hover .group-hover\:spr-interactive {
+  background-color: var(--spr-interactive, #1250de);
+}
+.group:hover .group-hover\:spr-interactive-hover {
+  background-color: var(--spr-interactive-hover, #1640b1);
+}
 .group:hover .group-hover\:spr-link {
-  color: var(--spr-link, #0e61f6);
+  color: var(--spr-link, #1250de);
+}
+.group:hover .group-hover\:spr-text-primary {
+  color: var(--spr-text-primary, #1e2022);
+}
+.group:hover .group-hover\:spr-text-secondary {
+  color: var(--spr-text-secondary, #252627);
+}
+.group:hover .group-hover\:spr-text-tertiary {
+  color: var(--spr-text-tertiary, #525457);
+}
+.group:hover .group-hover\:spr-text-placeholder {
+  color: var(--spr-text-placeholder, #757575);
+}
+.group:hover .group-hover\:spr-text-white {
+  color: var(--spr-text-white, #ffffff);
+}
+.group:hover .group-hover\:spr-text-inverse {
+  color: var(--spr-text-inverse, #ffffff);
+}
+.group:hover .group-hover\:spr-text-error {
+  color: var(--spr-text-error, #dc2625);
+}
+.group:hover .group-hover\:spr-text-success {
+  color: var(--spr-text-success, #15823d);
+}
+.group:hover .group-hover\:spr-text-warning {
+  color: var(--spr-text-warning, #ebb305);
+}
+.group:hover .group-hover\:spr-ui-01 {
+  background-color: var(--spr-ui-01, #ffffff);
+}
+.group:hover .group-hover\:spr-ui-05 {
+  background-color: var(--spr-ui-05, #ecedee);
+}
+.group:hover .group-hover\:spr-ui-03 {
+  background-color: var(--spr-ui-03, #e3e4e6);
+}
+.group:hover .group-hover\:spr-ui-06 {
+  background-color: var(--spr-ui-06, #d8d9db);
+}
+.group:hover .group-hover\:spr-tooltip-01 {
+  background-color: var(--spr-tooltip-01, #1e2022);
+}
+.group:hover .group-hover\:spr-support-error {
+  background-color: var(--spr-support-error, #dc2625);
+}
+.group:hover .group-hover\:spr-support-success {
+  background-color: var(--spr-support-success, #15823d);
+}
+.group:hover .group-hover\:spr-support-warning {
+  background-color: var(--spr-support-warning, #ebb305);
+}
+.group:hover .group-hover\:spr-interactive-01 {
+  background-color: var(--spr-interactive-01, #1250de);
+}
+.group:hover .group-hover\:spr-text-04 {
+  color: var(--spr-text-04, #1250de);
+}
+.group:hover .group-hover\:spr-text-link-active {
+  color: var(--spr-text-link-active, #1250de);
 }
 .group:hover .group-hover\:spr-text-01 {
-  color: var(--spr-text-01, #0a0a14);
+  color: var(--spr-text-01, #1e2022);
 }
 .group:hover .group-hover\:spr-text-02 {
-  color: var(--spr-text-02, #434350);
+  color: var(--spr-text-02, #252627);
 }
 .group:hover .group-hover\:spr-text-03 {
-  color: var(--spr-text-03, #646470);
-}
-.group:hover .group-hover\:spr-text-04 {
-  color: var(--spr-text-04, #0e61f6);
+  color: var(--spr-text-03, #525457);
 }
 .group:hover .group-hover\:spr-text-05 {
   color: var(--spr-text-05, #ffffff);
@@ -237,20 +324,14 @@
 .group:hover .group-hover\:spr-text-06 {
   color: var(--spr-text-06, #ffffff);
 }
-.group:hover .group-hover\:spr-text-magenta {
-  color: var(--spr-text-magenta, #cb1cce);
-}
-.group:hover .group-hover\:spr-text-placeholder {
-  color: var(--spr-text-placeholder, #646470);
-}
 .group:hover .group-hover\:spr-support-error-text {
-  color: var(--spr-support-error-text, #c70f5c);
+  color: var(--spr-support-error-text, #dc2625);
 }
 .group:hover .group-hover\:spr-support-success-text {
-  color: var(--spr-support-success-text, #6ac96e);
+  color: var(--spr-support-success-text, #15823d);
 }
 .group:hover .group-hover\:spr-support-warning-text {
-  color: var(--spr-support-warning-text, #f3bf24);
+  color: var(--spr-support-warning-text, #ebb305);
 }
 .group:hover .group-hover\:block {
   display: block;

package/utilities.min.css

@@ -1 +1 @@
-.group:hover .group-hover\:opacity-0{opacity:0}.group:hover .group-hover\:opacity-5{opacity:.05}.group:hover .group-hover\:opacity-10{opacity:.1}.group:hover .group-hover\:opacity-15{opacity:.15}.group:hover .group-hover\:opacity-20{opacity:.2}.group:hover .group-hover\:opacity-25{opacity:.25}.group:hover .group-hover\:opacity-30{opacity:.3}.group:hover .group-hover\:opacity-40{opacity:.4}.group:hover .group-hover\:opacity-50{opacity:.5}.group:hover .group-hover\:opacity-60{opacity:.6}.group:hover .group-hover\:opacity-70{opacity:.7}.group:hover .group-hover\:opacity-75{opacity:.75}.group:hover .group-hover\:opacity-80{opacity:.8}.group:hover .group-hover\:opacity-90{opacity:.9}.group:hover .group-hover\:opacity-100{opacity:1}.group:hover .group-hover\:bg-transparent{background-color:transparent}.group:hover .group-hover\:spr-ui-01{background-color:var(--spr-ui-01,#fff)}.group:hover .group-hover\:spr-ui-02{background-color:var(--spr-ui-02,#f8f8fa)}.group:hover .group-hover\:spr-ui-03{background-color:var(--spr-ui-03,#dbdbdb)}.group:hover .group-hover\:spr-ui-04{background-color:var(--spr-ui-04,#0e61f6)}.group:hover .group-hover\:spr-ui-05{background-color:var(--spr-ui-05,#eef0f1)}.group:hover .group-hover\:spr-ui-06{background-color:var(--spr-ui-06,#e6e6e9)}.group:hover .group-hover\:spr-ui-focus{background-color:var(--spr-ui-focus,rgba(8,40,204,.07))}.group:hover .group-hover\:spr-ui-focus-reverse{background-color:var(--spr-ui-focus-reverse,rgba(255,255,255,.2))}.group:hover .group-hover\:spr-ui-hover{background-color:var(--spr-ui-hover,#f8f8fa)}.group:hover .group-hover\:spr-ui-hover-reverse{background-color:var(--spr-ui-hover-reverse,rgba(255,255,255,.1))}.group:hover .group-hover\:spr-support-error{background-color:var(--spr-support-error,#c70f5c)}.group:hover .group-hover\:spr-support-error-highlight{background-color:var(--spr-support-error-highlight,rgba(199,15,92,.2))}.group:hover .group-hover\:spr-support-success{background-color:var(--spr-support-success,#6ac96e)}.group:hover .group-hover\:spr-support-success-highlight{background-color:var(--spr-support-success-highlight,rgba(106,201,110,.2))}.group:hover .group-hover\:spr-support-warning{background-color:var(--spr-support-warning,#f3bf24)}.group:hover .group-hover\:spr-support-warning-highlight{background-color:var(--spr-support-warning-highlight,rgba(243,191,36,.2))}.group:hover .group-hover\:spr-clr-blue-highlight{background-color:var(--spr-clr-blue-highlight,#e8f0fe)}.group:hover .group-hover\:spr-tag{background-color:var(--spr-tag,#f2f2f4)}.group:hover .group-hover\:spr-tag-01{background-color:var(--spr-tag-01,#e6e6e9)}.group:hover .group-hover\:spr-tag-02{background-color:var(--spr-tag-02,rgba(8,40,204,.07))}.group:hover .group-hover\:spr-field{background-color:var(--spr-field,#dbdbdb)}.group:hover .group-hover\:spr-popup{background-color:var(--spr-popup,#fff)}.group:hover .group-hover\:spr-overlay{background-color:var(--spr-overlay,rgba(10,10,20,.9))}.group:hover .group-hover\:spr-tooltip-01{background-color:var(--spr-tooltip-01,#0a0a14)}.group:hover .group-hover\:spr-highlight{background-color:var(--spr-highlight,rgba(255,231,173,.7))}.group:hover .group-hover\:spr-favourite{background-color:var(--spr-favourite,#ff9f21)}.group:hover .group-hover\:spr-notification{background-color:var(--spr-notification,#de336a)}.group:hover .group-hover\:spr-interactive-01{background-color:var(--spr-interactive-01,#0e61f6)}.group:hover .group-hover\:spr-interactive-hover{background-color:var(--spr-interactive-hover,#1858ce)}.group:hover .group-hover\:spr-interactive-disable{background-color:var(--spr-interactive-disable,rgba(255,255,255,.6))}.group:hover .group-hover\:spr-interactive-02{background-color:var(--spr-interactive-02,#dbdbdb)}.group:hover .group-hover\:spr-clr-blue{background-color:var(--spr-clr-blue,#2ea2fb)}.group:hover .group-hover\:spr-clr-green{background-color:var(--spr-clr-green,#3c9)}.group:hover .group-hover\:spr-clr-lavender{background-color:var(--spr-clr-lavender,#7f36f6)}.group:hover .group-hover\:spr-clr-orange{background-color:var(--spr-clr-orange,#f08c1a)}.group:hover .group-hover\:spr-clr-pink{background-color:var(--spr-clr-pink,#ffa1be)}.group:hover .group-hover\:spr-clr-red{background-color:var(--spr-clr-red,#e1245e)}.group:hover .group-hover\:spr-clr-sea{background-color:var(--spr-clr-sea,#16aad2)}.group:hover .group-hover\:spr-clr-teal{background-color:var(--spr-clr-teal,#13c18d)}.group:hover .group-hover\:spr-clr-yellow{background-color:var(--spr-clr-yellow,#ecad00)}.group:hover .group-hover\:spr-clr-grey{background-color:var(--spr-clr-grey,#d7d7dc)}.group:hover .group-hover\:spr-clr-purple{background-color:var(--spr-clr-purple,#8c43ff)}.group:hover .group-hover\:spr-clr-lt-yellow{background-color:var(--spr-clr-lt-yellow,#ffd04f)}.group:hover .group-hover\:spr-clr-darker-blue{background-color:var(--spr-clr-darker-blue,#327afd)}.group:hover .group-hover\:spr-secondary-yellow{background-color:var(--spr-secondary-yellow,#ffc312)}.group:hover .group-hover\:spr-secondary-green{background-color:var(--spr-secondary-green,#a3cb38)}.group:hover .group-hover\:spr-secondary-teal{background-color:var(--spr-secondary-teal,#12cbc4)}.group:hover .group-hover\:spr-secondary-lt-pink{background-color:var(--spr-secondary-lt-pink,#fda7df)}.group:hover .group-hover\:spr-secondary-pink{background-color:var(--spr-secondary-pink,#ed4c67)}.group:hover .group-hover\:spr-secondary-maroon{background-color:var(--spr-secondary-maroon,#b53471)}.group:hover .group-hover\:spr-secondary-orange{background-color:var(--spr-secondary-orange,#f48749)}.group:hover .group-hover\:spr-clr-magenta{background-color:var(--spr-clr-magenta,#cb1cce)}.group:hover .group-hover\:spr-clr-fuschia{background-color:var(--spr-clr-fuschia,#a70fdc)}.group:hover .group-hover\:spr-clr-violet{background-color:var(--spr-clr-violet,#8e43ff)}.group:hover .group-hover\:spr-clr-lt-violet{background-color:var(--spr-clr-lt-violet,#e4dff2)}.group:hover .group-hover\:spr-link{color:var(--spr-link,#0e61f6)}.group:hover .group-hover\:spr-text-01{color:var(--spr-text-01,#0a0a14)}.group:hover .group-hover\:spr-text-02{color:var(--spr-text-02,#434350)}.group:hover .group-hover\:spr-text-03{color:var(--spr-text-03,#646470)}.group:hover .group-hover\:spr-text-04{color:var(--spr-text-04,#0e61f6)}.group:hover .group-hover\:spr-text-05{color:var(--spr-text-05,#fff)}.group:hover .group-hover\:spr-text-06{color:var(--spr-text-06,#fff)}.group:hover .group-hover\:spr-text-magenta{color:var(--spr-text-magenta,#cb1cce)}.group:hover .group-hover\:spr-text-placeholder{color:var(--spr-text-placeholder,#646470)}.group:hover .group-hover\:spr-support-error-text{color:var(--spr-support-error-text,#c70f5c)}.group:hover .group-hover\:spr-support-success-text{color:var(--spr-support-success-text,#6ac96e)}.group:hover .group-hover\:spr-support-warning-text{color:var(--spr-support-warning-text,#f3bf24)}.group:hover .group-hover\:block{display:block}.group:hover .group-hover\:inline-block{display:inline-block}.group:hover .group-hover\:inline{display:inline}.group:hover .group-hover\:flex{display:flex}.group:hover .group-hover\:inline-flex{display:inline-flex}.group:hover .group-hover\:table{display:table}.group:hover .group-hover\:table-caption{display:table-caption}.group:hover .group-hover\:table-cell{display:table-cell}.group:hover .group-hover\:table-column{display:table-column}.group:hover .group-hover\:table-column-group{display:table-column-group}.group:hover .group-hover\:table-footer-group{display:table-footer-group}.group:hover .group-hover\:table-header-group{display:table-header-group}.group:hover .group-hover\:table-row-group{display:table-row-group}.group:hover .group-hover\:table-row{display:table-row}.group:hover .group-hover\:flow-root{display:flow-root}.group:hover .group-hover\:grid{display:grid}.group:hover .group-hover\:inline-grid{display:inline-grid}.group:hover .group-hover\:contents{display:contents}.group:hover .group-hover\:hidden{display:none}.group:hover .group-hover\:visible{visibility:visible}.group:hover .group-hover\:invisible{visibility:hidden}
+.group:hover .group-hover\:opacity-0{opacity:0}.group:hover .group-hover\:opacity-5{opacity:.05}.group:hover .group-hover\:opacity-10{opacity:.1}.group:hover .group-hover\:opacity-15{opacity:.15}.group:hover .group-hover\:opacity-20{opacity:.2}.group:hover .group-hover\:opacity-25{opacity:.25}.group:hover .group-hover\:opacity-30{opacity:.3}.group:hover .group-hover\:opacity-40{opacity:.4}.group:hover .group-hover\:opacity-50{opacity:.5}.group:hover .group-hover\:opacity-60{opacity:.6}.group:hover .group-hover\:opacity-70{opacity:.7}.group:hover .group-hover\:opacity-75{opacity:.75}.group:hover .group-hover\:opacity-80{opacity:.8}.group:hover .group-hover\:opacity-90{opacity:.9}.group:hover .group-hover\:opacity-100{opacity:1}.group:hover .group-hover\:bg-transparent{background-color:transparent}.group:hover .group-hover\:spr-ui-02{background-color:var(--spr-ui-02,#f8f8fa)}.group:hover .group-hover\:spr-ui-04{background-color:var(--spr-ui-04,#1250de)}.group:hover .group-hover\:spr-ui-focus{background-color:var(--spr-ui-focus,rgba(8,40,204,.07))}.group:hover .group-hover\:spr-ui-focus-reverse{background-color:var(--spr-ui-focus-reverse,rgba(255,255,255,.2))}.group:hover .group-hover\:spr-ui-hover{background-color:var(--spr-ui-hover,#f8f8fa)}.group:hover .group-hover\:spr-ui-hover-reverse{background-color:var(--spr-ui-hover-reverse,rgba(255,255,255,.1))}.group:hover .group-hover\:spr-support-error-highlight{background-color:var(--spr-support-error-highlight,rgba(220,38,37,.2))}.group:hover .group-hover\:spr-support-success-highlight{background-color:var(--spr-support-success-highlight,rgba(23,135,64,.2))}.group:hover .group-hover\:spr-support-warning-highlight{background-color:var(--spr-support-warning-highlight,rgba(235,179,5,.2))}.group:hover .group-hover\:spr-bg-success-highlight-2{background-color:var(--spr-bg-success-highlight-2,#87efac)}.group:hover .group-hover\:spr-clr-blue-highlight{background-color:var(--spr-clr-blue-highlight,#e8f0fe)}.group:hover .group-hover\:spr-tag{background-color:var(--spr-tag,#f2f2f4)}.group:hover .group-hover\:spr-tag-01{background-color:var(--spr-tag-01,#e6e6e9)}.group:hover .group-hover\:spr-tag-02{background-color:var(--spr-tag-02,rgba(8,40,204,.07))}.group:hover .group-hover\:spr-field{background-color:var(--spr-field,#dbdbdb)}.group:hover .group-hover\:spr-popup{background-color:var(--spr-popup,#fff)}.group:hover .group-hover\:spr-overlay{background-color:var(--spr-overlay,rgba(10,10,20,.9))}.group:hover .group-hover\:spr-favourite{background-color:var(--spr-favourite,#ff9f21)}.group:hover .group-hover\:spr-notification{background-color:var(--spr-notification,#de336a)}.group:hover .group-hover\:spr-interactive-disable{background-color:var(--spr-interactive-disable,rgba(255,255,255,.6))}.group:hover .group-hover\:spr-interactive-02{background-color:var(--spr-interactive-02,#e3e4e6)}.group:hover .group-hover\:spr-clr-blue{background-color:var(--spr-clr-blue,#2ea2fb)}.group:hover .group-hover\:spr-clr-green{background-color:var(--spr-clr-green,#3c9)}.group:hover .group-hover\:spr-clr-lavender{background-color:var(--spr-clr-lavender,#7f36f6)}.group:hover .group-hover\:spr-clr-orange{background-color:var(--spr-clr-orange,#f08c1a)}.group:hover .group-hover\:spr-clr-pink{background-color:var(--spr-clr-pink,#ffa1be)}.group:hover .group-hover\:spr-clr-red{background-color:var(--spr-clr-red,#e1245e)}.group:hover .group-hover\:spr-clr-sea{background-color:var(--spr-clr-sea,#16aad2)}.group:hover .group-hover\:spr-clr-teal{background-color:var(--spr-clr-teal,#13c18d)}.group:hover .group-hover\:spr-clr-yellow{background-color:var(--spr-clr-yellow,#ecad00)}.group:hover .group-hover\:spr-clr-grey{background-color:var(--spr-clr-grey,#d7d7dc)}.group:hover .group-hover\:spr-clr-purple{background-color:var(--spr-clr-purple,#8c43ff)}.group:hover .group-hover\:spr-clr-lt-yellow{background-color:var(--spr-clr-lt-yellow,#ffd04f)}.group:hover .group-hover\:spr-clr-darker-blue{background-color:var(--spr-clr-darker-blue,#327afd)}.group:hover .group-hover\:spr-secondary-yellow{background-color:var(--spr-secondary-yellow,#ffc312)}.group:hover .group-hover\:spr-secondary-green{background-color:var(--spr-secondary-green,#a3cb38)}.group:hover .group-hover\:spr-secondary-teal{background-color:var(--spr-secondary-teal,#12cbc4)}.group:hover .group-hover\:spr-secondary-lt-pink{background-color:var(--spr-secondary-lt-pink,#fda7df)}.group:hover .group-hover\:spr-secondary-pink{background-color:var(--spr-secondary-pink,#ed4c67)}.group:hover .group-hover\:spr-secondary-maroon{background-color:var(--spr-secondary-maroon,#b53471)}.group:hover .group-hover\:spr-secondary-orange{background-color:var(--spr-secondary-orange,#f48749)}.group:hover .group-hover\:spr-clr-magenta{background-color:var(--spr-clr-magenta,#cb1cce)}.group:hover .group-hover\:spr-clr-fuschia{background-color:var(--spr-clr-fuschia,#a70fdc)}.group:hover .group-hover\:spr-clr-violet{background-color:var(--spr-clr-violet,#8e43ff)}.group:hover .group-hover\:spr-clr-lt-violet{background-color:var(--spr-clr-lt-violet,#e4dff2)}.group:hover .group-hover\:spr-text-disable{color:var(--spr-text-disable,rgba(28,28,31,.33))}.group:hover .group-hover\:spr-text-magenta{color:var(--spr-text-magenta,#cb1cce)}.group:hover .group-hover\:spr-bg-primary{background-color:var(--spr-bg-primary,#fff)}.group:hover .group-hover\:spr-bg-secondary{background-color:var(--spr-bg-secondary,#ecedee)}.group:hover .group-hover\:spr-bg-tertiary{background-color:var(--spr-bg-tertiary,#e3e4e6)}.group:hover .group-hover\:spr-bg-quaternary{background-color:var(--spr-bg-quaternary,#f5f6f7)}.group:hover .group-hover\:spr-bg-quinary{background-color:var(--spr-bg-quinary,#d8d9db)}.group:hover .group-hover\:spr-bg-inverse{background-color:var(--spr-bg-inverse,#1e2022)}.group:hover .group-hover\:spr-bg-error{background-color:var(--spr-bg-error,#dc2625)}.group:hover .group-hover\:spr-bg-error-highlight{background-color:var(--spr-bg-error-highlight,#fee2e1)}.group:hover .group-hover\:spr-bg-success{background-color:var(--spr-bg-success,#15823d)}.group:hover .group-hover\:spr-bg-success-highlight{background-color:var(--spr-bg-success-highlight,#dcfce7)}.group:hover .group-hover\:spr-bg-warning{background-color:var(--spr-bg-warning,#ebb305)}.group:hover .group-hover\:spr-bg-warning-highlight{background-color:var(--spr-bg-warning-highlight,#fef9c3)}.group:hover .group-hover\:spr-bg-neutral{background-color:var(--spr-bg-neutral,#94969a)}.group:hover .group-hover\:spr-bg-overlay{background-color:var(--spr-bg-overlay,rgba(18,18,20,.66))}.group:hover .group-hover\:spr-bg-white{background-color:var(--spr-bg-white,#fff)}.group:hover .group-hover\:spr-highlight{background-color:var(--spr-highlight,#fef9c3)}.group:hover .group-hover\:spr-interactive{background-color:var(--spr-interactive,#1250de)}.group:hover .group-hover\:spr-interactive-hover{background-color:var(--spr-interactive-hover,#1640b1)}.group:hover .group-hover\:spr-link{color:var(--spr-link,#1250de)}.group:hover .group-hover\:spr-text-primary{color:var(--spr-text-primary,#1e2022)}.group:hover .group-hover\:spr-text-secondary{color:var(--spr-text-secondary,#252627)}.group:hover .group-hover\:spr-text-tertiary{color:var(--spr-text-tertiary,#525457)}.group:hover .group-hover\:spr-text-placeholder{color:var(--spr-text-placeholder,#757575)}.group:hover .group-hover\:spr-text-white{color:var(--spr-text-white,#fff)}.group:hover .group-hover\:spr-text-inverse{color:var(--spr-text-inverse,#fff)}.group:hover .group-hover\:spr-text-error{color:var(--spr-text-error,#dc2625)}.group:hover .group-hover\:spr-text-success{color:var(--spr-text-success,#15823d)}.group:hover .group-hover\:spr-text-warning{color:var(--spr-text-warning,#ebb305)}.group:hover .group-hover\:spr-ui-01{background-color:var(--spr-ui-01,#fff)}.group:hover .group-hover\:spr-ui-05{background-color:var(--spr-ui-05,#ecedee)}.group:hover .group-hover\:spr-ui-03{background-color:var(--spr-ui-03,#e3e4e6)}.group:hover .group-hover\:spr-ui-06{background-color:var(--spr-ui-06,#d8d9db)}.group:hover .group-hover\:spr-tooltip-01{background-color:var(--spr-tooltip-01,#1e2022)}.group:hover .group-hover\:spr-support-error{background-color:var(--spr-support-error,#dc2625)}.group:hover .group-hover\:spr-support-success{background-color:var(--spr-support-success,#15823d)}.group:hover .group-hover\:spr-support-warning{background-color:var(--spr-support-warning,#ebb305)}.group:hover .group-hover\:spr-interactive-01{background-color:var(--spr-interactive-01,#1250de)}.group:hover .group-hover\:spr-text-04{color:var(--spr-text-04,#1250de)}.group:hover .group-hover\:spr-text-link-active{color:var(--spr-text-link-active,#1250de)}.group:hover .group-hover\:spr-text-01{color:var(--spr-text-01,#1e2022)}.group:hover .group-hover\:spr-text-02{color:var(--spr-text-02,#252627)}.group:hover .group-hover\:spr-text-03{color:var(--spr-text-03,#525457)}.group:hover .group-hover\:spr-text-05{color:var(--spr-text-05,#fff)}.group:hover .group-hover\:spr-text-06{color:var(--spr-text-06,#fff)}.group:hover .group-hover\:spr-support-error-text{color:var(--spr-support-error-text,#dc2625)}.group:hover .group-hover\:spr-support-success-text{color:var(--spr-support-success-text,#15823d)}.group:hover .group-hover\:spr-support-warning-text{color:var(--spr-support-warning-text,#ebb305)}.group:hover .group-hover\:block{display:block}.group:hover .group-hover\:inline-block{display:inline-block}.group:hover .group-hover\:inline{display:inline}.group:hover .group-hover\:flex{display:flex}.group:hover .group-hover\:inline-flex{display:inline-flex}.group:hover .group-hover\:table{display:table}.group:hover .group-hover\:table-caption{display:table-caption}.group:hover .group-hover\:table-cell{display:table-cell}.group:hover .group-hover\:table-column{display:table-column}.group:hover .group-hover\:table-column-group{display:table-column-group}.group:hover .group-hover\:table-footer-group{display:table-footer-group}.group:hover .group-hover\:table-header-group{display:table-header-group}.group:hover .group-hover\:table-row-group{display:table-row-group}.group:hover .group-hover\:table-row{display:table-row}.group:hover .group-hover\:flow-root{display:flow-root}.group:hover .group-hover\:grid{display:grid}.group:hover .group-hover\:inline-grid{display:inline-grid}.group:hover .group-hover\:contents{display:contents}.group:hover .group-hover\:hidden{display:none}.group:hover .group-hover\:visible{visibility:visible}.group:hover .group-hover\:invisible{visibility:hidden}

package/space/dark/index.js

@@ -1,8 +0,0 @@
-"use strict";
-exports.__esModule = true;
-var theme_1 = require("./theme");
-var utilities_1 = require("./utilities");
-exports["default"] = {
-    theme: theme_1["default"],
-    classes: utilities_1["default"]
-};