@majoo-ui/react 1.55.2 → 1.55.4

package/components/devicePreview/DevicePreview.d.ts

@@ -42,6 +42,11 @@ interface Props {
      * @default false
      */
     withComponent?: boolean;
+    /**
+     * option for use device preview with clickable or not clickable component
+     * @default true
+     */
+    clickableComponent?: boolean;
     /**
      * option device preview variant
      * @default 'default'

package/index.esm.js

@@ -8250,6 +8250,8 @@ const _excluded$e = ["size", "onChange", "css", "disabled"];
 var _jsxFileName$y = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputSearchbox\\InputSearchbox.js";
 
 const InputSearchbox = _ref => {
+  var _props$value;
+
   let {
     size,
     onChange,
@@ -8259,6 +8261,7 @@ const InputSearchbox = _ref => {
       props = _objectWithoutPropertiesLoose(_ref, _excluded$e);
 
   const [value, setValue] = React__default.useState('');
+  const inputValue = (_props$value = props === null || props === void 0 ? void 0 : props.value) !== null && _props$value !== void 0 ? _props$value : value;
   const handleChange = React__default.useCallback(e => {
     setValue(e.target.value);
 
@@ -8283,7 +8286,7 @@ const InputSearchbox = _ref => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$y,
-      lineNumber: 30,
+      lineNumber: 31,
       columnNumber: 5
     }
   }, /*#__PURE__*/React__default.createElement(InputLeftElement, {
@@ -8291,14 +8294,14 @@ const InputSearchbox = _ref => {
       __self: undefined,
       __source: {
         fileName: _jsxFileName$y,
-        lineNumber: 31,
+        lineNumber: 32,
         columnNumber: 35
       }
     }),
     __self: undefined,
     __source: {
       fileName: _jsxFileName$y,
-      lineNumber: 31,
+      lineNumber: 32,
       columnNumber: 7
     }
   }), /*#__PURE__*/React__default.createElement(InputText, _extends({
@@ -8312,30 +8315,30 @@ const InputSearchbox = _ref => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$y,
-      lineNumber: 32,
+      lineNumber: 33,
       columnNumber: 7
     }
   })), /*#__PURE__*/React__default.createElement(InputRightElement, {
-    children: value.length > 0 ? /*#__PURE__*/React__default.createElement(SvgCloseFilled, {
+    children: inputValue.length > 0 ? /*#__PURE__*/React__default.createElement(SvgCloseFilled, {
       __self: undefined,
       __source: {
         fileName: _jsxFileName$y,
-        lineNumber: 41,
-        columnNumber: 55
+        lineNumber: 42,
+        columnNumber: 60
       }
     }) : /*#__PURE__*/React__default.createElement("div", {
       __self: undefined,
       __source: {
         fileName: _jsxFileName$y,
-        lineNumber: 41,
-        columnNumber: 73
+        lineNumber: 42,
+        columnNumber: 78
       }
     }),
     onClick: handleClearButtonClick,
     __self: undefined,
     __source: {
       fileName: _jsxFileName$y,
-      lineNumber: 41,
+      lineNumber: 42,
       columnNumber: 7
     }
   }));
@@ -24866,7 +24869,8 @@ const IFrameComponent = ({
 const Device = props => {
   const {
     withComponent,
-    content
+    content,
+    clickableComponent = true
   } = props;
   const [currentImgIdx, setImageIdx] = React.useState(0);
   const [, setRender] = React.useState(0);
@@ -24903,10 +24907,10 @@ const Device = props => {
       properties = Object.assign(Object.assign({}, properties), {
         typeDevice: img$j,
         cssImage: {
-          top: withComponent ? '6.5%' : '2.5%',
+          top: withComponent && clickableComponent ? '6.5%' : '2.5%',
           width: withComponent ? '87%' : '88%'
         },
-        ratio: withComponent ? 9 / 18.8 : 9 / 19.5
+        ratio: withComponent && clickableComponent ? 9 / 18.8 : 9 / 19.5
       });
       break;
 
@@ -25357,7 +25361,7 @@ const Device = props => {
         style: {
           width: props.size ? props.size : undefined,
           position: 'relative',
-          zIndex: withComponent || (props === null || props === void 0 ? void 0 : props.variant) === 'whatsapp' || (props === null || props === void 0 ? void 0 : props.variant) === 'email' ? 1 : 2
+          zIndex: withComponent && clickableComponent || (props === null || props === void 0 ? void 0 : props.variant) === 'whatsapp' || (props === null || props === void 0 ? void 0 : props.variant) === 'email' ? 1 : 2
         },
         src: properties.typeDevice,
         alt: "device-preview"

package/index.umd.js

@@ -8328,6 +8328,8 @@
   var _jsxFileName$y = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\form\\components\\InputSearchbox\\InputSearchbox.js";
 
   const InputSearchbox = _ref => {
+    var _props$value;
+
     let {
       size,
       onChange,
@@ -8337,6 +8339,7 @@
         props = _objectWithoutPropertiesLoose(_ref, _excluded$e);
 
     const [value, setValue] = React__default["default"].useState('');
+    const inputValue = (_props$value = props === null || props === void 0 ? void 0 : props.value) !== null && _props$value !== void 0 ? _props$value : value;
     const handleChange = React__default["default"].useCallback(e => {
       setValue(e.target.value);
 
@@ -8361,7 +8364,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$y,
-        lineNumber: 30,
+        lineNumber: 31,
         columnNumber: 5
       }
     }, /*#__PURE__*/React__default["default"].createElement(InputLeftElement, {
@@ -8369,14 +8372,14 @@
         __self: undefined,
         __source: {
           fileName: _jsxFileName$y,
-          lineNumber: 31,
+          lineNumber: 32,
           columnNumber: 35
         }
       }),
       __self: undefined,
       __source: {
         fileName: _jsxFileName$y,
-        lineNumber: 31,
+        lineNumber: 32,
         columnNumber: 7
       }
     }), /*#__PURE__*/React__default["default"].createElement(InputText, _extends({
@@ -8390,30 +8393,30 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$y,
-        lineNumber: 32,
+        lineNumber: 33,
         columnNumber: 7
       }
     })), /*#__PURE__*/React__default["default"].createElement(InputRightElement, {
-      children: value.length > 0 ? /*#__PURE__*/React__default["default"].createElement(SvgCloseFilled, {
+      children: inputValue.length > 0 ? /*#__PURE__*/React__default["default"].createElement(SvgCloseFilled, {
         __self: undefined,
         __source: {
           fileName: _jsxFileName$y,
-          lineNumber: 41,
-          columnNumber: 55
+          lineNumber: 42,
+          columnNumber: 60
         }
       }) : /*#__PURE__*/React__default["default"].createElement("div", {
         __self: undefined,
         __source: {
           fileName: _jsxFileName$y,
-          lineNumber: 41,
-          columnNumber: 73
+          lineNumber: 42,
+          columnNumber: 78
         }
       }),
       onClick: handleClearButtonClick,
       __self: undefined,
       __source: {
         fileName: _jsxFileName$y,
-        lineNumber: 41,
+        lineNumber: 42,
         columnNumber: 7
       }
     }));
@@ -25284,14 +25287,16 @@
 
   var Device = function Device(props) {
     var withComponent = props.withComponent,
-        content = props.content;
-
-    var _a = React__namespace.useState(0),
-        currentImgIdx = _a[0],
-        setImageIdx = _a[1];
+        content = props.content,
+        _a = props.clickableComponent,
+        clickableComponent = _a === void 0 ? true : _a;
 
     var _b = React__namespace.useState(0),
-        setRender = _b[1];
+        currentImgIdx = _b[0],
+        setImageIdx = _b[1];
+
+    var _c = React__namespace.useState(0),
+        setRender = _c[1];
 
     var properties = {
       typeDevice: '',
@@ -25326,10 +25331,10 @@
         properties = __assign(__assign({}, properties), {
           typeDevice: img$j,
           cssImage: {
-            top: withComponent ? '6.5%' : '2.5%',
+            top: withComponent && clickableComponent ? '6.5%' : '2.5%',
             width: withComponent ? '87%' : '88%'
           },
-          ratio: withComponent ? 9 / 18.8 : 9 / 19.5
+          ratio: withComponent && clickableComponent ? 9 / 18.8 : 9 / 19.5
         });
         break;
 
@@ -25786,7 +25791,7 @@
           style: {
             width: props.size ? props.size : undefined,
             position: 'relative',
-            zIndex: withComponent || (props === null || props === void 0 ? void 0 : props.variant) === 'whatsapp' || (props === null || props === void 0 ? void 0 : props.variant) === 'email' ? 1 : 2
+            zIndex: withComponent && clickableComponent || (props === null || props === void 0 ? void 0 : props.variant) === 'whatsapp' || (props === null || props === void 0 ? void 0 : props.variant) === 'email' ? 1 : 2
           },
           src: properties.typeDevice,
           alt: "device-preview"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@majoo-ui/react",
-  "version": "1.55.2",
+  "version": "1.55.4",
   "dependencies": {
     "@majoo-ui/core": "^1.31.1",
     "@majoo-ui/helpers": "^1.30.5",