componentes-sinco 1.2.1 → 1.2.3

package/dist/index.cjs

@@ -2375,7 +2375,7 @@ function SCSelect({
   width = "100%",
   size = "small",
   variant = "outlined",
-  background = "white",
+  background,
   required,
   disabled,
   setState,
@@ -2430,7 +2430,8 @@ function SCSelect({
     {
       fullWidth: true,
       size: size ? size : "medium",
-      variant
+      variant,
+      sx: { background: background ? background : "transparent" }
     },
     /* @__PURE__ */ import_react18.default.createElement(
       import_material12.InputLabel,
@@ -2449,6 +2450,7 @@ function SCSelect({
         variant,
         disabled: disabled || false,
         error,
+        sx: { height: "32px" },
         MenuProps: {
           sx: {
             zIndex: 1400
@@ -3088,16 +3090,18 @@ var SCDateRange = ({
             },
             sx: {
               flex: 1,
-              "& .MuiOutlinedInput-root": {
-                backgroundColor: background === "transparent" ? "transparent" : background
+              "& .MuiPickersOutlinedInput-root": {
+                height: "32px",
+                backgroundColor: background != null ? background : "transparent"
+              },
+              "& .MuiPickersInputBase-sectionsContainer": {
+                height: "32px",
+                padding: "0px 8px",
+                alignItems: "center"
               },
               "& .MuiInputLabel-asterisk": {
                 color: "error.main"
-              },
-              "& .MuiPickersOutlinedInput-sectionsContainer": {
-                padding: "6px 0px"
-              },
-              background: background != null ? background : "transparent"
+              }
             }
           };
         }
@@ -3736,14 +3740,14 @@ var clampEventToVisibleRange = (event2, currentDate, startHour, endHour) => {
 
 // src/Components/Calendario/Views/MonthView.tsx
 import_dayjs5.default.extend(import_localeData.default);
-var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEventClick, onEventHover }) => {
+var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEventClick, onEventHover, seeDays = false }) => {
   const noEvents = events.length === 0;
   const days = getMonthDays(currentDate);
   const weekDays = Array.from({ length: 7 }, (_, i) => (0, import_dayjs5.default)().day(i));
   const [openDrawer, setOpenDrawer] = import_react32.default.useState(false);
   const [selectedDay, setSelectedDay] = import_react32.default.useState(null);
   const [selectedEvents, setSelectedEvents] = import_react32.default.useState([]);
-  return /* @__PURE__ */ import_react32.default.createElement(import_react32.default.Fragment, null, /* @__PURE__ */ import_react32.default.createElement(import_material21.Box, { width: "100%", sx: { overflowX: "auto" } }, /* @__PURE__ */ import_react32.default.createElement(import_material21.Box, { minWidth: CALENDAR_CONSTANTS.MIN_WIDTH }, /* @__PURE__ */ import_react32.default.createElement(import_material21.Box, { display: "grid", gridTemplateColumns: CALENDAR_CONSTANTS.GRID_TEMPLATE, gap: 0.5, mb: 1 }, weekDays.map((day) => /* @__PURE__ */ import_react32.default.createElement(import_material21.Box, { key: day.day(), textAlign: "center", py: 0.5 }, /* @__PURE__ */ import_react32.default.createElement(import_material21.Typography, { variant: "caption", color: "text.secondary" }, day.format("dddd"))))), isLoading ? /* @__PURE__ */ import_react32.default.createElement(import_material21.Box, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: CALENDAR_CONSTANTS.LOADING_CONTAINER_HEIGHT }, /* @__PURE__ */ import_react32.default.createElement(import_material21.CircularProgress, { sx: { width: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE, height: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE }, variant: "indeterminate" })) : !isLoading && noEvents ? /* @__PURE__ */ import_react32.default.createElement(
+  return /* @__PURE__ */ import_react32.default.createElement(import_react32.default.Fragment, null, /* @__PURE__ */ import_react32.default.createElement(import_material21.Box, { width: "100%", sx: { overflowX: "auto" } }, /* @__PURE__ */ import_react32.default.createElement(import_material21.Box, { minWidth: CALENDAR_CONSTANTS.MIN_WIDTH }, /* @__PURE__ */ import_react32.default.createElement(import_material21.Box, { display: "grid", gridTemplateColumns: CALENDAR_CONSTANTS.GRID_TEMPLATE, gap: 0.5, mb: 1 }, weekDays.map((day) => /* @__PURE__ */ import_react32.default.createElement(import_material21.Box, { key: day.day(), textAlign: "center", py: 0.5 }, /* @__PURE__ */ import_react32.default.createElement(import_material21.Typography, { variant: "caption", color: "text.secondary" }, day.format("dddd"))))), isLoading ? /* @__PURE__ */ import_react32.default.createElement(import_material21.Box, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: CALENDAR_CONSTANTS.LOADING_CONTAINER_HEIGHT }, /* @__PURE__ */ import_react32.default.createElement(import_material21.CircularProgress, { sx: { width: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE, height: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE }, variant: "indeterminate" })) : seeDays == false ? /* @__PURE__ */ import_react32.default.createElement(
     EmptyState,
     {
       containerHeight: "calc(100vh - 130px)",
@@ -3751,7 +3755,7 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
       subtitle: "Selecciona un mec\xE1nico y as\xEDgnale las actividades a realizar.",
       icon: /* @__PURE__ */ import_react32.default.createElement(LogoCalendario, null)
     }
-  ) : /* @__PURE__ */ import_react32.default.createElement(import_material21.Box, { display: "grid", gridTemplateColumns: CALENDAR_CONSTANTS.GRID_TEMPLATE, gap: 0.5 }, days.map((day) => {
+  ) : seeDays == true ? /* @__PURE__ */ import_react32.default.createElement(import_material21.Box, { display: "grid", gridTemplateColumns: CALENDAR_CONSTANTS.GRID_TEMPLATE, gap: 0.5 }, days.map((day) => {
     const dayEvents = filterEventsForDay(events, day);
     const isCurrentMonth = day.month() === currentDate.month();
     return /* @__PURE__ */ import_react32.default.createElement(
@@ -3842,7 +3846,7 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
         )
       )
     );
-  })))), selectedDay && /* @__PURE__ */ import_react32.default.createElement(
+  })) : null)), selectedDay && /* @__PURE__ */ import_react32.default.createElement(
     SCDrawer,
     {
       width: CALENDAR_CONSTANTS.DRAWER_WIDTH,
@@ -3883,7 +3887,8 @@ var WeekView = ({
   onEventClick,
   onEventHover,
   startHour = 0,
-  endHour = 23
+  endHour = 23,
+  seeDays = false
 }) => {
   const noEvents = events.length === 0;
   const todayString = (0, import_dayjs6.default)().format("YYYY-MM-DD");
@@ -3927,7 +3932,7 @@ var WeekView = ({
       /* @__PURE__ */ import_react33.default.createElement(import_material22.Typography, { variant: "h6", color: "text.primary" }, day.format("D")),
       /* @__PURE__ */ import_react33.default.createElement(import_material22.Typography, { variant: "caption", color: "text.secondary" }, day.format("dddd"))
     );
-  })), isLoading ? /* @__PURE__ */ import_react33.default.createElement(import_material22.Box, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: "450px" }, /* @__PURE__ */ import_react33.default.createElement(import_material22.CircularProgress, { sx: { width: "60px", height: "60px" }, variant: "indeterminate" })) : !isLoading && noEvents ? /* @__PURE__ */ import_react33.default.createElement(
+  })), isLoading ? /* @__PURE__ */ import_react33.default.createElement(import_material22.Box, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: "450px" }, /* @__PURE__ */ import_react33.default.createElement(import_material22.CircularProgress, { sx: { width: "60px", height: "60px" }, variant: "indeterminate" })) : !isLoading && seeDays == false ? /* @__PURE__ */ import_react33.default.createElement(
     EmptyState,
     {
       containerHeight: "calc(100vh - 130px)",
@@ -4020,12 +4025,13 @@ var DayView = ({
   onEventClick,
   onEventHover,
   startHour = CALENDAR_CONSTANTS.DEFAULT_START_HOUR,
-  endHour = CALENDAR_CONSTANTS.DEFAULT_END_HOUR
+  endHour = CALENDAR_CONSTANTS.DEFAULT_END_HOUR,
+  seeDays
 }) => {
   const hours = Array.from({ length: endHour - startHour + 1 }, (_, i) => startHour + i);
   const dayEvents = filterEventsForDay(events, currentDate);
   const noEvents = events.length === 0;
-  return /* @__PURE__ */ import_react34.default.createElement(import_material23.Box, { display: "flex", flexDirection: "column", height: "100%" }, /* @__PURE__ */ import_react34.default.createElement(import_material23.Box, { display: "flex", borderBottom: "1px solid", borderColor: "primary.main", bgcolor: "background.paper" }, /* @__PURE__ */ import_react34.default.createElement(import_material23.Box, { width: CALENDAR_CONSTANTS.SIDEBAR_WIDTH, bgcolor: "background.default", borderBottom: "1px solid", borderColor: "transparent" }), /* @__PURE__ */ import_react34.default.createElement(import_material23.Box, { flex: 1, display: "flex", flexDirection: "column", textAlign: "start", gap: 0.5, py: 1, bgcolor: "primary.50" }, /* @__PURE__ */ import_react34.default.createElement(import_material23.Typography, { variant: "h6", color: "text.secondary" }, currentDate.format("D")), /* @__PURE__ */ import_react34.default.createElement(import_material23.Typography, { variant: "caption", color: "text.secondary" }, currentDate.format("dddd")))), isLoading ? /* @__PURE__ */ import_react34.default.createElement(import_material23.Box, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: CALENDAR_CONSTANTS.LOADING_CONTAINER_HEIGHT }, /* @__PURE__ */ import_react34.default.createElement(import_material23.CircularProgress, { sx: { width: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE, height: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE }, variant: "indeterminate" })) : noEvents ? /* @__PURE__ */ import_react34.default.createElement(
+  return /* @__PURE__ */ import_react34.default.createElement(import_material23.Box, { display: "flex", flexDirection: "column", height: "100%" }, /* @__PURE__ */ import_react34.default.createElement(import_material23.Box, { display: "flex", borderBottom: "1px solid", borderColor: "primary.main", bgcolor: "background.paper" }, /* @__PURE__ */ import_react34.default.createElement(import_material23.Box, { width: CALENDAR_CONSTANTS.SIDEBAR_WIDTH, bgcolor: "background.default", borderBottom: "1px solid", borderColor: "transparent" }), /* @__PURE__ */ import_react34.default.createElement(import_material23.Box, { flex: 1, display: "flex", flexDirection: "column", textAlign: "start", gap: 0.5, py: 1, bgcolor: "primary.50" }, /* @__PURE__ */ import_react34.default.createElement(import_material23.Typography, { variant: "h6", color: "text.secondary" }, currentDate.format("D")), /* @__PURE__ */ import_react34.default.createElement(import_material23.Typography, { variant: "caption", color: "text.secondary" }, currentDate.format("dddd")))), isLoading ? /* @__PURE__ */ import_react34.default.createElement(import_material23.Box, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: CALENDAR_CONSTANTS.LOADING_CONTAINER_HEIGHT }, /* @__PURE__ */ import_react34.default.createElement(import_material23.CircularProgress, { sx: { width: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE, height: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE }, variant: "indeterminate" })) : seeDays == false ? /* @__PURE__ */ import_react34.default.createElement(
     EmptyState,
     {
       containerHeight: "calc(100vh - 140px)",
@@ -4140,7 +4146,8 @@ var Calendar = ({
   toolbar,
   isLoading = false,
   startHour = CALENDAR_CONSTANTS.DEFAULT_START_HOUR,
-  endHour = CALENDAR_CONSTANTS.DEFAULT_END_HOUR
+  endHour = CALENDAR_CONSTANTS.DEFAULT_END_HOUR,
+  seeDays = false
 }) => {
   const [view, setView] = (0, import_react36.useState)(initialView);
   const { currentDate, navigateDate } = useCalendarNavigation((0, import_dayjs9.default)(), onDateChange);
@@ -4189,7 +4196,8 @@ var Calendar = ({
       onDayClick,
       onMoreClick,
       onEventClick,
-      onEventHover
+      onEventHover,
+      seeDays
     }
   ), view === "week" && /* @__PURE__ */ import_react36.default.createElement(
     WeekView,
@@ -4201,7 +4209,8 @@ var Calendar = ({
       onEventClick,
       onEventHover,
       startHour,
-      endHour
+      endHour,
+      seeDays
     }
   ), view === "day" && /* @__PURE__ */ import_react36.default.createElement(
     DayView,
@@ -4211,7 +4220,8 @@ var Calendar = ({
       onEventClick,
       onEventHover,
       startHour,
-      endHour
+      endHour,
+      seeDays
     }
   )));
 };
@@ -4386,6 +4396,7 @@ function useFilteredItems(items, filterValue, getItemLabel, selectedItems) {
 // src/Components/MultiSelect/MultiSelect.tsx
 function MultiSelect({
   textButton,
+  background,
   button,
   items,
   topPanel,
@@ -4455,6 +4466,7 @@ function MultiSelect({
     /* @__PURE__ */ import_react41.default.createElement(import_material27.Stack, { minWidth: "320px", "data-testid": "multiselect-container", bgcolor: "white", boxShadow: 3, borderRadius: 1 }, /* @__PURE__ */ import_react41.default.createElement(import_material27.Stack, { py: 1, px: 2 }, topPanel != null ? topPanel : /* @__PURE__ */ import_react41.default.createElement(import_material27.FormControl, { fullWidth: true, size: "small" }, /* @__PURE__ */ import_react41.default.createElement(
       import_material27.TextField,
       {
+        sx: { background: background ? background : "transparent" },
         "data-testid": "multiselect-input",
         fullWidth: true,
         size: "small",
@@ -4729,7 +4741,7 @@ var SCActivityCalendar = ({
           padding: "0px 16px"
         },
         fontSize: "12px !important",
-        height: "260px !important",
+        height: "324px !important",
         background: background ? background : "white",
         "& .MuiDayCalendar-header": { justifyContent: "space-between" },
         "& .MuiDayCalendar-weekContainer": { justifyContent: "space-between" },
@@ -4739,7 +4751,7 @@ var SCActivityCalendar = ({
       },
       onChange: (newValue) => setFecha(newValue)
     }
-  ), /* @__PURE__ */ import_react45.default.createElement(import_Grid6.default, { container: true, justifyContent: "center" }, /* @__PURE__ */ import_react45.default.createElement(import_material31.IconButton, { "data-testid": "close-calendar-button", onClick: toggleCalendar(false) }, /* @__PURE__ */ import_react45.default.createElement(import_KeyboardDoubleArrowUp.default, { color: "action" }))))), /* @__PURE__ */ import_react45.default.createElement(import_material31.IconButton, { onClick: handleClickPopoverFiltro, sx: { position: "fixed", right: "calc(100% - 96%)", top: openCalendar == false ? "220px" : "380px" } }, /* @__PURE__ */ import_react45.default.createElement(import_FilterList.default, { color: "action" })), /* @__PURE__ */ import_react45.default.createElement(
+  ), /* @__PURE__ */ import_react45.default.createElement(import_Grid6.default, { container: true, justifyContent: "center" }, /* @__PURE__ */ import_react45.default.createElement(import_material31.IconButton, { "data-testid": "close-calendar-button", onClick: toggleCalendar(false) }, /* @__PURE__ */ import_react45.default.createElement(import_KeyboardDoubleArrowUp.default, { color: "action" }))))), /* @__PURE__ */ import_react45.default.createElement(import_material31.IconButton, { onClick: handleClickPopoverFiltro, sx: { position: "fixed", right: "calc(100% - 96%)", top: openCalendar == false ? "220px" : "444px" } }, /* @__PURE__ */ import_react45.default.createElement(import_FilterList.default, { color: "action" })), /* @__PURE__ */ import_react45.default.createElement(
     import_material31.Popover,
     {
       open: openPopoverFiltro,
@@ -5015,7 +5027,7 @@ var SCCalendarSwipeable = ({
           padding: "0px 16px"
         },
         fontSize: "12px !important",
-        height: "260px !important",
+        height: "324px !important",
         background: background ? background : "white",
         "& .MuiDayCalendar-header": { justifyContent: "space-between" },
         "& .MuiDayCalendar-weekContainer": { justifyContent: "space-between" },