@mw-kit/mw-ui 1.8.16 → 1.8.17

package/dist/index.js

@@ -17297,9 +17297,11 @@ var CanvasContainer = import_styled_components72.default.div`
     font-size: 59px;
     line-height: 71px;
     opacity: 0.1;
+    z-index: 1;
   }
 
   canvas {
+    position: relative;
     display: block;
     width: 100%;
     height: 100%;
@@ -17307,6 +17309,7 @@ var CanvasContainer = import_styled_components72.default.div`
     border: 1px solid
       ${({ theme: theme4, $invalid: invalid }) => theme4.colors[invalid ? "warningRed" : "lightGrey"]};
     border-radius: 4px;
+    z-index: 2;
   }
 
   /* icons container */
@@ -17316,6 +17319,7 @@ var CanvasContainer = import_styled_components72.default.div`
     right: ${({ theme: theme4 }) => theme4.spacings.s3};
     display: flex;
     gap: ${({ theme: theme4 }) => theme4.spacings.s1};
+    z-index: 3;
 
     > button {
       padding: 0;
@@ -17434,6 +17438,7 @@ var SignatureInput = ({
     ref.clear();
     setValue("");
   }, [ref]);
+  const empty = (0, import_react62.useMemo)(() => !value && (!ref || ref.isEmpty()), [ref, value]);
   return /* @__PURE__ */ (0, import_jsx_runtime360.jsxs)(Container26, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(
       Input_default,
@@ -17491,20 +17496,12 @@ var SignatureInput = ({
                   if (!ref || ref.isEmpty()) return;
                   setValue(ref.getTrimmedCanvas().toDataURL("image/png"));
                 },
-                disabled: !ref || ref.isEmpty(),
+                disabled: empty,
                 title: "Recortar",
                 children: /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(Icon_default, { type: "semantic", icon: "cut" })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(
-              "button",
-              {
-                onClick: onClearHandler,
-                disabled: !ref || ref.isEmpty(),
-                title: "Limpar",
-                children: /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(Icon_default, { type: "semantic", icon: "eraser" })
-              }
-            )
+            /* @__PURE__ */ (0, import_jsx_runtime360.jsx)("button", { onClick: onClearHandler, disabled: empty, title: "Limpar", children: /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(Icon_default, { type: "semantic", icon: "eraser" }) })
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(
             import_react_signature_canvas.default,

package/dist/index.mjs

@@ -17201,7 +17201,7 @@ var ProgressBar = ({ type, value, ...props }) => {
 var ProgressBar_default = ProgressBar;
 
 // src/components/Signature/index.tsx
-import { useCallback as useCallback5, useEffect as useEffect21, useState as useState24 } from "react";
+import { useCallback as useCallback5, useEffect as useEffect21, useMemo as useMemo2, useState as useState24 } from "react";
 import SignatureCanvas from "react-signature-canvas";
 
 // src/components/Signature/styles.ts
@@ -17233,9 +17233,11 @@ var CanvasContainer = styled69.div`
     font-size: 59px;
     line-height: 71px;
     opacity: 0.1;
+    z-index: 1;
   }
 
   canvas {
+    position: relative;
     display: block;
     width: 100%;
     height: 100%;
@@ -17243,6 +17245,7 @@ var CanvasContainer = styled69.div`
     border: 1px solid
       ${({ theme: theme4, $invalid: invalid }) => theme4.colors[invalid ? "warningRed" : "lightGrey"]};
     border-radius: 4px;
+    z-index: 2;
   }
 
   /* icons container */
@@ -17252,6 +17255,7 @@ var CanvasContainer = styled69.div`
     right: ${({ theme: theme4 }) => theme4.spacings.s3};
     display: flex;
     gap: ${({ theme: theme4 }) => theme4.spacings.s1};
+    z-index: 3;
 
     > button {
       padding: 0;
@@ -17370,6 +17374,7 @@ var SignatureInput = ({
     ref.clear();
     setValue("");
   }, [ref]);
+  const empty = useMemo2(() => !value && (!ref || ref.isEmpty()), [ref, value]);
   return /* @__PURE__ */ jsxs182(Container26, { children: [
     /* @__PURE__ */ jsx360(
       Input_default,
@@ -17427,20 +17432,12 @@ var SignatureInput = ({
                   if (!ref || ref.isEmpty()) return;
                   setValue(ref.getTrimmedCanvas().toDataURL("image/png"));
                 },
-                disabled: !ref || ref.isEmpty(),
+                disabled: empty,
                 title: "Recortar",
                 children: /* @__PURE__ */ jsx360(Icon_default, { type: "semantic", icon: "cut" })
               }
             ),
-            /* @__PURE__ */ jsx360(
-              "button",
-              {
-                onClick: onClearHandler,
-                disabled: !ref || ref.isEmpty(),
-                title: "Limpar",
-                children: /* @__PURE__ */ jsx360(Icon_default, { type: "semantic", icon: "eraser" })
-              }
-            )
+            /* @__PURE__ */ jsx360("button", { onClick: onClearHandler, disabled: empty, title: "Limpar", children: /* @__PURE__ */ jsx360(Icon_default, { type: "semantic", icon: "eraser" }) })
           ] }),
           /* @__PURE__ */ jsx360(
             SignatureCanvas,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mw-kit/mw-ui",
-  "version": "1.8.16",
+  "version": "1.8.17",
   "description": "Made with create-react-library",
   "author": "fmgusmao",
   "license": "MIT",