componentes-sinco 1.1.31 → 1.1.33

package/dist/index.cjs

@@ -1533,51 +1533,68 @@ var validateInputs = (arrayElements, onError, onSuccess, setChipFilters, setText
 
 // src/Components/Drawer/Helpers/validateTypeElement.tsx
 var import_react10 = __toESM(require("react"), 1);
+var COMPONENT_NAME_MAP = {
+  SCtextField: "textField",
+  SCtextArea: "textArea",
+  SCDateRange: "dateRange",
+  SCDatePicker: "datePicker",
+  SCTime: "time",
+  SCAutocomplete: "autocomplete",
+  SCSelect: "select"
+};
+var getComponentName = (node) => {
+  const type = node.type;
+  return typeof type === "function" ? type.displayName || type.name || "" : "";
+};
+var isKnownComponent = (node) => {
+  var _a;
+  const name = getComponentName(node);
+  if (COMPONENT_NAME_MAP[name]) return true;
+  if (((_a = node.props) == null ? void 0 : _a.typeFormat) === "multiselect") return true;
+  return false;
+};
+var findInTree = (node) => {
+  var _a;
+  if (!import_react10.default.isValidElement(node)) return null;
+  if (isKnownComponent(node)) return node;
+  const children = (_a = node.props) == null ? void 0 : _a.children;
+  if (!children) return null;
+  for (const child of import_react10.default.Children.toArray(children)) {
+    if (import_react10.default.isValidElement(child)) {
+      const found = findInTree(child);
+      if (found) return found;
+    }
+  }
+  return null;
+};
+var resolveValidation = (node) => {
+  var _a;
+  const name = getComponentName(node);
+  if (((_a = node.props) == null ? void 0 : _a.typeFormat) === "multiselect") return "multiselect";
+  return COMPONENT_NAME_MAP[name] || "";
+};
 var validateTypeElements = (element) => {
   var _a;
   let validation = "";
   let typeElement = element;
-  if (element.type == "textField") {
-    validation = "textField";
-    typeElement = element;
-  } else if (import_react10.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCtextField") {
-    validation = "textField";
-    typeElement = element == null ? void 0 : element.component.props;
-  } else if (element.type == "textArea") {
-    validation = "textArea";
-    typeElement = element;
-  } else if (import_react10.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCtextArea") {
-    validation = "textArea";
-    typeElement = element == null ? void 0 : element.component.props;
-  } else if (element.type == "dateRange") {
-    validation = "dateRange";
-    typeElement = element;
-  } else if (import_react10.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCDateRange") {
-    validation = "dateRange";
-    typeElement = element == null ? void 0 : element.component.props;
-  } else if (element.type == "autocomplete") {
-    validation = "autocomplete";
+  if (element.type && COMPONENT_NAME_MAP[(_a = Object.keys(COMPONENT_NAME_MAP).find((k) => COMPONENT_NAME_MAP[k] === element.type)) != null ? _a : ""]) {
+    validation = element.type;
     typeElement = element;
-  } else if (import_react10.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCAutocomplete") {
-    validation = "autocomplete";
-    typeElement = element == null ? void 0 : element.component.props;
-  } else if (element.typeFormat == "multiselect") {
+  } else if (element.typeFormat === "multiselect") {
     validation = "multiselect";
     typeElement = element;
-  } else if (import_react10.default.isValidElement(element == null ? void 0 : element.component) && element.component.props && ((_a = element == null ? void 0 : element.component) == null ? void 0 : _a.props).typeFormat == "multiselect") {
-    validation = "multiselect";
-    typeElement = element == null ? void 0 : element.component.props;
-  } else if (element.type == "select") {
-    validation = "select";
-    typeElement = element;
-  } else if (import_react10.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCSelect") {
-    validation = "select";
-    typeElement = element == null ? void 0 : element.component.props;
+  } else if (import_react10.default.isValidElement(element == null ? void 0 : element.component) && isKnownComponent(element.component)) {
+    const node = element.component;
+    validation = resolveValidation(node);
+    typeElement = node.props;
+  } else if (import_react10.default.isValidElement(element == null ? void 0 : element.component)) {
+    const found = findInTree(element.component);
+    if (found) {
+      validation = resolveValidation(found);
+      typeElement = found.props;
+    }
   }
-  return {
-    validation,
-    element: typeElement
-  };
+  return { validation, element: typeElement };
 };
 
 // src/Components/Drawer/hooks/useDrawerState.ts
@@ -1642,11 +1659,11 @@ var useChipFilters = (arrayElements, chipFilters) => {
   const processManualFilters = () => {
     const newFiltersToAdd = [];
     arrayElements.forEach((element) => {
-      var _a, _b, _c, _d;
+      var _a, _b, _c, _d, _e, _f, _g, _h;
       const { validation, element: typeElement } = validateTypeElements(element);
       const textValue = ((_a = typeElement.state) == null ? void 0 : _a.textValue) !== void 0 ? String((_b = typeElement.state) == null ? void 0 : _b.textValue) : String(typeElement.state);
       if (textValue.trim() !== "" && textValue.trim() !== "," && textValue.trim() !== "undefined") {
-        const value = validation === "dateRange" ? `${(_c = typeElement.state[0]) == null ? void 0 : _c.format("DD/MM/YYYY")} - ${(_d = typeElement.state[1]) == null ? void 0 : _d.format("DD/MM/YYYY")}` : textValue;
+        const value = validation === "dateRange" ? `${(_c = typeElement.state[0]) == null ? void 0 : _c.format("DD/MM/YYYY")} - ${(_d = typeElement.state[1]) == null ? void 0 : _d.format("DD/MM/YYYY")}` : validation === "datePicker" ? (_f = (_e = typeElement.state) == null ? void 0 : _e.format("DD/MM/YYYY")) != null ? _f : "" : validation === "time" ? (_h = (_g = typeElement.state) == null ? void 0 : _g.format("HH:mm")) != null ? _h : "" : textValue;
         const existingFilterIndex = newFiltersToAdd.findIndex(
           (filter) => filter.arrayElement.label === element.label
         );
@@ -1674,20 +1691,26 @@ var useChipFilters = (arrayElements, chipFilters) => {
     });
   };
   const getCurrentValue = (validation, typeElement) => {
-    var _a, _b, _c, _d, _e;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i;
     if (validation === "dateRange") {
       if (((_a = typeElement.state) == null ? void 0 : _a[0]) && ((_b = typeElement.state) == null ? void 0 : _b[1])) {
         return `${(_c = typeElement.state[0]) == null ? void 0 : _c.format("DD/MM/YYYY")} - ${(_d = typeElement.state[1]) == null ? void 0 : _d.format("DD/MM/YYYY")}`;
       }
       return "";
     }
-    return ((_e = typeElement.state) == null ? void 0 : _e.textValue) !== void 0 ? String(typeElement.state.textValue).trim() : String(typeElement.state).trim();
+    if (validation === "datePicker") {
+      return ((_f = (_e = typeElement.state) == null ? void 0 : _e.isValid) == null ? void 0 : _f.call(_e)) ? typeElement.state.format("DD/MM/YYYY") : "";
+    }
+    if (validation === "time") {
+      return ((_h = (_g = typeElement.state) == null ? void 0 : _g.isValid) == null ? void 0 : _h.call(_g)) ? typeElement.state.format("HH:mm") : "";
+    }
+    return ((_i = typeElement.state) == null ? void 0 : _i.textValue) !== void 0 ? String(typeElement.state.textValue).trim() : String(typeElement.state).trim();
   };
   const updateFilter = (value, typeElement, label) => {
     setTextFilters((prevFilters) => {
       const newFilter = { value, arrayElement: typeElement };
       const existingFilterIndex = prevFilters.findIndex(
-        (filter) => filter.arrayElement.label === label
+        (filter) => label !== void 0 ? filter.arrayElement.label === label : filter.value === value
       );
       if (existingFilterIndex !== -1) {
         const updatedFilters = [...prevFilters];
@@ -1753,6 +1776,10 @@ var resetElementByType = (originalElement, validation, typeElement) => {
     case "dateRange":
       defaultValue = [null, null];
       break;
+    case "datePicker":
+    case "time":
+      defaultValue = null;
+      break;
     case "multiselect":
       defaultValue = { hiddenValue: [], textValue: [] };
       break;
@@ -1843,7 +1870,7 @@ var ChipFiltersDisplay = ({
       scrollRef.current.scrollLeft += offset;
     }
   };
-  return /* @__PURE__ */ import_react15.default.createElement(import_material9.Box, { display: "flex", alignItems: "center", sx: { maxWidth: "78%" } }, /* @__PURE__ */ import_react15.default.createElement(import_material9.IconButton, { onClick: () => scroll(-150), size: "small" }, /* @__PURE__ */ import_react15.default.createElement(import_ChevronLeft.default, { fontSize: "small", color: "action" })), /* @__PURE__ */ import_react15.default.createElement(
+  return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, (textFilters == null ? void 0 : textFilters.length) > 0 && /* @__PURE__ */ import_react15.default.createElement(import_material9.Box, { display: "flex", alignItems: "center", sx: { maxWidth: "78%" } }, /* @__PURE__ */ import_react15.default.createElement(import_material9.IconButton, { onClick: () => scroll(-150), size: "small" }, /* @__PURE__ */ import_react15.default.createElement(import_ChevronLeft.default, { fontSize: "small", color: "action" })), /* @__PURE__ */ import_react15.default.createElement(
     import_material9.Box,
     {
       ref: scrollRef,
@@ -1870,7 +1897,7 @@ var ChipFiltersDisplay = ({
         }
       })
     ))
-  ), /* @__PURE__ */ import_react15.default.createElement(import_material9.IconButton, { onClick: () => scroll(150), size: "small" }, /* @__PURE__ */ import_react15.default.createElement(import_ChevronRight.default, { fontSize: "small", color: "action" })));
+  ), /* @__PURE__ */ import_react15.default.createElement(import_material9.IconButton, { onClick: () => scroll(150), size: "small" }, /* @__PURE__ */ import_react15.default.createElement(import_ChevronRight.default, { fontSize: "small", color: "action" }))));
 };
 
 // src/Components/Drawer/components/DrawerContent.tsx
@@ -2486,7 +2513,8 @@ function SCAutocomplete({
   setState,
   state,
   inputChange,
-  maxCheck
+  maxCheck,
+  width = "100%"
 }) {
   const labelContent = `<span style="color: red;">* </span>` + label;
   let group = "";
@@ -2578,13 +2606,26 @@ function SCAutocomplete({
   ) || null;
   const [open, setOpen] = import_react19.default.useState(false);
   const componentClickActiveRef = import_react19.default.useRef(false);
+  const containerRef = import_react19.default.useRef(null);
+  const [chipLimit, setChipLimit] = import_react19.default.useState(2);
+  (0, import_react19.useEffect)(() => {
+    const el = containerRef.current;
+    if (!el) return;
+    const observer = new ResizeObserver((entries) => {
+      const width2 = entries[0].contentRect.width;
+      const limit = Math.max(1, Math.floor((width2 - 80) / 128));
+      setChipLimit(limit);
+    });
+    observer.observe(el);
+    return () => observer.disconnect();
+  }, []);
   const hayOnComponentClickGlobal = (0, import_react19.useMemo)(() => {
     return data.some((opt) => {
       const item = getItemValue(opt);
       return Boolean(item.onComponentClick);
     });
   }, [data, getItemValue]);
-  return /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, data && /* @__PURE__ */ import_react19.default.createElement(
+  return /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, data && /* @__PURE__ */ import_react19.default.createElement(import_material13.Box, { ref: containerRef, sx: { width } }, /* @__PURE__ */ import_react19.default.createElement(
     import_material13.Autocomplete,
     __spreadProps(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, hayOnComponentClickGlobal ? { disableCloseOnSelect: true } : {}), hayOnComponentClickGlobal ? { blurOnSelect: false } : {}), hayOnComponentClickGlobal ? { open } : {}), hayOnComponentClickGlobal ? { onOpen: () => setOpen(true) } : {}), hayOnComponentClickGlobal ? {
       onClose: (event2, reason) => {
@@ -2614,9 +2655,9 @@ function SCAutocomplete({
         width: "100%",
         maxWidth: "100%"
       },
-      limitTags: 2,
+      limitTags: chipLimit,
       renderTags: (value, getTagProps) => {
-        const limit = 2;
+        const limit = chipLimit;
         return /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, value.slice(0, limit).map((option, index) => {
           const _a = getTagProps({ index }), { key } = _a, chipProps = __objRest(_a, ["key"]);
           return /* @__PURE__ */ import_react19.default.createElement(
@@ -2699,7 +2740,14 @@ function SCAutocomplete({
       },
       renderInput: (params) => /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, /* @__PURE__ */ import_react19.default.createElement(
         import_material13.TextField,
-        __spreadProps(__spreadValues({}, params), {
+        __spreadProps(__spreadValues({
+          sx: { "& .MuiOutlinedInput-input": {
+            padding: "2.5px 2px 2.5px 2px !important",
+            // ajusta aquí
+            width: "10px !important",
+            minWidth: "10px !important"
+          } }
+        }, params), {
           label: required ? /* @__PURE__ */ import_react19.default.createElement("span", { dangerouslySetInnerHTML: { __html: labelContent } }) : label,
           placeholder: selectedOptions.length == 0 ? "B\xFAsqueda" : "",
           InputProps: __spreadProps(__spreadValues({}, params.InputProps), {
@@ -2774,7 +2822,7 @@ function SCAutocomplete({
         }
       }
     })
-  ));
+  )));
 }
 
 // src/Components/SCDateRange.tsx
@@ -4642,11 +4690,9 @@ var SCAppBar = ({
   };
   (0, import_react46.useEffect)(() => {
     const handleOnline = () => {
-      console.log("tiene internet");
       setIsOnline(true);
     };
     const handleOffline = () => {
-      console.log(" no tiene internet");
       setIsOnline(false);
     };
     window.addEventListener("online", handleOnline);
@@ -5122,7 +5168,6 @@ function SCDataGridInitial({ data, columns, getRowId, groupColumns, titleRowsPag
       columnVisibilityModel[col.field] = false;
     }
   });
-  console.log("columnVisibilityModel:", columnVisibilityModel);
   const initialState = {
     pagination: { paginationModel: { pageSize: rows } }
   };