@vention/machine-ui 3.39.0 → 3.41.0

package/README.md

@@ -4,7 +4,7 @@ Machine UI is Vention's component library for building applications and Human-Ma
 
 ## 📚 Documentation
 
-Complete documentation, including component examples, design system guidelines, and usage instructions, can be found at:
+Complete documentation, including component examples, design system guidelines, and usage instructions can be found at:
 
 **[https://assets.vention.com/machine-ui-storybook/](https://assets.vention.com/machine-ui-storybook/index.html?path=/docs/guides-introduction--documentation)**
 

package/index.esm.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import { Typography, Button, Stack, Box as Box$1, Grid, IconButton, ClickAwayListener, Modal, linearProgressClasses, LinearProgress, InputAdornment, TextField, Radio, FormControlLabel, FormControl, Select, MenuItem, FormHelperText, ButtonGroup, Paper, Card, CardMedia, CardContent, ListItemIcon, ListItemText, Popover, MenuList, useTheme as useTheme$1, Drawer, Tooltip, Checkbox } from '@mui/material';
+import { Typography, Button, Stack, Box as Box$1, Grid, IconButton, ClickAwayListener, Modal, CircularProgress as CircularProgress$1, linearProgressClasses, LinearProgress, InputAdornment, TextField, Radio, FormControlLabel, FormControl, Select, MenuItem, FormHelperText, ButtonGroup, Paper, Card, CardMedia, CardContent, ListItemIcon, ListItemText, Popover, MenuList, useTheme as useTheme$1, Drawer, Tooltip, Checkbox } from '@mui/material';
 import { IconCheck, IconAlertTriangleFilled, IconAlertTriangle, IconExclamationMark, IconExternalLink, IconX, IconInfoCircleFilled, IconCircleCheckFilled, IconChevronUp, IconChevronDown, IconInfoCircle, IconInfoSmall, IconMinus, IconPlus, IconLoader2, IconCaretRightFilled, IconChevronsRight, IconChevronsLeft, IconChevronRight } from '@tabler/icons-react';
 import { forwardRef, useState, cloneElement, useRef, useEffect, useCallback, lazy, memo, Suspense, useMemo, createContext, useContext, useImperativeHandle, Children, Fragment as Fragment$1, useReducer } from 'react';
 import { tss } from 'tss-react/mui';
@@ -4178,7 +4178,9 @@ const VentionModal = props => {
             "data-testid": ventionModalTestIds.positiveIcon
           })), props.type === "info" && jsx(IconInfoSmall, Object.assign({}, iconProps, {
             "data-testid": ventionModalTestIds.infoIcon
-          })), props.type === "warning" && jsx(IconAlertTriangle, Object.assign({}, iconProps, {
+          })), props.type === "loading" && jsx(CircularProgress$1, {
+            "data-testid": ventionModalTestIds.loadingIcon
+          }), props.type === "warning" && jsx(IconAlertTriangle, Object.assign({}, iconProps, {
             "data-testid": ventionModalTestIds.warningIcon
           })), props.type === "negative" && jsx(IconAlertTriangle, Object.assign({}, iconProps, {
             "data-testid": ventionModalTestIds.negativeIcon
@@ -4253,7 +4255,7 @@ const useStyles$w = tss.withParams().create(({
     statusCircle: {
       width: status.containerSize,
       height: status.containerSize,
-      display: "flex",
+      display: type === "loading" ? "block" : "flex",
       justifyContent: "center",
       alignItems: "center",
       borderRadius: "50%",
@@ -4283,8 +4285,8 @@ const ALIGN_ITEMS = {
   left: "flex-start",
   center: "center"
 };
-const getColors$2 = (type, theme) => {
-  switch (type) {
+const getColors$2 = (modelType, theme) => {
+  switch (modelType) {
     case "positive":
       return {
         statusContainerColor: theme.palette.background.success,
@@ -4305,6 +4307,7 @@ const getColors$2 = (type, theme) => {
         statusContainerColor: theme.palette.background.destructive,
         statusGlowColor: theme.palette.background.subtleDestructive
       };
+    case "loading":
     case "none":
       return {
         statusContainerColor: "transparent",
@@ -4341,6 +4344,7 @@ const getBodyTextTypography = (modalSize, isTouchDevice) => {
 const ventionModalTestIds = {
   positiveIcon: "vention-modal-positive-icon",
   infoIcon: "vention-modal-info-icon",
+  loadingIcon: "vention-modal-loading-icon",
   warningIcon: "vention-modal-warning-icon",
   negativeIcon: "vention-modal-negative-icon",
   modalActions: "vention-modal-actions"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vention/machine-ui",
-  "version": "3.39.0",
+  "version": "3.41.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/VentionCo/machine-cloud.git"

package/src/lib/components/vention-modal/vention-modal.d.ts

@@ -8,7 +8,7 @@ export interface VentionModalProps {
      * This can be a simple string or your own React Component.
      */
     body: string | React.ReactElement;
-    type: "positive" | "info" | "warning" | "negative" | "none";
+    type: "positive" | "info" | "warning" | "negative" | "loading" | "none";
     modalSize?: VentionModalBaseProps["modalSize"];
     isTouchDevice?: boolean;
     isOpen: VentionModalBaseProps["isOpen"];
@@ -46,6 +46,7 @@ export declare const VentionModal: (props: VentionModalProps) => import("react/j
 export declare const ventionModalTestIds: {
     positiveIcon: string;
     infoIcon: string;
+    loadingIcon: string;
     warningIcon: string;
     negativeIcon: string;
     modalActions: string;