mendix · Keraito · Sep 1, 2021 · Aug 31, 2021 · Aug 31, 2021 · Aug 31, 2021
diff --git a/packages/jsActions/nanoflow-actions-hybrid/package.json b/packages/jsActions/nanoflow-actions-hybrid/package.json
@@ -54,7 +54,7 @@
     "concurrently": "^5.3.0",
     "eslint": "^7.20.0",
     "npm-watch": "^0.6.0",
-    "typescript": "^4.0.5",
+    "typescript": "~4.3.5",
     "rimraf": "^2.7.1"
   }
 }
diff --git a/packages/jsActions/nanoflow-actions-hybrid/src/camera/ScanBarcode.ts b/packages/jsActions/nanoflow-actions-hybrid/src/camera/ScanBarcode.ts
@@ -12,7 +12,7 @@
 /**
  * @returns {Promise.<string>}
  */
-export async function ScanBarcode(): Promise<string> {
+export async function ScanBarcode(): Promise<string | void> {
     // BEGIN USER CODE
     // Documentation https://github.com/phonegap/phonegap-plugin-barcodescanner
     return new Promise((resolve, reject) => {

diff --git a/packages/jsActions/nanoflow-actions-hybrid/src/contacts/SelectContact.ts b/packages/jsActions/nanoflow-actions-hybrid/src/contacts/SelectContact.ts
@@ -12,7 +12,7 @@
 /**
  * @returns {Promise.<MxObject>}
  */
-export async function SelectContact(): Promise<mendix.lib.MxObject> {
+export async function SelectContact(): Promise<mendix.lib.MxObject | void> {
     // BEGIN USER CODE
     // Documentation: https://github.com/apache/cordova-plugin-contacts
     return new Promise((resolve, reject) => {

@@ -0,0 +1 @@
+Please see [Image](https://docs.mendix.com/appstore/widgets/image) in the Mendix documentation for details.
@@ -1,6 +1,6 @@
 {
-  "name": "image-viewer-web",
-  "widgetName": "ImageViewer",
+  "name": "image-web",
+  "widgetName": "Image",
   "version": "1.0.0",
   "description": "Display an image and enlarge it on click",
   "copyright": "© Mendix Technology BV 2021. All rights reserved.",

@@ -7,10 +7,10 @@ import {
     StructurePreviewProps,
     transformGroupsIntoTabs
 } from "@mendix/piw-utils-internal";
-import { DatasourceEnum, ImageViewerPreviewProps } from "../typings/ImageViewerProps";
+import { DatasourceEnum, ImagePreviewProps } from "../typings/ImageProps";
 import StructurePreviewImageViewerSvg from "./assets/placeholder.svg";
 
-type ImageViewPreviewPropsKey = keyof ImageViewerPreviewProps;
+type ImageViewPreviewPropsKey = keyof ImagePreviewProps;
 
 const dataSourceProperties: ImageViewPreviewPropsKey[] = ["imageObject", "imageUrl", "imageIcon"];
 
@@ -40,7 +40,7 @@ function reorderTabsForStudio(tabs: Properties): void {
 }
 
 export function getProperties(
-    values: ImageViewerPreviewProps,
+    values: ImagePreviewProps,
     defaultProperties: Properties,
     platform: "web" | "desktop"
 ): Properties {
@@ -88,7 +88,7 @@ export function getPreview(): StructurePreviewProps | null {
     };
 }
 
-export function check(values: ImageViewerPreviewProps): Problem[] {
+export function check(values: ImagePreviewProps): Problem[] {
     const errors: Problem[] = [];
 
     if (values.datasource === "imageUrl" && !values.imageUrl) {

@@ -1,14 +1,14 @@
 import { parseStyle } from "@mendix/piw-utils-internal";
 import { WebIcon } from "mendix";
 import { createElement, ReactElement } from "react";
-import { ImageViewerPreviewProps } from "../typings/ImageViewerProps";
-import { ImageViewer as ImageViewerComponent } from "./components/ImageViewer/index";
+import { ImagePreviewProps } from "../typings/ImageProps";
+import { ImageViewer as ImageViewerComponent } from "./components/Image/index";
 
 import ImageViewerPlaceholder from "./assets/placeholder.svg";
 
 declare function require(name: string): string;
 
-export function preview(props: ImageViewerPreviewProps): ReactElement | null {
+export function preview(props: ImagePreviewProps): ReactElement | null {
     let image = ImageViewerPlaceholder;
     switch (props.datasource) {
         case "image":
@@ -58,5 +58,5 @@ export function preview(props: ImageViewerPreviewProps): ReactElement | null {
 }
 
 export function getPreviewCss(): string {
-    return require("./ui/ImageViewer.scss");
+    return require("./ui/Image.scss");
 }
@@ -1,15 +1,15 @@
 import { ValueStatus } from "mendix";
 import { createElement, FunctionComponent, useCallback } from "react";
-import { ImageViewerContainerProps } from "../typings/ImageViewerProps";
-import { ImageViewer as ImageViewerComponent, ImageViewerImageProps } from "./components/ImageViewer/index";
+import { ImageContainerProps } from "../typings/ImageProps";
+import { ImageViewer as ImageViewerComponent, ImageViewerImageProps } from "./components/Image/index";
 
 function getImageProps({
     datasource,
     imageIcon,
     imageObject,
     imageUrl,
     defaultImageDynamic
-}: ImageViewerContainerProps): ImageViewerImageProps {
+}: ImageContainerProps): ImageViewerImageProps {
     const fallback: ImageViewerImageProps = {
         type: "image",
         image: undefined
@@ -62,7 +62,7 @@ function getImageProps({
     }
 }
 
-export const ImageViewer: FunctionComponent<ImageViewerContainerProps> = props => {
+export const ImageViewer: FunctionComponent<ImageContainerProps> = props => {
     const onClick = useCallback(() => props.onClick?.execute(), [props.onClick]);
     const { type, image } = getImageProps(props);
 

@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="utf-8" ?>
-<widget id="com.mendix.widget.web.imageviewer.ImageViewer" needsEntityContext="false" offlineCapable="true" xmlns="http://www.mendix.com/widget/1.0/" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.mendix.com/widget/1.0/ ../../../node_modules/mendix/custom_widget.xsd" pluginWidget="true">
+<widget id="com.mendix.widget.web.image.Image" needsEntityContext="false" offlineCapable="true" xmlns="http://www.mendix.com/widget/1.0/" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.mendix.com/widget/1.0/ ../../../node_modules/mendix/custom_widget.xsd" pluginWidget="true">
     <name>Image viewer</name>
     <description>Display an image and enlarge it on click.</description>
     <icon>iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAABnlBMVEUAAAD///+A//9V//+Av/9mzP9gv/9Vxv9Ns/9duf9Vv/9Osf9Jtv9Vu/9Qv/9LtP9RvP9Jtv9Osf9Ktf9Ms/9Puf9Ns/9Ktf9Ms/hKtfhOsfhNs/lLtPlLtPlKtflIsflMs/pJsfpNs/pIsvpKsPpLtPtKsftJsvtJsvdJs/hLtPhKsfhJsvhXV1dLsflKsvlKsvlKsvlKsvpKsvdKs/dJsfdIsvhKsPhJsfhKsPhJsvhKsfhIsPlKsflJsPlKsflIsflJsvdKsvdJsfhJsPhJsfhKsvhIsvhJsfhIsPhKsfhJsvlJsfdJsfdIsPdKsfdJsfdJsfdIsfdIsfhIsfhIsfhJsfhJsfhIsPhJsPhIsfhJsfdJsfdJsfdJsfdIsPdJsfdJsPhIsfhJsfhIsfhJsfhIsfhJsfhJsPhJsfhJsfhIsfhIsPhJsfdIsPdJsPdVVVVJsfdJsfdJsfdIsPdJsfdIsPdIsPdJsfhJsPhIsPhJsfhIsPhIsfhJsfhJsPhIsfhJsfhJsPhIsPhIsfhJsPhJsPhIsfhIsPdVVVU8lPiOAAAAiHRSTlMAAQIDBAUICQoLDA0ODxARExUXGBsdHh8lJicoKSwtLi8xMjU3PT4/QkZHSElJUlNWWV1gZGVqa2xucHV4eXt8f4SHiYuMjpGTm5yeoKGio6SnqaqtsbO2uLm+wMHEyMnLzM3O0NHU1dba3d7f4eLj4+Tn6Onr7O3u7/Dy8/T19vf4+fr7/P3+LOCsiQAAAeRJREFUeAHt1/lTEmEYwPHHhYyiLEjtPtLu0siOsLL7MLtNOjRLs8MyU7Q7K4hyv/7Xve/sLrAzArPvMFPT7Oen9wf4MsDz7OyKI9QxvWBgukM8Ru9XBfEsGKpvQAL6/wORY48+5ieu7zIN7HiG4+5yo0B7Hs/oMoNA4i0lN4IHkreA+Ssbmva/BOztAQP7nqL1iBJ7BfQGCxy30WYt0Q4C44ECbb9Qih+7BpgLFLgN2BOF0WbTQBboFEsUs6/wDXBnx+xHfAKcXuKcV5j8jZdwmQ7SqhlcpqO8e5Yi/zJt6ZvMTfXvrBWQRO+YOws/feucLqDZFwwvKJ02rrRRIPkBz/dmk8AAkDsU3/sJuGkQSKGcVIejgN1eM9DYfX/yx+uH3S3iSLwHHkfUyXoODNcKdGVx/L62VrR+IL9JtD0oqaoB6yIlubS7UpwSRwZ401gl0HAHn0xs9TtgJCKOdQWgp0rgPEr+3PrYxhMv0IYH9FBtFs9l4GuyYqALJeu83Dr8GdcZKWrSI9FXKdAyB0y1iqt1BI2xqJSkgfltFQL39Ki1SVF8CKWwVcpEx4HBxQMplCNSZukgcFZ8DqAsGojPAEMNUm5l5svVqPg9cAP/2D1SeJcWBsLA398F84euOj32hf4AR3v7uNFLZj0AAAAASUVORK5CYII=</icon>

@@ -1,10 +1,10 @@
 import { cloneElement, createElement, CSSProperties, FunctionComponent, useCallback } from "react";
-import { HeightUnitEnum, WidthUnitEnum, OnClickTypeEnum, DisplayAsEnum } from "../../../typings/ImageViewerProps";
+import { HeightUnitEnum, WidthUnitEnum, OnClickTypeEnum, DisplayAsEnum } from "../../../typings/ImageProps";
 import { useLightboxState } from "../../utils/lightboxState";
 import { ImageViewerUi, ImageViewerContentProps } from "./ui";
 import { Lightbox, LightboxProps } from "../Lightbox";
 
-import "../../ui/ImageViewer.scss";
+import "../../ui/Image.scss";
 
 export type ImageViewerImageProps = {
     type: "image" | "icon";

@@ -1,9 +1,9 @@
 import { createElement, CSSProperties, HTMLAttributes, ReactElement, ReactEventHandler } from "react";
 import classNames from "classnames";
-import { HeightUnitEnum, WidthUnitEnum } from "../../../typings/ImageViewerProps";
+import { HeightUnitEnum, WidthUnitEnum } from "../../../typings/ImageProps";
 import { LightboxProps } from "../Lightbox";
 
-import "../../ui/ImageViewer.scss";
+import "../../ui/Image.scss";
 
 function getStyle(value: string | number, type: WidthUnitEnum | HeightUnitEnum): number | string {
     // when type is auto default browser styles applies

@@ -1,6 +1,6 @@
 import { createElement } from "react";
 import { mount, render } from "enzyme";
-import { ImageViewer, ImageViewerProps } from "../ImageViewer/index";
+import { ImageViewer, ImageViewerProps } from "../Image/index";
 import { Lightbox } from "../Lightbox";
 import { ModalProps } from "react-overlays/esm/Modal";
 

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<package xmlns="http://www.mendix.com/package/1.0/">
+    <clientModule name="Image" version="1.0.0" xmlns="http://www.mendix.com/clientModule/1.0/">
+        <widgetFiles>
+            <widgetFile path="Image.xml"/>
+        </widgetFiles>
+        <files>
+            <file path="com/mendix/widget/web/image"/>
+        </files>
+    </clientModule>
+</package>
@@ -1,5 +1,5 @@
 /**
- * This file was generated from ImageViewer.xml
+ * This file was generated from Image.xml
  * WARNING: All changes made to this file will be overwritten
  * @author Mendix UI Content Team
  */
@@ -16,7 +16,7 @@ export type HeightUnitEnum = "auto" | "pixels";
 
 export type DisplayAsEnum = "fullImage" | "thumbnail";
 
-export interface ImageViewerContainerProps {
+export interface ImageContainerProps {
     name: string;
     class: string;
     style?: CSSProperties;
@@ -38,7 +38,7 @@ export interface ImageViewerContainerProps {
     responsive: boolean;
 }
 
-export interface ImageViewerPreviewProps {
+export interface ImagePreviewProps {
     class: string;
     style: string;
     datasource: DatasourceEnum;

@@ -33,7 +33,7 @@
     "cross-env": "^7.0.2",
     "concurrently": "^5.3.0",
     "fast-xml-parser": "^3.17.5",
-    "typescript": "^4.0.5"
+    "typescript": "~4.3.5"
   },
   "dependencies": {}
 }
@@ -57,7 +57,7 @@
     "tsconfig-paths": "^3.9.0",
     "tslint": "^6.1.3",
     "tslint-eslint-rules": "^5.4.0",
-    "typescript": "^4.0.5",
+    "typescript": "~4.3.5",
     "webpack": "^5.3.2",
     "webpack-cli": "^4.1.0",
     "webpack-dev-server": "^3.11.0",

@@ -14,7 +14,7 @@
   "devDependencies": {
     "@mendix/pluggable-widgets-tools": ">=8.9.2",
     "eslint": "^7.20.0",
-    "typescript": "^4.0.5",
+    "typescript": "~4.3.5",
     "rimraf": "^2.7.1"
   }
 }
@@ -16,7 +16,7 @@
   "devDependencies": {
     "@mendix/pluggable-widgets-tools": ">=8.9.2",
     "eslint": "^7.20.0",
-    "typescript": "^4.0.5",
+    "typescript": "~4.3.5",
     "rimraf": "^2.7.1"
   }
 }
@@ -5,13 +5,16 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ## [Unreleased]
 
+## [9.5.0] - 2021-09-01
+
 ### Added
 - We added support for icon and tile images. Now you can use an image file instead of `<icon>` in your `MyWidget.xml`. In order to use, please make sure you follow the pattern `src/MyWidget.icon.png` (24x24px) and `src/MyWidget.tile.png` (256x192px)
 
 ### Changed
 - We fixed the formatting of Preview typings
 - We fixed the Preview typings for Icon property.
-- We downgraded the version of `rollup-plugin-sass` to 1.2.4 in order to prevent a library version issue throwing `The "path" argument must be of type string. Received an instance of RegExp`.
+- We defined a fixed version of `typescript` to 4.3.5 in order to prevent processes to be hanging after creates the widget mpk. See issue [here](https://github.com/rollup/rollup/issues/4213)
+- We updated Mendix library to 9.5.0
 
 ## [9.4.3] - 2021-08-12