componentes-sinco 1.0.30 → 1.0.31
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +24 -18
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +5 -3
- package/dist/index.d.ts +5 -3
- package/dist/index.js +24 -18
- package/dist/index.js.map +1 -1
- package/package.json +4 -1
package/dist/index.d.cts
CHANGED
|
@@ -106,6 +106,7 @@ interface DrawerProps<T> {
|
|
|
106
106
|
open?: boolean;
|
|
107
107
|
setOpen?: any;
|
|
108
108
|
chipFilters?: any[];
|
|
109
|
+
typeView?: 'web' | 'mobile';
|
|
109
110
|
}
|
|
110
111
|
|
|
111
112
|
type ToastType = 'success' | 'error' | 'warning' | 'info';
|
|
@@ -410,7 +411,7 @@ interface SCDialogProps {
|
|
|
410
411
|
iconTitle?: React__default.ReactNode | React__default.ReactElement | keyof typeof Muicon;
|
|
411
412
|
subtitle?: string;
|
|
412
413
|
content?: any;
|
|
413
|
-
actions?: Action[];
|
|
414
|
+
actions?: Action[] | boolean;
|
|
414
415
|
buttonDialog?: {
|
|
415
416
|
icon?: string;
|
|
416
417
|
text?: string;
|
|
@@ -424,10 +425,11 @@ interface SCDialogProps {
|
|
|
424
425
|
widthContent?: 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large';
|
|
425
426
|
heightContent?: string;
|
|
426
427
|
background?: string;
|
|
428
|
+
typeView?: 'web' | 'mobile';
|
|
427
429
|
setShow?: React__default.Dispatch<React__default.SetStateAction<boolean>>;
|
|
428
430
|
show?: boolean | any;
|
|
429
431
|
}
|
|
430
|
-
declare const SCDialog: ({ title, iconTitle, subtitle, content, actions, buttonDialog, disableClose, dividers, widthContent, heightContent, background, setShow, show }: SCDialogProps) => React__default.JSX.Element;
|
|
432
|
+
declare const SCDialog: ({ title, iconTitle, subtitle, content, actions, buttonDialog, disableClose, dividers, widthContent, heightContent, background, typeView, setShow, show }: SCDialogProps) => React__default.JSX.Element;
|
|
431
433
|
|
|
432
434
|
interface Option$2 {
|
|
433
435
|
title?: string;
|
|
@@ -555,7 +557,7 @@ declare const CALENDAR_CONSTANTS: {
|
|
|
555
557
|
readonly GRID_TEMPLATE: "repeat(7, minmax(150px, 1fr))";
|
|
556
558
|
readonly DAY_HEIGHT: 60;
|
|
557
559
|
readonly SIDEBAR_WIDTH: 47;
|
|
558
|
-
readonly MIN_CELL_HEIGHT:
|
|
560
|
+
readonly MIN_CELL_HEIGHT: 99;
|
|
559
561
|
readonly DEFAULT_START_HOUR: 0;
|
|
560
562
|
readonly DEFAULT_END_HOUR: 23;
|
|
561
563
|
readonly DRAWER_WIDTH: "350px";
|
package/dist/index.d.ts
CHANGED
|
@@ -106,6 +106,7 @@ interface DrawerProps<T> {
|
|
|
106
106
|
open?: boolean;
|
|
107
107
|
setOpen?: any;
|
|
108
108
|
chipFilters?: any[];
|
|
109
|
+
typeView?: 'web' | 'mobile';
|
|
109
110
|
}
|
|
110
111
|
|
|
111
112
|
type ToastType = 'success' | 'error' | 'warning' | 'info';
|
|
@@ -410,7 +411,7 @@ interface SCDialogProps {
|
|
|
410
411
|
iconTitle?: React__default.ReactNode | React__default.ReactElement | keyof typeof Muicon;
|
|
411
412
|
subtitle?: string;
|
|
412
413
|
content?: any;
|
|
413
|
-
actions?: Action[];
|
|
414
|
+
actions?: Action[] | boolean;
|
|
414
415
|
buttonDialog?: {
|
|
415
416
|
icon?: string;
|
|
416
417
|
text?: string;
|
|
@@ -424,10 +425,11 @@ interface SCDialogProps {
|
|
|
424
425
|
widthContent?: 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large';
|
|
425
426
|
heightContent?: string;
|
|
426
427
|
background?: string;
|
|
428
|
+
typeView?: 'web' | 'mobile';
|
|
427
429
|
setShow?: React__default.Dispatch<React__default.SetStateAction<boolean>>;
|
|
428
430
|
show?: boolean | any;
|
|
429
431
|
}
|
|
430
|
-
declare const SCDialog: ({ title, iconTitle, subtitle, content, actions, buttonDialog, disableClose, dividers, widthContent, heightContent, background, setShow, show }: SCDialogProps) => React__default.JSX.Element;
|
|
432
|
+
declare const SCDialog: ({ title, iconTitle, subtitle, content, actions, buttonDialog, disableClose, dividers, widthContent, heightContent, background, typeView, setShow, show }: SCDialogProps) => React__default.JSX.Element;
|
|
431
433
|
|
|
432
434
|
interface Option$2 {
|
|
433
435
|
title?: string;
|
|
@@ -555,7 +557,7 @@ declare const CALENDAR_CONSTANTS: {
|
|
|
555
557
|
readonly GRID_TEMPLATE: "repeat(7, minmax(150px, 1fr))";
|
|
556
558
|
readonly DAY_HEIGHT: 60;
|
|
557
559
|
readonly SIDEBAR_WIDTH: 47;
|
|
558
|
-
readonly MIN_CELL_HEIGHT:
|
|
560
|
+
readonly MIN_CELL_HEIGHT: 99;
|
|
559
561
|
readonly DEFAULT_START_HOUR: 0;
|
|
560
562
|
readonly DEFAULT_END_HOUR: 23;
|
|
561
563
|
readonly DRAWER_WIDTH: "350px";
|
package/dist/index.js
CHANGED
|
@@ -3053,7 +3053,7 @@ import { Button as Button11, Typography as Typography14, Modal as Modal2, Dialog
|
|
|
3053
3053
|
import Grid8 from "@mui/material/Grid";
|
|
3054
3054
|
import CloseIcon2 from "@mui/icons-material/Close";
|
|
3055
3055
|
import * as Muicon5 from "@mui/icons-material";
|
|
3056
|
-
var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, disableClose, dividers, widthContent, heightContent, background, setShow, show }) => {
|
|
3056
|
+
var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, disableClose, dividers, widthContent, heightContent, background, typeView = "web", setShow, show }) => {
|
|
3057
3057
|
let i = 0;
|
|
3058
3058
|
let iconTitleValidation = "";
|
|
3059
3059
|
let IconTitle;
|
|
@@ -3073,22 +3073,24 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
3073
3073
|
ButtonIcon = Muicon5[buttonDialog == null ? void 0 : buttonDialog.icon];
|
|
3074
3074
|
}
|
|
3075
3075
|
}
|
|
3076
|
-
|
|
3077
|
-
|
|
3078
|
-
if (
|
|
3079
|
-
|
|
3080
|
-
|
|
3081
|
-
|
|
3076
|
+
if (Array.isArray(actions)) {
|
|
3077
|
+
actions.map(function(option, index, array) {
|
|
3078
|
+
if (option == null ? void 0 : option.icon) {
|
|
3079
|
+
if ((option == null ? void 0 : option.icon.type) == void 0) {
|
|
3080
|
+
option.icon = Muicon5[option == null ? void 0 : option.icon];
|
|
3081
|
+
} else {
|
|
3082
|
+
option;
|
|
3083
|
+
}
|
|
3082
3084
|
}
|
|
3083
|
-
}
|
|
3084
|
-
}
|
|
3085
|
+
});
|
|
3086
|
+
}
|
|
3085
3087
|
if (iconTitle) {
|
|
3086
3088
|
if (Muicon5[iconTitle] == void 0) {
|
|
3087
|
-
if (iconTitle
|
|
3088
|
-
iconTitleValidation = "image";
|
|
3089
|
-
IconTitle = iconTitle;
|
|
3090
|
-
} else {
|
|
3089
|
+
if (Muicon5[iconTitle]) {
|
|
3091
3090
|
iconTitleValidation = "icon";
|
|
3091
|
+
IconTitle = Muicon5[iconTitle];
|
|
3092
|
+
} else {
|
|
3093
|
+
iconTitleValidation = "image";
|
|
3092
3094
|
IconTitle = iconTitle;
|
|
3093
3095
|
}
|
|
3094
3096
|
} else {
|
|
@@ -3108,11 +3110,12 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
3108
3110
|
setShow(false);
|
|
3109
3111
|
}
|
|
3110
3112
|
};
|
|
3111
|
-
const dialogActions = actions !=
|
|
3113
|
+
const dialogActions = actions == false ? false : actions != void 0 ? actions : [{ text: "Cerrar", fn: handleClose }];
|
|
3112
3114
|
content = content != null ? content : { component: /* @__PURE__ */ React27.createElement(Box13, null, " Aqui va el contenido ") };
|
|
3113
3115
|
return /* @__PURE__ */ React27.createElement("div", null, buttonDialog ? /* @__PURE__ */ React27.createElement(React27.Fragment, null, buttonDialog.text != void 0 ? /* @__PURE__ */ React27.createElement(Tooltip4, { placement: "bottom-start", title: buttonDialog.tooltip != void 0 ? buttonDialog.tooltip : "", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ React27.createElement(Button11, { size: "small", color: buttonDialog.color != void 0 ? buttonDialog.color : "primary", variant: (buttonDialog == null ? void 0 : buttonDialog.variant) != void 0 ? buttonDialog == null ? void 0 : buttonDialog.variant : "text", startIcon: (buttonDialog == null ? void 0 : buttonDialog.iconPosition) != void 0 ? (buttonDialog == null ? void 0 : buttonDialog.iconPosition) == "left" ? /* @__PURE__ */ React27.createElement(ButtonIcon, null) : "" : "", endIcon: (buttonDialog == null ? void 0 : buttonDialog.iconPosition) != void 0 ? (buttonDialog == null ? void 0 : buttonDialog.iconPosition) == "right" ? /* @__PURE__ */ React27.createElement(ButtonIcon, null) : "" : "", onClick: handleOpen }, " ", (buttonDialog == null ? void 0 : buttonDialog.text) != void 0 ? buttonDialog.text : "", " ")) : /* @__PURE__ */ React27.createElement(IconButton10, { style: { cursor: "pointer" }, onClick: handleOpen }, /* @__PURE__ */ React27.createElement(SvgIcon5, { fontSize: "small", color: (buttonDialog == null ? void 0 : buttonDialog.color) != void 0 ? buttonDialog == null ? void 0 : buttonDialog.color : "action", component: ButtonIcon }))) : "", /* @__PURE__ */ React27.createElement(Modal2, { open: open || false, onClose: handleClose }, /* @__PURE__ */ React27.createElement(
|
|
3114
3116
|
Dialog,
|
|
3115
3117
|
{
|
|
3118
|
+
fullScreen: typeView === "mobile" ? true : false,
|
|
3116
3119
|
"data-testid": "dialog-element",
|
|
3117
3120
|
open: open || false,
|
|
3118
3121
|
onClose: disableClose ? void 0 : handleClose,
|
|
@@ -3124,7 +3127,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
3124
3127
|
}
|
|
3125
3128
|
}
|
|
3126
3129
|
},
|
|
3127
|
-
title && /* @__PURE__ */ React27.createElement(DialogTitle, { sx: { m: 0, padding: "8px 16px 8px 16px" }, "data-testid": "dialog-icon-title" }, /* @__PURE__ */ React27.createElement(Grid8, { container: true, size: 12, sx: { justifyContent: "space-between", flexWrap: "nowrap" } }, /* @__PURE__ */ React27.createElement(Grid8, { container: true, size: 11, sx: { alignItems: "center" } }, iconTitle ? iconTitleValidation == "image" ? /* @__PURE__ */ React27.createElement(Box13, { sx: { marginRight: "16px", width: "44px", height: "44px", borderRadius: "1px" } }, /* @__PURE__ */ React27.createElement("img", { src: IconTitle, width: "44px", height: "44px" })) : /* @__PURE__ */ React27.createElement(SvgIcon5, { color: "action", fontSize: "small", component: IconTitle, sx: { marginRight: "16px" } }) : "", /* @__PURE__ */ React27.createElement(Grid8, null, /* @__PURE__ */ React27.createElement(Typography14, { color: "text.primary", variant: "h6", gutterBottom: true }, title ? title : ""), /* @__PURE__ */ React27.createElement(Typography14, { color: "text.secondary", variant: "body2", gutterBottom: true }, subtitle ? subtitle : ""))), disableClose != true ? /* @__PURE__ */ React27.createElement(IconButton10, { "data-testid": "close-dialog-button", onClick: handleClose, size: "small", color: "default", sx: { height: 22, width: 22 } }, /* @__PURE__ */ React27.createElement(CloseIcon2,
|
|
3130
|
+
title && /* @__PURE__ */ React27.createElement(DialogTitle, { sx: { m: 0, padding: "8px 16px 8px 16px" }, "data-testid": "dialog-icon-title" }, /* @__PURE__ */ React27.createElement(Grid8, { container: true, size: 12, sx: { justifyContent: "space-between", flexWrap: "nowrap" } }, /* @__PURE__ */ React27.createElement(Grid8, { container: true, size: 11, sx: { alignItems: "center" } }, iconTitle ? iconTitleValidation == "image" ? /* @__PURE__ */ React27.createElement(Box13, { sx: { marginRight: "16px", width: "44px", height: "44px", borderRadius: "1px" } }, /* @__PURE__ */ React27.createElement("img", { src: IconTitle, width: "44px", height: "44px" })) : /* @__PURE__ */ React27.createElement(SvgIcon5, { color: "action", fontSize: "small", component: IconTitle, sx: { marginRight: "16px" } }) : "", /* @__PURE__ */ React27.createElement(Grid8, null, /* @__PURE__ */ React27.createElement(Typography14, { color: "text.primary", variant: "h6", gutterBottom: true }, title ? title : ""), /* @__PURE__ */ React27.createElement(Typography14, { color: "text.secondary", variant: "body2", gutterBottom: true }, subtitle ? subtitle : ""))), disableClose != true ? /* @__PURE__ */ React27.createElement(IconButton10, { "data-testid": "close-dialog-button", onClick: handleClose, size: "small", color: "default", sx: { height: 22, width: 22 } }, /* @__PURE__ */ React27.createElement(CloseIcon2, { color: "action" })) : "")),
|
|
3128
3131
|
/* @__PURE__ */ React27.createElement(
|
|
3129
3132
|
DialogContent,
|
|
3130
3133
|
{
|
|
@@ -3163,7 +3166,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
3163
3166
|
}
|
|
3164
3167
|
) : content.component
|
|
3165
3168
|
),
|
|
3166
|
-
dialogActions.length > 0 ? /* @__PURE__ */ React27.createElement(DialogActions, { sx: { gap: 1, m: 0, padding: "12px 16px 12px 16px", justifyContent: dialogActions.length >= 3 ? "space-between" : "flex-end" } }, dialogActions.length >= 3 ? /* @__PURE__ */ React27.createElement(React27.Fragment, null, /* @__PURE__ */ React27.createElement(
|
|
3169
|
+
dialogActions != void 0 && dialogActions != false ? Array.isArray(dialogActions) && (dialogActions == null ? void 0 : dialogActions.length) > 0 ? /* @__PURE__ */ React27.createElement(DialogActions, { sx: { gap: 1, m: 0, padding: "12px 16px 12px 16px", justifyContent: dialogActions.length >= 3 ? "space-between" : "flex-end" } }, dialogActions.length >= 3 ? /* @__PURE__ */ React27.createElement(React27.Fragment, null, /* @__PURE__ */ React27.createElement(
|
|
3167
3170
|
Button11,
|
|
3168
3171
|
{
|
|
3169
3172
|
variant: "text",
|
|
@@ -3202,7 +3205,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
3202
3205
|
},
|
|
3203
3206
|
boton.text
|
|
3204
3207
|
);
|
|
3205
|
-
})) : ""
|
|
3208
|
+
})) : "" : ""
|
|
3206
3209
|
)));
|
|
3207
3210
|
};
|
|
3208
3211
|
|
|
@@ -3783,7 +3786,7 @@ var CALENDAR_CONSTANTS = {
|
|
|
3783
3786
|
GRID_TEMPLATE: "repeat(7, minmax(150px, 1fr))",
|
|
3784
3787
|
DAY_HEIGHT: 60,
|
|
3785
3788
|
SIDEBAR_WIDTH: 47,
|
|
3786
|
-
MIN_CELL_HEIGHT:
|
|
3789
|
+
MIN_CELL_HEIGHT: 99,
|
|
3787
3790
|
DEFAULT_START_HOUR: 0,
|
|
3788
3791
|
DEFAULT_END_HOUR: 23,
|
|
3789
3792
|
DRAWER_WIDTH: "350px",
|
|
@@ -3847,6 +3850,7 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
|
|
|
3847
3850
|
return /* @__PURE__ */ React36.createElement(Box20, { width: "100%", sx: { overflowX: "auto" } }, /* @__PURE__ */ React36.createElement(Box20, { minWidth: CALENDAR_CONSTANTS.MIN_WIDTH }, /* @__PURE__ */ React36.createElement(Box20, { display: "grid", gridTemplateColumns: CALENDAR_CONSTANTS.GRID_TEMPLATE, gap: 0.5, mb: 1 }, weekDays.map((day) => /* @__PURE__ */ React36.createElement(Box20, { key: day.day(), textAlign: "center", py: 0.5 }, /* @__PURE__ */ React36.createElement(Typography21, { variant: "caption", color: "text.secondary" }, day.format("dddd"))))), isLoading ? /* @__PURE__ */ React36.createElement(Box20, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: CALENDAR_CONSTANTS.LOADING_CONTAINER_HEIGHT }, /* @__PURE__ */ React36.createElement(CircularProgress2, { sx: { width: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE, height: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE }, variant: "indeterminate" })) : !isLoading && noEvents ? /* @__PURE__ */ React36.createElement(
|
|
3848
3851
|
EmptyState,
|
|
3849
3852
|
{
|
|
3853
|
+
containerHeight: "480px",
|
|
3850
3854
|
title: "Inicia la gesti\xF3n de las actividades",
|
|
3851
3855
|
subtitle: "Selecciona un mec\xE1nico y as\xEDgnale las actividades a realizar.",
|
|
3852
3856
|
icon: /* @__PURE__ */ React36.createElement(LogoCalendario, null)
|
|
@@ -4013,6 +4017,7 @@ var WeekView = ({
|
|
|
4013
4017
|
})), isLoading ? /* @__PURE__ */ React37.createElement(Box21, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: "450px" }, /* @__PURE__ */ React37.createElement(CircularProgress3, { sx: { width: "60px", height: "60px" }, variant: "indeterminate" })) : !isLoading && noEvents ? /* @__PURE__ */ React37.createElement(
|
|
4014
4018
|
EmptyState,
|
|
4015
4019
|
{
|
|
4020
|
+
containerHeight: "480px",
|
|
4016
4021
|
title: "Inicia la gesti\xF3n de las actividades",
|
|
4017
4022
|
subtitle: "Selecciona un mec\xE1nico y as\xEDgnale las actividades a realizar.",
|
|
4018
4023
|
icon: /* @__PURE__ */ React37.createElement(LogoCalendario, null)
|
|
@@ -4109,6 +4114,7 @@ var DayView = ({
|
|
|
4109
4114
|
return /* @__PURE__ */ React38.createElement(Box22, { display: "flex", flexDirection: "column", height: "100%" }, /* @__PURE__ */ React38.createElement(Box22, { display: "flex", borderBottom: "1px solid", borderColor: "primary.main", bgcolor: "background.paper" }, /* @__PURE__ */ React38.createElement(Box22, { width: CALENDAR_CONSTANTS.SIDEBAR_WIDTH, bgcolor: "background.default", borderBottom: "1px solid", borderColor: "transparent" }), /* @__PURE__ */ React38.createElement(Box22, { flex: 1, display: "flex", flexDirection: "column", textAlign: "start", gap: 0.5, py: 1, bgcolor: "primary.50" }, /* @__PURE__ */ React38.createElement(Typography23, { variant: "h6", color: "text.secondary" }, currentDate.format("D")), /* @__PURE__ */ React38.createElement(Typography23, { variant: "caption", color: "text.secondary" }, currentDate.format("dddd")))), isLoading ? /* @__PURE__ */ React38.createElement(Box22, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: CALENDAR_CONSTANTS.LOADING_CONTAINER_HEIGHT }, /* @__PURE__ */ React38.createElement(CircularProgress4, { sx: { width: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE, height: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE }, variant: "indeterminate" })) : noEvents ? /* @__PURE__ */ React38.createElement(
|
|
4110
4115
|
EmptyState,
|
|
4111
4116
|
{
|
|
4117
|
+
containerHeight: "480px",
|
|
4112
4118
|
title: "Inicia la gesti\xF3n de las actividades",
|
|
4113
4119
|
subtitle: "Selecciona un mec\xE1nico y as\xEDgnale las actividades a realizar.",
|
|
4114
4120
|
icon: /* @__PURE__ */ React38.createElement(LogoCalendario, null)
|