@superdispatch/ui 0.24.1 → 0.24.3

package/dist-node/index.js

@@ -491,6 +491,7 @@ if (process.env.NODE_ENV !== "production") AdaptiveVerticalToolbar.displayName =
   Color["Yellow100"] = "#FFE494";
   Color["Yellow200"] = "#FFDC6B";
   Color["Yellow400"] = "#FFA91F";
+  Color["Dark50"] = "rgba(25, 35, 52, 0.5)";
   Color["Dark100"] = "#8F949E";
   Color["Dark300"] = "#5B6371";
   Color["Dark500"] = "#192334";
@@ -536,7 +537,7 @@ var useStyles$2 = /*#__PURE__*/styles.makeStyles(theme => {
       '&:not([disabled])[aria-busy="false"]': {
         '&:hover, &:focus': {
           '&$withIcon > $overlay': {
-            backgroundColor: exports.Color.Black50,
+            backgroundColor: exports.Color.Dark50,
             '& > svg': {
               opacity: 1
             }
@@ -573,6 +574,7 @@ var useStyles$2 = /*#__PURE__*/styles.makeStyles(theme => {
       top: 0,
       left: 0,
       position: 'absolute',
+      color: exports.Color.Blue500,
       fontSize: theme.spacing(5),
       [sm]: {
         fontSize: theme.spacing(4)
@@ -694,15 +696,15 @@ var useStyles$3 = /*#__PURE__*/styles.makeStyles(theme => ({
     backgroundColor: exports.Color.Silver100
   },
   error: {
-    color: exports.Color.Red300,
-    borderColor: exports.Color.Red300,
+    color: exports.Color.Red500,
+    borderColor: exports.Color.Red500,
     backgroundColor: exports.Color.Red50,
     '&:focus': {
       backgroundColor: exports.Color.Red75
     }
   },
   primary: {
-    color: exports.Color.Blue300,
+    color: exports.Color.Blue500,
     borderColor: exports.Color.Silver500,
     '&:focus': {
       backgroundColor: exports.Color.Blue50
@@ -769,11 +771,14 @@ var CardButton = /*#__PURE__*/React.forwardRef((_ref, ref) => {
       'small': styles.sizeSmall,
       'large': styles.sizeLarge
     }[size]),
-    children: error ? /*#__PURE__*/jsxRuntime.jsx(core.Typography, {
+    children: error ? /*#__PURE__*/jsxRuntime.jsxs(core.Typography, {
       variant: "h4",
       color: "inherit",
       className: styles.label,
-      children: error
+      children: [!!startIcon && /*#__PURE__*/jsxRuntime.jsx("span", {
+        className: clsx(styles.icon, styles.startIcon),
+        children: startIcon
+      }), error]
     }) : /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
       children: [/*#__PURE__*/jsxRuntime.jsxs(core.Typography, {
         variant: "h4",
@@ -788,6 +793,7 @@ var CardButton = /*#__PURE__*/React.forwardRef((_ref, ref) => {
         })]
       }), !!hint && /*#__PURE__*/jsxRuntime.jsx(core.Typography, {
         color: "textSecondary",
+        variant: "caption",
         className: styles.hint,
         children: hint
       })]
@@ -3031,7 +3037,7 @@ function line(color) {
 
 function overrideLink(theme) {
   theme.props.MuiLink = {
-    underline: 'none',
+    underline: 'always',
     color: 'textPrimary'
   };
   theme.overrides.MuiLink = {
@@ -3043,30 +3049,45 @@ function overrideLink(theme) {
       '&:focus': {
         outline: 'none'
       },
-      '&:hover, &:active': {
-        backgroundImage: line('currentColor')
-      },
-      '&.MuiTypography-colorTextPrimary': {
+      '&:disabled': {
+        color: exports.Color.Dark100,
         backgroundImage: line(exports.Color.Silver500),
         '&:focus, &:hover, &:active': {
-          color: exports.Color.Blue500,
-          backgroundImage: line(exports.Color.Blue500)
+          color: exports.Color.Dark100,
+          backgroundImage: line(exports.Color.Silver500)
         }
       },
-      '&.MuiTypography-colorError': {
-        color: exports.Color.Red500,
+      '&.MuiLink-underlineAlways': {
+        textDecoration: 'none',
         backgroundImage: line(exports.Color.Silver500),
+        '&:hover, &:active': {
+          backgroundImage: line('currentColor')
+        }
+      },
+      '&.MuiLink-underlineHover': {
+        backgroundImage: 'none',
+        '&:hover, &:active': {
+          textDecoration: 'none',
+          backgroundImage: line('currentColor')
+        }
+      },
+      '&.MuiLink-underlineNone': {
+        backgroundImage: 'none',
         '&:focus, &:hover, &:active': {
-          color: exports.Color.Red500,
-          backgroundImage: line(exports.Color.Red500)
+          backgroundImage: 'none'
         }
       },
-      '&.MuiTypography-colorTextSecondary': {
-        color: exports.Color.Dark100,
-        backgroundImage: line(exports.Color.Silver500),
+      '&.MuiTypography-colorPrimary': {
+        backgroundImage: 'none',
+        '&:hover, &:active': {
+          textDecoration: 'none',
+          backgroundImage: line('currentColor')
+        }
+      },
+      '&.MuiTypography-colorTextPrimary, &.MuiTypography-colorTextSecondary': {
         '&:focus, &:hover, &:active': {
-          color: exports.Color.Dark100,
-          backgroundImage: line(exports.Color.Silver500)
+          color: exports.Color.Blue500,
+          backgroundImage: line(exports.Color.Blue500)
         }
       }
     },
@@ -3415,7 +3436,10 @@ function overrideTextField(theme) {
   };
   theme.overrides.MuiFormLabel = {
     root: _objectSpread(_objectSpread({}, theme.typography.body2), {}, {
-      color: exports.Color.Dark400,
+      color: exports.Color.Dark500,
+      '&.MuiFormLabel-root': {
+        fontSize: theme.spacing(1.75)
+      },
       '&$error': {
         color: undefined
       },
@@ -3430,11 +3454,37 @@ function overrideTextField(theme) {
   theme.overrides.MuiInputBase = {
     root: _objectSpread(_objectSpread({}, theme.typography.body2), {}, {
       '&$disabled': {
-        backgroundColor: exports.Color.Silver100
+        backgroundColor: exports.Color.Silver30
+      },
+      '&$error': {
+        borderColor: exports.Color.Red500
+      },
+      '&.MuiOutlinedInput-root': {
+        '& fieldset': {
+          borderColor: exports.Color.Silver500
+        },
+        '&:hover fieldset': {
+          borderColor: exports.Color.Dark100
+        },
+        '&.Mui-focused fieldset': {
+          borderColor: exports.Color.Blue500
+        },
+        '&.Mui-error fieldset': {
+          borderColor: exports.Color.Red500
+        },
+        '&.Mui-error:hover fieldset': {
+          borderColor: exports.Color.Red500
+        },
+        '&.Mui-disabled fieldset': {
+          borderColor: exports.Color.Silver400
+        }
       }
     }),
     input: {
       textOverflow: 'ellipsis',
+      '&.MuiInputBase-input': {
+        fontSize: theme.spacing(1.75)
+      },
       height: theme.spacing(3),
       [sm]: {
         height: theme.spacing(2.5)
@@ -3568,7 +3618,14 @@ function overrideTextField(theme) {
   };
   theme.overrides.MuiFormHelperText = {
     root: _objectSpread(_objectSpread({}, theme.typography.body2), {}, {
-      marginTop: theme.spacing(0.5)
+      color: exports.Color.Dark300,
+      marginTop: theme.spacing(0.5),
+      '&.Mui-error': {
+        color: exports.Color.Red500
+      },
+      '&.MuiFormHelperText-root': {
+        fontSize: theme.spacing(1.75)
+      }
     }),
     contained: {
       marginLeft: undefined,
@@ -3757,7 +3814,7 @@ function createSuperDispatchTheme() {
       },
       text: {
         primary: exports.Color.Dark500,
-        secondary: exports.Color.Dark200,
+        secondary: exports.Color.Dark300,
         hint: exports.Color.Dark100,
         disabled: exports.Color.Dark100
       },