@veritone-ce/design-system 1.12.26 → 1.12.28

package/dist/components/Button/index.d.ts

@@ -1,7 +1,10 @@
+/// <reference types="react" />
 import { ButtonProps as MuiButtonProps } from '@mui/material';
 export type ButtonProps = {
     'data-testid'?: string;
     isLoading?: boolean;
+    component?: React.ElementType;
+    to?: string;
 } & MuiButtonProps;
 /**
 - Use a button for common user click actions. Several variations available.

package/dist/components/ModelGridView/index.d.ts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 interface ModelGridViewData {
     modelName: string;
     lastModified: string;
@@ -8,6 +9,7 @@ interface ModelGridViewData {
 export type ModelGridViewProps = {
     'data-testid'?: string;
     rows: ModelGridViewData[];
+    zeroStateComponent?: React.ReactNode;
 };
-declare const ModelGridView: ({ rows }: ModelGridViewProps) => import("react/jsx-runtime").JSX.Element;
+declare const ModelGridView: ({ rows, zeroStateComponent }: ModelGridViewProps) => import("react/jsx-runtime").JSX.Element;
 export default ModelGridView;

package/dist/components/ModelGridView/index.js

@@ -118,8 +118,24 @@ function EnhancedTableHead(props) {
     })
   });
 }
+var ZeroState = function ZeroState() {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+    sx: {
+      width: '100%',
+      height: '100vh',
+      display: 'flex',
+      justifyContent: 'center',
+      alignItems: 'center',
+      backgroundColor: 'rgba(224, 232, 240, 1)'
+    },
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
+      children: "No data to display"
+    })
+  });
+};
 var ModelGridView = function ModelGridView(_ref) {
-  var rows = _ref.rows;
+  var rows = _ref.rows,
+    zeroStateComponent = _ref.zeroStateComponent;
   var _React$useState = React.useState('desc'),
     _React$useState2 = _slicedToArray(_React$useState, 2),
     order = _React$useState2[0],
@@ -178,8 +194,18 @@ var ModelGridView = function ModelGridView(_ref) {
             order: order,
             orderBy: orderBy,
             onRequestSort: handleRequestSort
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableBody, {
-            children: rows.slice().sort(getComparator(order, orderBy)).map(function (row, index) {
+          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.TableBody, {
+            children: [rows.length === 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableRow, {
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TableCell, {
+                colSpan: 6,
+                align: "center",
+                sx: {
+                  height: '100%',
+                  verticalAlign: 'middle'
+                },
+                children: zeroStateComponent || /*#__PURE__*/(0, _jsxRuntime.jsx)(ZeroState, {})
+              })
+            }), rows.length > 0 && rows.slice().sort(getComparator(order, orderBy)).map(function (row, index) {
               var labelId = "enhanced-table-checkbox-".concat(index);
               return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.TableRow, {
                 tabIndex: -1,
@@ -293,7 +319,7 @@ var ModelGridView = function ModelGridView(_ref) {
                   })]
                 })]
               }, row.modelName);
-            })
+            })]
           })]
         })
       })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@veritone-ce/design-system",
-  "version": "1.12.26",
+  "version": "1.12.28",
   "private": false,
   "description": "Design System for Veritone CE",
   "keywords": [