@vention/machine-ui 4.2.0 → 4.2.2

package/index.esm.js

@@ -4029,7 +4029,8 @@ const VentionModalBase = props => {
     modalSize = "medium",
     isTouchDevice = false,
     backDropClickClosable = true,
-    width
+    width,
+    dataTestId
   } = props;
   const {
     classes,
@@ -4070,7 +4071,7 @@ const VentionModalBase = props => {
     className: classes.modal,
     children: /*#__PURE__*/jsxs("div", {
       className: classes.modalContainer,
-      "data-testid": ventionModalBaseTestIds.modalContainer,
+      "data-testid": dataTestId != null ? dataTestId : ventionModalBaseTestIds.modalContainer,
       children: [/*#__PURE__*/jsx("div", {
         className: classes.closeIconButton,
         onClick: props.onClose,
@@ -4169,6 +4170,7 @@ const ventionModalBaseTestIds = {
 };
 
 const VentionModal = props => {
+  var _props$dataTestIds$mo, _props$dataTestIds, _props$dataTestIds$fo, _props$dataTestIds2;
   const {
     modalSize = "medium",
     isTouchDevice = false,
@@ -4204,6 +4206,7 @@ const VentionModal = props => {
     isTouchDevice: isTouchDevice,
     backDropClickClosable: backDropClickClosable,
     width: props.width,
+    dataTestId: (_props$dataTestIds$mo = (_props$dataTestIds = props.dataTestIds) == null ? void 0 : _props$dataTestIds.modal) != null ? _props$dataTestIds$mo : ventionModalTestIds.container,
     children: /*#__PURE__*/jsxs(Box$1, {
       className: classes.modalContent,
       children: [props.type !== "none" && /*#__PURE__*/jsx(Box$1, {
@@ -4232,7 +4235,7 @@ const VentionModal = props => {
         children: props.body
       }), /*#__PURE__*/jsxs(Box$1, {
         className: classes.modalActions,
-        "data-testid": ventionModalTestIds.modalActions,
+        "data-testid": (_props$dataTestIds$fo = (_props$dataTestIds2 = props.dataTestIds) == null ? void 0 : _props$dataTestIds2.footer) != null ? _props$dataTestIds$fo : ventionModalTestIds.modalActions,
         children: [props.secondaryButton && /*#__PURE__*/jsx(VentionButton, {
           size: buttonSize,
           "data-testid": props.secondaryButton.dataTestId,
@@ -4378,6 +4381,7 @@ const getBodyTextTypography = (modalSize, isTouchDevice) => {
   return "paragraph14Regular";
 };
 const ventionModalTestIds = {
+  container: "vention-modal",
   positiveIcon: "vention-modal-positive-icon",
   infoIcon: "vention-modal-info-icon",
   loadingIcon: "vention-modal-loading-icon",
@@ -12180,6 +12184,15 @@ function getDropZoneStatus(type, hasErrorMessages) {
   }
 }
 
+const VentionDropZoneTestIds = {
+  container: "dropzoneContainer",
+  contents: "dropzoneContents",
+  uploadIcon: "dropzoneUploadIcon",
+  title: "dropzoneTitle",
+  criteria: "dropzoneCriteria",
+  errors: "dropzoneErrors",
+  fileInput: "dropzoneFileInput"
+};
 const UPLOAD_TITLE = "Drop to start uploading";
 
 /**
@@ -12194,8 +12207,10 @@ function VentionDropZone({
   onFilesSelect,
   fileCriteriaDescription,
   defaultTitle = "Drop files here or click to upload",
-  disabled = false
+  disabled = false,
+  dataTestIds
 }) {
+  var _dataTestIds$containe, _dataTestIds$contents, _dataTestIds$uploadIc, _dataTestIds$title, _dataTestIds$criteria, _dataTestIds$errors, _dataTestIds$fileInpu;
   const [state, dispatch] = useReducer(dropZoneReducer, {
     dropZoneStatus: DropZoneState.Default,
     title: defaultTitle,
@@ -12287,16 +12302,16 @@ function VentionDropZone({
     onDragLeave: handleDragLeave,
     onDrop: handleDrop,
     className: classes.dropZoneContainer,
-    "data-testid": "dropzoneContainer",
+    "data-testid": (_dataTestIds$containe = dataTestIds == null ? void 0 : dataTestIds.container) != null ? _dataTestIds$containe : VentionDropZoneTestIds.container,
     children: /*#__PURE__*/jsxs(Grid, {
-      "data-testid": "dropzoneContents",
+      "data-testid": (_dataTestIds$contents = dataTestIds == null ? void 0 : dataTestIds.contents) != null ? _dataTestIds$contents : VentionDropZoneTestIds.contents,
       container: true,
       className: classes.dropZoneContents,
       children: [/*#__PURE__*/jsx(Grid, {
         item: true,
         className: classes.dropZoneUploadIcon,
         children: /*#__PURE__*/jsx(VentionIcon, {
-          dataTestId: "dropzoneUploadIcon",
+          dataTestId: (_dataTestIds$uploadIc = dataTestIds == null ? void 0 : dataTestIds.uploadIcon) != null ? _dataTestIds$uploadIc : VentionDropZoneTestIds.uploadIcon,
           type: "circle-arrow-up",
           size: getDropZoneStyle(size, "iconSize")
         })
@@ -12304,16 +12319,16 @@ function VentionDropZone({
         item: true,
         className: classes.dropZoneTexts,
         children: [/*#__PURE__*/jsx("div", {
-          "data-testid": "dropzoneTitle",
+          "data-testid": (_dataTestIds$title = dataTestIds == null ? void 0 : dataTestIds.title) != null ? _dataTestIds$title : VentionDropZoneTestIds.title,
           className: classes.dropTitle,
           children: state.title
         }), state.dropZoneStatus !== DropZoneState.DraggedOver && /*#__PURE__*/jsxs(Fragment, {
           children: [/*#__PURE__*/jsx("div", {
-            "data-testid": "dropzoneCriteria",
+            "data-testid": (_dataTestIds$criteria = dataTestIds == null ? void 0 : dataTestIds.criteria) != null ? _dataTestIds$criteria : VentionDropZoneTestIds.criteria,
             className: classes.criteriaDescription,
             children: fileCriteriaDescription
           }), /*#__PURE__*/jsx("div", {
-            "data-testid": "dropzoneErrors",
+            "data-testid": (_dataTestIds$errors = dataTestIds == null ? void 0 : dataTestIds.errors) != null ? _dataTestIds$errors : VentionDropZoneTestIds.errors,
             children: state.errorMessages.map(error => {
               return /*#__PURE__*/jsxs("div", {
                 className: classes.errorMessage,
@@ -12324,7 +12339,7 @@ function VentionDropZone({
         })]
       }), /*#__PURE__*/jsx("input", {
         onChange: handleFileInputChange,
-        "data-testid": "dropzoneFileInput",
+        "data-testid": (_dataTestIds$fileInpu = dataTestIds == null ? void 0 : dataTestIds.fileInput) != null ? _dataTestIds$fileInpu : VentionDropZoneTestIds.fileInput,
         disabled: disabled,
         "aria-label": "File upload",
         type: "file",

package/package.json

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

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

@@ -15,6 +15,16 @@ export type DropZoneProps = {
     fileCriteriaDescription: string;
     defaultTitle?: string;
     disabled?: boolean;
+    dataTestIds?: Partial<Record<keyof typeof VentionDropZoneTestIds, string>>;
+};
+declare const VentionDropZoneTestIds: {
+    readonly container: "dropzoneContainer";
+    readonly contents: "dropzoneContents";
+    readonly uploadIcon: "dropzoneUploadIcon";
+    readonly title: "dropzoneTitle";
+    readonly criteria: "dropzoneCriteria";
+    readonly errors: "dropzoneErrors";
+    readonly fileInput: "dropzoneFileInput";
 };
 /**
  * Vention's custom dropzone component. Supports drag and drop as well as
@@ -22,4 +32,5 @@ export type DropZoneProps = {
  * Use onFilesSelect callback to handle file selection and validation.
  * Visualizes basic error state along with error messages returned by onFilesSelect.
  */
-export declare function VentionDropZone({ style, size, onFilesSelect, fileCriteriaDescription, defaultTitle, disabled, }: DropZoneProps): JSX.Element;
+export declare function VentionDropZone({ style, size, onFilesSelect, fileCriteriaDescription, defaultTitle, disabled, dataTestIds, }: DropZoneProps): JSX.Element;
+export {};

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

@@ -31,6 +31,10 @@ export interface VentionModalProps {
         dataTestId?: string;
     };
     backDropClickClosable?: boolean;
+    dataTestIds?: {
+        modal?: string;
+        footer?: string;
+    };
     /**
      * How to align the text and the content.
      * Defaults to "center".
@@ -44,6 +48,7 @@ export interface VentionModalProps {
 }
 export declare const VentionModal: (props: VentionModalProps) => import("react/jsx-runtime").JSX.Element;
 export declare const ventionModalTestIds: {
+    container: string;
     positiveIcon: string;
     infoIcon: string;
     loadingIcon: string;

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

@@ -8,6 +8,7 @@ export interface VentionModalBaseProps {
     children: React.ReactNode;
     isTouchDevice?: boolean;
     backDropClickClosable?: boolean;
+    dataTestId?: string;
     /**
      * The custom width will override the modals' default from the {@link modalSize}.
      * If nothing is provided, {@link modalSize} will drive the width.