componentes-sinco 1.2.1 → 1.2.3

package/dist/index.d.cts

@@ -97,6 +97,7 @@ interface CalendarProps {
     isLoading?: boolean;
     startHour?: number;
     endHour?: number;
+    seeDays?: boolean;
 }
 
 declare const Calendar: React__default.FC<CalendarProps>;
@@ -336,6 +337,7 @@ declare const SCModal: ({ buttonModal, state, open, setOpen, title, description,
 
 interface MultiSelectProps<T> {
     textButton?: string;
+    background?: string;
     button?: {
         icon?: string;
         text?: string;
@@ -379,7 +381,7 @@ declare function useFilteredItems<T>(items: T[], filterValue: string, getItemLab
     sortedItems: T[];
 };
 
-declare function MultiSelect<T>({ textButton, button, items, topPanel, actions, dense, open, selectAll, getItemLabel }: MultiSelectProps<T>): React__default.JSX.Element;
+declare function MultiSelect<T>({ textButton, background, button, items, topPanel, actions, dense, open, selectAll, getItemLabel }: MultiSelectProps<T>): React__default.JSX.Element;
 
 interface PageheaderProperties {
     title: string | React.ReactNode;
@@ -454,7 +456,7 @@ declare const SCTextField: ({ title, iconTitle, infoTitle, label, placeholder, i
 interface SCAccordionProps {
     title?: string;
     actions?: React__default.ReactNode;
-    children?: React__default.ReactNode;
+    children?: any;
 }
 declare const SCAccordion: ({ title, actions, children, }: SCAccordionProps) => React__default.JSX.Element;
 

package/dist/index.d.ts

@@ -97,6 +97,7 @@ interface CalendarProps {
     isLoading?: boolean;
     startHour?: number;
     endHour?: number;
+    seeDays?: boolean;
 }
 
 declare const Calendar: React__default.FC<CalendarProps>;
@@ -336,6 +337,7 @@ declare const SCModal: ({ buttonModal, state, open, setOpen, title, description,
 
 interface MultiSelectProps<T> {
     textButton?: string;
+    background?: string;
     button?: {
         icon?: string;
         text?: string;
@@ -379,7 +381,7 @@ declare function useFilteredItems<T>(items: T[], filterValue: string, getItemLab
     sortedItems: T[];
 };
 
-declare function MultiSelect<T>({ textButton, button, items, topPanel, actions, dense, open, selectAll, getItemLabel }: MultiSelectProps<T>): React__default.JSX.Element;
+declare function MultiSelect<T>({ textButton, background, button, items, topPanel, actions, dense, open, selectAll, getItemLabel }: MultiSelectProps<T>): React__default.JSX.Element;
 
 interface PageheaderProperties {
     title: string | React.ReactNode;
@@ -454,7 +456,7 @@ declare const SCTextField: ({ title, iconTitle, infoTitle, label, placeholder, i
 interface SCAccordionProps {
     title?: string;
     actions?: React__default.ReactNode;
-    children?: React__default.ReactNode;
+    children?: any;
 }
 declare const SCAccordion: ({ title, actions, children, }: SCAccordionProps) => React__default.JSX.Element;
 

package/dist/index.js

@@ -2289,7 +2289,7 @@ function SCSelect({
   width = "100%",
   size = "small",
   variant = "outlined",
-  background = "white",
+  background,
   required,
   disabled,
   setState,
@@ -2344,7 +2344,8 @@ function SCSelect({
     {
       fullWidth: true,
       size: size ? size : "medium",
-      variant
+      variant,
+      sx: { background: background ? background : "transparent" }
     },
     /* @__PURE__ */ React14.createElement(
       InputLabel2,
@@ -2363,6 +2364,7 @@ function SCSelect({
         variant,
         disabled: disabled || false,
         error,
+        sx: { height: "32px" },
         MenuProps: {
           sx: {
             zIndex: 1400
@@ -3002,16 +3004,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"
+              }
             }
           };
         }
@@ -3650,14 +3654,14 @@ var clampEventToVisibleRange = (event2, currentDate, startHour, endHour) => {
 
 // src/Components/Calendario/Views/MonthView.tsx
 dayjs5.extend(localeData);
-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) => dayjs5().day(i));
   const [openDrawer, setOpenDrawer] = React28.useState(false);
   const [selectedDay, setSelectedDay] = React28.useState(null);
   const [selectedEvents, setSelectedEvents] = React28.useState([]);
-  return /* @__PURE__ */ React28.createElement(React28.Fragment, null, /* @__PURE__ */ React28.createElement(Box16, { width: "100%", sx: { overflowX: "auto" } }, /* @__PURE__ */ React28.createElement(Box16, { minWidth: CALENDAR_CONSTANTS.MIN_WIDTH }, /* @__PURE__ */ React28.createElement(Box16, { display: "grid", gridTemplateColumns: CALENDAR_CONSTANTS.GRID_TEMPLATE, gap: 0.5, mb: 1 }, weekDays.map((day) => /* @__PURE__ */ React28.createElement(Box16, { key: day.day(), textAlign: "center", py: 0.5 }, /* @__PURE__ */ React28.createElement(Typography14, { variant: "caption", color: "text.secondary" }, day.format("dddd"))))), isLoading ? /* @__PURE__ */ React28.createElement(Box16, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: CALENDAR_CONSTANTS.LOADING_CONTAINER_HEIGHT }, /* @__PURE__ */ React28.createElement(CircularProgress2, { sx: { width: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE, height: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE }, variant: "indeterminate" })) : !isLoading && noEvents ? /* @__PURE__ */ React28.createElement(
+  return /* @__PURE__ */ React28.createElement(React28.Fragment, null, /* @__PURE__ */ React28.createElement(Box16, { width: "100%", sx: { overflowX: "auto" } }, /* @__PURE__ */ React28.createElement(Box16, { minWidth: CALENDAR_CONSTANTS.MIN_WIDTH }, /* @__PURE__ */ React28.createElement(Box16, { display: "grid", gridTemplateColumns: CALENDAR_CONSTANTS.GRID_TEMPLATE, gap: 0.5, mb: 1 }, weekDays.map((day) => /* @__PURE__ */ React28.createElement(Box16, { key: day.day(), textAlign: "center", py: 0.5 }, /* @__PURE__ */ React28.createElement(Typography14, { variant: "caption", color: "text.secondary" }, day.format("dddd"))))), isLoading ? /* @__PURE__ */ React28.createElement(Box16, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: CALENDAR_CONSTANTS.LOADING_CONTAINER_HEIGHT }, /* @__PURE__ */ React28.createElement(CircularProgress2, { sx: { width: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE, height: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE }, variant: "indeterminate" })) : seeDays == false ? /* @__PURE__ */ React28.createElement(
     EmptyState,
     {
       containerHeight: "calc(100vh - 130px)",
@@ -3665,7 +3669,7 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
       subtitle: "Selecciona un mec\xE1nico y as\xEDgnale las actividades a realizar.",
       icon: /* @__PURE__ */ React28.createElement(LogoCalendario, null)
     }
-  ) : /* @__PURE__ */ React28.createElement(Box16, { display: "grid", gridTemplateColumns: CALENDAR_CONSTANTS.GRID_TEMPLATE, gap: 0.5 }, days.map((day) => {
+  ) : seeDays == true ? /* @__PURE__ */ React28.createElement(Box16, { 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__ */ React28.createElement(
@@ -3756,7 +3760,7 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
         )
       )
     );
-  })))), selectedDay && /* @__PURE__ */ React28.createElement(
+  })) : null)), selectedDay && /* @__PURE__ */ React28.createElement(
     SCDrawer,
     {
       width: CALENDAR_CONSTANTS.DRAWER_WIDTH,
@@ -3797,7 +3801,8 @@ var WeekView = ({
   onEventClick,
   onEventHover,
   startHour = 0,
-  endHour = 23
+  endHour = 23,
+  seeDays = false
 }) => {
   const noEvents = events.length === 0;
   const todayString = dayjs6().format("YYYY-MM-DD");
@@ -3841,7 +3846,7 @@ var WeekView = ({
       /* @__PURE__ */ React29.createElement(Typography15, { variant: "h6", color: "text.primary" }, day.format("D")),
       /* @__PURE__ */ React29.createElement(Typography15, { variant: "caption", color: "text.secondary" }, day.format("dddd"))
     );
-  })), isLoading ? /* @__PURE__ */ React29.createElement(Box17, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: "450px" }, /* @__PURE__ */ React29.createElement(CircularProgress3, { sx: { width: "60px", height: "60px" }, variant: "indeterminate" })) : !isLoading && noEvents ? /* @__PURE__ */ React29.createElement(
+  })), isLoading ? /* @__PURE__ */ React29.createElement(Box17, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: "450px" }, /* @__PURE__ */ React29.createElement(CircularProgress3, { sx: { width: "60px", height: "60px" }, variant: "indeterminate" })) : !isLoading && seeDays == false ? /* @__PURE__ */ React29.createElement(
     EmptyState,
     {
       containerHeight: "calc(100vh - 130px)",
@@ -3934,12 +3939,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__ */ React30.createElement(Box18, { display: "flex", flexDirection: "column", height: "100%" }, /* @__PURE__ */ React30.createElement(Box18, { display: "flex", borderBottom: "1px solid", borderColor: "primary.main", bgcolor: "background.paper" }, /* @__PURE__ */ React30.createElement(Box18, { width: CALENDAR_CONSTANTS.SIDEBAR_WIDTH, bgcolor: "background.default", borderBottom: "1px solid", borderColor: "transparent" }), /* @__PURE__ */ React30.createElement(Box18, { flex: 1, display: "flex", flexDirection: "column", textAlign: "start", gap: 0.5, py: 1, bgcolor: "primary.50" }, /* @__PURE__ */ React30.createElement(Typography16, { variant: "h6", color: "text.secondary" }, currentDate.format("D")), /* @__PURE__ */ React30.createElement(Typography16, { variant: "caption", color: "text.secondary" }, currentDate.format("dddd")))), isLoading ? /* @__PURE__ */ React30.createElement(Box18, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: CALENDAR_CONSTANTS.LOADING_CONTAINER_HEIGHT }, /* @__PURE__ */ React30.createElement(CircularProgress4, { sx: { width: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE, height: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE }, variant: "indeterminate" })) : noEvents ? /* @__PURE__ */ React30.createElement(
+  return /* @__PURE__ */ React30.createElement(Box18, { display: "flex", flexDirection: "column", height: "100%" }, /* @__PURE__ */ React30.createElement(Box18, { display: "flex", borderBottom: "1px solid", borderColor: "primary.main", bgcolor: "background.paper" }, /* @__PURE__ */ React30.createElement(Box18, { width: CALENDAR_CONSTANTS.SIDEBAR_WIDTH, bgcolor: "background.default", borderBottom: "1px solid", borderColor: "transparent" }), /* @__PURE__ */ React30.createElement(Box18, { flex: 1, display: "flex", flexDirection: "column", textAlign: "start", gap: 0.5, py: 1, bgcolor: "primary.50" }, /* @__PURE__ */ React30.createElement(Typography16, { variant: "h6", color: "text.secondary" }, currentDate.format("D")), /* @__PURE__ */ React30.createElement(Typography16, { variant: "caption", color: "text.secondary" }, currentDate.format("dddd")))), isLoading ? /* @__PURE__ */ React30.createElement(Box18, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: CALENDAR_CONSTANTS.LOADING_CONTAINER_HEIGHT }, /* @__PURE__ */ React30.createElement(CircularProgress4, { sx: { width: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE, height: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE }, variant: "indeterminate" })) : seeDays == false ? /* @__PURE__ */ React30.createElement(
     EmptyState,
     {
       containerHeight: "calc(100vh - 140px)",
@@ -4054,7 +4060,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] = useState14(initialView);
   const { currentDate, navigateDate } = useCalendarNavigation(dayjs9(), onDateChange);
@@ -4103,7 +4110,8 @@ var Calendar = ({
       onDayClick,
       onMoreClick,
       onEventClick,
-      onEventHover
+      onEventHover,
+      seeDays
     }
   ), view === "week" && /* @__PURE__ */ React31.createElement(
     WeekView,
@@ -4115,7 +4123,8 @@ var Calendar = ({
       onEventClick,
       onEventHover,
       startHour,
-      endHour
+      endHour,
+      seeDays
     }
   ), view === "day" && /* @__PURE__ */ React31.createElement(
     DayView,
@@ -4125,7 +4134,8 @@ var Calendar = ({
       onEventClick,
       onEventHover,
       startHour,
-      endHour
+      endHour,
+      seeDays
     }
   )));
 };
@@ -4300,6 +4310,7 @@ function useFilteredItems(items, filterValue, getItemLabel, selectedItems) {
 // src/Components/MultiSelect/MultiSelect.tsx
 function MultiSelect({
   textButton,
+  background,
   button,
   items,
   topPanel,
@@ -4369,6 +4380,7 @@ function MultiSelect({
     /* @__PURE__ */ React34.createElement(Stack12, { minWidth: "320px", "data-testid": "multiselect-container", bgcolor: "white", boxShadow: 3, borderRadius: 1 }, /* @__PURE__ */ React34.createElement(Stack12, { py: 1, px: 2 }, topPanel != null ? topPanel : /* @__PURE__ */ React34.createElement(FormControl3, { fullWidth: true, size: "small" }, /* @__PURE__ */ React34.createElement(
       TextField4,
       {
+        sx: { background: background ? background : "transparent" },
         "data-testid": "multiselect-input",
         fullWidth: true,
         size: "small",
@@ -4643,7 +4655,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" },
@@ -4653,7 +4665,7 @@ var SCActivityCalendar = ({
       },
       onChange: (newValue) => setFecha(newValue)
     }
-  ), /* @__PURE__ */ React38.createElement(Grid9, { container: true, justifyContent: "center" }, /* @__PURE__ */ React38.createElement(IconButton13, { "data-testid": "close-calendar-button", onClick: toggleCalendar(false) }, /* @__PURE__ */ React38.createElement(KeyboardDoubleArrowUpIcon, { color: "action" }))))), /* @__PURE__ */ React38.createElement(IconButton13, { onClick: handleClickPopoverFiltro, sx: { position: "fixed", right: "calc(100% - 96%)", top: openCalendar == false ? "220px" : "380px" } }, /* @__PURE__ */ React38.createElement(FilterListIcon, { color: "action" })), /* @__PURE__ */ React38.createElement(
+  ), /* @__PURE__ */ React38.createElement(Grid9, { container: true, justifyContent: "center" }, /* @__PURE__ */ React38.createElement(IconButton13, { "data-testid": "close-calendar-button", onClick: toggleCalendar(false) }, /* @__PURE__ */ React38.createElement(KeyboardDoubleArrowUpIcon, { color: "action" }))))), /* @__PURE__ */ React38.createElement(IconButton13, { onClick: handleClickPopoverFiltro, sx: { position: "fixed", right: "calc(100% - 96%)", top: openCalendar == false ? "220px" : "444px" } }, /* @__PURE__ */ React38.createElement(FilterListIcon, { color: "action" })), /* @__PURE__ */ React38.createElement(
     Popover6,
     {
       open: openPopoverFiltro,
@@ -4929,7 +4941,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" },