@soyfri/shared-library 1.3.5 → 1.3.9

package/components/Icon/Icon.js

@@ -0,0 +1,70 @@
+import "../../index.js";
+import { jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { styled, Badge } from "@mui/material";
+const sizeMap = {
+  xs: 18,
+  sm: 24,
+  md: 36,
+  lg: 48,
+  xl: 64
+};
+const StyledIcon = styled("span")(({ color, fontSize, spin, outlined }) => ({
+  display: "inline-flex",
+  color,
+  fontSize,
+  animation: spin ? "spin 1s linear infinite" : void 0,
+  border: outlined ? "1px solid currentColor" : void 0,
+  borderRadius: "50%",
+  padding: outlined ? 4 : 0,
+  "@keyframes spin": {
+    "0%": { transform: "rotate(0deg)" },
+    "100%": { transform: "rotate(360deg)" }
+  }
+}));
+const Icon = ({
+  children,
+  color = "var(--primary-color)",
+  outlined = false,
+  spin = false,
+  badge,
+  badgeColor = "primary",
+  badgePosition = { vertical: "bottom", horizontal: "right" },
+  badgeSize = "medium",
+  size = "sm",
+  black,
+  white,
+  className
+}) => {
+  const finalColor = useMemo(() => {
+    if (white) return "white";
+    if (black) return "black";
+    return color;
+  }, [color, white, black]);
+  const iconSize = sizeMap[size];
+  return /* @__PURE__ */ jsx(
+    Badge,
+    {
+      badgeContent: badge,
+      color: badgeColor,
+      anchorOrigin: badgePosition,
+      invisible: badge === void 0,
+      sx: { ".MuiBadge-badge": { transform: "scale(1)" } },
+      children: /* @__PURE__ */ jsx(
+        StyledIcon,
+        {
+          color: finalColor,
+          fontSize: iconSize,
+          spin,
+          outlined,
+          className: `hsi-icon ${className || ""}`,
+          children
+        }
+      )
+    }
+  );
+};
+export {
+  Icon
+};
+//# sourceMappingURL=Icon.js.map

package/components/Icon/Icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.js","sources":["../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import React, { ReactNode, useMemo } from 'react';\nimport { Badge, SvgIconProps, styled } from '@mui/material';\n\nexport type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\nexport interface IconProps {\n  children: ReactNode;\n  color?: string;\n  outlined?: boolean;\n  spin?: boolean;\n  badge?: string | number;\n  badgeColor?: 'primary' | 'secondary' | 'error';\n  badgePosition?: {\n    vertical: 'top' | 'bottom';\n    horizontal: 'right' | 'left';\n  };\n  badgeSize?: 'small' | 'medium' | 'large';\n  size?: IconSize;\n  black?: boolean;\n  white?: boolean;\n  className?: string;\n}\n\nconst sizeMap: Record<IconSize, number> = {\n  xs: 18,\n  sm: 24,\n  md: 36,\n  lg: 48,\n  xl: 64,\n};\n\nconst StyledIcon = styled('span')<{\n  color?: string;\n  fontSize?: number;\n  spin?: boolean;\n  outlined?: boolean;\n}>(({ color, fontSize, spin, outlined }) => ({\n  display: 'inline-flex',\n  color: color,\n  fontSize: fontSize,\n  animation: spin ? 'spin 1s linear infinite' : undefined,\n  border: outlined ? '1px solid currentColor' : undefined,\n  borderRadius: '50%',\n  padding: outlined ? 4 : 0,\n  '@keyframes spin': {\n    '0%': { transform: 'rotate(0deg)' },\n    '100%': { transform: 'rotate(360deg)' },\n  },\n}));\n\nexport const Icon: React.FC<IconProps> = ({\n  children,\n  color = 'var(--primary-color)',\n  outlined = false,\n  spin = false,\n  badge,\n  badgeColor = 'primary',\n  badgePosition = { vertical: 'bottom', horizontal: 'right' },\n  badgeSize = 'medium',\n  size = 'sm',\n  black,\n  white,\n  className,\n}) => {\n  const finalColor = useMemo(() => {\n    if (white) return 'white';\n    if (black) return 'black';\n    return color;\n  }, [color, white, black]);\n\n  const iconSize = sizeMap[size];\n\n  return (\n    <Badge\n      badgeContent={badge}\n      color={badgeColor}\n      anchorOrigin={badgePosition}\n      invisible={badge === undefined}\n      sx={{ '.MuiBadge-badge': { transform: 'scale(1)' } }}\n    >\n      <StyledIcon\n        color={finalColor}\n        fontSize={iconSize}\n        spin={spin}\n        outlined={outlined}\n        className={`hsi-icon ${className || ''}`}\n      >\n        {children}\n      </StyledIcon>\n    </Badge>\n  );\n};\n\nexport default Icon;"],"names":[],"mappings":";;;;AAuBA,MAAM,UAAoC;AAAA,EACxC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,MAAM,aAAa,OAAO,MAAM,EAK7B,CAAC,EAAE,OAAO,UAAU,MAAM,gBAAgB;AAAA,EAC3C,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA,WAAW,OAAO,4BAA4B;AAAA,EAC9C,QAAQ,WAAW,2BAA2B;AAAA,EAC9C,cAAc;AAAA,EACd,SAAS,WAAW,IAAI;AAAA,EACxB,mBAAmB;AAAA,IACjB,MAAM,EAAE,WAAW,eAAA;AAAA,IACnB,QAAQ,EAAE,WAAW,iBAAA;AAAA,EAAiB;AAE1C,EAAE;AAEK,MAAM,OAA4B,CAAC;AAAA,EACxC;AAAA,EACA,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,OAAO;AAAA,EACP;AAAA,EACA,aAAa;AAAA,EACb,gBAAgB,EAAE,UAAU,UAAU,YAAY,QAAA;AAAA,EAClD,YAAY;AAAA,EACZ,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,aAAa,QAAQ,MAAM;AAC/B,QAAI,MAAO,QAAO;AAClB,QAAI,MAAO,QAAO;AAClB,WAAO;AAAA,EACT,GAAG,CAAC,OAAO,OAAO,KAAK,CAAC;AAExB,QAAM,WAAW,QAAQ,IAAI;AAE7B,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,cAAc;AAAA,MACd,OAAO;AAAA,MACP,cAAc;AAAA,MACd,WAAW,UAAU;AAAA,MACrB,IAAI,EAAE,mBAAmB,EAAE,WAAW,aAAW;AAAA,MAEjD,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAO;AAAA,UACP,UAAU;AAAA,UACV;AAAA,UACA;AAAA,UACA,WAAW,YAAY,aAAa,EAAE;AAAA,UAErC;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGN;"}

package/components/Icon/index.d.ts

@@ -0,0 +1 @@
+export { default as Icon } from './Icon';

package/components/Icon.d.ts

@@ -0,0 +1,2 @@
+export * from './Icon/index'
+export {}

package/components/Input/Input.cjs

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const Input = require("../../Input-c8MwNNPg.cjs");
+exports.Input = Input.Input;
+//# sourceMappingURL=Input.cjs.map

package/components/Input/Input.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/components/Input/Input.d.ts

@@ -0,0 +1,32 @@
+import { default as React } from 'react';
+import { TextFieldProps } from '@mui/material';
+import { Control, RegisterOptions } from 'react-hook-form';
+interface BaseInputProps extends Omit<TextFieldProps, 'value' | 'onChange' | 'variant' | 'type' | 'inputProps' | 'slotProps' | 'error' | 'helperText'> {
+    type?: 'text' | 'number' | 'email' | 'password' | 'tel' | 'url' | 'search' | 'date' | 'datetime-local' | 'month' | 'week' | 'time' | 'color';
+    variant?: 'outlined' | 'filled' | 'standard';
+    min?: number;
+    max?: number;
+    inputProps?: React.InputHTMLAttributes<HTMLInputElement>;
+    slotProps?: TextFieldProps['slotProps'];
+    disabled?: boolean;
+    readOnly?: boolean;
+    error?: boolean;
+    helperText?: string;
+}
+interface RHFInputProps extends BaseInputProps {
+    name: string;
+    control: Control<any>;
+    validation?: RegisterOptions;
+    value?: string | number;
+    onChange?: (value: string | number) => void;
+}
+interface StandardInputPropsWithOptionalName extends BaseInputProps {
+    name?: string;
+    control?: never;
+    validation?: never;
+    value: string | number;
+    onChange: (value: string | number) => void;
+}
+export type InputProps = RHFInputProps | StandardInputPropsWithOptionalName;
+export declare const Input: React.ForwardRefExoticComponent<(Omit<RHFInputProps, "ref"> | Omit<StandardInputPropsWithOptionalName, "ref">) & React.RefAttributes<HTMLInputElement>>;
+export default Input;

package/components/Input/Input.js

@@ -0,0 +1,5 @@
+import { I } from "../../Input-DFHs7cJ_.js";
+export {
+  I as Input
+};
+//# sourceMappingURL=Input.js.map

package/components/Input/Input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/components/Input.d.ts

@@ -0,0 +1,2 @@
+export * from './Input/index'
+export {}

package/components/InputGroup/InputGroup.cjs

@@ -0,0 +1,126 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const material = require("@mui/material");
+const DatePicker = require("@mui/x-date-pickers/DatePicker");
+const Input = require("../../Input-c8MwNNPg.cjs");
+const Select = require("../../Select-BO2N56sm.cjs");
+const DatePicker$1 = require("../../DatePicker-BXdDk2g_.cjs");
+const InputGroup = ({ children }) => {
+  const childrenArray = React.Children.toArray(children);
+  const childrenWithDividers = childrenArray.map((child, index) => {
+    if (React.isValidElement(child)) {
+      const childProps = child.props;
+      const childType = child.type;
+      const isInputComponent = childType === material.TextField || childType === Input.Input || childType === material.Select || childType === Select.Select || childType === DatePicker.DatePicker || childType === DatePicker$1.DatePicker;
+      const clonedChild = isInputComponent ? React.cloneElement(child, __spreadProps(__spreadValues({}, childProps), {
+        // Añade la clase directamente al componente clonado
+        className: "InputGroupChild",
+        sx: __spreadProps(__spreadValues({}, childProps.sx), {
+          // Usa el selector correcto para anular el borde del NotchedOutline
+          "& .MuiOutlinedInput-notchedOutline": {
+            border: "none !important"
+          },
+          // Asegura que el botón del DatePicker no tenga borde divisor
+          "& .MuiInputBase-root .MuiButtonBase-root": {
+            borderRight: "none"
+          },
+          // Oculta el legend de MuiOutlinedInput para que el borde no tenga "muescas"
+          "& .MuiOutlinedInput-notchedOutline > legend": {
+            display: "none"
+          },
+          " .InputGroupChild > MuiOutlinedInput-notchedOutline": {
+            border: "none !important"
+          },
+          ".MuiOutlinedInput-notchedOutline, > .MuiOutlinedInput-notchedOutline": {
+            border: "none !important"
+          }
+        })
+      })) : child;
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        material.Box,
+        {
+          sx: {
+            flexGrow: 1,
+            display: "flex",
+            alignItems: "center",
+            minWidth: 0,
+            borderRight: index < childrenArray.length - 1 ? "1px solid #ccc" : "none"
+          },
+          children: clonedChild
+        },
+        index
+      );
+    }
+    return child;
+  });
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    material.Box,
+    {
+      sx: {
+        width: "100%",
+        display: "grid",
+        marginBottom: "10px",
+        marginTop: "10px"
+      },
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        material.Box,
+        {
+          className: "InputGroupChild",
+          sx: {
+            display: "flex",
+            justifyContent: "space-between",
+            height: "32px",
+            border: "1px solid #ccc",
+            borderRadius: "10px",
+            padding: "8px 0px",
+            marginTop: "-5px",
+            marginBottom: "20px",
+            "& .MuiInputBase-root, & .MuiButtonBase-root, & .MuiChip-root": {
+              borderRadius: 0
+            },
+            "& > div:first-of-type .MuiInputBase-root, & > div:first-of-type .MuiButtonBase-root, & > div:first-of-type .MuiChip-root": {
+              borderTopLeftRadius: "10px",
+              borderBottomLeftRadius: "10px"
+            },
+            "& > div:last-of-type .MuiInputBase-root, & > div:last-of-type .MuiButtonBase-root, & > div:last-of-type .MuiChip-root": {
+              borderTopRightRadius: "10px",
+              borderBottomRightRadius: "10px",
+              border: "none !important"
+            },
+            // Estilo para los componentes que tienen `InputGroupChild` en la clase
+            "& .InputGroupChild": {
+              width: "100%"
+            },
+            "&  > div:first-of-type .MuiInputBase-root > .MuiOutlinedInput-notchedOutline": {
+              border: "none !important"
+            }
+          },
+          children: childrenWithDividers
+        }
+      )
+    }
+  );
+};
+exports.InputGroup = InputGroup;
+//# sourceMappingURL=InputGroup.cjs.map

package/components/InputGroup/InputGroup.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputGroup.cjs","sources":["../../../src/components/InputGroup/InputGroup.tsx"],"sourcesContent":["import React, { Children, cloneElement, isValidElement } from 'react';\nimport { Box } from '@mui/material';\nimport { DatePicker as MuiDatePicker } from '@mui/x-date-pickers/DatePicker';\nimport { Select as MuiSelect } from '@mui/material';\nimport { TextField as MuiTextField } from '@mui/material';\nimport { Input } from '../Input';\nimport { Select } from '../Select';\nimport { DatePicker } from '../DatePicker';\n\ninterface CommonProps {\n  sx?: object;\n  [key: string]: any;\n}\n\ninterface InputGroupProps {\n  children: React.ReactNode;\n}\n\nconst InputGroup: React.FC<InputGroupProps> = ({ children }) => {\n  const childrenArray = Children.toArray(children);\n\n  const childrenWithDividers = childrenArray.map((child, index) => {\n    if (isValidElement(child)) {\n      const childProps = child.props as CommonProps;\n      const childType = child.type as any;\n\n      const isInputComponent = (\n        childType === MuiTextField || \n        childType === Input || \n        childType === MuiSelect || \n        childType === Select ||\n        childType === MuiDatePicker || \n        childType === DatePicker\n      );\n\n      const clonedChild = isInputComponent ? (\n        cloneElement(child, {\n          ...childProps,\n          // Añade la clase directamente al componente clonado\n          className: 'InputGroupChild',\n          sx: {\n            ...childProps.sx,\n            // Usa el selector correcto para anular el borde del NotchedOutline\n            '& .MuiOutlinedInput-notchedOutline': {\n              border: 'none !important',\n            },\n            // Asegura que el botón del DatePicker no tenga borde divisor\n            '& .MuiInputBase-root .MuiButtonBase-root': {\n              borderRight: 'none',\n            },\n            // Oculta el legend de MuiOutlinedInput para que el borde no tenga \"muescas\"\n            '& .MuiOutlinedInput-notchedOutline > legend': {\n              display: 'none',\n            },\n\n            ' .InputGroupChild > MuiOutlinedInput-notchedOutline': {\n              border: 'none !important',\n\n            }, \n            '.MuiOutlinedInput-notchedOutline, > .MuiOutlinedInput-notchedOutline': {\n              border: 'none !important',\n            }\n\n          },\n        } as CommonProps)\n      ) : (\n        child\n      );\n\n      return (\n        <Box\n          key={index}\n          sx={{\n            flexGrow: 1,\n            display: 'flex',\n            alignItems: 'center',\n            minWidth: 0,\n            borderRight: index < childrenArray.length - 1 ? '1px solid #ccc' : 'none',\n          }}\n        >\n          {clonedChild}\n        </Box>\n      );\n    }\n    return child;\n  });\n\n  return (\n    <Box\n      sx={{\n          width: '100%',\n          display: 'grid',\n          marginBottom: '10px',\n          marginTop: '10px'\n      }}\n\n  >\n    <Box\n      className='InputGroupChild'\n      sx={{\n        display: 'flex',\n        justifyContent: 'space-between',\n        height: '32px',\n        border: '1px solid #ccc',\n        borderRadius: '10px',\n        padding: '8px 0px',\n        marginTop: '-5px',\n        marginBottom: '20px',\n        '& .MuiInputBase-root, & .MuiButtonBase-root, & .MuiChip-root': {\n          borderRadius: 0,\n        },\n        '& > div:first-of-type .MuiInputBase-root, & > div:first-of-type .MuiButtonBase-root, & > div:first-of-type .MuiChip-root': {\n          borderTopLeftRadius: '10px',\n          borderBottomLeftRadius: '10px',\n        },\n        '& > div:last-of-type .MuiInputBase-root, & > div:last-of-type .MuiButtonBase-root, & > div:last-of-type .MuiChip-root': {\n          borderTopRightRadius: '10px',\n          borderBottomRightRadius: '10px',\n          border: 'none !important'\n        },\n        // Estilo para los componentes que tienen `InputGroupChild` en la clase\n        '& .InputGroupChild': {\n          width: '100%',\n        },\n        '&  > div:first-of-type .MuiInputBase-root > .MuiOutlinedInput-notchedOutline': {\n          border: 'none !important',\n        },\n      }}\n    >\n      {childrenWithDividers}\n    </Box>\n  </Box>\n  );\n};\n\nexport default InputGroup;"],"names":["Children","isValidElement","MuiTextField","Input","MuiSelect","Select","MuiDatePicker","DatePicker","cloneElement","jsx","Box"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,MAAM,aAAwC,CAAC,EAAE,eAAe;AAC9D,QAAM,gBAAgBA,MAAAA,SAAS,QAAQ,QAAQ;AAE/C,QAAM,uBAAuB,cAAc,IAAI,CAAC,OAAO,UAAU;AAC/D,QAAIC,MAAAA,eAAe,KAAK,GAAG;AACzB,YAAM,aAAa,MAAM;AACzB,YAAM,YAAY,MAAM;AAExB,YAAM,mBACJ,cAAcC,sBACd,cAAcC,MAAAA,SACd,cAAcC,SAAAA,UACd,cAAcC,OAAAA,UACd,cAAcC,WAAAA,cACd,cAAcC,aAAAA;AAGhB,YAAM,cAAc,mBAClBC,MAAAA,aAAa,OAAO,iCACf,aADe;AAAA;AAAA,QAGlB,WAAW;AAAA,QACX,IAAI,iCACC,WAAW,KADZ;AAAA;AAAA,UAGF,sCAAsC;AAAA,YACpC,QAAQ;AAAA,UAAA;AAAA;AAAA,UAGV,4CAA4C;AAAA,YAC1C,aAAa;AAAA,UAAA;AAAA;AAAA,UAGf,+CAA+C;AAAA,YAC7C,SAAS;AAAA,UAAA;AAAA,UAGX,uDAAuD;AAAA,YACrD,QAAQ;AAAA,UAAA;AAAA,UAGV,wEAAwE;AAAA,YACtE,QAAQ;AAAA,UAAA;AAAA,QACV;AAAA,MAEF,EACc,IAEhB;AAGF,aACEC,2BAAAA;AAAAA,QAACC,SAAAA;AAAAA,QAAA;AAAA,UAEC,IAAI;AAAA,YACF,UAAU;AAAA,YACV,SAAS;AAAA,YACT,YAAY;AAAA,YACZ,UAAU;AAAA,YACV,aAAa,QAAQ,cAAc,SAAS,IAAI,mBAAmB;AAAA,UAAA;AAAA,UAGpE,UAAA;AAAA,QAAA;AAAA,QATI;AAAA,MAAA;AAAA,IAYX;AACA,WAAO;AAAA,EACT,CAAC;AAED,SACED,2BAAAA;AAAAA,IAACC,SAAAA;AAAAA,IAAA;AAAA,MACC,IAAI;AAAA,QACA,OAAO;AAAA,QACP,SAAS;AAAA,QACT,cAAc;AAAA,QACd,WAAW;AAAA,MAAA;AAAA,MAIjB,UAAAD,2BAAAA;AAAAA,QAACC,SAAAA;AAAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,IAAI;AAAA,YACF,SAAS;AAAA,YACT,gBAAgB;AAAA,YAChB,QAAQ;AAAA,YACR,QAAQ;AAAA,YACR,cAAc;AAAA,YACd,SAAS;AAAA,YACT,WAAW;AAAA,YACX,cAAc;AAAA,YACd,gEAAgE;AAAA,cAC9D,cAAc;AAAA,YAAA;AAAA,YAEhB,4HAA4H;AAAA,cAC1H,qBAAqB;AAAA,cACrB,wBAAwB;AAAA,YAAA;AAAA,YAE1B,yHAAyH;AAAA,cACvH,sBAAsB;AAAA,cACtB,yBAAyB;AAAA,cACzB,QAAQ;AAAA,YAAA;AAAA;AAAA,YAGV,sBAAsB;AAAA,cACpB,OAAO;AAAA,YAAA;AAAA,YAET,gFAAgF;AAAA,cAC9E,QAAQ;AAAA,YAAA;AAAA,UACV;AAAA,UAGD,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGJ;;"}

package/components/InputGroup/InputGroup.d.ts

@@ -0,0 +1,6 @@
+import { default as React } from 'react';
+interface InputGroupProps {
+    children: React.ReactNode;
+}
+declare const InputGroup: React.FC<InputGroupProps>;
+export default InputGroup;

package/components/InputGroup/InputGroup.js

@@ -0,0 +1,126 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import { jsx } from "react/jsx-runtime";
+import { Children, isValidElement, cloneElement } from "react";
+import { Box, TextField, Select } from "@mui/material";
+import { DatePicker } from "@mui/x-date-pickers/DatePicker";
+import { I as Input } from "../../Input-DFHs7cJ_.js";
+import { S as Select$1 } from "../../Select-BcLkyHSE.js";
+import { D as DatePicker$1 } from "../../DatePicker-BS543Ayk.js";
+const InputGroup = ({ children }) => {
+  const childrenArray = Children.toArray(children);
+  const childrenWithDividers = childrenArray.map((child, index) => {
+    if (isValidElement(child)) {
+      const childProps = child.props;
+      const childType = child.type;
+      const isInputComponent = childType === TextField || childType === Input || childType === Select || childType === Select$1 || childType === DatePicker || childType === DatePicker$1;
+      const clonedChild = isInputComponent ? cloneElement(child, __spreadProps(__spreadValues({}, childProps), {
+        // Añade la clase directamente al componente clonado
+        className: "InputGroupChild",
+        sx: __spreadProps(__spreadValues({}, childProps.sx), {
+          // Usa el selector correcto para anular el borde del NotchedOutline
+          "& .MuiOutlinedInput-notchedOutline": {
+            border: "none !important"
+          },
+          // Asegura que el botón del DatePicker no tenga borde divisor
+          "& .MuiInputBase-root .MuiButtonBase-root": {
+            borderRight: "none"
+          },
+          // Oculta el legend de MuiOutlinedInput para que el borde no tenga "muescas"
+          "& .MuiOutlinedInput-notchedOutline > legend": {
+            display: "none"
+          },
+          " .InputGroupChild > MuiOutlinedInput-notchedOutline": {
+            border: "none !important"
+          },
+          ".MuiOutlinedInput-notchedOutline, > .MuiOutlinedInput-notchedOutline": {
+            border: "none !important"
+          }
+        })
+      })) : child;
+      return /* @__PURE__ */ jsx(
+        Box,
+        {
+          sx: {
+            flexGrow: 1,
+            display: "flex",
+            alignItems: "center",
+            minWidth: 0,
+            borderRight: index < childrenArray.length - 1 ? "1px solid #ccc" : "none"
+          },
+          children: clonedChild
+        },
+        index
+      );
+    }
+    return child;
+  });
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      sx: {
+        width: "100%",
+        display: "grid",
+        marginBottom: "10px",
+        marginTop: "10px"
+      },
+      children: /* @__PURE__ */ jsx(
+        Box,
+        {
+          className: "InputGroupChild",
+          sx: {
+            display: "flex",
+            justifyContent: "space-between",
+            height: "32px",
+            border: "1px solid #ccc",
+            borderRadius: "10px",
+            padding: "8px 0px",
+            marginTop: "-5px",
+            marginBottom: "20px",
+            "& .MuiInputBase-root, & .MuiButtonBase-root, & .MuiChip-root": {
+              borderRadius: 0
+            },
+            "& > div:first-of-type .MuiInputBase-root, & > div:first-of-type .MuiButtonBase-root, & > div:first-of-type .MuiChip-root": {
+              borderTopLeftRadius: "10px",
+              borderBottomLeftRadius: "10px"
+            },
+            "& > div:last-of-type .MuiInputBase-root, & > div:last-of-type .MuiButtonBase-root, & > div:last-of-type .MuiChip-root": {
+              borderTopRightRadius: "10px",
+              borderBottomRightRadius: "10px",
+              border: "none !important"
+            },
+            // Estilo para los componentes que tienen `InputGroupChild` en la clase
+            "& .InputGroupChild": {
+              width: "100%"
+            },
+            "&  > div:first-of-type .MuiInputBase-root > .MuiOutlinedInput-notchedOutline": {
+              border: "none !important"
+            }
+          },
+          children: childrenWithDividers
+        }
+      )
+    }
+  );
+};
+export {
+  InputGroup
+};
+//# sourceMappingURL=InputGroup.js.map

package/components/InputGroup/InputGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputGroup.js","sources":["../../../src/components/InputGroup/InputGroup.tsx"],"sourcesContent":["import React, { Children, cloneElement, isValidElement } from 'react';\nimport { Box } from '@mui/material';\nimport { DatePicker as MuiDatePicker } from '@mui/x-date-pickers/DatePicker';\nimport { Select as MuiSelect } from '@mui/material';\nimport { TextField as MuiTextField } from '@mui/material';\nimport { Input } from '../Input';\nimport { Select } from '../Select';\nimport { DatePicker } from '../DatePicker';\n\ninterface CommonProps {\n  sx?: object;\n  [key: string]: any;\n}\n\ninterface InputGroupProps {\n  children: React.ReactNode;\n}\n\nconst InputGroup: React.FC<InputGroupProps> = ({ children }) => {\n  const childrenArray = Children.toArray(children);\n\n  const childrenWithDividers = childrenArray.map((child, index) => {\n    if (isValidElement(child)) {\n      const childProps = child.props as CommonProps;\n      const childType = child.type as any;\n\n      const isInputComponent = (\n        childType === MuiTextField || \n        childType === Input || \n        childType === MuiSelect || \n        childType === Select ||\n        childType === MuiDatePicker || \n        childType === DatePicker\n      );\n\n      const clonedChild = isInputComponent ? (\n        cloneElement(child, {\n          ...childProps,\n          // Añade la clase directamente al componente clonado\n          className: 'InputGroupChild',\n          sx: {\n            ...childProps.sx,\n            // Usa el selector correcto para anular el borde del NotchedOutline\n            '& .MuiOutlinedInput-notchedOutline': {\n              border: 'none !important',\n            },\n            // Asegura que el botón del DatePicker no tenga borde divisor\n            '& .MuiInputBase-root .MuiButtonBase-root': {\n              borderRight: 'none',\n            },\n            // Oculta el legend de MuiOutlinedInput para que el borde no tenga \"muescas\"\n            '& .MuiOutlinedInput-notchedOutline > legend': {\n              display: 'none',\n            },\n\n            ' .InputGroupChild > MuiOutlinedInput-notchedOutline': {\n              border: 'none !important',\n\n            }, \n            '.MuiOutlinedInput-notchedOutline, > .MuiOutlinedInput-notchedOutline': {\n              border: 'none !important',\n            }\n\n          },\n        } as CommonProps)\n      ) : (\n        child\n      );\n\n      return (\n        <Box\n          key={index}\n          sx={{\n            flexGrow: 1,\n            display: 'flex',\n            alignItems: 'center',\n            minWidth: 0,\n            borderRight: index < childrenArray.length - 1 ? '1px solid #ccc' : 'none',\n          }}\n        >\n          {clonedChild}\n        </Box>\n      );\n    }\n    return child;\n  });\n\n  return (\n    <Box\n      sx={{\n          width: '100%',\n          display: 'grid',\n          marginBottom: '10px',\n          marginTop: '10px'\n      }}\n\n  >\n    <Box\n      className='InputGroupChild'\n      sx={{\n        display: 'flex',\n        justifyContent: 'space-between',\n        height: '32px',\n        border: '1px solid #ccc',\n        borderRadius: '10px',\n        padding: '8px 0px',\n        marginTop: '-5px',\n        marginBottom: '20px',\n        '& .MuiInputBase-root, & .MuiButtonBase-root, & .MuiChip-root': {\n          borderRadius: 0,\n        },\n        '& > div:first-of-type .MuiInputBase-root, & > div:first-of-type .MuiButtonBase-root, & > div:first-of-type .MuiChip-root': {\n          borderTopLeftRadius: '10px',\n          borderBottomLeftRadius: '10px',\n        },\n        '& > div:last-of-type .MuiInputBase-root, & > div:last-of-type .MuiButtonBase-root, & > div:last-of-type .MuiChip-root': {\n          borderTopRightRadius: '10px',\n          borderBottomRightRadius: '10px',\n          border: 'none !important'\n        },\n        // Estilo para los componentes que tienen `InputGroupChild` en la clase\n        '& .InputGroupChild': {\n          width: '100%',\n        },\n        '&  > div:first-of-type .MuiInputBase-root > .MuiOutlinedInput-notchedOutline': {\n          border: 'none !important',\n        },\n      }}\n    >\n      {childrenWithDividers}\n    </Box>\n  </Box>\n  );\n};\n\nexport default InputGroup;"],"names":["MuiTextField","MuiSelect","Select","MuiDatePicker","DatePicker"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,MAAM,aAAwC,CAAC,EAAE,eAAe;AAC9D,QAAM,gBAAgB,SAAS,QAAQ,QAAQ;AAE/C,QAAM,uBAAuB,cAAc,IAAI,CAAC,OAAO,UAAU;AAC/D,QAAI,eAAe,KAAK,GAAG;AACzB,YAAM,aAAa,MAAM;AACzB,YAAM,YAAY,MAAM;AAExB,YAAM,mBACJ,cAAcA,aACd,cAAc,SACd,cAAcC,UACd,cAAcC,YACd,cAAcC,cACd,cAAcC;AAGhB,YAAM,cAAc,mBAClB,aAAa,OAAO,iCACf,aADe;AAAA;AAAA,QAGlB,WAAW;AAAA,QACX,IAAI,iCACC,WAAW,KADZ;AAAA;AAAA,UAGF,sCAAsC;AAAA,YACpC,QAAQ;AAAA,UAAA;AAAA;AAAA,UAGV,4CAA4C;AAAA,YAC1C,aAAa;AAAA,UAAA;AAAA;AAAA,UAGf,+CAA+C;AAAA,YAC7C,SAAS;AAAA,UAAA;AAAA,UAGX,uDAAuD;AAAA,YACrD,QAAQ;AAAA,UAAA;AAAA,UAGV,wEAAwE;AAAA,YACtE,QAAQ;AAAA,UAAA;AAAA,QACV;AAAA,MAEF,EACc,IAEhB;AAGF,aACE;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,IAAI;AAAA,YACF,UAAU;AAAA,YACV,SAAS;AAAA,YACT,YAAY;AAAA,YACZ,UAAU;AAAA,YACV,aAAa,QAAQ,cAAc,SAAS,IAAI,mBAAmB;AAAA,UAAA;AAAA,UAGpE,UAAA;AAAA,QAAA;AAAA,QATI;AAAA,MAAA;AAAA,IAYX;AACA,WAAO;AAAA,EACT,CAAC;AAED,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAI;AAAA,QACA,OAAO;AAAA,QACP,SAAS;AAAA,QACT,cAAc;AAAA,QACd,WAAW;AAAA,MAAA;AAAA,MAIjB,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,IAAI;AAAA,YACF,SAAS;AAAA,YACT,gBAAgB;AAAA,YAChB,QAAQ;AAAA,YACR,QAAQ;AAAA,YACR,cAAc;AAAA,YACd,SAAS;AAAA,YACT,WAAW;AAAA,YACX,cAAc;AAAA,YACd,gEAAgE;AAAA,cAC9D,cAAc;AAAA,YAAA;AAAA,YAEhB,4HAA4H;AAAA,cAC1H,qBAAqB;AAAA,cACrB,wBAAwB;AAAA,YAAA;AAAA,YAE1B,yHAAyH;AAAA,cACvH,sBAAsB;AAAA,cACtB,yBAAyB;AAAA,cACzB,QAAQ;AAAA,YAAA;AAAA;AAAA,YAGV,sBAAsB;AAAA,cACpB,OAAO;AAAA,YAAA;AAAA,YAET,gFAAgF;AAAA,cAC9E,QAAQ;AAAA,YAAA;AAAA,UACV;AAAA,UAGD,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGJ;"}

package/components/InputGroup.d.ts

@@ -0,0 +1,2 @@
+export * from './InputGroup/index'
+export {}

package/components/MenuButton/MenuButton.cjs

@@ -0,0 +1,78 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const material = require("@mui/material");
+const MenuButton = ({
+  buttonText,
+  buttonIcon,
+  options,
+  variant = "contained"
+}) => {
+  const [anchorEl, setAnchorEl] = React.useState(null);
+  const [menuWidth, setMenuWidth] = React.useState(0);
+  const open = Boolean(anchorEl);
+  const buttonRef = React.useRef(null);
+  const uniqueId = React.useId();
+  const buttonId = `menu-button-${uniqueId}`;
+  const menuId = `menu-content-${uniqueId}`;
+  const handleClick = (event) => {
+    setAnchorEl(event.currentTarget);
+    if (buttonRef.current) {
+      setMenuWidth(buttonRef.current.offsetWidth);
+    }
+  };
+  const handleClose = () => {
+    setAnchorEl(null);
+  };
+  const handleMenuItemClick = (action) => {
+    handleClose();
+    action();
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      material.Button,
+      {
+        ref: buttonRef,
+        variant,
+        id: buttonId,
+        "aria-controls": open ? menuId : void 0,
+        "aria-haspopup": "true",
+        "aria-expanded": open ? "true" : void 0,
+        onClick: handleClick,
+        startIcon: buttonIcon,
+        children: buttonText
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      material.Menu,
+      {
+        id: menuId,
+        anchorEl,
+        open,
+        onClose: handleClose,
+        MenuListProps: {
+          "aria-labelledby": buttonId
+        },
+        PaperProps: {
+          style: {
+            minWidth: menuWidth
+          }
+        },
+        children: options.map((option, index) => /* @__PURE__ */ jsxRuntime.jsxs(
+          material.MenuItem,
+          {
+            onClick: () => handleMenuItemClick(option.action),
+            children: [
+              option.icon && /* @__PURE__ */ jsxRuntime.jsx(material.ListItemIcon, { children: option.icon }),
+              /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "inherit", noWrap: true, children: option.label })
+            ]
+          },
+          index
+        ))
+      }
+    )
+  ] });
+};
+exports.MenuButton = MenuButton;
+//# sourceMappingURL=MenuButton.cjs.map

package/components/MenuButton/MenuButton.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuButton.cjs","sources":["../../../src/components/MenuButton/MenuButton.tsx"],"sourcesContent":["import React, { useState, MouseEvent, ReactNode, useId, useRef } from 'react'; // 👈 Importa useRef\nimport { Button, Menu, MenuItem, ListItemIcon, Typography } from '@mui/material';\nimport { ButtonProps } from '@mui/material/Button';\n\n// Define la interfaz para cada opción del menú\nexport interface MenuOption {\n    label: string;\n    action: () => void;\n    icon?: ReactNode;\n}\n\n// Define las props para el componente reutilizable\ninterface MenuButtonProps {\n    buttonText?: string;\n    buttonIcon?: ReactNode;\n    options: MenuOption[];\n    variant?: ButtonProps['variant'];\n}\n\nexport const MenuButton: React.FC<MenuButtonProps> = ({\n    buttonText,\n    buttonIcon,\n    options,\n    variant = 'contained',\n}) => {\n    const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);\n    const [menuWidth, setMenuWidth] = useState<number>(0);\n    const open = Boolean(anchorEl);\n\n    const buttonRef = useRef<HTMLButtonElement>(null);\n\n    const uniqueId = useId();\n    const buttonId = `menu-button-${uniqueId}`;\n    const menuId = `menu-content-${uniqueId}`;\n\n    const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n        setAnchorEl(event.currentTarget);\n        if (buttonRef.current) {\n            setMenuWidth(buttonRef.current.offsetWidth);\n        }\n    };\n\n    const handleClose = () => {\n        setAnchorEl(null);\n    };\n\n    const handleMenuItemClick = (action: () => void) => {\n        handleClose();\n        action();\n    };\n\n    return (\n        <>\n            <Button\n                ref={buttonRef}\n                variant={variant}\n                id={buttonId}\n                aria-controls={open ? menuId : undefined}\n                aria-haspopup=\"true\"\n                aria-expanded={open ? 'true' : undefined}\n                onClick={handleClick}\n                startIcon={buttonIcon}\n            >\n                {buttonText}\n            </Button>\n            <Menu\n                id={menuId}\n                anchorEl={anchorEl}\n                open={open}\n                onClose={handleClose}\n                MenuListProps={{\n                    'aria-labelledby': buttonId,\n                }}\n                PaperProps={{\n                    style: {\n                        minWidth: menuWidth,\n                    },\n                }}\n            >\n                {options.map((option, index) => (\n                    <MenuItem\n                        key={index}\n                        onClick={() => handleMenuItemClick(option.action)}\n                    >\n                        {option.icon && (\n                            <ListItemIcon>\n                                {option.icon}\n                            </ListItemIcon>\n                        )}\n                        <Typography variant=\"inherit\" noWrap>\n                            {option.label}\n                        </Typography>\n                    </MenuItem>\n                ))}\n            </Menu>\n        </>\n    );\n};\n\nexport default MenuButton;"],"names":["useState","useRef","useId","jsxs","Fragment","jsx","Button","Menu","MenuItem","ListItemIcon","Typography"],"mappings":";;;;;AAmBO,MAAM,aAAwC,CAAC;AAAA,EAClD;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AACd,MAAM;AACF,QAAM,CAAC,UAAU,WAAW,IAAIA,MAAAA,SAA6B,IAAI;AACjE,QAAM,CAAC,WAAW,YAAY,IAAIA,MAAAA,SAAiB,CAAC;AACpD,QAAM,OAAO,QAAQ,QAAQ;AAE7B,QAAM,YAAYC,MAAAA,OAA0B,IAAI;AAEhD,QAAM,WAAWC,MAAAA,MAAA;AACjB,QAAM,WAAW,eAAe,QAAQ;AACxC,QAAM,SAAS,gBAAgB,QAAQ;AAEvC,QAAM,cAAc,CAAC,UAAyC;AAC1D,gBAAY,MAAM,aAAa;AAC/B,QAAI,UAAU,SAAS;AACnB,mBAAa,UAAU,QAAQ,WAAW;AAAA,IAC9C;AAAA,EACJ;AAEA,QAAM,cAAc,MAAM;AACtB,gBAAY,IAAI;AAAA,EACpB;AAEA,QAAM,sBAAsB,CAAC,WAAuB;AAChD,gBAAA;AACA,WAAA;AAAA,EACJ;AAEA,SACIC,2BAAAA,KAAAC,qBAAA,EACI,UAAA;AAAA,IAAAC,2BAAAA;AAAAA,MAACC,SAAAA;AAAAA,MAAA;AAAA,QACG,KAAK;AAAA,QACL;AAAA,QACA,IAAI;AAAA,QACJ,iBAAe,OAAO,SAAS;AAAA,QAC/B,iBAAc;AAAA,QACd,iBAAe,OAAO,SAAS;AAAA,QAC/B,SAAS;AAAA,QACT,WAAW;AAAA,QAEV,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAELD,2BAAAA;AAAAA,MAACE,SAAAA;AAAAA,MAAA;AAAA,QACG,IAAI;AAAA,QACJ;AAAA,QACA;AAAA,QACA,SAAS;AAAA,QACT,eAAe;AAAA,UACX,mBAAmB;AAAA,QAAA;AAAA,QAEvB,YAAY;AAAA,UACR,OAAO;AAAA,YACH,UAAU;AAAA,UAAA;AAAA,QACd;AAAA,QAGH,UAAA,QAAQ,IAAI,CAAC,QAAQ,UAClBJ,2BAAAA;AAAAA,UAACK,SAAAA;AAAAA,UAAA;AAAA,YAEG,SAAS,MAAM,oBAAoB,OAAO,MAAM;AAAA,YAE/C,UAAA;AAAA,cAAA,OAAO,QACJH,+BAACI,SAAAA,cAAA,EACI,UAAA,OAAO,MACZ;AAAA,6CAEHC,SAAAA,YAAA,EAAW,SAAQ,WAAU,QAAM,MAC/B,iBAAO,MAAA,CACZ;AAAA,YAAA;AAAA,UAAA;AAAA,UAVK;AAAA,QAAA,CAYZ;AAAA,MAAA;AAAA,IAAA;AAAA,EACL,GACJ;AAER;;"}

package/components/MenuButton/MenuButton.d.ts

@@ -0,0 +1,15 @@
+import { default as React, ReactNode } from 'react';
+import { ButtonProps } from '@mui/material/Button';
+export interface MenuOption {
+    label: string;
+    action: () => void;
+    icon?: ReactNode;
+}
+interface MenuButtonProps {
+    buttonText?: string;
+    buttonIcon?: ReactNode;
+    options: MenuOption[];
+    variant?: ButtonProps['variant'];
+}
+export declare const MenuButton: React.FC<MenuButtonProps>;
+export default MenuButton;

package/components/MenuButton/MenuButton.js

@@ -0,0 +1,78 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { useState, useRef, useId } from "react";
+import { Button, Menu, MenuItem, ListItemIcon, Typography } from "@mui/material";
+const MenuButton = ({
+  buttonText,
+  buttonIcon,
+  options,
+  variant = "contained"
+}) => {
+  const [anchorEl, setAnchorEl] = useState(null);
+  const [menuWidth, setMenuWidth] = useState(0);
+  const open = Boolean(anchorEl);
+  const buttonRef = useRef(null);
+  const uniqueId = useId();
+  const buttonId = `menu-button-${uniqueId}`;
+  const menuId = `menu-content-${uniqueId}`;
+  const handleClick = (event) => {
+    setAnchorEl(event.currentTarget);
+    if (buttonRef.current) {
+      setMenuWidth(buttonRef.current.offsetWidth);
+    }
+  };
+  const handleClose = () => {
+    setAnchorEl(null);
+  };
+  const handleMenuItemClick = (action) => {
+    handleClose();
+    action();
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        ref: buttonRef,
+        variant,
+        id: buttonId,
+        "aria-controls": open ? menuId : void 0,
+        "aria-haspopup": "true",
+        "aria-expanded": open ? "true" : void 0,
+        onClick: handleClick,
+        startIcon: buttonIcon,
+        children: buttonText
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Menu,
+      {
+        id: menuId,
+        anchorEl,
+        open,
+        onClose: handleClose,
+        MenuListProps: {
+          "aria-labelledby": buttonId
+        },
+        PaperProps: {
+          style: {
+            minWidth: menuWidth
+          }
+        },
+        children: options.map((option, index) => /* @__PURE__ */ jsxs(
+          MenuItem,
+          {
+            onClick: () => handleMenuItemClick(option.action),
+            children: [
+              option.icon && /* @__PURE__ */ jsx(ListItemIcon, { children: option.icon }),
+              /* @__PURE__ */ jsx(Typography, { variant: "inherit", noWrap: true, children: option.label })
+            ]
+          },
+          index
+        ))
+      }
+    )
+  ] });
+};
+export {
+  MenuButton
+};
+//# sourceMappingURL=MenuButton.js.map

package/components/MenuButton/MenuButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuButton.js","sources":["../../../src/components/MenuButton/MenuButton.tsx"],"sourcesContent":["import React, { useState, MouseEvent, ReactNode, useId, useRef } from 'react'; // 👈 Importa useRef\nimport { Button, Menu, MenuItem, ListItemIcon, Typography } from '@mui/material';\nimport { ButtonProps } from '@mui/material/Button';\n\n// Define la interfaz para cada opción del menú\nexport interface MenuOption {\n    label: string;\n    action: () => void;\n    icon?: ReactNode;\n}\n\n// Define las props para el componente reutilizable\ninterface MenuButtonProps {\n    buttonText?: string;\n    buttonIcon?: ReactNode;\n    options: MenuOption[];\n    variant?: ButtonProps['variant'];\n}\n\nexport const MenuButton: React.FC<MenuButtonProps> = ({\n    buttonText,\n    buttonIcon,\n    options,\n    variant = 'contained',\n}) => {\n    const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);\n    const [menuWidth, setMenuWidth] = useState<number>(0);\n    const open = Boolean(anchorEl);\n\n    const buttonRef = useRef<HTMLButtonElement>(null);\n\n    const uniqueId = useId();\n    const buttonId = `menu-button-${uniqueId}`;\n    const menuId = `menu-content-${uniqueId}`;\n\n    const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n        setAnchorEl(event.currentTarget);\n        if (buttonRef.current) {\n            setMenuWidth(buttonRef.current.offsetWidth);\n        }\n    };\n\n    const handleClose = () => {\n        setAnchorEl(null);\n    };\n\n    const handleMenuItemClick = (action: () => void) => {\n        handleClose();\n        action();\n    };\n\n    return (\n        <>\n            <Button\n                ref={buttonRef}\n                variant={variant}\n                id={buttonId}\n                aria-controls={open ? menuId : undefined}\n                aria-haspopup=\"true\"\n                aria-expanded={open ? 'true' : undefined}\n                onClick={handleClick}\n                startIcon={buttonIcon}\n            >\n                {buttonText}\n            </Button>\n            <Menu\n                id={menuId}\n                anchorEl={anchorEl}\n                open={open}\n                onClose={handleClose}\n                MenuListProps={{\n                    'aria-labelledby': buttonId,\n                }}\n                PaperProps={{\n                    style: {\n                        minWidth: menuWidth,\n                    },\n                }}\n            >\n                {options.map((option, index) => (\n                    <MenuItem\n                        key={index}\n                        onClick={() => handleMenuItemClick(option.action)}\n                    >\n                        {option.icon && (\n                            <ListItemIcon>\n                                {option.icon}\n                            </ListItemIcon>\n                        )}\n                        <Typography variant=\"inherit\" noWrap>\n                            {option.label}\n                        </Typography>\n                    </MenuItem>\n                ))}\n            </Menu>\n        </>\n    );\n};\n\nexport default MenuButton;"],"names":[],"mappings":";;;AAmBO,MAAM,aAAwC,CAAC;AAAA,EAClD;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AACd,MAAM;AACF,QAAM,CAAC,UAAU,WAAW,IAAI,SAA6B,IAAI;AACjE,QAAM,CAAC,WAAW,YAAY,IAAI,SAAiB,CAAC;AACpD,QAAM,OAAO,QAAQ,QAAQ;AAE7B,QAAM,YAAY,OAA0B,IAAI;AAEhD,QAAM,WAAW,MAAA;AACjB,QAAM,WAAW,eAAe,QAAQ;AACxC,QAAM,SAAS,gBAAgB,QAAQ;AAEvC,QAAM,cAAc,CAAC,UAAyC;AAC1D,gBAAY,MAAM,aAAa;AAC/B,QAAI,UAAU,SAAS;AACnB,mBAAa,UAAU,QAAQ,WAAW;AAAA,IAC9C;AAAA,EACJ;AAEA,QAAM,cAAc,MAAM;AACtB,gBAAY,IAAI;AAAA,EACpB;AAEA,QAAM,sBAAsB,CAAC,WAAuB;AAChD,gBAAA;AACA,WAAA;AAAA,EACJ;AAEA,SACI,qBAAA,UAAA,EACI,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,KAAK;AAAA,QACL;AAAA,QACA,IAAI;AAAA,QACJ,iBAAe,OAAO,SAAS;AAAA,QAC/B,iBAAc;AAAA,QACd,iBAAe,OAAO,SAAS;AAAA,QAC/B,SAAS;AAAA,QACT,WAAW;AAAA,QAEV,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAEL;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,IAAI;AAAA,QACJ;AAAA,QACA;AAAA,QACA,SAAS;AAAA,QACT,eAAe;AAAA,UACX,mBAAmB;AAAA,QAAA;AAAA,QAEvB,YAAY;AAAA,UACR,OAAO;AAAA,YACH,UAAU;AAAA,UAAA;AAAA,QACd;AAAA,QAGH,UAAA,QAAQ,IAAI,CAAC,QAAQ,UAClB;AAAA,UAAC;AAAA,UAAA;AAAA,YAEG,SAAS,MAAM,oBAAoB,OAAO,MAAM;AAAA,YAE/C,UAAA;AAAA,cAAA,OAAO,QACJ,oBAAC,cAAA,EACI,UAAA,OAAO,MACZ;AAAA,kCAEH,YAAA,EAAW,SAAQ,WAAU,QAAM,MAC/B,iBAAO,MAAA,CACZ;AAAA,YAAA;AAAA,UAAA;AAAA,UAVK;AAAA,QAAA,CAYZ;AAAA,MAAA;AAAA,IAAA;AAAA,EACL,GACJ;AAER;"}

package/components/MenuButton.d.ts

@@ -0,0 +1,2 @@
+export * from './MenuButton/index'
+export {}