@majoo-ui/react 1.55.2 → 1.55.3

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

@@ -24866,7 +24866,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,7 +24904,7 @@ 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
@@ -25357,7 +25358,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

@@ -25284,14 +25284,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,7 +25328,7 @@
         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
@@ -25786,7 +25788,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.3",
   "dependencies": {
     "@majoo-ui/core": "^1.31.1",
     "@majoo-ui/helpers": "^1.30.5",