componentes-sinco 1.3.0 → 1.3.1

package/dist/index.d.cts

@@ -271,9 +271,10 @@ interface FooterActionsProperties {
     leftContent?: React.ReactNode;
     rightContent?: React.ReactNode;
     variant?: 'standard' | 'float';
+    width?: string;
 }
 
-declare const FooterAction: ({ leftContent, rightContent, label, variant, }: FooterActionsProperties) => React__default.JSX.Element;
+declare const FooterAction: ({ leftContent, rightContent, label, variant, width, }: FooterActionsProperties) => React__default.JSX.Element;
 
 interface BasicMenuProps {
     open?: boolean;

package/dist/index.d.ts

@@ -271,9 +271,10 @@ interface FooterActionsProperties {
     leftContent?: React.ReactNode;
     rightContent?: React.ReactNode;
     variant?: 'standard' | 'float';
+    width?: string;
 }
 
-declare const FooterAction: ({ leftContent, rightContent, label, variant, }: FooterActionsProperties) => React__default.JSX.Element;
+declare const FooterAction: ({ leftContent, rightContent, label, variant, width, }: FooterActionsProperties) => React__default.JSX.Element;
 
 interface BasicMenuProps {
     open?: boolean;

package/dist/index.js

@@ -1765,6 +1765,8 @@ function SCSelect({
   const labelContent = `<span style="color: red;">* </span>` + label;
   const [prevData, setPrevData] = React12.useState(data);
   const [error, setError] = React12.useState(false);
+  const [placement, setPlacement] = React12.useState("bottom");
+  const containerRef = React12.useRef(null);
   useEffect9(() => {
     if (error) {
       setTimeout(() => {
@@ -1793,6 +1795,14 @@ function SCSelect({
     const isError = !currentValue && !!required;
     setError(Boolean(isError));
   };
+  const handleOpen = () => {
+    if (containerRef.current) {
+      const rect = containerRef.current.getBoundingClientRect();
+      const spaceBelow = window.innerHeight - rect.bottom;
+      const estimatedMenuHeight = Math.min(300, data.length * 36 + 16);
+      setPlacement(spaceBelow < estimatedMenuHeight ? "top" : "bottom");
+    }
+  };
   const handleChange = (event2) => {
     const selectedValue = event2.target.value;
     if (selectedValue) {
@@ -1806,7 +1816,7 @@ function SCSelect({
       }
     }
   };
-  return /* @__PURE__ */ React12.createElement(React12.Fragment, null, data && /* @__PURE__ */ React12.createElement(Box7, { sx: { width } }, /* @__PURE__ */ React12.createElement(
+  return /* @__PURE__ */ React12.createElement(React12.Fragment, null, data && /* @__PURE__ */ React12.createElement(Box7, { ref: containerRef, sx: { width } }, /* @__PURE__ */ React12.createElement(
     FormControl2,
     {
       fullWidth: true,
@@ -1828,6 +1838,7 @@ function SCSelect({
         label: required ? /* @__PURE__ */ React12.createElement("span", { dangerouslySetInnerHTML: { __html: labelContent } }) : label,
         onChange: handleChange,
         onBlur: handleBlur,
+        onOpen: handleOpen,
         variant,
         disabled: disabled || false,
         error,
@@ -1835,7 +1846,6 @@ function SCSelect({
         MenuProps: {
           sx: {
             zIndex: 1400
-            // muy alto para que quede encima
           },
           PaperProps: {
             sx: {
@@ -1844,11 +1854,11 @@ function SCSelect({
             }
           },
           anchorOrigin: {
-            vertical: "bottom",
+            vertical: placement,
             horizontal: "left"
           },
           transformOrigin: {
-            vertical: "top",
+            vertical: placement === "bottom" ? "top" : "bottom",
             horizontal: "left"
           },
           disableAutoFocusItem: true,
@@ -4246,13 +4256,14 @@ var FooterAction = ({
   leftContent,
   rightContent,
   label,
-  variant
+  variant,
+  width
 }) => {
   return /* @__PURE__ */ React33.createElement(
     AppBar,
     {
       color: "inherit",
-      sx: { position: variant == "float" ? "relative" : "fixed", left: 0, right: "auto", width: "100%", top: "auto", bottom: 0 }
+      sx: { position: variant == "float" ? "relative" : "fixed", left: variant == "float" ? "auto" : "50%", transform: variant == "float" ? "none" : "translateX(-50%)", margin: variant == "float" ? "0 auto" : void 0, right: "auto", width: width != null ? width : "100%", top: "auto", bottom: 0 }
     },
     /* @__PURE__ */ React33.createElement(
       Toolbar,