techsbcn-storybook 2.10.5 → 2.11.2

package/dist/index.js

@@ -551,7 +551,7 @@ var TextFieldComponent = ({
         input: {
           className: `${noBorders ? "no-border" : ""} ${!rest.disabled && hover ? "main-border-color" : ""}
           ${endIcon ? "end-icon-padding" : ""}`,
-          disableUnderline,
+          ...variant !== "outlined" && { disableUnderline },
           startAdornment: startIcon,
           endAdornment: endIcon,
           classes: { focused: "main-border-color" },
@@ -2775,7 +2775,7 @@ var DatePickerComponent = ({
           slotProps: {
             input: {
               className: `${noBorders ? "no-border" : ""} ${!rest.disabled && hover ? "main-border-color" : ""}`,
-              disableUnderline,
+              ...variant !== "outlined" && { disableUnderline },
               startAdornment: startIcon,
               endAdornment: endIcon,
               classes: { focused: "main-border-color" },
@@ -2873,6 +2873,7 @@ var FileUploadComponent = ({ labels, onUpload }) => {
   const [file, setFile] = React10.useState(null);
   const [note, setNote] = React10.useState("");
   const [loading, setLoading] = React10.useState(false);
+  const [dragging, setDragging] = React10.useState(false);
   const save = async () => {
     if (!file) return;
     setLoading(true);
@@ -2891,16 +2892,37 @@ var FileUploadComponent = ({ labels, onUpload }) => {
     {
       component: "label",
       onDragOver: (event) => event.preventDefault(),
+      onDragEnter: () => setDragging(true),
+      onDragLeave: (event) => {
+        if (!event.currentTarget.contains(event.relatedTarget)) setDragging(false);
+      },
       onDrop: (event) => {
         event.preventDefault();
-        setFile(event.dataTransfer.files[0] ?? null);
+        setDragging(false);
+        const dropped = event.dataTransfer.files[0];
+        if (dropped) setFile(dropped);
+      },
+      sx: {
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        gap: 1,
+        p: 3,
+        border: "2px dashed",
+        borderColor: dragging ? "primary.main" : "divider",
+        bgcolor: dragging ? "action.hover" : "transparent",
+        borderRadius: 1,
+        cursor: "pointer",
+        position: "relative",
+        "&:focus-within": { borderColor: "primary.main" }
       }
     },
     /* @__PURE__ */ React10__default.default.createElement(
-      "input",
+      material.Box,
       {
+        component: "input",
         type: "file",
-        hidden: true,
+        sx: { position: "absolute", width: 1, height: 1, opacity: 0, overflow: "hidden" },
         onChange: (event) => {
           setFile(event.target.files?.[0] ?? null);
           event.target.value = "";