@xqmsg/ui-core 0.21.7 → 0.22.0

package/dist/ui-core.cjs.development.js

@@ -307,7 +307,8 @@ var label = {
 };
 var border = {
   focus: '#3A6CD980',
-  "default": '#9999991A'
+  "default": '#D9D9D9',
+  light: '#99999919A'
 };
 var blur = {
   quaternary: {
@@ -476,6 +477,121 @@ var Breadcrumbs = function Breadcrumbs(_ref) {
   }));
 };
 
+var typography = {
+  letterSpacings: {
+    tighter: '-0.05em',
+    tight: '-0.025em',
+    normal: '0',
+    wide: '0.025em',
+    wider: '0.05em',
+    widest: '0.1em'
+  },
+  lineHeights: {
+    normal: 'normal',
+    none: 1,
+    shorter: 1.25,
+    "short": 1.375,
+    base: 1.5,
+    tall: 1.625,
+    taller: '2',
+    '3': '.75rem',
+    '4': '1rem',
+    '5': '1.25rem',
+    '6': '1.5rem',
+    '7': '1.75rem',
+    '8': '2rem',
+    '9': '2.25rem',
+    '10': '2.5rem'
+  },
+  fontWeights: {
+    hairline: 100,
+    thin: 200,
+    light: 300,
+    normal: 400,
+    medium: 500,
+    semibold: 600,
+    bold: 700,
+    extrabold: 800,
+    black: 900
+  },
+  fonts: {
+    base: "proxima-nova, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"",
+    mono: "SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace"
+  },
+  fontSizes: {
+    xs: '0.75rem',
+    sm: '0.875rem',
+    md: '1rem',
+    lg: '1.125rem',
+    xl: '1.25rem',
+    '2xl': '1.5rem',
+    '3xl': '1.875rem',
+    '4xl': '2.25rem',
+    '5xl': '3rem',
+    '6xl': '4rem'
+  }
+};
+
+/**
+ * A functional React component utilized to render the `Card` component
+ */
+var Card = function Card(_ref) {
+  var title = _ref.title,
+    leftIcon = _ref.leftIcon,
+    children = _ref.children,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? 'auto' : _ref$height;
+  return /*#__PURE__*/React__default.createElement(react.Box, {
+    bg: colors.fill.light.quaternary,
+    borderRadius: "4px",
+    border: ".5px solid " + colors.border["default"],
+    py: "8px",
+    px: "8px",
+    height: height,
+    overflowY: "auto",
+    width: "206px",
+    _notLast: {
+      marginBottom: '8px'
+    }
+  }, title && /*#__PURE__*/React__default.createElement(react.Flex, {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "start",
+    textDecoration: "none",
+    _hover: {
+      textDecoration: 'none'
+    },
+    mb: "8px"
+  }, /*#__PURE__*/React__default.createElement(react.Flex, {
+    alignItems: "center"
+  }, /*#__PURE__*/React__default.createElement(react.Box, {
+    mr: "4px"
+  }, leftIcon), /*#__PURE__*/React__default.createElement(react.Text, {
+    color: colors.label.primary.light,
+    fontSize: typography.fontSizes.sm,
+    fontWeight: typography.fontWeights.medium
+  }, title))), React.Children.map(children, function (child) {
+    if (! /*#__PURE__*/React__default.isValidElement(child)) {
+      return;
+    }
+    if (child.type !== Button) {
+      return /*#__PURE__*/React__default.createElement(react.Text, {
+        as: "div",
+        _notLast: {
+          marginBottom: '8px'
+        },
+        color: colors.label.primary.light,
+        fontSize: typography.fontSizes.xs,
+        fontWeight: typography.fontWeights.normal
+      }, child);
+    } else {
+      return /*#__PURE__*/React__default.createElement(react.Box, {
+        mt: "8px"
+      }, child);
+    }
+  }));
+};
+
 var _path$4, _path2, _path3, _path4;
 function _extends$4() { _extends$4 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$4.apply(this, arguments); }
 var SvgGoogle = function SvgGoogle(props, ref) {
@@ -675,6 +791,9 @@ function _extends$6() {
   };
   return _extends$6.apply(this, arguments);
 }
+function _objectDestructuringEmpty(obj) {
+  if (obj == null) throw new TypeError("Cannot destructure " + obj);
+}
 function _objectWithoutPropertiesLoose(source, excluded) {
   if (source == null) return {};
   var target = {};
@@ -1052,7 +1171,7 @@ var StackedSelect = /*#__PURE__*/React__default.forwardRef(function (_ref2, _ref
  * A functional React component utilized to render the `StackedTextarea` component.
  */
 var StackedTextarea = /*#__PURE__*/React__default.forwardRef(function (_ref2, _ref) {
-  var props = _extends$6({}, _ref2);
+  var props = _extends$6({}, (_objectDestructuringEmpty(_ref2), _ref2));
   return /*#__PURE__*/React__default.createElement(react.Textarea, Object.assign({
     ref: _ref
   }, props, {
@@ -1333,7 +1452,7 @@ var StackedMultiSelect = /*#__PURE__*/React__default.forwardRef(function (_ref2,
   }, /*#__PURE__*/React__default.createElement(react.Flex, {
     fontSize: "13px",
     h: "26px",
-    border: isFocussed ? '2px solid' : '1px solid',
+    border: isFocussed ? '2px solid' : '.5px solid',
     borderColor: isFocussed ? colors.border.focus : colors.border["default"],
     py: "5px",
     pl: "8px",
@@ -1557,7 +1676,7 @@ var StackedPilledInput = /*#__PURE__*/React__default.forwardRef(function (_ref2,
     position: "relative"
   }, /*#__PURE__*/React__default.createElement(react.Flex, {
     fontSize: "13px",
-    border: isFocussed ? '2px solid' : '1px solid',
+    border: isFocussed ? '2px solid' : '.5px solid',
     borderColor: isFocussed ? colors.border.focus : colors.border["default"],
     pl: "8px",
     borderRadius: "4px",
@@ -2137,103 +2256,171 @@ var SvgFolderFill = function SvgFolderFill(props, ref) {
 var ForwardRef$e = /*#__PURE__*/React.forwardRef(SvgFolderFill);
 var Memo$e = /*#__PURE__*/React.memo(ForwardRef$e);
 
+var _defs$1, _path$f, _path2$2;
+function _extends$g() { _extends$g = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$g.apply(this, arguments); }
+var SvgFolderFillGradient = function SvgFolderFillGradient(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$g({
+    id: "Layer_1",
+    "data-name": "Layer 1",
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 102.4 89.6",
+    ref: ref
+  }, props), _defs$1 || (_defs$1 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
+    id: "linear-gradient",
+    x1: 67.42,
+    y1: 97.14,
+    x2: 14.33,
+    y2: 13.53,
+    gradientTransform: "matrix(1 0 0 -1 0 91.6)",
+    gradientUnits: "userSpaceOnUse"
+  }, /*#__PURE__*/React.createElement("stop", {
+    offset: 0,
+    stopColor: "#ff81e2"
+  }), /*#__PURE__*/React.createElement("stop", {
+    offset: 1,
+    stopColor: "#0082ff"
+  })), /*#__PURE__*/React.createElement("linearGradient", {
+    id: "linear-gradient-2",
+    x1: 87.33,
+    y1: 84.5,
+    x2: 34.24,
+    y2: 0.89,
+    gradientTransform: "matrix(1 0 0 -1 0 91.6)",
+    gradientUnits: "userSpaceOnUse"
+  }, /*#__PURE__*/React.createElement("stop", {
+    offset: 0,
+    stopColor: "#ff81e2"
+  }), /*#__PURE__*/React.createElement("stop", {
+    offset: 1,
+    stopColor: "#0082ff"
+  })), /*#__PURE__*/React.createElement("style", null, ".cls-3{fill:#fff}"))), _path$f || (_path$f = /*#__PURE__*/React.createElement("path", {
+    className: "cls-3",
+    d: "M11.2 0C5.01 0 0 5.01 0 11.2v20.87C3.23 30 7.08 28.8 11.2 28.8h80c4.12 0 7.97 1.2 11.2 3.27V24c0-6.19-5.01-11.2-11.2-11.2H60.25c-.42 0-.83-.17-1.13-.47l-9.05-9.05C47.97 1.18 45.12 0 42.15 0H11.2Z"
+  })), /*#__PURE__*/React.createElement("path", {
+    d: "M11.2 0C5.01 0 0 5.01 0 11.2v20.87C3.23 30 7.08 28.8 11.2 28.8h80c4.12 0 7.97 1.2 11.2 3.27V24c0-6.19-5.01-11.2-11.2-11.2H60.25c-.42 0-.83-.17-1.13-.47l-9.05-9.05C47.97 1.18 45.12 0 42.15 0H11.2Z",
+    style: {
+      fill: "url(#linear-gradient)",
+      fillOpacity: 0.8
+    }
+  }), _path2$2 || (_path2$2 = /*#__PURE__*/React.createElement("path", {
+    className: "cls-3",
+    d: "M11.2 38.4C5.01 38.4 0 43.41 0 49.6v28.8c0 6.19 5.01 11.2 11.2 11.2h80c6.19 0 11.2-5.01 11.2-11.2V49.6c0-6.19-5.01-11.2-11.2-11.2h-80Z"
+  })), /*#__PURE__*/React.createElement("path", {
+    d: "M11.2 38.4C5.01 38.4 0 43.41 0 49.6v28.8c0 6.19 5.01 11.2 11.2 11.2h80c6.19 0 11.2-5.01 11.2-11.2V49.6c0-6.19-5.01-11.2-11.2-11.2h-80Z",
+    style: {
+      fillOpacity: 0.8,
+      fill: "url(#linear-gradient-2)"
+    }
+  }));
+};
+var ForwardRef$f = /*#__PURE__*/React.forwardRef(SvgFolderFillGradient);
+var Memo$f = /*#__PURE__*/React.memo(ForwardRef$f);
+
 /**
  * A functional React component utilized to render the `FolderFill` icon component
  */
 var FolderFill = function FolderFill(_ref) {
-  var boxSize = _ref.boxSize;
+  var boxSize = _ref.boxSize,
+    _ref$gradient = _ref.gradient,
+    gradient = _ref$gradient === void 0 ? false : _ref$gradient;
+  if (gradient) {
+    return /*#__PURE__*/React__default.createElement(Memo$f, {
+      width: boxSize,
+      height: boxSize
+    });
+  }
   return /*#__PURE__*/React__default.createElement(Memo$e, {
     width: boxSize,
     height: boxSize
   });
 };
 
-var _path$f;
-function _extends$g() { _extends$g = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$g.apply(this, arguments); }
+var _path$g;
+function _extends$h() { _extends$h = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$h.apply(this, arguments); }
 var SvgFolderOutline = function SvgFolderOutline(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$g({
+  return /*#__PURE__*/React.createElement("svg", _extends$h({
     width: 14,
     height: 12,
     viewBox: "0 0 14 12",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ref: ref
-  }, props), _path$f || (_path$f = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$g || (_path$g = /*#__PURE__*/React.createElement("path", {
     d: "M1 6.538v-.461c0-.765.62-1.385 1.385-1.385h9.23c.765 0 1.385.62 1.385 1.385v.461M7.653 2.576 6.347 1.27A.923.923 0 0 0 5.695 1h-3.31C1.62 1 1 1.62 1 2.385v7.384c0 .765.62 1.385 1.385 1.385h9.23c.765 0 1.385-.62 1.385-1.385V4.231c0-.765-.62-1.385-1.385-1.385h-3.31a.923.923 0 0 1-.652-.27Z",
     stroke: "#0082ff",
     strokeLinecap: "round",
     strokeLinejoin: "round"
   })));
 };
-var ForwardRef$f = /*#__PURE__*/React.forwardRef(SvgFolderOutline);
-var Memo$f = /*#__PURE__*/React.memo(ForwardRef$f);
+var ForwardRef$g = /*#__PURE__*/React.forwardRef(SvgFolderOutline);
+var Memo$g = /*#__PURE__*/React.memo(ForwardRef$g);
 
 /**
  * A functional React component utilized to render the `FolderOutline` icon component
  */
 var FolderOutline = function FolderOutline(_ref) {
   var boxSize = _ref.boxSize;
-  return /*#__PURE__*/React__default.createElement(Memo$f, {
+  return /*#__PURE__*/React__default.createElement(Memo$g, {
     boxSize: boxSize
   });
 };
 
-var _path$g;
-function _extends$h() { _extends$h = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$h.apply(this, arguments); }
+var _path$h;
+function _extends$i() { _extends$i = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$i.apply(this, arguments); }
 var SvgFolderAddFill = function SvgFolderAddFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$h({
+  return /*#__PURE__*/React.createElement("svg", _extends$i({
     width: 16,
     height: 16,
     viewBox: "0 0 16 16",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ref: ref
-  }, props), _path$g || (_path$g = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$h || (_path$h = /*#__PURE__*/React.createElement("path", {
     d: "M8 7v4m2-2H6m2.707-4.793L7.293 2.793a1 1 0 0 0-.707-.293H3A1.5 1.5 0 0 0 1.5 4v8A1.5 1.5 0 0 0 3 13.5h10a1.5 1.5 0 0 0 1.5-1.5V6A1.5 1.5 0 0 0 13 4.5H9.414a1 1 0 0 1-.707-.293Z",
     stroke: "#fff",
     strokeLinecap: "round",
     strokeLinejoin: "round"
   })));
 };
-var ForwardRef$g = /*#__PURE__*/React.forwardRef(SvgFolderAddFill);
-var Memo$g = /*#__PURE__*/React.memo(ForwardRef$g);
+var ForwardRef$h = /*#__PURE__*/React.forwardRef(SvgFolderAddFill);
+var Memo$h = /*#__PURE__*/React.memo(ForwardRef$h);
 
 /**
  * A functional React component utilized to render the `FolderAddFill` icon component
  */
 var FolderAddFill = function FolderAddFill(_ref) {
   var boxSize = _ref.boxSize;
-  return /*#__PURE__*/React__default.createElement(Memo$g, {
+  return /*#__PURE__*/React__default.createElement(Memo$h, {
     boxSize: boxSize
   });
 };
 
-var _path$h;
-function _extends$i() { _extends$i = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$i.apply(this, arguments); }
+var _path$i;
+function _extends$j() { _extends$j = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$j.apply(this, arguments); }
 var SvgFolderAddOutline = function SvgFolderAddOutline(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$i({
+  return /*#__PURE__*/React.createElement("svg", _extends$j({
     width: 14,
     height: 12,
     viewBox: "0 0 14 12",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ref: ref
-  }, props), _path$h || (_path$h = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$i || (_path$i = /*#__PURE__*/React.createElement("path", {
     d: "M7 5v4m2-2H5m2.707-4.793L6.293.793A1 1 0 0 0 5.586.5H2A1.5 1.5 0 0 0 .5 2v8A1.5 1.5 0 0 0 2 11.5h10a1.5 1.5 0 0 0 1.5-1.5V4A1.5 1.5 0 0 0 12 2.5H8.414a1 1 0 0 1-.707-.293Z",
     stroke: "#3C3C4399",
     strokeLinecap: "round",
     strokeLinejoin: "round"
   })));
 };
-var ForwardRef$h = /*#__PURE__*/React.forwardRef(SvgFolderAddOutline);
-var Memo$h = /*#__PURE__*/React.memo(ForwardRef$h);
+var ForwardRef$i = /*#__PURE__*/React.forwardRef(SvgFolderAddOutline);
+var Memo$i = /*#__PURE__*/React.memo(ForwardRef$i);
 
 /**
  * A functional React component utilized to render the `FolderAddOutline` icon component
  */
 var FolderAddOutline = function FolderAddOutline(_ref) {
   var boxSize = _ref.boxSize;
-  return /*#__PURE__*/React__default.createElement(Memo$h, {
+  return /*#__PURE__*/React__default.createElement(Memo$i, {
     boxSize: boxSize
   });
 };
@@ -2251,122 +2438,122 @@ var GoogleDrive = function GoogleDrive(_ref) {
   });
 };
 
-var _path$i;
-function _extends$j() { _extends$j = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$j.apply(this, arguments); }
+var _path$j;
+function _extends$k() { _extends$k = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$k.apply(this, arguments); }
 var SvgGroup = function SvgGroup(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$j({
+  return /*#__PURE__*/React.createElement("svg", _extends$k({
     width: 15,
     height: 14,
     viewBox: "0 0 15 14",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ref: ref
-  }, props), _path$i || (_path$i = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$j || (_path$j = /*#__PURE__*/React.createElement("path", {
     d: "M9.356 11.676a6.438 6.438 0 0 0 1.803.256 6.413 6.413 0 0 0 2.83-.654l.003-.119a2.833 2.833 0 0 0-5.176-1.593m.54 2.11v-.002c0-.764-.195-1.483-.54-2.108m.54 2.11v.073a8.46 8.46 0 0 1-4.378 1.213 8.46 8.46 0 0 1-4.377-1.213v-.075a4.378 4.378 0 0 1 8.215-2.108m-1.52-6.648a2.318 2.318 0 1 1-4.636 0 2.318 2.318 0 0 1 4.636 0Zm5.666 1.545a1.803 1.803 0 1 1-3.606 0 1.803 1.803 0 0 1 3.606 0Z",
     stroke: "#0082ff",
     strokeLinecap: "round",
     strokeLinejoin: "round"
   })));
 };
-var ForwardRef$i = /*#__PURE__*/React.forwardRef(SvgGroup);
-var Memo$i = /*#__PURE__*/React.memo(ForwardRef$i);
+var ForwardRef$j = /*#__PURE__*/React.forwardRef(SvgGroup);
+var Memo$j = /*#__PURE__*/React.memo(ForwardRef$j);
 
 /**
  * A functional React component utilized to render the `Group` icon component
  */
 var Group = function Group(_ref) {
   var boxSize = _ref.boxSize;
-  return /*#__PURE__*/React__default.createElement(Memo$i, {
+  return /*#__PURE__*/React__default.createElement(Memo$j, {
     boxSize: boxSize
   });
 };
 
-var _path$j;
-function _extends$k() { _extends$k = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$k.apply(this, arguments); }
+var _path$k;
+function _extends$l() { _extends$l = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$l.apply(this, arguments); }
 var SvgHome = function SvgHome(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$k({
+  return /*#__PURE__*/React.createElement("svg", _extends$l({
     width: 15,
     height: 14,
     viewBox: "0 0 15 14",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ref: ref
-  }, props), _path$j || (_path$j = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$k || (_path$k = /*#__PURE__*/React.createElement("path", {
     stroke: "#0082ff",
     d: "m.8 7.267 5.878-5.878a.738.738 0 0 1 1.044 0L13.6 7.267M2.277 5.79v6.646c0 .408.33.739.738.739h2.708v-3.2c0-.408.33-.739.739-.739h1.477c.407 0 .738.33.738.739v3.2h2.708c.408 0 .738-.331.738-.739V5.79M4.74 13.175h5.415",
     strokeLinecap: "round",
     strokeLinejoin: "round"
   })));
 };
-var ForwardRef$j = /*#__PURE__*/React.forwardRef(SvgHome);
-var Memo$j = /*#__PURE__*/React.memo(ForwardRef$j);
+var ForwardRef$k = /*#__PURE__*/React.forwardRef(SvgHome);
+var Memo$k = /*#__PURE__*/React.memo(ForwardRef$k);
 
 /**
  * A functional React component utilized to render the `Home` icon component
  */
 var Home = function Home(_ref) {
   var boxSize = _ref.boxSize;
-  return /*#__PURE__*/React__default.createElement(Memo$j, {
+  return /*#__PURE__*/React__default.createElement(Memo$k, {
     boxSize: boxSize
   });
 };
 
-var _path$k;
-function _extends$l() { _extends$l = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$l.apply(this, arguments); }
+var _path$l;
+function _extends$m() { _extends$m = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$m.apply(this, arguments); }
 var SvgImage = function SvgImage(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$l({
+  return /*#__PURE__*/React.createElement("svg", _extends$m({
     width: 16,
     height: 12,
     viewBox: "0 0 16 12",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ref: ref
-  }, props), _path$k || (_path$k = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$l || (_path$l = /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
     d: "M.8 2.2A1.8 1.8 0 0 1 2.6.4h10.8a1.8 1.8 0 0 1 1.8 1.8v7.6a1.8 1.8 0 0 1-1.8 1.8H2.6A1.8 1.8 0 0 1 .8 9.8V2.2ZM2 6.849V9.8a.6.6 0 0 0 .6.6h10.8a.6.6 0 0 0 .6-.6V7.649l-1.776-1.776a.6.6 0 0 0-.848 0L9.849 7.4l.375.376a.6.6 0 0 1-.848.848L5.224 4.473a.6.6 0 0 0-.848 0L2 6.849ZM9.6 3.6a.8.8 0 1 1-1.6 0 .8.8 0 0 1 1.6 0Z",
     fill: "#fff"
   })));
 };
-var ForwardRef$k = /*#__PURE__*/React.forwardRef(SvgImage);
-var Memo$k = /*#__PURE__*/React.memo(ForwardRef$k);
+var ForwardRef$l = /*#__PURE__*/React.forwardRef(SvgImage);
+var Memo$l = /*#__PURE__*/React.memo(ForwardRef$l);
 
 /**
  * A functional React component utilized to render the `Image` icon component
  */
 var Image = function Image(_ref) {
   var boxSize = _ref.boxSize;
-  return /*#__PURE__*/React__default.createElement(Memo$k, {
+  return /*#__PURE__*/React__default.createElement(Memo$l, {
     boxSize: boxSize
   });
 };
 
-var _path$l;
-function _extends$m() { _extends$m = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$m.apply(this, arguments); }
+var _path$m;
+function _extends$n() { _extends$n = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$n.apply(this, arguments); }
 var SvgMenu = function SvgMenu(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$m({
+  return /*#__PURE__*/React.createElement("svg", _extends$n({
     width: 10,
     height: 10,
     viewBox: "0 0 10 10",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ref: ref
-  }, props), _path$l || (_path$l = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$m || (_path$m = /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
     d: "M0 .8A.6.6 0 0 1 .6.2H9a.6.6 0 0 1 0 1.2H.6A.6.6 0 0 1 0 .8ZM0 5a.6.6 0 0 1 .6-.6H9a.6.6 0 0 1 0 1.2H.6A.6.6 0 0 1 0 5Zm0 4.2a.6.6 0 0 1 .6-.6H9a.6.6 0 0 1 0 1.2H.6a.6.6 0 0 1-.6-.6Z",
     fill: "#fff"
   })));
 };
-var ForwardRef$l = /*#__PURE__*/React.forwardRef(SvgMenu);
-var Memo$l = /*#__PURE__*/React.memo(ForwardRef$l);
+var ForwardRef$m = /*#__PURE__*/React.forwardRef(SvgMenu);
+var Memo$m = /*#__PURE__*/React.memo(ForwardRef$m);
 
 /**
  * A functional React component utilized to render the `Menu` icon component
  */
 var Menu = function Menu(_ref) {
   var boxSize = _ref.boxSize;
-  return /*#__PURE__*/React__default.createElement(Memo$l, {
+  return /*#__PURE__*/React__default.createElement(Memo$m, {
     boxSize: boxSize
   });
 };
@@ -2384,49 +2571,49 @@ var MicrosoftOneDrive = function MicrosoftOneDrive(_ref) {
   });
 };
 
-var _path$m;
-function _extends$n() { _extends$n = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$n.apply(this, arguments); }
+var _path$n;
+function _extends$o() { _extends$o = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$o.apply(this, arguments); }
 var SvgSearch = function SvgSearch(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$n({
+  return /*#__PURE__*/React.createElement("svg", _extends$o({
     width: 14,
     height: 14,
     viewBox: "0 0 14 14",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ref: ref
-  }, props), _path$m || (_path$m = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$n || (_path$n = /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
     d: "M6.2 1.8a4.4 4.4 0 1 0 0 8.8 4.4 4.4 0 0 0 0-8.8ZM.6 6.2a5.6 5.6 0 1 1 9.961 3.513l2.663 2.663a.6.6 0 0 1-.848.848l-2.663-2.663A5.6 5.6 0 0 1 .6 6.2Z",
     fill: "#3C3C4399"
   })));
 };
-var ForwardRef$m = /*#__PURE__*/React.forwardRef(SvgSearch);
-var Memo$m = /*#__PURE__*/React.memo(ForwardRef$m);
+var ForwardRef$n = /*#__PURE__*/React.forwardRef(SvgSearch);
+var Memo$n = /*#__PURE__*/React.memo(ForwardRef$n);
 
 /**
  * A functional React component utilized to render the `Search` icon component
  */
 var Search = function Search(_ref) {
   var boxSize = _ref.boxSize;
-  return /*#__PURE__*/React__default.createElement(Memo$m, {
+  return /*#__PURE__*/React__default.createElement(Memo$n, {
     boxSize: boxSize
   });
 };
 
-var _path$n, _path2$2;
-function _extends$o() { _extends$o = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$o.apply(this, arguments); }
+var _path$o, _path2$3;
+function _extends$p() { _extends$p = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$p.apply(this, arguments); }
 var SvgSettings = function SvgSettings(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$o({
+  return /*#__PURE__*/React.createElement("svg", _extends$p({
     width: 16,
     height: 16,
     viewBox: "0 0 16 16",
     fill: "#0082ff",
     xmlns: "http://www.w3.org/2000/svg",
     ref: ref
-  }, props), _path$n || (_path$n = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$o || (_path$o = /*#__PURE__*/React.createElement("path", {
     d: "M10.42 7.4c.376 0 .661-.346.51-.69a3.2 3.2 0 0 0-3.276-1.891c-.375.04-.532.46-.344.786L8.173 7.1a.6.6 0 0 0 .52.3h1.726ZM6.272 6.206c-.189-.326-.632-.4-.854-.096A3.186 3.186 0 0 0 4.8 8c0 .707.23 1.36.618 1.89.222.304.665.23.854-.096L7.134 8.3a.6.6 0 0 0 0-.6l-.862-1.494ZM7.31 10.395c-.188.326-.03.746.344.787a3.2 3.2 0 0 0 3.275-1.891c.152-.345-.133-.691-.51-.691H8.693a.6.6 0 0 0-.52.3l-.863 1.495Z"
-  })), _path2$2 || (_path2$2 = /*#__PURE__*/React.createElement("path", {
+  })), _path2$3 || (_path2$3 = /*#__PURE__*/React.createElement("path", {
     stroke: "#0082ff",
     fill: "#fff",
     fillRule: "evenodd",
@@ -2434,136 +2621,136 @@ var SvgSettings = function SvgSettings(props, ref) {
     d: "m11.304 3.478.516-.894a.6.6 0 0 0-1.04-.6l-.515.893A5.563 5.563 0 0 0 8.6 2.432V1.4a.6.6 0 0 0-1.2 0v1.032a5.564 5.564 0 0 0-1.665.445l-.515-.893a.6.6 0 0 0-1.04.6l.516.894a5.632 5.632 0 0 0-1.218 1.218l-.894-.516a.6.6 0 0 0-.6 1.04l.893.515A5.564 5.564 0 0 0 2.432 7.4H1.4a.6.6 0 0 0 0 1.2h1.032c.062.587.215 1.147.445 1.665l-.893.515a.6.6 0 1 0 .6 1.04l.894-.516c.34.466.752.877 1.218 1.218l-.516.894a.6.6 0 0 0 1.04.6l.515-.893c.518.23 1.078.383 1.665.445V14.6a.6.6 0 1 0 1.2 0v-1.032a5.565 5.565 0 0 0 1.665-.445l.515.893a.6.6 0 0 0 1.04-.6l-.516-.894a5.632 5.632 0 0 0 1.218-1.218l.894.516a.6.6 0 1 0 .6-1.04l-.893-.515c.23-.518.383-1.078.445-1.665H14.6a.6.6 0 1 0 0-1.2h-1.032a5.564 5.564 0 0 0-.445-1.665l.893-.515a.6.6 0 0 0-.6-1.04l-.894.516a5.633 5.633 0 0 0-1.218-1.218ZM8 3.6a4.38 4.38 0 0 0-2.225.603 4.422 4.422 0 0 0-1.599 1.619A4.38 4.38 0 0 0 3.6 8a4.38 4.38 0 0 0 .601 2.222 4.422 4.422 0 0 0 1.623 1.603A4.38 4.38 0 0 0 8 12.4a4.38 4.38 0 0 0 2.223-.602 4.422 4.422 0 0 0 1.602-1.622A4.38 4.38 0 0 0 12.4 8a4.38 4.38 0 0 0-.602-2.224 4.422 4.422 0 0 0-1.623-1.602A4.38 4.38 0 0 0 8 3.6Z"
   })));
 };
-var ForwardRef$n = /*#__PURE__*/React.forwardRef(SvgSettings);
-var Memo$n = /*#__PURE__*/React.memo(ForwardRef$n);
+var ForwardRef$o = /*#__PURE__*/React.forwardRef(SvgSettings);
+var Memo$o = /*#__PURE__*/React.memo(ForwardRef$o);
 
 /**
  * A functional React component utilized to render the `Settings` icon component
  */
 var Settings = function Settings(_ref) {
   var boxSize = _ref.boxSize;
-  return /*#__PURE__*/React__default.createElement(Memo$n, {
+  return /*#__PURE__*/React__default.createElement(Memo$o, {
     boxSize: boxSize,
     fill: colors.fill.action
   });
 };
 
-var _path$o;
-function _extends$p() { _extends$p = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$p.apply(this, arguments); }
+var _path$p;
+function _extends$q() { _extends$q = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$q.apply(this, arguments); }
 var SvgTableFill = function SvgTableFill(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$p({
+  return /*#__PURE__*/React.createElement("svg", _extends$q({
     width: 16,
     height: 12,
     viewBox: "0 0 16 12",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ref: ref
-  }, props), _path$o || (_path$o = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$p || (_path$p = /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
     d: "M.792 2.192A1.8 1.8 0 0 1 2.6.4h10.8a1.8 1.8 0 0 1 1.8 1.8l.008 7.6a1.8 1.8 0 0 1-1.8 1.8h-10.8A1.814 1.814 0 0 1 .8 9.792l-.008-7.6ZM7.4 9.808v-.5a.6.6 0 0 0-.6-.6H2.6a.6.6 0 0 0-.6.6V9.8a.6.6 0 0 0 .6.6h4.298a.6.6 0 0 0 .502-.592Zm1.2 0a.6.6 0 0 0 .502.592H13.4a.6.6 0 0 0 .6-.6v-.492a.6.6 0 0 0-.6-.6H9.2a.6.6 0 0 0-.6.6v.5ZM14 6.904v-.5a.6.6 0 0 0-.6-.6H9.2a.6.6 0 0 0-.6.6v.5a.6.6 0 0 0 .6.6h4.2a.6.6 0 0 0 .6-.6Zm-6.6 0v-.5a.6.6 0 0 0-.6-.6H2.6a.6.6 0 0 0-.6.6v.5a.6.6 0 0 0 .6.6h4.2a.6.6 0 0 0 .6-.6ZM14 4v-.5a.6.6 0 0 0-.6-.6H9.2a.6.6 0 0 0-.6.6V4a.6.6 0 0 0 .6.6h4.2A.6.6 0 0 0 14 4ZM7.4 4v-.5a.6.6 0 0 0-.6-.6H2.6a.6.6 0 0 0-.6.6V4a.6.6 0 0 0 .6.6h4.2a.6.6 0 0 0 .6-.6Z",
     fill: "#3C3C432E"
   })));
 };
-var ForwardRef$o = /*#__PURE__*/React.forwardRef(SvgTableFill);
-var Memo$o = /*#__PURE__*/React.memo(ForwardRef$o);
+var ForwardRef$p = /*#__PURE__*/React.forwardRef(SvgTableFill);
+var Memo$p = /*#__PURE__*/React.memo(ForwardRef$p);
 
 /**
  * A functional React component utilized to render the `TableFill` icon component
  */
 var TableFill = function TableFill(_ref) {
   var boxSize = _ref.boxSize;
-  return /*#__PURE__*/React__default.createElement(Memo$o, {
+  return /*#__PURE__*/React__default.createElement(Memo$p, {
     boxSize: boxSize
   });
 };
 
-var _path$p;
-function _extends$q() { _extends$q = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$q.apply(this, arguments); }
+var _path$q;
+function _extends$r() { _extends$r = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$r.apply(this, arguments); }
 var SvgTableOutline = function SvgTableOutline(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$q({
+  return /*#__PURE__*/React.createElement("svg", _extends$r({
     width: 14,
     height: 12,
     viewBox: "0 0 14 12",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ref: ref
-  }, props), _path$p || (_path$p = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$q || (_path$q = /*#__PURE__*/React.createElement("path", {
     d: "M1.25 11h11.5m-11.5 0a.75.75 0 0 1-.75-.75m.75.75h5a.75.75 0 0 0 .75-.75m-6.5 0v-8.5m0 8.5v-1a.75.75 0 0 1 .75-.75m12.25 1.75v-8.5m0 8.5a.75.75 0 0 1-.75.75m.75-.75v-1a.75.75 0 0 0-.75-.75m0 2.5h-5a.75.75 0 0 1-.75-.75m6.5-8.5a.75.75 0 0 0-.75-.75H1.25a.75.75 0 0 0-.75.75m13 0v1a.75.75 0 0 1-.75.75M.5 1.75v1c0 .414.336.75.75.75m0 0h11.5m-11.5 0h5a.75.75 0 0 1 .75.75M1.25 3.5a.75.75 0 0 0-.75.75v1c0 .414.336.75.75.75m11.5-2.5h-5a.75.75 0 0 0-.75.75m5.75-.75a.75.75 0 0 1 .75.75v1a.75.75 0 0 1-.75.75M1.25 6h5m-5 0a.75.75 0 0 0-.75.75v1c0 .414.336.75.75.75M7 5.25v-1m0 1a.75.75 0 0 1-.75.75M7 5.25c0 .414.336.75.75.75m-1.5 0a.75.75 0 0 1 .75.75M7.75 6h5m-5 0a.75.75 0 0 0-.75.75M12.75 6a.75.75 0 0 1 .75.75v1a.75.75 0 0 1-.75.75m-11.5 0h5M7 7.75v-1m0 1a.75.75 0 0 1-.75.75M7 7.75c0 .414.336.75.75.75m-1.5 0a.75.75 0 0 1 .75.75m0 1v-1m0 0a.75.75 0 0 1 .75-.75m0 0h5",
     stroke: "#3C3C4399",
     strokeLinecap: "round",
     strokeLinejoin: "round"
   })));
 };
-var ForwardRef$p = /*#__PURE__*/React.forwardRef(SvgTableOutline);
-var Memo$p = /*#__PURE__*/React.memo(ForwardRef$p);
+var ForwardRef$q = /*#__PURE__*/React.forwardRef(SvgTableOutline);
+var Memo$q = /*#__PURE__*/React.memo(ForwardRef$q);
 
 /**
  * A functional React component utilized to render the `TableOutline` icon component
  */
 var TableOutline = function TableOutline(_ref) {
   var boxSize = _ref.boxSize;
-  return /*#__PURE__*/React__default.createElement(Memo$p, {
+  return /*#__PURE__*/React__default.createElement(Memo$q, {
     boxSize: boxSize
   });
 };
 
-var _path$q;
-function _extends$r() { _extends$r = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$r.apply(this, arguments); }
+var _path$r;
+function _extends$s() { _extends$s = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$s.apply(this, arguments); }
 var SvgTrash = function SvgTrash(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$r({
+  return /*#__PURE__*/React.createElement("svg", _extends$s({
     width: 12,
     height: 14,
     viewBox: "0 0 12 14",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ref: ref
-  }, props), _path$q || (_path$q = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$r || (_path$r = /*#__PURE__*/React.createElement("path", {
     d: "m7.763 5.154-.213 5.538m-2.946 0L4.39 5.154m6.134-1.975c.21.032.42.066.629.102m-.63-.102-.656 8.543A1.385 1.385 0 0 1 8.487 13h-4.82a1.385 1.385 0 0 1-1.38-1.278l-.658-8.543m8.896 0a29.607 29.607 0 0 0-2.14-.244M1 3.281c.209-.036.419-.07.63-.102m0 0c.705-.107 1.418-.188 2.14-.244m4.615 0v-.564c0-.726-.56-1.331-1.286-1.355a31.972 31.972 0 0 0-2.044 0c-.725.024-1.286.63-1.286 1.355v.564m4.616 0a29.946 29.946 0 0 0-4.616 0",
     stroke: "#0082ff",
     strokeLinecap: "round",
     strokeLinejoin: "round"
   })));
 };
-var ForwardRef$q = /*#__PURE__*/React.forwardRef(SvgTrash);
-var Memo$q = /*#__PURE__*/React.memo(ForwardRef$q);
+var ForwardRef$r = /*#__PURE__*/React.forwardRef(SvgTrash);
+var Memo$r = /*#__PURE__*/React.memo(ForwardRef$r);
 
 /**
  * A functional React component utilized to render the `Trash` icon component
  */
 var Trash = function Trash(_ref) {
   var boxSize = _ref.boxSize;
-  return /*#__PURE__*/React__default.createElement(Memo$q, {
+  return /*#__PURE__*/React__default.createElement(Memo$r, {
     boxSize: boxSize
   });
 };
 
-var _path$r;
-function _extends$s() { _extends$s = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$s.apply(this, arguments); }
+var _path$s;
+function _extends$t() { _extends$t = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$t.apply(this, arguments); }
 var SvgServices = function SvgServices(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$s({
+  return /*#__PURE__*/React.createElement("svg", _extends$t({
     width: 14,
     height: 14,
     viewBox: "0 0 14 14",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ref: ref
-  }, props), _path$r || (_path$r = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$s || (_path$s = /*#__PURE__*/React.createElement("path", {
     d: "M8.5 3.058c0-.237.124-.45.267-.64.148-.193.233-.422.233-.668C9 1.06 8.328.5 7.5.5S6 1.06 6 1.75c0 .246.085.475.233.669.143.188.267.402.267.639v0c0 .24-.197.435-.438.428a32.26 32.26 0 0 1-2.775-.2c.124 1.076.195 2.167.21 3.272A.437.437 0 0 1 3.058 7v0c-.237 0-.45-.124-.64-.267A1.098 1.098 0 0 0 1.75 6.5C1.06 6.5.5 7.172.5 8s.56 1.5 1.25 1.5c.246 0 .475-.085.669-.233.188-.143.402-.267.639-.267v0c.206 0 .37.174.355.38a32.022 32.022 0 0 1-.429 3.37 32.23 32.23 0 0 0 3.078.236.427.427 0 0 0 .438-.428v0c0-.237-.124-.45-.267-.64A1.098 1.098 0 0 1 6 11.25c0-.69.672-1.25 1.5-1.25.829 0 1.5.56 1.5 1.25 0 .246-.085.475-.232.669-.144.188-.268.402-.268.639v0c0 .222.185.4.407.386a32.068 32.068 0 0 0 3.618-.42c.18-1.031.31-2.08.388-3.144a.355.355 0 0 0-.355-.38v0c-.237 0-.45.124-.64.268a1.098 1.098 0 0 1-.668.232C10.56 9.5 10 8.828 10 8s.56-1.5 1.25-1.5c.246 0 .476.085.669.233.188.143.402.267.639.267v0a.437.437 0 0 0 .44-.442c-.017-1.209-.1-2.4-.247-3.573a32.06 32.06 0 0 1-3.844.459.385.385 0 0 1-.407-.386v0Z",
     stroke: "#0082FF",
     strokeLinecap: "round",
     strokeLinejoin: "round"
   })));
 };
-var ForwardRef$r = /*#__PURE__*/React.forwardRef(SvgServices);
-var Memo$r = /*#__PURE__*/React.memo(ForwardRef$r);
+var ForwardRef$s = /*#__PURE__*/React.forwardRef(SvgServices);
+var Memo$s = /*#__PURE__*/React.memo(ForwardRef$s);
 
 /**
  * A functional React component utilized to render the `Services` icon component
  */
 var Services = function Services(_ref) {
   var boxSize = _ref.boxSize;
-  return /*#__PURE__*/React__default.createElement(Memo$r, {
+  return /*#__PURE__*/React__default.createElement(Memo$s, {
     boxSize: boxSize
   });
 };
@@ -2581,92 +2768,92 @@ var Vault = function Vault(_ref) {
   });
 };
 
-var _path$s;
-function _extends$t() { _extends$t = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$t.apply(this, arguments); }
+var _path$t;
+function _extends$u() { _extends$u = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$u.apply(this, arguments); }
 var SvgQuestion = function SvgQuestion(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$t({
+  return /*#__PURE__*/React.createElement("svg", _extends$u({
     width: 14,
     height: 14,
     viewBox: "0 0 14 14",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ref: ref
-  }, props), _path$s || (_path$s = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$t || (_path$t = /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
     d: "M.5 7a6.5 6.5 0 1 1 13 0 6.5 6.5 0 0 1-13 0Zm7.585-2.611c-.592-.519-1.577-.519-2.17 0a.5.5 0 0 1-.658-.753c.97-.848 2.517-.848 3.487 0 1.008.883 1.008 2.345 0 3.228-.171.15-.36.272-.559.368-.45.218-.685.516-.685.768v.5a.5.5 0 0 1-1 0V8c0-.853.706-1.405 1.25-1.668.122-.059.234-.133.335-.22.553-.485.553-1.239 0-1.723ZM7 11a.5.5 0 1 0 0-1 .5.5 0 0 0 0 1Z",
     fill: "#0082FF"
   })));
 };
-var ForwardRef$s = /*#__PURE__*/React.forwardRef(SvgQuestion);
-var Memo$s = /*#__PURE__*/React.memo(ForwardRef$s);
+var ForwardRef$t = /*#__PURE__*/React.forwardRef(SvgQuestion);
+var Memo$t = /*#__PURE__*/React.memo(ForwardRef$t);
 
 /**
  * A functional React component utilized to render the `Question` icon component
  */
 var Question = function Question(_ref) {
   var boxSize = _ref.boxSize;
-  return /*#__PURE__*/React__default.createElement(Memo$s, {
+  return /*#__PURE__*/React__default.createElement(Memo$t, {
     boxSize: boxSize
   });
 };
 
-var _path$t;
-function _extends$u() { _extends$u = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$u.apply(this, arguments); }
+var _path$u;
+function _extends$v() { _extends$v = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$v.apply(this, arguments); }
 var SvgVideo = function SvgVideo(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$u({
+  return /*#__PURE__*/React.createElement("svg", _extends$v({
     width: 14,
     height: 14,
     viewBox: "0 0 14 14",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ref: ref
-  }, props), _path$t || (_path$t = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$u || (_path$u = /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
     d: "M.6 7a6.4 6.4 0 1 1 12.8 0A6.4 6.4 0 0 1 .6 7Zm5.113-2.327a.6.6 0 0 1 .612.022l2.8 1.8a.6.6 0 0 1 0 1.01l-2.8 1.8A.6.6 0 0 1 5.4 8.8V5.2a.6.6 0 0 1 .313-.527Z",
     fill: "#0082FF"
   })));
 };
-var ForwardRef$t = /*#__PURE__*/React.forwardRef(SvgVideo);
-var Memo$t = /*#__PURE__*/React.memo(ForwardRef$t);
+var ForwardRef$u = /*#__PURE__*/React.forwardRef(SvgVideo);
+var Memo$u = /*#__PURE__*/React.memo(ForwardRef$u);
 
 /**
  * A functional React component utilized to render the `Video` icon component
  */
 var Video = function Video(_ref) {
   var boxSize = _ref.boxSize;
-  return /*#__PURE__*/React__default.createElement(Memo$t, {
+  return /*#__PURE__*/React__default.createElement(Memo$u, {
     boxSize: boxSize
   });
 };
 
-var _path$u;
-function _extends$v() { _extends$v = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$v.apply(this, arguments); }
+var _path$v;
+function _extends$w() { _extends$w = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$w.apply(this, arguments); }
 var SvgPage = function SvgPage(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$v({
+  return /*#__PURE__*/React.createElement("svg", _extends$w({
     width: 12,
     height: 14,
     viewBox: "0 0 12 14",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ref: ref
-  }, props), _path$u || (_path$u = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$v || (_path$v = /*#__PURE__*/React.createElement("path", {
     d: "M11 8.5V6.75A2.25 2.25 0 0 0 8.75 4.5h-1A.75.75 0 0 1 7 3.75v-1A2.25 2.25 0 0 0 4.75.5H3.5M5 .5H1.75a.75.75 0 0 0-.75.75v11.5c0 .414.336.75.75.75h8.5a.75.75 0 0 0 .75-.75V6.5a6 6 0 0 0-6-6Z",
     stroke: "#0082FF",
     strokeLinecap: "round",
     strokeLinejoin: "round"
   })));
 };
-var ForwardRef$u = /*#__PURE__*/React.forwardRef(SvgPage);
-var Memo$u = /*#__PURE__*/React.memo(ForwardRef$u);
+var ForwardRef$v = /*#__PURE__*/React.forwardRef(SvgPage);
+var Memo$v = /*#__PURE__*/React.memo(ForwardRef$v);
 
 /**
  * A functional React component utilized to render the `Page` icon component
  */
 var Page = function Page(_ref) {
   var boxSize = _ref.boxSize;
-  return /*#__PURE__*/React__default.createElement(Memo$u, {
+  return /*#__PURE__*/React__default.createElement(Memo$v, {
     boxSize: boxSize
   });
 };
@@ -2684,6 +2871,60 @@ var Workspace = function Workspace(_ref) {
   });
 };
 
+var _rect, _rect2, _path$w, _defs$2;
+function _extends$x() { _extends$x = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$x.apply(this, arguments); }
+var SvgTask = function SvgTask(props, ref) {
+  return /*#__PURE__*/React.createElement("svg", _extends$x({
+    width: 16,
+    height: 16,
+    viewBox: "0 0 16 16",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ref: ref
+  }, props), _rect || (_rect = /*#__PURE__*/React.createElement("rect", {
+    width: 16,
+    height: 16,
+    rx: 8,
+    fill: "#FFB300"
+  })), _rect2 || (_rect2 = /*#__PURE__*/React.createElement("rect", {
+    width: 16,
+    height: 16,
+    rx: 8,
+    fill: "url(#a)",
+    fillOpacity: 0.16
+  })), _path$w || (_path$w = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M11.842 9.591a1.8 1.8 0 0 0 0-3.182 1.8 1.8 0 0 0-2.25-2.25 1.8 1.8 0 0 0-3.183 0 1.8 1.8 0 0 0-2.25 2.25 1.8 1.8 0 0 0 0 3.182 1.8 1.8 0 0 0 2.25 2.25 1.8 1.8 0 0 0 3.183 0 1.8 1.8 0 0 0 2.25-2.25Zm-1.528-2.676a.45.45 0 1 0-.728-.53L7.496 9.26 6.368 8.132a.45.45 0 0 0-.636.636l1.5 1.5a.45.45 0 0 0 .682-.053l2.4-3.3Z",
+    fill: "#fff"
+  })), _defs$2 || (_defs$2 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
+    id: "a",
+    x1: 8,
+    y1: 0,
+    x2: 8,
+    y2: 16,
+    gradientUnits: "userSpaceOnUse"
+  }, /*#__PURE__*/React.createElement("stop", {
+    stopColor: "#fff"
+  }), /*#__PURE__*/React.createElement("stop", {
+    offset: 1,
+    stopColor: "#fff",
+    stopOpacity: 0
+  })))));
+};
+var ForwardRef$w = /*#__PURE__*/React.forwardRef(SvgTask);
+var Memo$w = /*#__PURE__*/React.memo(ForwardRef$w);
+
+/**
+ * A functional React component utilized to render the `Task` icon component
+ */
+var Task = function Task(_ref) {
+  var boxSize = _ref.boxSize;
+  return /*#__PURE__*/React__default.createElement(Memo$w, {
+    boxSize: boxSize
+  });
+};
+
 /**
  * A functional React component utilized to render the `BorderedBox` component
  */
@@ -2981,61 +3222,6 @@ function generateTableColumnsAsConst(arr) {
   return [].concat(arr);
 }
 
-var typography = {
-  letterSpacings: {
-    tighter: '-0.05em',
-    tight: '-0.025em',
-    normal: '0',
-    wide: '0.025em',
-    wider: '0.05em',
-    widest: '0.1em'
-  },
-  lineHeights: {
-    normal: 'normal',
-    none: 1,
-    shorter: 1.25,
-    "short": 1.375,
-    base: 1.5,
-    tall: 1.625,
-    taller: '2',
-    '3': '.75rem',
-    '4': '1rem',
-    '5': '1.25rem',
-    '6': '1.5rem',
-    '7': '1.75rem',
-    '8': '2rem',
-    '9': '2.25rem',
-    '10': '2.5rem'
-  },
-  fontWeights: {
-    hairline: 100,
-    thin: 200,
-    light: 300,
-    normal: 400,
-    medium: 500,
-    semibold: 600,
-    bold: 700,
-    extrabold: 800,
-    black: 900
-  },
-  fonts: {
-    base: "proxima-nova, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"",
-    mono: "SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace"
-  },
-  fontSizes: {
-    xs: '0.75rem',
-    sm: '0.875rem',
-    md: '1rem',
-    lg: '1.125rem',
-    xl: '1.25rem',
-    '2xl': '1.5rem',
-    '3xl': '1.875rem',
-    '4xl': '2.25rem',
-    '5xl': '3rem',
-    '6xl': '4rem'
-  }
-};
-
 /**
  * A loading spinner rendered after the table to indicate more rows are being loaded.
  */
@@ -3522,7 +3708,7 @@ var baseStyle$7 = {
     },
     py: '5px',
     px: '8px',
-    border: '1px solid',
+    border: '.5px solid',
     borderColor: colors.border["default"],
     _disabled: {
       opacity: 1,
@@ -4340,25 +4526,25 @@ var ToolbarBreadcrumbs = function ToolbarBreadcrumbs(_ref) {
   }));
 };
 
-var _path$v;
-function _extends$w() { _extends$w = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$w.apply(this, arguments); }
+var _path$x;
+function _extends$y() { _extends$y = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$y.apply(this, arguments); }
 var SvgLeftArrow = function SvgLeftArrow(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$w({
+  return /*#__PURE__*/React.createElement("svg", _extends$y({
     width: 8,
     height: 14,
     viewBox: "0 0 8 14",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ref: ref
-  }, props), _path$v || (_path$v = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$x || (_path$x = /*#__PURE__*/React.createElement("path", {
     d: "M7.125 13.25.875 7 7.125.75",
     stroke: "current",
     strokeLinecap: "round",
     strokeLinejoin: "round"
   })));
 };
-var ForwardRef$v = /*#__PURE__*/React.forwardRef(SvgLeftArrow);
-var Memo$v = /*#__PURE__*/React.memo(ForwardRef$v);
+var ForwardRef$x = /*#__PURE__*/React.forwardRef(SvgLeftArrow);
+var Memo$x = /*#__PURE__*/React.memo(ForwardRef$x);
 
 /**
  * A functional React component utilized to render the `LeftArrowButton` component
@@ -4372,22 +4558,22 @@ var LeftArrowButton = function LeftArrowButton(_ref) {
     },
     cursor: disabled ? 'not-allowed' : 'pointer',
     transform: "scaleX(-1)"
-  }, /*#__PURE__*/React__default.createElement(Memo$v, {
+  }, /*#__PURE__*/React__default.createElement(Memo$x, {
     stroke: disabled ? '#3C3C43' : 'black'
   }));
 };
 
-var _path$w;
-function _extends$x() { _extends$x = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$x.apply(this, arguments); }
+var _path$y;
+function _extends$z() { _extends$z = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$z.apply(this, arguments); }
 var SvgRightArrow = function SvgRightArrow(props, ref) {
-  return /*#__PURE__*/React.createElement("svg", _extends$x({
+  return /*#__PURE__*/React.createElement("svg", _extends$z({
     width: 8,
     height: 14,
     viewBox: "0 0 8 14",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     ref: ref
-  }, props), _path$w || (_path$w = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$y || (_path$y = /*#__PURE__*/React.createElement("path", {
     d: "M.875.75 7.125 7l-6.25 6.25",
     stroke: "current",
     strokeOpacity: 0.6,
@@ -4395,8 +4581,8 @@ var SvgRightArrow = function SvgRightArrow(props, ref) {
     strokeLinejoin: "round"
   })));
 };
-var ForwardRef$w = /*#__PURE__*/React.forwardRef(SvgRightArrow);
-var Memo$w = /*#__PURE__*/React.memo(ForwardRef$w);
+var ForwardRef$y = /*#__PURE__*/React.forwardRef(SvgRightArrow);
+var Memo$y = /*#__PURE__*/React.memo(ForwardRef$y);
 
 /**
  * A functional React component utilized to render the `RightArrowButton` component
@@ -4409,7 +4595,7 @@ var RightArrowButton = function RightArrowButton(_ref) {
       if (!disabled) return _onClick();
     },
     cursor: disabled ? 'not-allowed' : 'pointer'
-  }, /*#__PURE__*/React__default.createElement(Memo$w, {
+  }, /*#__PURE__*/React__default.createElement(Memo$y, {
     stroke: disabled ? '#3C3C43' : 'black'
   }));
 };
@@ -4578,6 +4764,7 @@ exports.ActionRow = ActionRow;
 exports.Banner = Banner;
 exports.Breadcrumbs = Breadcrumbs;
 exports.Button = Button;
+exports.Card = Card;
 exports.Checkmark = Checkmark;
 exports.ChevronDown = ChevronDown;
 exports.ChevronRight = ChevronRight;
@@ -4621,6 +4808,7 @@ exports.Table = Table;
 exports.TableFill = TableFill;
 exports.TableOutline = TableOutline;
 exports.TabsWrapper = TabsWrapper;
+exports.Task = Task;
 exports.Text = Text;
 exports.Toolbar = Toolbar;
 exports.Trash = Trash;