componentes-sinco 1.0.8 → 1.0.9

package/dist/index.d.cts

@@ -501,8 +501,28 @@ interface SCTimeProps {
 }
 declare const SCTime: ({ label, required, disabled, background, timeStep, state, setState, }: SCTimeProps) => React__default.JSX.Element;
 
+interface SCCardProps {
+    title?: string;
+    subtitle?: string;
+    iconTitle?: React__default.ReactNode | React__default.ReactElement | keyof typeof Muicon;
+    actionsTitle?: any;
+    image?: any;
+    content?: any;
+    actions?: {
+        text?: string;
+        fn: () => void;
+        disabled?: boolean;
+    }[];
+    expand?: {
+        type?: 'icon' | 'text';
+        position?: 'top' | 'bottom';
+        content?: string;
+    };
+}
+declare const SCCard: ({ title, image, iconTitle, actionsTitle, subtitle, content, actions, expand }: SCCardProps) => React__default.JSX.Element;
+
 declare const SincoTheme: _mui_material_styles.Theme;
 declare let AdproSincoTheme: _mui_material_styles.Theme;
 declare let ADCSincoTheme: _mui_material_styles.Theme;
 
-export { ADCSincoTheme, AdproSincoTheme, Calendar, type CalendarEvent, type CalendarProps, type CalendarView, EmptyState, type EmptyStateProperties, type EmptyStateSize, type EmptyStateStates, FooterAction, type FooterActionsProperties, type ModalProps, type ModalStates, MultiSelect, type MultiSelectProps, PageHeader, type PageheaderProperties, type ReplyPalette$1 as ReplyPalette, type ReplyTextPalette, type ReplyVariants, type RepplyButtonVariants, SCAutocomplete, SCCalendarSwipeable, SCDataGrid, SCDataGridInitial, SCDateRange, SCDialog, SCDrawer, SCMenu, SCModal, SCSelect, SCTabs, SCTextArea, type SCTextAreaProps, SCTextField, type SCTextFieldProps, SCTime, SCToastNotification, SincoTheme, type ToastBaseProperties, ToastProgress, type ToastType, capitalize, getButtonColor, getIcon, getIconComponent, getIconMultiSelect, getModalColor, modalStateConfig, useFilteredItems, useMultiSelectHandlers, useProgress };
+export { ADCSincoTheme, AdproSincoTheme, Calendar, type CalendarEvent, type CalendarProps, type CalendarView, EmptyState, type EmptyStateProperties, type EmptyStateSize, type EmptyStateStates, FooterAction, type FooterActionsProperties, type ModalProps, type ModalStates, MultiSelect, type MultiSelectProps, PageHeader, type PageheaderProperties, type ReplyPalette$1 as ReplyPalette, type ReplyTextPalette, type ReplyVariants, type RepplyButtonVariants, SCAutocomplete, SCCalendarSwipeable, SCCard, SCDataGrid, SCDataGridInitial, SCDateRange, SCDialog, SCDrawer, SCMenu, SCModal, SCSelect, SCTabs, SCTextArea, type SCTextAreaProps, SCTextField, type SCTextFieldProps, SCTime, SCToastNotification, SincoTheme, type ToastBaseProperties, ToastProgress, type ToastType, capitalize, getButtonColor, getIcon, getIconComponent, getIconMultiSelect, getModalColor, modalStateConfig, useFilteredItems, useMultiSelectHandlers, useProgress };

package/dist/index.d.ts

@@ -501,8 +501,28 @@ interface SCTimeProps {
 }
 declare const SCTime: ({ label, required, disabled, background, timeStep, state, setState, }: SCTimeProps) => React__default.JSX.Element;
 
+interface SCCardProps {
+    title?: string;
+    subtitle?: string;
+    iconTitle?: React__default.ReactNode | React__default.ReactElement | keyof typeof Muicon;
+    actionsTitle?: any;
+    image?: any;
+    content?: any;
+    actions?: {
+        text?: string;
+        fn: () => void;
+        disabled?: boolean;
+    }[];
+    expand?: {
+        type?: 'icon' | 'text';
+        position?: 'top' | 'bottom';
+        content?: string;
+    };
+}
+declare const SCCard: ({ title, image, iconTitle, actionsTitle, subtitle, content, actions, expand }: SCCardProps) => React__default.JSX.Element;
+
 declare const SincoTheme: _mui_material_styles.Theme;
 declare let AdproSincoTheme: _mui_material_styles.Theme;
 declare let ADCSincoTheme: _mui_material_styles.Theme;
 
-export { ADCSincoTheme, AdproSincoTheme, Calendar, type CalendarEvent, type CalendarProps, type CalendarView, EmptyState, type EmptyStateProperties, type EmptyStateSize, type EmptyStateStates, FooterAction, type FooterActionsProperties, type ModalProps, type ModalStates, MultiSelect, type MultiSelectProps, PageHeader, type PageheaderProperties, type ReplyPalette$1 as ReplyPalette, type ReplyTextPalette, type ReplyVariants, type RepplyButtonVariants, SCAutocomplete, SCCalendarSwipeable, SCDataGrid, SCDataGridInitial, SCDateRange, SCDialog, SCDrawer, SCMenu, SCModal, SCSelect, SCTabs, SCTextArea, type SCTextAreaProps, SCTextField, type SCTextFieldProps, SCTime, SCToastNotification, SincoTheme, type ToastBaseProperties, ToastProgress, type ToastType, capitalize, getButtonColor, getIcon, getIconComponent, getIconMultiSelect, getModalColor, modalStateConfig, useFilteredItems, useMultiSelectHandlers, useProgress };
+export { ADCSincoTheme, AdproSincoTheme, Calendar, type CalendarEvent, type CalendarProps, type CalendarView, EmptyState, type EmptyStateProperties, type EmptyStateSize, type EmptyStateStates, FooterAction, type FooterActionsProperties, type ModalProps, type ModalStates, MultiSelect, type MultiSelectProps, PageHeader, type PageheaderProperties, type ReplyPalette$1 as ReplyPalette, type ReplyTextPalette, type ReplyVariants, type RepplyButtonVariants, SCAutocomplete, SCCalendarSwipeable, SCCard, SCDataGrid, SCDataGridInitial, SCDateRange, SCDialog, SCDrawer, SCMenu, SCModal, SCSelect, SCTabs, SCTextArea, type SCTextAreaProps, SCTextField, type SCTextFieldProps, SCTime, SCToastNotification, SincoTheme, type ToastBaseProperties, ToastProgress, type ToastType, capitalize, getButtonColor, getIcon, getIconComponent, getIconMultiSelect, getModalColor, modalStateConfig, useFilteredItems, useMultiSelectHandlers, useProgress };

package/dist/index.js

@@ -2841,7 +2841,6 @@ var CalendarToolbar = ({
   };
   const getFormattedDate = () => {
     const sunday = labelDate.day(0);
-    const saturday = sunday.add(6, "day");
     if (view === "month") {
       const textMonth = labelDate.format("MMMM YYYY");
       return textMonth.charAt(0).toUpperCase() + textMonth.slice(1);
@@ -2976,7 +2975,7 @@ var CalendarEventCard = ({ event: event2, color, sx, onClick, onHover }) => {
           onMouseEnter: handlePopoverOpen,
           onMouseLeave: handlePopoverClose
         },
-        capitalize(event2.title)
+        event2.title.charAt(0).toUpperCase() + event2.title.slice(1).toLowerCase()
       ),
       /* @__PURE__ */ React21.createElement(
         Popover4,
@@ -2996,7 +2995,7 @@ var CalendarEventCard = ({ event: event2, color, sx, onClick, onHover }) => {
           onClose: handlePopoverClose,
           disableRestoreFocus: true
         },
-        onHover ? onHover(event2) : /* @__PURE__ */ React21.createElement(Typography17, null, "Sin contenido")
+        onHover ? onHover(event2) : " "
       )
     )
   );
@@ -3412,9 +3411,15 @@ var Calendar = ({
   const handleNavigate = (action) => {
     let newDate = currentDate;
     const unit = view === "month" ? "month" : "day";
-    if (action === "PREV") newDate = currentDate.subtract(1, unit);
-    else if (action === "NEXT") newDate = currentDate.add(1, unit);
-    else if (action === "TODAY") newDate = dayjs7();
+    if (action === "PREV") {
+      if (view === "day") newDate = currentDate.subtract(1, "day");
+      if (view === "week") newDate = currentDate.subtract(1, "week");
+      if (view === "month") newDate = currentDate.subtract(1, "month");
+    } else if (action === "NEXT") {
+      if (view === "day") newDate = currentDate.add(1, "day");
+      if (view === "week") newDate = currentDate.add(1, "week");
+      if (view === "month") newDate = currentDate.add(1, "month");
+    } else if (action === "TODAY") newDate = dayjs7();
     setCurrentDate(newDate);
   };
   return /* @__PURE__ */ React25.createElement(Box19, null, /* @__PURE__ */ React25.createElement(
@@ -3618,11 +3623,88 @@ var SCTime = ({
   )));
 };
 
+// src/Components/SCCard.tsx
+import React27 from "react";
+import { Button as Button11, Box as Box21, SvgIcon as SvgIcon8 } from "@mui/material";
+import IconButton11 from "@mui/material/IconButton";
+import Card from "@mui/material/Card";
+import CardHeader from "@mui/material/CardHeader";
+import CardMedia from "@mui/material/CardMedia";
+import CardContent from "@mui/material/CardContent";
+import CardActions from "@mui/material/CardActions";
+import Collapse from "@mui/material/Collapse";
+import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
+import * as Muicon8 from "@mui/icons-material";
+var SCCard = ({ title, image, iconTitle, actionsTitle, subtitle, content, actions, expand }) => {
+  let iconTitleValidation = "";
+  let IconTitle;
+  const [expanded, setExpanded] = React27.useState(false);
+  if (iconTitle) {
+    if (Muicon8[iconTitle] == void 0) {
+      if (iconTitle && React27.isValidElement(iconTitle) && iconTitle.type == void 0) {
+        iconTitleValidation = "image";
+        IconTitle = iconTitle;
+      } else {
+        iconTitleValidation = "icon";
+        IconTitle = iconTitle;
+      }
+    } else {
+      iconTitleValidation = "icon";
+      IconTitle = Muicon8[iconTitle];
+    }
+  }
+  const handleExpandClick = () => {
+    setExpanded(!expanded);
+  };
+  return /* @__PURE__ */ React27.createElement(Card, { sx: { maxWidth: 345 } }, title && /* @__PURE__ */ React27.createElement(
+    CardHeader,
+    {
+      avatar: iconTitle ? iconTitleValidation === "image" ? /* @__PURE__ */ React27.createElement(Box21, { sx: { marginRight: "16px", width: "44px", height: "44px", borderRadius: "1px" } }, /* @__PURE__ */ React27.createElement("img", { src: IconTitle, width: "44px", height: "44px" })) : /* @__PURE__ */ React27.createElement(SvgIcon8, { color: "action", fontSize: "small", component: IconTitle, sx: { marginRight: "16px" } }) : void 0,
+      action: (expand == null ? void 0 : expand.position) == "top" ? (expand == null ? void 0 : expand.type) === "text" ? /* @__PURE__ */ React27.createElement(Button11, { onClick: handleExpandClick, sx: { marginRight: "auto" } }, "Expandir") : (expand == null ? void 0 : expand.type) === "icon" && /* @__PURE__ */ React27.createElement(IconButton11, { onClick: handleExpandClick, sx: { marginRight: "auto" }, size: "small" }, /* @__PURE__ */ React27.createElement(ExpandMoreIcon, { fontSize: "small" })) : actionsTitle,
+      title,
+      subheader: subtitle,
+      sx: {
+        "& .MuiCardHeader-title": {
+          fontSize: "14px",
+          color: "text.primary"
+        },
+        "& .MuiCardHeader-subheader": {
+          fontSize: "13px",
+          color: "text.secondary"
+        },
+        "& .MuiCardHeader-action": {
+          height: "40px !important",
+          display: "flex",
+          alignItems: "center"
+        }
+      }
+    }
+  ), image && /* @__PURE__ */ React27.createElement(
+    CardMedia,
+    {
+      component: "img",
+      height: "194",
+      image
+    }
+  ), content && /* @__PURE__ */ React27.createElement(CardContent, { sx: { padding: "8px 16px !important" } }, content), ((expand == null ? void 0 : expand.position) == "bottom" || actions != void 0) && /* @__PURE__ */ React27.createElement(CardActions, { disableSpacing: true, sx: { justifyContent: "flex-end" } }, (expand == null ? void 0 : expand.position) === "bottom" ? (expand == null ? void 0 : expand.type) === "text" ? /* @__PURE__ */ React27.createElement(Button11, { onClick: handleExpandClick, sx: { marginRight: "auto" } }, "Expandir") : (expand == null ? void 0 : expand.type) === "icon" && /* @__PURE__ */ React27.createElement(IconButton11, { onClick: handleExpandClick, sx: { marginRight: "auto" } }, /* @__PURE__ */ React27.createElement(ExpandMoreIcon, null)) : null, actions && actions.length > 0 ? actions.map((action, index) => /* @__PURE__ */ React27.createElement(
+    Button11,
+    {
+      key: index,
+      size: "small",
+      color: action.color || "primary",
+      variant: action.variant || "text",
+      onClick: action.fn,
+      disabled: action.disabled || false
+    },
+    action.text
+  )) : ""), expand && /* @__PURE__ */ React27.createElement(Collapse, { in: expanded, timeout: "auto", unmountOnExit: true }, /* @__PURE__ */ React27.createElement(CardContent, { sx: { padding: "8px 16px !important" } }, expand.content)));
+};
+
 // src/Theme/index.ts
 import { createTheme } from "@mui/material/styles";
 
 // src/Theme/components.ts
-import React27 from "react";
+import React28 from "react";
 import {
   InfoRounded as InfoRounded2,
   CheckCircleRounded as CheckCircleRounded2,
@@ -4325,10 +4407,10 @@ var components = {
   MuiAlert: {
     defaultProps: {
       iconMapping: {
-        success: React27.createElement(CheckCircleRounded2),
-        error: React27.createElement(ErrorRounded2),
-        warning: React27.createElement(WarningRounded2),
-        info: React27.createElement(InfoRounded2)
+        success: React28.createElement(CheckCircleRounded2),
+        error: React28.createElement(ErrorRounded2),
+        warning: React28.createElement(WarningRounded2),
+        info: React28.createElement(InfoRounded2)
       }
     },
     variants: [
@@ -5376,6 +5458,7 @@ export {
   PageHeader,
   SCAutocomplete,
   SCCalendarSwipeable,
+  SCCard,
   SCDataGrid,
   SCDataGridInitial,
   SCDateRange,