@veritone-ce/design-system 1.12.21 → 1.12.23

package/dist/assets/theme.js

@@ -1,9 +1,10 @@
 "use strict";
 
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.colors = void 0;
+exports["default"] = exports.colors = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _material = require("@mui/material");
 var _stepper = _interopRequireDefault(require("../components/Stepper/stepper.theme"));
@@ -20,17 +21,21 @@ var _linearProgress = _interopRequireDefault(require("../components/LinearProgre
 var _CheckCircle = _interopRequireDefault(require("@mui/icons-material/CheckCircle"));
 var _Cancel = _interopRequireDefault(require("@mui/icons-material/Cancel"));
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 var InformationIcon = function InformationIcon(props) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("svg", {
-    ...props,
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("svg", _objectSpread(_objectSpread({}, props), {}, {
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
       fillRule: "evenodd",
       clipRule: "evenodd",
       d: "M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18Zm1.674-4.444.14-.575c-.072.034-.189.073-.35.118a1.655 1.655 0 0 1-.436.067c-.272 0-.464-.045-.575-.134-.11-.09-.166-.258-.166-.505 0-.098.017-.243.051-.435.034-.191.073-.362.115-.511l.524-1.86c.051-.17.087-.358.106-.563.019-.204.028-.347.028-.428 0-.392-.137-.71-.412-.956-.275-.244-.666-.367-1.173-.367-.281 0-.58.05-.895.15-.315.1-.645.22-.99.361l-.141.576c.102-.039.225-.08.368-.122.142-.043.282-.064.418-.064.277 0 .465.047.563.14.098.095.147.26.147.5 0 .131-.016.277-.048.437-.032.16-.072.33-.119.508l-.524 1.867a5.499 5.499 0 0 0-.102.527 3.366 3.366 0 0 0-.032.457c0 .384.142.7.425.95.284.249.681.373 1.192.373.333 0 .625-.043.876-.13.252-.088.588-.215 1.01-.38Zm-.093-7.552a1.09 1.09 0 0 0 .368-.828 1.1 1.1 0 0 0-.368-.83A1.247 1.247 0 0 0 12.696 7c-.345 0-.641.115-.889.345-.247.23-.37.507-.37.831 0 .324.123.6.37.828.248.228.544.342.889.342s.64-.114.885-.342Z",
       fill: "#214167"
     })
-  });
+  }));
 };
 InformationIcon.defaultProps = {
   width: "22",
@@ -39,15 +44,14 @@ InformationIcon.defaultProps = {
   xmlns: "http://www.w3.org/2000/svg"
 };
 var WarningIcon = function WarningIcon(props) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("svg", {
-    ...props,
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("svg", _objectSpread(_objectSpread({}, props), {}, {
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
       fillRule: "evenodd",
       clipRule: "evenodd",
       d: "M17.075 17.075A9.976 9.976 0 0 0 20 10a9.976 9.976 0 0 0-2.925-7.075A9.976 9.976 0 0 0 10 0a9.976 9.976 0 0 0-7.075 2.925A9.976 9.976 0 0 0 0 10a9.976 9.976 0 0 0 2.925 7.075A9.976 9.976 0 0 0 10 20a9.976 9.976 0 0 0 7.075-2.925Zm-5.722-3.218A1.35 1.35 0 0 0 10 12.505c-.75 0-1.371.603-1.371 1.352 0 .75.621 1.372 1.371 1.372s1.353-.622 1.353-1.372ZM10 11.134c-.494 0-.86-.403-.914-.915l-.457-4.076C8.556 5.43 9.305 4.77 10 4.77s1.444.659 1.353 1.372l-.439 4.076c-.055.512-.42.915-.914.915Z",
       fill: "#FFBB0A"
     })
-  });
+  }));
 };
 WarningIcon.defaultProps = {
   width: "22",
@@ -55,7 +59,7 @@ WarningIcon.defaultProps = {
   fill: "none",
   xmlns: "http://www.w3.org/2000/svg"
 };
-const colors = {
+var colors = {
   brand: {
     pink: '#D43060',
     blueOne: '#214167',
@@ -63,30 +67,30 @@ const colors = {
     warning: '#FFBB0A',
     success: '#28BA3F',
     error: '#EB0000',
-    white: `#FFFFFF`
+    white: "#FFFFFF"
   },
   text: {
-    primary: `#2A323C`,
-    secondary: `#5C6269`,
-    tertiary: `#465364`,
-    disabled: `#7C848D`
+    primary: "#2A323C",
+    secondary: "#5C6269",
+    tertiary: "#465364",
+    disabled: "#7C848D"
   },
   button: {
-    primary: `#1871E8`,
-    hover: `#1259B9`
+    primary: "#1871E8",
+    hover: "#1259B9"
   },
   misc: {
-    background: `#E4ECF3`,
-    altBackground: `#E0E8F0`,
-    rowHoverGreyOne: `#FAFAFA`,
-    rowOn: `#F2F7FE`,
-    rowOnHoverGreyTwo: `#EAF1FA`
+    background: "#E4ECF3",
+    altBackground: "#E0E8F0",
+    rowHoverGreyOne: "#FAFAFA",
+    rowOn: "#F2F7FE",
+    rowOnHoverGreyTwo: "#EAF1FA"
   }
 };
 exports.colors = colors;
 // create theme in steps https://mui.com/material-ui/customization/theming/#api
 
-let theme = (0, _material.createTheme)({
+var theme = (0, _material.createTheme)({
   typography: {
     fontFamily: ['Nunito Sans', 'Helvetica', 'sans-serif'].join(','),
     h2: {
@@ -136,26 +140,26 @@ let theme = (0, _material.createTheme)({
   spacing: 10
 });
 theme = (0, _material.createTheme)(theme, {
-  components: {
-    MuiButton: (0, _button.default)(theme),
-    ...(0, _stepper.default)(theme),
-    MuiSelect: (0, _select.default)(theme),
-    MuiTextField: (0, _input.default)(theme),
-    MuiDialog: (0, _modal.default)(theme),
-    MuiCheckbox: (0, _checkbox.default)(theme),
-    MuiRadio: (0, _RadioButton.default)(theme),
-    MuiTabs: (0, _tabs.default)(theme),
-    MuiChip: (0, _statusChip.default)(theme),
+  components: _objectSpread(_objectSpread({
+    MuiButton: (0, _button["default"])(theme)
+  }, (0, _stepper["default"])(theme)), {}, {
+    MuiSelect: (0, _select["default"])(theme),
+    MuiTextField: (0, _input["default"])(theme),
+    MuiDialog: (0, _modal["default"])(theme),
+    MuiCheckbox: (0, _checkbox["default"])(theme),
+    MuiRadio: (0, _RadioButton["default"])(theme),
+    MuiTabs: (0, _tabs["default"])(theme),
+    MuiChip: (0, _statusChip["default"])(theme),
     MuiMenu: (0, _menuFlyout.menuFlyoutTheme)(theme),
     MuiMenuItem: (0, _menuFlyout.menuItemTheme)(theme),
-    MuiLinearProgress: (0, _linearProgress.default)(theme),
+    MuiLinearProgress: (0, _linearProgress["default"])(theme),
     MuiInputLabel: {
       styleOverrides: {
         root: {
           color: theme.palette.text.secondary,
-          fontSize: `14px`,
-          lineHeight: `21px`,
-          fontWeight: `600`
+          fontSize: "14px",
+          lineHeight: "21px",
+          fontWeight: "600"
         }
       }
     },
@@ -177,17 +181,17 @@ theme = (0, _material.createTheme)(theme, {
           position: 'relative',
           marginLeft: 0,
           '&.Mui-error': {
-            paddingLeft: `17px`,
+            paddingLeft: "17px",
             '&::before': {
-              content: `""`,
-              height: `12px`,
+              content: "\"\"",
+              height: "12px",
               width: '12px',
               position: 'absolute',
               left: 0,
-              top: `50%`,
-              transform: `translate(0, -50%)`,
+              top: "50%",
+              transform: "translate(0, -50%)",
               backgroundColor: theme.palette.error.main,
-              borderRadius: `100%`
+              borderRadius: "100%"
             }
           }
         }
@@ -196,8 +200,8 @@ theme = (0, _material.createTheme)(theme, {
     MuiDialogTitle: {
       styleOverrides: {
         root: {
-          fontSize: `24px`,
-          lineHeight: `34px`,
+          fontSize: "24px",
+          lineHeight: "34px",
           paddingTop: theme.spacing(3),
           paddingLeft: theme.spacing(3),
           paddingRight: theme.spacing(3),
@@ -224,7 +228,7 @@ theme = (0, _material.createTheme)(theme, {
     },
     MuiLink: {
       defaultProps: {
-        underline: `none`,
+        underline: "none",
         color: colors.button.primary
       }
     },
@@ -232,45 +236,39 @@ theme = (0, _material.createTheme)(theme, {
       defaultProps: {
         autoHideDuration: 3000,
         anchorOrigin: {
-          vertical: `top`,
-          horizontal: `right`
+          vertical: "top",
+          horizontal: "right"
         }
       },
       styleOverrides: {
         root: {
-          width: `100%`,
-          maxWidth: `415px`,
-          position: `absolute`
+          width: "100%",
+          maxWidth: "415px",
+          position: "absolute"
         }
       }
     },
     MuiAlert: {
       defaultProps: {
-        variant: `outlined`,
+        variant: "outlined",
         iconMapping: {
-          success: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CheckCircle.default, {}),
-          info: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-            alt: 'information icon',
-            src: InformationIcon
-          }),
-          warning: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-            alt: 'warning icon',
-            src: WarningIcon
-          }),
-          error: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Cancel.default, {})
+          success: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CheckCircle["default"], {}),
+          info: /*#__PURE__*/(0, _jsxRuntime.jsx)(InformationIcon, {}),
+          warning: /*#__PURE__*/(0, _jsxRuntime.jsx)(WarningIcon, {}),
+          error: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Cancel["default"], {})
         }
       },
       styleOverrides: {
         root: {
-          width: `415px`,
-          backgroundColor: `white`,
-          position: `relative`,
-          overflow: `hidden`,
-          border: `1px solid #7C848D`,
+          width: "415px",
+          backgroundColor: "white",
+          position: "relative",
+          overflow: "hidden",
+          border: "1px solid #7C848D",
           '&:after': {
             content: '""',
-            position: `absolute`,
-            width: `4px`,
+            position: "absolute",
+            width: "4px",
             left: 0,
             top: 0,
             bottom: 0
@@ -292,8 +290,8 @@ theme = (0, _material.createTheme)(theme, {
             fontSize: 20
           },
           '& .MuiAlert-message': {
-            fontSize: `12px`,
-            lineHeight: `22px`,
+            fontSize: "12px",
+            lineHeight: "22px",
             color: colors.text.primary
           },
           '& .MuiIconButton-root': {
@@ -350,7 +348,7 @@ theme = (0, _material.createTheme)(theme, {
     //     }
     //   }
     // }
-  }
+  })
 });
 var _default = theme;
-exports.default = _default;
+exports["default"] = _default;

package/dist/components/Box/index.js

@@ -1,17 +1,22 @@
 "use strict";
 
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports["default"] = void 0;
 var _material = require("@mui/material");
 var _jsxRuntime = require("react/jsx-runtime");
-const Box = ({
-  ...props
-}) => {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
-    ...props
-  });
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _objectDestructuringEmpty(obj) { if (obj == null) throw new TypeError("Cannot destructure " + obj); }
+function _extends() { _extends = 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.apply(this, arguments); }
+var Box = function Box(_ref) {
+  var props = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, _objectSpread({}, props));
 };
 var _default = Box;
-exports.default = _default;
+exports["default"] = _default;

package/dist/components/Breadcrumbs/breadcrumbs.theme.js

@@ -3,15 +3,19 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
-const breadcrumbs = theme => ({
-  styleOverrides: {
-    root: () => ({
-      '& .MuiBreadcrumbs-separator': {
-        color: theme.palette.text.disabled
+exports["default"] = void 0;
+var breadcrumbs = function breadcrumbs(theme) {
+  return {
+    styleOverrides: {
+      root: function root() {
+        return {
+          '& .MuiBreadcrumbs-separator': {
+            color: theme.palette.text.disabled
+          }
+        };
       }
-    })
-  }
-});
+    }
+  };
+};
 var _default = breadcrumbs;
-exports.default = _default;
+exports["default"] = _default;

package/dist/components/Breadcrumbs/index.js

@@ -3,11 +3,11 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports["default"] = void 0;
 var _material = require("@mui/material");
 var _theme = _interopRequireDefault(require("../../assets/theme"));
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 /**
  * - This is the breadcrumbs component that is used in the header
  * - It takes in an array of links and renders them as breadcrumbs
@@ -15,17 +15,17 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
  * - The last link is styled differently
  **/
 
-const BreadcrumbsComponent = ({
-  links = []
-}) => {
+var BreadcrumbsComponent = function BreadcrumbsComponent(_ref) {
+  var _ref$links = _ref.links,
+    links = _ref$links === void 0 ? [] : _ref$links;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Breadcrumbs, {
     "aria-label": "breadcrumbs",
     "data-testid": "breadcrumbs",
-    children: links?.map((link, index) => {
+    children: links === null || links === void 0 ? void 0 : links.map(function (link, index) {
       if (index === links.length - 1) {
         return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
           sx: {
-            color: _theme.default.palette.text.disabled,
+            color: _theme["default"].palette.text.disabled,
             fontFamily: 'Dosis',
             fontStyle: 'normal',
             fontWeight: 600,
@@ -39,7 +39,7 @@ const BreadcrumbsComponent = ({
           href: link.href,
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
             sx: {
-              color: _theme.default.palette.button.main,
+              color: _theme["default"].palette.button.main,
               fontFamily: 'Dosis',
               fontStyle: 'normal',
               fontWeight: 600,
@@ -54,4 +54,4 @@ const BreadcrumbsComponent = ({
   });
 };
 var _default = BreadcrumbsComponent;
-exports.default = _default;
+exports["default"] = _default;

package/dist/components/Button/Indicator.js

@@ -3,26 +3,26 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports["default"] = void 0;
 var _material = require("@mui/material");
 var _theme = _interopRequireDefault(require("../../assets/theme"));
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-const Indicator = () => {
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var Indicator = function Indicator() {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
     className: "button-loader",
     "data-testid": "loading-indicator",
     sx: {
-      position: `absolute`,
+      position: "absolute",
       top: 0,
       left: 0,
       right: 0,
       bottom: 0,
-      display: `grid`,
-      justifyItems: `center`,
-      alignItems: `center`,
-      background: _theme.default.palette.misc.rowHoverGreyOne,
-      border: `1px solid ${_theme.default.palette.misc.rowOnHoverGreyTwo}`,
+      display: "grid",
+      justifyItems: "center",
+      alignItems: "center",
+      background: _theme["default"].palette.misc.rowHoverGreyOne,
+      border: "1px solid ".concat(_theme["default"].palette.misc.rowOnHoverGreyTwo),
       borderRadius: '0.2rem'
     },
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.CircularProgress, {
@@ -31,4 +31,4 @@ const Indicator = () => {
   });
 };
 var _default = Indicator;
-exports.default = _default;
+exports["default"] = _default;