componentes-sinco 1.0.1-rc.4 → 1.0.1-rc.6

package/dist/index.cjs

@@ -1099,7 +1099,8 @@ var import_material6 = require("@mui/material");
 var import_Grid23 = __toESM(require("@mui/material/Grid2"), 1);
 var import_Close2 = __toESM(require("@mui/icons-material/Close"), 1);
 var Muicon3 = __toESM(require("@mui/icons-material"), 1);
-var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, disableClose, dividers, widthContent, heightContent, background, setShow, show }) => {
+var SCDialog = ({ title, iconTitle, subtitle, content, actions = [{ text: "Cerrar", fn: () => {
+} }], buttonDialog, disableClose, dividers, widthContent, heightContent, background, setShow, show }) => {
   let i = 0;
   let iconTitleValidation = "";
   let IconTitle;
@@ -1138,7 +1139,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
       setShow(false);
     }
   };
-  const dialogActions = actions != null ? actions : [{ text: "Cerrar", fn: handleClose }];
+  actions = actions != null ? actions : [{ text: "Cerrar", fn: handleClose }];
   content = content != null ? content : { component: /* @__PURE__ */ import_react9.default.createElement(import_material6.Box, null, " Aqui va el contenido ") };
   return /* @__PURE__ */ import_react9.default.createElement("div", null, buttonDialog ? /* @__PURE__ */ import_react9.default.createElement(import_react9.default.Fragment, null, buttonDialog.text != void 0 ? /* @__PURE__ */ import_react9.default.createElement(import_material6.Tooltip, { placement: "bottom-start", title: buttonDialog.tooltip != void 0 ? buttonDialog.tooltip : "", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ import_react9.default.createElement(import_material6.Button, { 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) == "left" || !(buttonDialog == null ? void 0 : buttonDialog.iconPosition) ? /* @__PURE__ */ import_react9.default.createElement(ButtonIcon, { color: buttonDialog.color != void 0 ? buttonDialog.color : "primary" }) : "", endIcon: (buttonDialog == null ? void 0 : buttonDialog.iconPosition) == "right" ? /* @__PURE__ */ import_react9.default.createElement(ButtonIcon, { color: buttonDialog.color != void 0 ? buttonDialog.color : "primary" }) : "", onClick: handleOpen }, " ", (buttonDialog == null ? void 0 : buttonDialog.text) != void 0 ? buttonDialog.text : "", " ")) : /* @__PURE__ */ import_react9.default.createElement(import_material6.IconButton, { style: { cursor: "pointer" }, onClick: handleOpen }, /* @__PURE__ */ import_react9.default.createElement(import_material6.SvgIcon, { fontSize: "small", color: (buttonDialog == null ? void 0 : buttonDialog.color) != void 0 ? buttonDialog == null ? void 0 : buttonDialog.color : "action", component: ButtonIcon }))) : "", /* @__PURE__ */ import_react9.default.createElement(import_material6.Modal, { open: open || false, onClose: handleClose }, /* @__PURE__ */ import_react9.default.createElement(
     import_material6.Dialog,
@@ -1176,12 +1177,12 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
         }
       ) : content.component
     ),
-    dialogActions.length > 0 ? /* @__PURE__ */ import_react9.default.createElement(import_material6.DialogActions, { sx: { gap: 1, m: 0, padding: "12px 16px 12px 16px" } }, dialogActions.map((boton) => /* @__PURE__ */ import_react9.default.createElement(
+    actions != void 0 && actions.length > 0 ? /* @__PURE__ */ import_react9.default.createElement(import_material6.DialogActions, { sx: { gap: 1, m: 0, padding: "12px 16px 12px 16px" } }, actions.map((boton) => /* @__PURE__ */ import_react9.default.createElement(
       import_material6.Button,
       {
         key: i = i + 1,
         autoFocus: true,
-        variant: i == 1 || dialogActions.length < 2 ? "contained" : "text",
+        variant: i == 1 || actions.length < 2 ? "contained" : "text",
         color: "primary",
         size: "small",
         onClick: boton.fn,

package/dist/index.d.mts

@@ -0,0 +1,361 @@
+import * as React$1 from 'react';
+import React__default, { ComponentType } from 'react';
+import * as Muicon from '@mui/icons-material';
+import * as _mui_material_OverridableComponent from '@mui/material/OverridableComponent';
+import * as _mui_material from '@mui/material';
+import * as _mui_material_styles from '@mui/material/styles';
+
+type ReplyPalette$1 = "primary" | "secondary" | "warning" | "info" | "success" | "error";
+type ReplyTextPalette = "primary" | "secondary" | "disabled";
+type ReplyVariants = "outlined" | "filled" | "standard";
+type RepplyButtonVariants = "text" | "contained" | "outlined";
+
+declare function capitalize(text: string): string;
+
+interface ArrayElement {
+    type?: 'textField' | 'textArea';
+    title?: string;
+    iconTitle?: keyof typeof Muicon;
+    infoTitle?: {
+        text?: string;
+        component?: "tooltip" | "popover";
+    };
+    label?: string;
+    placeholder?: string;
+    infoElement?: {
+        text?: string;
+        component?: "tooltip" | "popover";
+    };
+    iconInputStart?: string;
+    iconInputEnd?: string;
+    maxLength?: number;
+    component?: React.ReactNode;
+    variant?: ReplyVariants;
+    format?: 'int' | 'text' | 'password' | 'decimal';
+    disabled?: boolean;
+    required?: boolean;
+    size?: 'small' | 'medium';
+    width?: string;
+    rows?: number;
+    color?: ReplyPalette$1;
+    background?: string;
+    state?: any | React.Dispatch<React.SetStateAction<string>>;
+    value?: string;
+    onChange?: () => {};
+    onBlur?: () => {};
+    onKeyDown?: () => {};
+}
+interface DrawerProps {
+    title?: string;
+    arrayElements?: ArrayElement[];
+    actions?: {
+        text: string;
+        fn: () => void;
+        disabled?: boolean;
+    }[];
+    buttonDrawer?: {
+        icon?: keyof typeof Muicon;
+        text?: string;
+        color?: ReplyPalette$1;
+        variant?: 'text' | 'outlined' | 'contained';
+        iconPosition?: 'left' | 'right' | undefined;
+    };
+    colorTitle?: ReplyTextPalette | ReplyPalette$1 | string;
+    anchor?: "left" | "right";
+    width?: string;
+    open?: boolean;
+}
+
+type ToastType = 'success' | 'error' | 'warning' | 'info';
+interface ToastBaseProperties {
+    type?: ToastType;
+    title: string;
+    subtitle?: string;
+    time?: number;
+    listITems?: string[];
+    seeMore?: boolean;
+    actions?: {
+        text: string;
+        fn: () => void;
+        disabled?: boolean;
+    }[];
+}
+
+declare const SCToastNotification: (toast: ToastBaseProperties) => React__default.JSX.Element;
+
+declare const useProgress: (timeProgress: number, lote?: number) => {
+    progress: number;
+};
+declare const ToastProgress: (timeProgress: number) => {
+    progressToast: number;
+};
+
+declare const SCDrawer: ({ title, arrayElements, actions, buttonDrawer, colorTitle, anchor, width, open, }: DrawerProps) => React__default.JSX.Element;
+
+interface MultiSelectProps<T> {
+    textButton?: string;
+    button?: {
+        icon?: string;
+        text?: string;
+        color?: ReplyPalette$1;
+        variant?: RepplyButtonVariants;
+        iconPosition?: 'left' | 'right';
+        size?: "small" | "medium" | "large";
+    };
+    topPanel?: React.ReactNode;
+    dense?: boolean;
+    open: boolean;
+    selectAll?: boolean;
+    items: T[];
+    getItemLabel: (item: T) => string;
+    actions?: {
+        text: string;
+        fn: () => void;
+        disabled?: boolean;
+    }[];
+}
+
+declare function useMultiSelectHandlers<T>(): {
+    anchorEl: HTMLButtonElement | null;
+    open: boolean;
+    selectedItems: T[];
+    filterValue: string;
+    setSelectedItems: React$1.Dispatch<React$1.SetStateAction<T[]>>;
+    handleOpen: (e: React.MouseEvent<HTMLButtonElement>) => void;
+    handleClose: () => void;
+    handleFilterChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    handleCheckboxToggle: (item: T) => void;
+    setOpen: React$1.Dispatch<React$1.SetStateAction<boolean>>;
+};
+
+declare function getIconMultiSelect(name: string): _mui_material_OverridableComponent.OverridableComponent<_mui_material.SvgIconTypeMap<{}, "svg">> & {
+    muiName: string;
+};
+
+declare function useFilteredItems<T>(items: T[], filterValue: string, getItemLabel: (item: T) => string, selectedItems: T[]): {
+    filteredItems: T[];
+    sortedItems: T[];
+};
+
+declare function SCMultiSelect<T>({ textButton, button, items, topPanel, actions, dense, open, selectAll, getItemLabel }: MultiSelectProps<T>): React__default.JSX.Element;
+
+interface SCTextAreaProps {
+    title?: string;
+    iconTitle?: keyof typeof Muicon;
+    infoTitle?: {
+        text?: string;
+        component?: "tooltip" | "popover";
+    };
+    colorTitle?: ReplyTextPalette;
+    placeholder?: string;
+    label?: string;
+    width?: string;
+    required?: boolean;
+    background?: string;
+    variant?: ReplyVariants;
+    disabled?: boolean;
+    rows?: number;
+    maxLength?: number;
+    value: string;
+    state: React.Dispatch<React.SetStateAction<string>>;
+    onBlur?: (event: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
+}
+
+declare function getIcon(name?: string): ComponentType | null;
+
+declare const SCTextArea: ({ title, iconTitle, infoTitle, label, placeholder, maxLength, variant, disabled, required, width, rows, colorTitle, background, state, value, onBlur, }: SCTextAreaProps) => React__default.JSX.Element;
+
+interface SCTextFieldProps {
+    title?: string;
+    iconTitle?: string;
+    infoTitle?: {
+        text?: string;
+        component?: "tooltip" | "popover";
+    };
+    label?: string;
+    placeholder?: string;
+    color?: ReplyPalette$1;
+    width?: string;
+    background?: string;
+    format?: string;
+    inputAddorment?: {
+        start: string;
+        end: string;
+    };
+    iconInputStart?: string;
+    iconInputEnd?: string;
+    infoElement?: {
+        text?: string;
+        component?: "tooltip" | "popover";
+    };
+    size?: "small" | "medium";
+    variant?: "outlined" | "filled" | "standard";
+    value: string;
+    maxLength?: number;
+    disabled?: boolean;
+    required?: boolean;
+    state: React.Dispatch<React.SetStateAction<string>>;
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
+    onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
+}
+
+declare const SCTextField: ({ title, iconTitle, infoTitle, label, placeholder, infoElement, iconInputStart, iconInputEnd, maxLength, variant, format, disabled, required, size, width, color, background, state, value, onChange, onBlur, onKeyDown, }: SCTextFieldProps) => React__default.JSX.Element;
+
+type ReplyPalette = "primary" | "secondary" | "warning" | "info" | "success" | "error" | "inherit";
+
+/***************************************************************************/
+
+interface SCDialogProps {
+    title?: string;
+    iconTitle?: React__default.ReactNode | React__default.ReactElement | keyof typeof Muicon;
+    subtitle?: string;
+    content?: any;
+    actions?: {
+        text: string;
+        fn: () => void;
+        disabled?: boolean;
+    }[];
+    buttonDialog?: {
+        icon?: string;
+        text?: string;
+        color?: ReplyPalette;
+        tooltip?: string;
+        variant?: 'text' | 'outlined' | 'contained';
+        iconPosition?: 'left' | 'right' | undefined;
+    };
+    disableClose?: boolean;
+    dividers?: boolean;
+    widthContent?: 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large';
+    heightContent?: string;
+    background?: string;
+    setShow?: React__default.Dispatch<React__default.SetStateAction<boolean>>;
+    show?: boolean | any;
+}
+declare const SCDialog: ({ title, iconTitle, subtitle, content, actions, buttonDialog, disableClose, dividers, widthContent, heightContent, background, setShow, show }: SCDialogProps) => React__default.JSX.Element;
+
+/***************************************************************************/
+
+interface Option$1 {
+    name?: string;
+    iconLeft?: any | React__default.ReactNode | React__default.ReactElement | React__default.ElementType | null;
+    iconRight?: any | React__default.ReactNode | React__default.ReactElement | React__default.ElementType | null;
+    divider?: boolean;
+    page: React__default.ReactNode | React__default.ReactElement;
+}
+interface SCMenuProps {
+    header?: any;
+    options: Option$1[];
+    defaultOption?: string;
+    disable?: boolean;
+    widthMenu?: string;
+    heightMenu?: string;
+    widthPage?: string;
+}
+declare const SCMenu: ({ header, options, defaultOption, disable, widthMenu, heightMenu, widthPage }: SCMenuProps) => React__default.JSX.Element;
+
+/***************************************************************************/
+
+interface Option {
+    name?: string;
+    badge?: string | number | null | undefined;
+    icon?: any | React__default.ReactNode | React__default.ReactElement | React__default.ElementType | null;
+    disabled?: boolean;
+    page: React__default.ReactNode | React__default.ReactElement;
+}
+interface SCTabsProps {
+    options: Option[];
+    defaultOption?: string;
+    background?: string;
+    iconPosition?: "top" | "bottom" | "start" | "end";
+    colorTab?: "secondary" | "primary";
+    orientation?: "horizontal" | "vertical";
+    variant?: "standard" | "fullWidth" | "scrollable";
+    scrollButtons?: boolean;
+    children?: any;
+}
+declare const SCTabs: ({ options, defaultOption, background, iconPosition, colorTab, orientation, variant, scrollButtons, children }: SCTabsProps) => React__default.JSX.Element;
+
+interface FooterActionsProperties {
+    label?: React.ReactNode;
+    leftContent?: React.ReactNode;
+    rightContent?: React.ReactNode;
+    variant?: 'standard' | 'float';
+}
+
+declare const FooterAction: ({ leftContent, rightContent, label, variant, }: FooterActionsProperties) => React__default.JSX.Element;
+
+interface PageheaderProperties {
+    title: string | React.ReactNode;
+    subtitle?: string | React.ReactNode;
+    actions?: React.ReactNode;
+    buttonBack?: React.ReactNode;
+    fixed?: boolean;
+    shadow?: boolean;
+}
+
+declare const PageHeader: ({ title, subtitle, actions, buttonBack, fixed, shadow, }: PageheaderProperties) => React__default.JSX.Element;
+
+declare const modalStateConfig: {
+    info: {
+        color: string;
+        defaultDescription: string;
+        icon: React__default.JSX.Element;
+    };
+    delete: {
+        color: string;
+        defaultDescription: string;
+        icon: React__default.JSX.Element;
+    };
+    warning: {
+        color: string;
+        defaultDescription: string;
+        icon: React__default.JSX.Element;
+    };
+};
+
+type ModalStates = 'info' | 'delete' | 'warning';
+interface ModalProps {
+    title: string;
+    description?: string;
+    textButton?: string;
+    buttonVariant?: RepplyButtonVariants;
+    iconPosition?: 'left' | 'right';
+    buttonColor?: ReplyPalette$1;
+    state: ModalStates;
+    open: boolean;
+    action?: {
+        text: string;
+        fn: () => void;
+        disabled?: boolean;
+    }[];
+    buttonModal?: {
+        icon?: string;
+        text?: string;
+        color?: ReplyPalette$1;
+        variant?: 'text' | 'outlined' | 'contained';
+        iconPosition?: 'left' | 'right';
+        size?: "small" | "medium" | "large";
+    };
+}
+
+declare const getIconComponent: (iconName?: string) => React.ElementType;
+declare const getModalColor: (state: string) => string;
+declare const getButtonColor: (state: string) => 'inherit' | 'info' | 'error' | 'warning';
+
+declare const SCModal: ({ buttonModal, state, open, title, description, action, }: ModalProps) => React__default.JSX.Element;
+
+/***************************************************************************/
+
+interface SCCalendarSwipeableProps {
+    background?: string;
+    setState: React__default.Dispatch<React__default.SetStateAction<string>>;
+    state: string | any;
+}
+declare const SCCalendarSwipeable: ({ background, setState, state, }: SCCalendarSwipeableProps) => 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, FooterAction, type FooterActionsProperties, type ModalProps, type ModalStates, type MultiSelectProps, PageHeader, type PageheaderProperties, type ReplyPalette$1 as ReplyPalette, type ReplyTextPalette, type ReplyVariants, type RepplyButtonVariants, SCCalendarSwipeable, SCDialog, SCDrawer, SCMenu, SCModal, SCMultiSelect, SCTabs, SCTextArea, type SCTextAreaProps, SCTextField, type SCTextFieldProps, SCToastNotification, SincoTheme, type ToastBaseProperties, ToastProgress, type ToastType, capitalize, getButtonColor, getIcon, getIconComponent, getIconMultiSelect, getModalColor, modalStateConfig, useFilteredItems, useMultiSelectHandlers, useProgress };

package/dist/index.js

@@ -1041,7 +1041,8 @@ import { Button as Button4, Typography as Typography5, Modal, Dialog, DialogActi
 import Grid4 from "@mui/material/Grid2";
 import CloseIcon2 from "@mui/icons-material/Close";
 import * as Muicon3 from "@mui/icons-material";
-var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, disableClose, dividers, widthContent, heightContent, background, setShow, show }) => {
+var SCDialog = ({ title, iconTitle, subtitle, content, actions = [{ text: "Cerrar", fn: () => {
+} }], buttonDialog, disableClose, dividers, widthContent, heightContent, background, setShow, show }) => {
   let i = 0;
   let iconTitleValidation = "";
   let IconTitle;
@@ -1080,7 +1081,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
       setShow(false);
     }
   };
-  const dialogActions = actions != null ? actions : [{ text: "Cerrar", fn: handleClose }];
+  actions = actions != null ? actions : [{ text: "Cerrar", fn: handleClose }];
   content = content != null ? content : { component: /* @__PURE__ */ React6.createElement(Box5, null, " Aqui va el contenido ") };
   return /* @__PURE__ */ React6.createElement("div", null, buttonDialog ? /* @__PURE__ */ React6.createElement(React6.Fragment, null, buttonDialog.text != void 0 ? /* @__PURE__ */ React6.createElement(Tooltip3, { placement: "bottom-start", title: buttonDialog.tooltip != void 0 ? buttonDialog.tooltip : "", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ React6.createElement(Button4, { 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) == "left" || !(buttonDialog == null ? void 0 : buttonDialog.iconPosition) ? /* @__PURE__ */ React6.createElement(ButtonIcon, { color: buttonDialog.color != void 0 ? buttonDialog.color : "primary" }) : "", endIcon: (buttonDialog == null ? void 0 : buttonDialog.iconPosition) == "right" ? /* @__PURE__ */ React6.createElement(ButtonIcon, { color: buttonDialog.color != void 0 ? buttonDialog.color : "primary" }) : "", onClick: handleOpen }, " ", (buttonDialog == null ? void 0 : buttonDialog.text) != void 0 ? buttonDialog.text : "", " ")) : /* @__PURE__ */ React6.createElement(IconButton4, { style: { cursor: "pointer" }, onClick: handleOpen }, /* @__PURE__ */ React6.createElement(SvgIcon3, { fontSize: "small", color: (buttonDialog == null ? void 0 : buttonDialog.color) != void 0 ? buttonDialog == null ? void 0 : buttonDialog.color : "action", component: ButtonIcon }))) : "", /* @__PURE__ */ React6.createElement(Modal, { open: open || false, onClose: handleClose }, /* @__PURE__ */ React6.createElement(
     Dialog,
@@ -1118,12 +1119,12 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
         }
       ) : content.component
     ),
-    dialogActions.length > 0 ? /* @__PURE__ */ React6.createElement(DialogActions, { sx: { gap: 1, m: 0, padding: "12px 16px 12px 16px" } }, dialogActions.map((boton) => /* @__PURE__ */ React6.createElement(
+    actions != void 0 && actions.length > 0 ? /* @__PURE__ */ React6.createElement(DialogActions, { sx: { gap: 1, m: 0, padding: "12px 16px 12px 16px" } }, actions.map((boton) => /* @__PURE__ */ React6.createElement(
       Button4,
       {
         key: i = i + 1,
         autoFocus: true,
-        variant: i == 1 || dialogActions.length < 2 ? "contained" : "text",
+        variant: i == 1 || actions.length < 2 ? "contained" : "text",
         color: "primary",
         size: "small",
         onClick: boton.fn,