@superdispatch/ui-lab 0.23.4 → 0.24.0

package/dist-node/index.js

@@ -22,14 +22,14 @@ var Dropzone = _interopDefault(require('react-dropzone'));
 var reactAnchorme = require('react-anchorme');
 var lodash = require('lodash');
 
-function colorMixin(textColor, backgroundColor, buttonHoverColor) {
-  return styled.css(["color:", ";background-color:", ";& .MuiAlert-icon{color:", ";}& .MuiAlert-action{& .MuiIconButton-root{&:hover,&:active{color:", ";}}}"], textColor, backgroundColor, textColor, buttonHoverColor);
+function colorMixin(textColor, iconColor, backgroundColor, buttonHoverColor) {
+  return styled.css(["color:", ";border-color:", ";background-color:", ";& .MuiAlert-icon{color:", ";}& .MuiAlert-action{color:", ";& .MuiIconButton-root{&:hover,&:active{color:", ";}}}"], textColor, textColor, backgroundColor, iconColor, iconColor, buttonHoverColor);
 }
 
 var StyledAlert = /*#__PURE__*/styled__default(lab.Alert).withConfig({
   displayName: "Alert__StyledAlert",
   componentId: "SD__sc-1j6qebb-0"
-})(["&.MuiAlert-outlinedSuccess{", ";}&.MuiAlert-outlinedInfo{", ";}&.MuiAlert-outlinedWarning{", ";}&.MuiAlert-outlinedError{", ";}& .MuiAlert-icon{opacity:1;padding:8px 0;font-size:24px;}& .MuiAlert-action{display:block;padding-top:5px;margin-right:-3px;& .MuiIconButton-root{& .MuiSvgIcon-root{font-size:24px;}}}"], /*#__PURE__*/colorMixin(ui.Color.Green500, ui.Color.Green50, ui.Color.Green400), /*#__PURE__*/colorMixin(ui.Color.Blue500, ui.Color.Blue50, ui.Color.Blue400), /*#__PURE__*/colorMixin(ui.Color.Yellow500, ui.Color.Yellow50, ui.Color.Yellow400), /*#__PURE__*/colorMixin(ui.Color.Red500, ui.Color.Red50, ui.Color.Red400));
+})(["&.MuiAlert-outlinedSuccess{", ";}&.MuiAlert-outlinedInfo{", ";}&.MuiAlert-outlinedWarning{", ";}&.MuiAlert-outlinedError{", ";}& .MuiAlert-icon{opacity:1;padding:8px 0;font-size:24px;}& .MuiAlert-action{display:block;padding-top:5px;margin-right:-3px;& .MuiIconButton-root{& .MuiSvgIcon-root{font-size:24px;}}}"], /*#__PURE__*/colorMixin(ui.Color.Green500, ui.Color.Green300, ui.Color.Green50, ui.Color.Green400), /*#__PURE__*/colorMixin(ui.Color.Blue500, ui.Color.Blue300, ui.Color.Blue50, ui.Color.Blue400), /*#__PURE__*/colorMixin(ui.Color.Yellow500, ui.Color.Yellow300, ui.Color.Yellow50, ui.Color.Yellow400), /*#__PURE__*/colorMixin(ui.Color.Red500, ui.Color.Red300, ui.Color.Red50, ui.Color.Red400));
 
 function toMaterialSeverity(severity) {
   return severity === 'info' ? 'info' : severity === 'caution' ? 'warning' : severity === 'critical' ? 'error' : 'success';
@@ -38,7 +38,8 @@ function toMaterialSeverity(severity) {
 var iconMapping = {
   success: /*#__PURE__*/jsxRuntime.jsx(icons.CheckCircle, {}),
   info: /*#__PURE__*/jsxRuntime.jsx(icons.Info, {}),
-  error: /*#__PURE__*/jsxRuntime.jsx(icons.Error, {})
+  error: /*#__PURE__*/jsxRuntime.jsx(icons.Error, {}),
+  warning: /*#__PURE__*/jsxRuntime.jsx(icons.Warning, {})
 };
 var Alert = /*#__PURE__*/react.forwardRef((_ref, ref) => {
   var {
@@ -684,7 +685,7 @@ var _excluded$4 = ["variant", "as", "align", "color", "display", "noWrap", "wrap
 var normalizeTextColor = /*#__PURE__*/createRuleNormalizer({
   inherit: 'inherit',
   primary: ui.Color.Dark500,
-  secondary: ui.Color.Dark200,
+  secondary: ui.Color.Dark300,
   white: ui.Color.White,
   blue: ui.Color.Blue300,
   green: ui.Color.Green300,
@@ -863,6 +864,33 @@ var DescriptionItem = /*#__PURE__*/react.forwardRef((_ref2, ref) => {
 });
 if (process.env.NODE_ENV !== "production") DescriptionItem.displayName = "DescriptionItem";
 
+var DottedLine = /*#__PURE__*/styled__default.div.withConfig({
+  displayName: "DescriptionLineItem__DottedLine",
+  componentId: "SD__sc-1ixx5h8-0"
+})(["border-bottom:1px dotted ", ";margin:0px 8px;height:7px;"], ui.Color.Silver400);
+var DescriptionLineItem = /*#__PURE__*/react.forwardRef((_ref, ref) => {
+  var {
+    title,
+    children
+  } = _ref;
+  return /*#__PURE__*/jsxRuntime.jsxs(ui.Columns, {
+    ref: ref,
+    align: "center",
+    children: [/*#__PURE__*/jsxRuntime.jsx(ui.Column, {
+      width: "content",
+      children: title
+    }), /*#__PURE__*/jsxRuntime.jsx(ui.Column, {
+      width: "fluid",
+      children: /*#__PURE__*/jsxRuntime.jsx(DottedLine, {})
+    }), /*#__PURE__*/jsxRuntime.jsx(ui.Column, {
+      width: "content",
+      children: children
+    })]
+  });
+});
+if (process.env.NODE_ENV !== "production") DescriptionLineItem.displayName = "DescriptionLineItem";
+DescriptionLineItem.displayName = 'DescriptionLineItem';
+
 var _excluded$5 = ["disabled", "children", "hintText", "startIcon", "fallback", "accept", "maxSize", "maxFiles", "onDropRejected", "onDropAccepted"];
 function toBytes(input, unit) {
   if (unit === 'gb') return input * (1 << 30);
@@ -2197,6 +2225,8 @@ exports.Chat = Chat;
 exports.ChatMessage = ChatMessage;
 exports.Container = Container;
 exports.DescriptionItem = DescriptionItem;
+exports.DescriptionLineItem = DescriptionLineItem;
+exports.DottedLine = DottedLine;
 exports.FileDropZone = FileDropZone;
 exports.FileListItem = FileListItem;
 exports.LinkedText = LinkedText;