@soyfri/shared-library 3.0.0 → 3.2.0

package/components/Icon/Icon.js

@@ -1,109 +1,6 @@
-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",
-  alignItems: "center",
-  justifyContent: "center",
-  color,
-  fontSize,
-  width: fontSize,
-  height: 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)" }
-  },
-  "& svg": {
-    width: "100%",
-    height: "100%",
-    fill: "currentColor",
-    display: "block"
-  },
-  "& img": {
-    width: "100%",
-    height: "100%",
-    display: "block"
-  }
-}));
-const Icon = ({
-  children,
-  path,
-  url,
-  alt = "icon",
-  viewBox = "0 0 24 24",
-  color = "var(--primary-color)",
-  outlined = false,
-  spin = false,
-  badge,
-  badgeColor = "primary",
-  badgePosition = { vertical: "bottom", horizontal: "right" },
-  size = "sm",
-  black,
-  white,
-  className,
-  sx
-}) => {
-  const finalColor = white ? "white" : black ? "black" : color;
-  const iconSize = sizeMap[size];
-  const content = useMemo(() => {
-    if (children) return children;
-    if (path) {
-      const trimmed = path.trim();
-      if (trimmed.startsWith("<svg")) {
-        return /* @__PURE__ */ jsx("span", { dangerouslySetInnerHTML: { __html: trimmed } });
-      }
-      return /* @__PURE__ */ jsx(
-        "svg",
-        {
-          xmlns: "http://www.w3.org/2000/svg",
-          viewBox,
-          fill: "currentColor",
-          "aria-hidden": "true",
-          children: /* @__PURE__ */ jsx("path", { d: trimmed })
-        }
-      );
-    }
-    if (url) {
-      return /* @__PURE__ */ jsx("img", { src: url, alt });
-    }
-    return null;
-  }, [children, path, url, alt, viewBox]);
-  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 || ""}`,
-          sx,
-          children: content
-        }
-      )
-    }
-  );
-};
+import { I, I as I2 } from "../../Icon-CUwK2c8z.js";
 export {
-  Icon,
-  Icon as default
+  I as Icon,
+  I2 as default
 };
 //# sourceMappingURL=Icon.js.map

package/components/Icon/Icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.js","sources":["../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import React, { type ReactNode, useMemo } from 'react';\nimport { Badge, styled } from '@mui/material';\nimport type { SxProps, Theme } from '@mui/material/styles';\n\nexport type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\nexport interface IconProps {\n  /**\n   * Contenido del icono. Modo legacy: acepta un elemento MUI o SVG ya armado.\n   * Si se usa junto con `path` o `url`, `children` tiene prioridad.\n   */\n  children?: ReactNode;\n  /**\n   * Ruta SVG inline. Acepta dos formatos:\n   * - Solo el valor del atributo `d` de un `<path>` (ej. `\"M12 2L2 22...\"`).\n   * - Un SVG completo (ej. `\"<svg>...</svg>\"`).\n   *\n   * ⚠️ Seguridad: cuando el string empieza con `<svg`, se inyecta vía\n   * `dangerouslySetInnerHTML`. **NUNCA pasar contenido proveniente de input\n   * de usuario o de backends no confiables** — riesgo XSS.\n   */\n  path?: string;\n  /**\n   * URL a un archivo `.svg` (asset local o remoto). Se renderiza vía `<img>`.\n   * El color del icono NO aplica en este modo (limitación de `<img>`).\n   */\n  url?: string;\n  /** Alt text cuando se usa `url`. Default: `\"icon\"`. */\n  alt?: string;\n  /**\n   * ViewBox cuando se usa `path`. Default: `\"0 0 24 24\"`. Ignorado si `path`\n   * ya viene como `<svg>` completo.\n   */\n  viewBox?: string;\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  size?: IconSize;\n  black?: boolean;\n  white?: boolean;\n  className?: string;\n  sx?: SxProps<Theme>;\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  alignItems: 'center',\n  justifyContent: 'center',\n  color: color,\n  fontSize: fontSize,\n  width: fontSize,\n  height: 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  '& svg': {\n    width: '100%',\n    height: '100%',\n    fill: 'currentColor',\n    display: 'block',\n  },\n  '& img': {\n    width: '100%',\n    height: '100%',\n    display: 'block',\n  },\n}));\n\nexport const Icon: React.FC<IconProps> = ({\n  children,\n  path,\n  url,\n  alt = 'icon',\n  viewBox = '0 0 24 24',\n  color = 'var(--primary-color)',\n  outlined = false,\n  spin = false,\n  badge,\n  badgeColor = 'primary',\n  badgePosition = { vertical: 'bottom', horizontal: 'right' },\n  size = 'sm',\n  black,\n  white,\n  className,\n  sx,\n}) => {\n  const finalColor = white ? 'white' : black ? 'black' : color;\n  const iconSize = sizeMap[size];\n\n  const content = useMemo(() => {\n    if (children) return children;\n\n    if (path) {\n      const trimmed = path.trim();\n      if (trimmed.startsWith('<svg')) {\n        return <span dangerouslySetInnerHTML={{ __html: trimmed }} />;\n      }\n      return (\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          viewBox={viewBox}\n          fill=\"currentColor\"\n          aria-hidden=\"true\"\n        >\n          <path d={trimmed} />\n        </svg>\n      );\n    }\n\n    if (url) {\n      return <img src={url} alt={alt} />;\n    }\n\n    return null;\n  }, [children, path, url, alt, viewBox]);\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        sx={sx}\n      >\n        {content}\n      </StyledIcon>\n    </Badge>\n  );\n};\n\nexport default Icon;\n"],"names":[],"mappings":";;;AAkDA,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,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,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;AAAA,EAExC,SAAS;AAAA,IACP,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA,EAAA;AAAA,EAEX,SAAS;AAAA,IACP,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,SAAS;AAAA,EAAA;AAEb,EAAE;AAEK,MAAM,OAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA,MAAM;AAAA,EACN,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,OAAO;AAAA,EACP;AAAA,EACA,aAAa;AAAA,EACb,gBAAgB,EAAE,UAAU,UAAU,YAAY,QAAA;AAAA,EAClD,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,aAAa,QAAQ,UAAU,QAAQ,UAAU;AACvD,QAAM,WAAW,QAAQ,IAAI;AAE7B,QAAM,UAAU,QAAQ,MAAM;AAC5B,QAAI,SAAU,QAAO;AAErB,QAAI,MAAM;AACR,YAAM,UAAU,KAAK,KAAA;AACrB,UAAI,QAAQ,WAAW,MAAM,GAAG;AAC9B,mCAAQ,QAAA,EAAK,yBAAyB,EAAE,QAAQ,WAAW;AAAA,MAC7D;AACA,aACE;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN;AAAA,UACA,MAAK;AAAA,UACL,eAAY;AAAA,UAEZ,UAAA,oBAAC,QAAA,EAAK,GAAG,QAAA,CAAS;AAAA,QAAA;AAAA,MAAA;AAAA,IAGxB;AAEA,QAAI,KAAK;AACP,aAAO,oBAAC,OAAA,EAAI,KAAK,KAAK,IAAA,CAAU;AAAA,IAClC;AAEA,WAAO;AAAA,EACT,GAAG,CAAC,UAAU,MAAM,KAAK,KAAK,OAAO,CAAC;AAEtC,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,UACtC;AAAA,UAEC,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"Icon.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/components/Input/Input.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const Input = require("../../Input-CScC87J5.cjs");
+const Input = require("../../Input-Bpjw7qwq.cjs");
 exports.Input = Input.Input;
 exports.default = Input.Input;
 //# sourceMappingURL=Input.cjs.map

package/components/Input/Input.d.ts

@@ -12,6 +12,10 @@ export interface BaseInputProps extends Omit<TextFieldProps, 'value' | 'onChange
     /** "outside" = label arriba del campo (default). "floating" = label clásico MUI dentro del borde */
     labelPosition?: LabelPosition;
     readOnly?: boolean;
+    /** Contenido al inicio del input (ej. icono de búsqueda). Atajo de `slotProps.input.startAdornment`. */
+    startAdornment?: React.ReactNode;
+    /** Contenido al final del input (ej. botón clear). Atajo de `slotProps.input.endAdornment`. */
+    endAdornment?: React.ReactNode;
     /**
      * Nombre del preset de estilo registrado en `theme.styles.Input`.
      * - `"default"` (o ausente) = estilo built-in del paquete.

package/components/Input/Input.helpers.d.ts

@@ -1,4 +1,4 @@
-import { InputHTMLAttributes } from 'react';
+import { InputHTMLAttributes, ReactNode } from 'react';
 import { TextFieldProps } from '@mui/material';
 import { InputType } from './Input';
 /**
@@ -11,4 +11,4 @@ export declare const parseValue: (raw: string, type: InputType) => string | numb
  * Construye los slotProps del TextField consolidando htmlInput + inputLabel.
  * Maneja los atributos min/max cuando type="number", maxLength y readOnly.
  */
-export declare const buildSlotProps: (type: InputType, min: number | undefined, max: number | undefined, maxLength: number | undefined, customSlotProps: TextFieldProps["slotProps"], customInputProps: InputHTMLAttributes<HTMLInputElement> | undefined, readOnly?: boolean) => TextFieldProps["slotProps"];
+export declare const buildSlotProps: (type: InputType, min: number | undefined, max: number | undefined, maxLength: number | undefined, customSlotProps: TextFieldProps["slotProps"], customInputProps: InputHTMLAttributes<HTMLInputElement> | undefined, readOnly?: boolean, startAdornment?: ReactNode, endAdornment?: ReactNode) => TextFieldProps["slotProps"];

package/components/Input/Input.js

@@ -1,4 +1,4 @@
-import { I, I as I2 } from "../../Input-DP_fKl38.js";
+import { I, I as I2 } from "../../Input-BibHlnGN.js";
 export {
   I as Input,
   I2 as default

package/components/InputGroup/InputGroup.cjs

@@ -1,140 +1,6 @@
 "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.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const jsxRuntime = require("react/jsx-runtime");
-const React = require("react");
-const material = require("@mui/material");
-const mergeSx = require("../../mergeSx-Dbccoo_H.cjs");
-const tokens = require("../../tokens-jaWWNk39.cjs");
-const InputGroup = ({
-  children,
-  sx,
-  slotSx,
-  borderRadius = 10,
-  disabled,
-  orientation = "horizontal",
-  className
-}) => {
-  const radius = typeof borderRadius === "number" ? `${borderRadius}px` : borderRadius;
-  const slots = React.Children.toArray(children).filter(React.isValidElement);
-  const isHorizontal = orientation === "horizontal";
-  const baseSx = {
-    // Respeta el label "outside" de Input/Select: los hijos pierden su marginTop
-    // (ver más abajo) y el grupo reserva el mismo espacio arriba para que los
-    // labels floten por encima del borde del grupo.
-    marginTop: tokens.LABEL_MARGIN_TOP,
-    display: "flex",
-    flexDirection: isHorizontal ? "row" : "column",
-    alignItems: "stretch",
-    width: "100%",
-    border: (theme) => `1px solid ${theme.palette.divider}`,
-    borderRadius: radius,
-    backgroundColor: "background.paper",
-    transition: "border-color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms, box-shadow 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms",
-    "&:focus-within": {
-      borderColor: "primary.main",
-      boxShadow: (theme) => `0 0 0 1px ${theme.palette.primary.main}`
-    },
-    opacity: disabled ? 0.6 : 1,
-    pointerEvents: disabled ? "none" : "auto",
-    // Cancelar el marginTop que Input/Select reservan en labelPosition="outside".
-    // El grupo ya lo reservó en su nivel externo.
-    "& .MuiFormControl-root, & > [data-input-group-slot] > .MuiTextField-root, & > [data-input-group-slot] > .MuiFormControl-root": {
-      marginTop: 0
-    },
-    // Quitar el borde del notched outline interno: el borde visible es el del
-    // grupo, los separadores son los borderRight/borderBottom de cada slot.
-    "& .MuiOutlinedInput-notchedOutline": {
-      border: "none"
-    },
-    // Forzar que todos los campos pinten sus esquinas cuadradas (las esquinas
-    // redondeadas se aplican solo al primer/último slot más abajo).
-    "& .MuiInputBase-root, & .MuiChip-root": {
-      borderRadius: 0
-    },
-    // Botones integrados: sin radius propio, altura completa, sin sombra.
-    "& .MuiButton-root": {
-      borderRadius: 0,
-      height: "100%",
-      boxShadow: "none",
-      border: "none"
-    },
-    // Slots: cada hijo vive en un slot neutro que lo centra verticalmente.
-    "& > [data-input-group-slot]": __spreadProps(__spreadValues({
-      flex: 1,
-      display: "flex",
-      alignItems: "center",
-      minWidth: 0
-    }, isHorizontal ? { borderRight: (theme) => `1px solid ${theme.palette.divider}` } : { borderBottom: (theme) => `1px solid ${theme.palette.divider}` }), {
-      "&:last-of-type": {
-        borderRight: "none",
-        borderBottom: "none"
-      }
-    }),
-    // Esquinas redondeadas: primer slot (izquierda o arriba).
-    "& > [data-input-group-slot]:first-of-type .MuiInputBase-root, & > [data-input-group-slot]:first-of-type .MuiButton-root, & > [data-input-group-slot]:first-of-type .MuiChip-root": isHorizontal ? {
-      borderTopLeftRadius: radius,
-      borderBottomLeftRadius: radius
-    } : {
-      borderTopLeftRadius: radius,
-      borderTopRightRadius: radius
-    },
-    // Esquinas redondeadas: último slot (derecha o abajo).
-    "& > [data-input-group-slot]:last-of-type .MuiInputBase-root, & > [data-input-group-slot]:last-of-type .MuiButton-root, & > [data-input-group-slot]:last-of-type .MuiChip-root": isHorizontal ? {
-      borderTopRightRadius: radius,
-      borderBottomRightRadius: radius
-    } : {
-      borderBottomLeftRadius: radius,
-      borderBottomRightRadius: radius
-    }
-  };
-  const baseSlotSx = {
-    flex: 1,
-    display: "flex",
-    alignItems: "center",
-    minWidth: 0
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    material.Box,
-    {
-      "data-testid": "input-group",
-      className,
-      "aria-disabled": disabled ? "true" : void 0,
-      sx: mergeSx.mergeSx(baseSx, sx),
-      children: slots.map((child, i) => {
-        var _a;
-        const slotKey = (_a = child.key) != null ? _a : i;
-        return /* @__PURE__ */ jsxRuntime.jsx(
-          material.Box,
-          {
-            "data-input-group-slot": true,
-            sx: mergeSx.mergeSx(baseSlotSx, slotSx),
-            children: child
-          },
-          slotKey
-        );
-      })
-    }
-  );
-};
-exports.InputGroup = InputGroup;
-exports.default = InputGroup;
+const InputGroup = require("../../InputGroup-BZ7cmAcg.cjs");
+exports.InputGroup = InputGroup.InputGroup;
+exports.default = InputGroup.InputGroup;
 //# sourceMappingURL=InputGroup.cjs.map

package/components/InputGroup/InputGroup.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"InputGroup.cjs","sources":["../../../src/components/InputGroup/InputGroup.tsx"],"sourcesContent":["import React, { Children, isValidElement } from 'react';\nimport { Box, type SxProps, type Theme } from '@mui/material';\n\nimport { mergeSx } from '../_shared/mergeSx';\nimport { LABEL_MARGIN_TOP } from '../../theme/tokens';\n\nexport interface InputGroupProps {\n  children: React.ReactNode;\n  /**\n   * sx aplicado al contenedor raíz del grupo. Se mergea sobre los defaults.\n   */\n  sx?: SxProps<Theme>;\n  /**\n   * sx aplicado a cada slot individual. Útil para controlar flex/gap entre\n   * los hijos del grupo.\n   */\n  slotSx?: SxProps<Theme>;\n  /**\n   * Radio del borde del grupo. Default: 10.\n   */\n  borderRadius?: number | string;\n  /**\n   * Desactiva visualmente el grupo (no cascada lógica — los hijos deben\n   * manejar su propio `disabled`).\n   */\n  disabled?: boolean;\n  /**\n   * Orientación del grupo. Default: 'horizontal'.\n   */\n  orientation?: 'horizontal' | 'vertical';\n  className?: string;\n}\n\n/**\n * Agrupa visualmente varios componentes de entrada (Input / Select / DatePicker /\n * Button, etc.) compartiendo un solo borde y con separadores internos.\n *\n * El grupo respeta el espacio que Input/Select reservan para su label `outside`\n * (`LABEL_MARGIN_TOP`) moviendo ese reservado al contenedor externo y\n * cancelándolo en los hijos. Los labels siguen flotando por encima del borde\n * del grupo con la misma animación que fuera del grupo.\n *\n * No inspecciona el tipo de cada hijo; aplica los overrides a través de\n * descendant selectors por CSS para funcionar con cualquier wrapper / memoizado.\n */\nexport const InputGroup: React.FC<InputGroupProps> = ({\n  children,\n  sx,\n  slotSx,\n  borderRadius = 10,\n  disabled,\n  orientation = 'horizontal',\n  className,\n}) => {\n  const radius = typeof borderRadius === 'number' ? `${borderRadius}px` : borderRadius;\n  const slots = Children.toArray(children).filter(isValidElement);\n  const isHorizontal = orientation === 'horizontal';\n\n  const baseSx: SxProps<Theme> = {\n    // Respeta el label \"outside\" de Input/Select: los hijos pierden su marginTop\n    // (ver más abajo) y el grupo reserva el mismo espacio arriba para que los\n    // labels floten por encima del borde del grupo.\n    marginTop: LABEL_MARGIN_TOP,\n\n    display: 'flex',\n    flexDirection: isHorizontal ? 'row' : 'column',\n    alignItems: 'stretch',\n    width: '100%',\n    border: (theme) => `1px solid ${theme.palette.divider}`,\n    borderRadius: radius,\n    backgroundColor: 'background.paper',\n    transition:\n      'border-color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms, box-shadow 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms',\n    '&:focus-within': {\n      borderColor: 'primary.main',\n      boxShadow: (theme) => `0 0 0 1px ${theme.palette.primary.main}`,\n    },\n    opacity: disabled ? 0.6 : 1,\n    pointerEvents: disabled ? 'none' : 'auto',\n\n    // Cancelar el marginTop que Input/Select reservan en labelPosition=\"outside\".\n    // El grupo ya lo reservó en su nivel externo.\n    '& .MuiFormControl-root, & > [data-input-group-slot] > .MuiTextField-root, & > [data-input-group-slot] > .MuiFormControl-root':\n      {\n        marginTop: 0,\n      },\n\n    // Quitar el borde del notched outline interno: el borde visible es el del\n    // grupo, los separadores son los borderRight/borderBottom de cada slot.\n    '& .MuiOutlinedInput-notchedOutline': {\n      border: 'none',\n    },\n\n    // Forzar que todos los campos pinten sus esquinas cuadradas (las esquinas\n    // redondeadas se aplican solo al primer/último slot más abajo).\n    '& .MuiInputBase-root, & .MuiChip-root': {\n      borderRadius: 0,\n    },\n\n    // Botones integrados: sin radius propio, altura completa, sin sombra.\n    '& .MuiButton-root': {\n      borderRadius: 0,\n      height: '100%',\n      boxShadow: 'none',\n      border: 'none',\n    },\n\n    // Slots: cada hijo vive en un slot neutro que lo centra verticalmente.\n    '& > [data-input-group-slot]': {\n      flex: 1,\n      display: 'flex',\n      alignItems: 'center',\n      minWidth: 0,\n      // Separador entre slots (horizontal: borderRight / vertical: borderBottom),\n      // usando el color de divider del theme.\n      ...(isHorizontal\n        ? { borderRight: (theme: Theme) => `1px solid ${theme.palette.divider}` }\n        : { borderBottom: (theme: Theme) => `1px solid ${theme.palette.divider}` }),\n      '&:last-of-type': {\n        borderRight: 'none',\n        borderBottom: 'none',\n      },\n    },\n\n    // Esquinas redondeadas: primer slot (izquierda o arriba).\n    '& > [data-input-group-slot]:first-of-type .MuiInputBase-root, & > [data-input-group-slot]:first-of-type .MuiButton-root, & > [data-input-group-slot]:first-of-type .MuiChip-root':\n      isHorizontal\n        ? {\n            borderTopLeftRadius: radius,\n            borderBottomLeftRadius: radius,\n          }\n        : {\n            borderTopLeftRadius: radius,\n            borderTopRightRadius: radius,\n          },\n\n    // Esquinas redondeadas: último slot (derecha o abajo).\n    '& > [data-input-group-slot]:last-of-type .MuiInputBase-root, & > [data-input-group-slot]:last-of-type .MuiButton-root, & > [data-input-group-slot]:last-of-type .MuiChip-root':\n      isHorizontal\n        ? {\n            borderTopRightRadius: radius,\n            borderBottomRightRadius: radius,\n          }\n        : {\n            borderBottomLeftRadius: radius,\n            borderBottomRightRadius: radius,\n          },\n  };\n\n  const baseSlotSx: SxProps<Theme> = {\n    flex: 1,\n    display: 'flex',\n    alignItems: 'center',\n    minWidth: 0,\n  };\n\n  return (\n    <Box\n      data-testid=\"input-group\"\n      className={className}\n      aria-disabled={disabled ? 'true' : undefined}\n      sx={mergeSx(baseSx, sx)}\n    >\n      {slots.map((child, i) => {\n        const slotKey = (child as React.ReactElement).key ?? i;\n        return (\n          <Box\n            key={slotKey}\n            data-input-group-slot\n            sx={mergeSx(baseSlotSx, slotSx)}\n          >\n            {child}\n          </Box>\n        );\n      })}\n    </Box>\n  );\n};\n\nexport default InputGroup;\n"],"names":["Children","isValidElement","LABEL_MARGIN_TOP","jsx","Box","mergeSx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AA6CO,MAAM,aAAwC,CAAC;AAAA,EACpD;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf;AAAA,EACA,cAAc;AAAA,EACd;AACF,MAAM;AACJ,QAAM,SAAS,OAAO,iBAAiB,WAAW,GAAG,YAAY,OAAO;AACxE,QAAM,QAAQA,MAAAA,SAAS,QAAQ,QAAQ,EAAE,OAAOC,oBAAc;AAC9D,QAAM,eAAe,gBAAgB;AAErC,QAAM,SAAyB;AAAA;AAAA;AAAA;AAAA,IAI7B,WAAWC,OAAAA;AAAAA,IAEX,SAAS;AAAA,IACT,eAAe,eAAe,QAAQ;AAAA,IACtC,YAAY;AAAA,IACZ,OAAO;AAAA,IACP,QAAQ,CAAC,UAAU,aAAa,MAAM,QAAQ,OAAO;AAAA,IACrD,cAAc;AAAA,IACd,iBAAiB;AAAA,IACjB,YACE;AAAA,IACF,kBAAkB;AAAA,MAChB,aAAa;AAAA,MACb,WAAW,CAAC,UAAU,aAAa,MAAM,QAAQ,QAAQ,IAAI;AAAA,IAAA;AAAA,IAE/D,SAAS,WAAW,MAAM;AAAA,IAC1B,eAAe,WAAW,SAAS;AAAA;AAAA;AAAA,IAInC,gIACE;AAAA,MACE,WAAW;AAAA,IAAA;AAAA;AAAA;AAAA,IAKf,sCAAsC;AAAA,MACpC,QAAQ;AAAA,IAAA;AAAA;AAAA;AAAA,IAKV,yCAAyC;AAAA,MACvC,cAAc;AAAA,IAAA;AAAA;AAAA,IAIhB,qBAAqB;AAAA,MACnB,cAAc;AAAA,MACd,QAAQ;AAAA,MACR,WAAW;AAAA,MACX,QAAQ;AAAA,IAAA;AAAA;AAAA,IAIV,+BAA+B;AAAA,MAC7B,MAAM;AAAA,MACN,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,UAAU;AAAA,OAGN,eACA,EAAE,aAAa,CAAC,UAAiB,aAAa,MAAM,QAAQ,OAAO,OACnE,EAAE,cAAc,CAAC,UAAiB,aAAa,MAAM,QAAQ,OAAO,GAAA,IAT3C;AAAA,MAU7B,kBAAkB;AAAA,QAChB,aAAa;AAAA,QACb,cAAc;AAAA,MAAA;AAAA,IAChB;AAAA;AAAA,IAIF,oLACE,eACI;AAAA,MACE,qBAAqB;AAAA,MACrB,wBAAwB;AAAA,IAAA,IAE1B;AAAA,MACE,qBAAqB;AAAA,MACrB,sBAAsB;AAAA,IAAA;AAAA;AAAA,IAI9B,iLACE,eACI;AAAA,MACE,sBAAsB;AAAA,MACtB,yBAAyB;AAAA,IAAA,IAE3B;AAAA,MACE,wBAAwB;AAAA,MACxB,yBAAyB;AAAA,IAAA;AAAA,EAC3B;AAGR,QAAM,aAA6B;AAAA,IACjC,MAAM;AAAA,IACN,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,UAAU;AAAA,EAAA;AAGZ,SACEC,2BAAAA;AAAAA,IAACC,SAAAA;AAAAA,IAAA;AAAA,MACC,eAAY;AAAA,MACZ;AAAA,MACA,iBAAe,WAAW,SAAS;AAAA,MACnC,IAAIC,QAAAA,QAAQ,QAAQ,EAAE;AAAA,MAErB,UAAA,MAAM,IAAI,CAAC,OAAO,MAAM;;AACvB,cAAM,WAAW,WAA6B,QAA7B,YAAoC;AACrD,eACEF,2BAAAA;AAAAA,UAACC,SAAAA;AAAAA,UAAA;AAAA,YAEC,yBAAqB;AAAA,YACrB,IAAIC,QAAAA,QAAQ,YAAY,MAAM;AAAA,YAE7B,UAAA;AAAA,UAAA;AAAA,UAJI;AAAA,QAAA;AAAA,MAOX,CAAC;AAAA,IAAA;AAAA,EAAA;AAGP;;;"}
+{"version":3,"file":"InputGroup.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/components/InputGroup/InputGroup.js

@@ -1,140 +1,6 @@
-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 } from "react";
-import { Box } from "@mui/material";
-import { m as mergeSx } from "../../mergeSx-BXoNZjB_.js";
-import { L as LABEL_MARGIN_TOP } from "../../tokens-BRrcP_p_.js";
-const InputGroup = ({
-  children,
-  sx,
-  slotSx,
-  borderRadius = 10,
-  disabled,
-  orientation = "horizontal",
-  className
-}) => {
-  const radius = typeof borderRadius === "number" ? `${borderRadius}px` : borderRadius;
-  const slots = Children.toArray(children).filter(isValidElement);
-  const isHorizontal = orientation === "horizontal";
-  const baseSx = {
-    // Respeta el label "outside" de Input/Select: los hijos pierden su marginTop
-    // (ver más abajo) y el grupo reserva el mismo espacio arriba para que los
-    // labels floten por encima del borde del grupo.
-    marginTop: LABEL_MARGIN_TOP,
-    display: "flex",
-    flexDirection: isHorizontal ? "row" : "column",
-    alignItems: "stretch",
-    width: "100%",
-    border: (theme) => `1px solid ${theme.palette.divider}`,
-    borderRadius: radius,
-    backgroundColor: "background.paper",
-    transition: "border-color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms, box-shadow 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms",
-    "&:focus-within": {
-      borderColor: "primary.main",
-      boxShadow: (theme) => `0 0 0 1px ${theme.palette.primary.main}`
-    },
-    opacity: disabled ? 0.6 : 1,
-    pointerEvents: disabled ? "none" : "auto",
-    // Cancelar el marginTop que Input/Select reservan en labelPosition="outside".
-    // El grupo ya lo reservó en su nivel externo.
-    "& .MuiFormControl-root, & > [data-input-group-slot] > .MuiTextField-root, & > [data-input-group-slot] > .MuiFormControl-root": {
-      marginTop: 0
-    },
-    // Quitar el borde del notched outline interno: el borde visible es el del
-    // grupo, los separadores son los borderRight/borderBottom de cada slot.
-    "& .MuiOutlinedInput-notchedOutline": {
-      border: "none"
-    },
-    // Forzar que todos los campos pinten sus esquinas cuadradas (las esquinas
-    // redondeadas se aplican solo al primer/último slot más abajo).
-    "& .MuiInputBase-root, & .MuiChip-root": {
-      borderRadius: 0
-    },
-    // Botones integrados: sin radius propio, altura completa, sin sombra.
-    "& .MuiButton-root": {
-      borderRadius: 0,
-      height: "100%",
-      boxShadow: "none",
-      border: "none"
-    },
-    // Slots: cada hijo vive en un slot neutro que lo centra verticalmente.
-    "& > [data-input-group-slot]": __spreadProps(__spreadValues({
-      flex: 1,
-      display: "flex",
-      alignItems: "center",
-      minWidth: 0
-    }, isHorizontal ? { borderRight: (theme) => `1px solid ${theme.palette.divider}` } : { borderBottom: (theme) => `1px solid ${theme.palette.divider}` }), {
-      "&:last-of-type": {
-        borderRight: "none",
-        borderBottom: "none"
-      }
-    }),
-    // Esquinas redondeadas: primer slot (izquierda o arriba).
-    "& > [data-input-group-slot]:first-of-type .MuiInputBase-root, & > [data-input-group-slot]:first-of-type .MuiButton-root, & > [data-input-group-slot]:first-of-type .MuiChip-root": isHorizontal ? {
-      borderTopLeftRadius: radius,
-      borderBottomLeftRadius: radius
-    } : {
-      borderTopLeftRadius: radius,
-      borderTopRightRadius: radius
-    },
-    // Esquinas redondeadas: último slot (derecha o abajo).
-    "& > [data-input-group-slot]:last-of-type .MuiInputBase-root, & > [data-input-group-slot]:last-of-type .MuiButton-root, & > [data-input-group-slot]:last-of-type .MuiChip-root": isHorizontal ? {
-      borderTopRightRadius: radius,
-      borderBottomRightRadius: radius
-    } : {
-      borderBottomLeftRadius: radius,
-      borderBottomRightRadius: radius
-    }
-  };
-  const baseSlotSx = {
-    flex: 1,
-    display: "flex",
-    alignItems: "center",
-    minWidth: 0
-  };
-  return /* @__PURE__ */ jsx(
-    Box,
-    {
-      "data-testid": "input-group",
-      className,
-      "aria-disabled": disabled ? "true" : void 0,
-      sx: mergeSx(baseSx, sx),
-      children: slots.map((child, i) => {
-        var _a;
-        const slotKey = (_a = child.key) != null ? _a : i;
-        return /* @__PURE__ */ jsx(
-          Box,
-          {
-            "data-input-group-slot": true,
-            sx: mergeSx(baseSlotSx, slotSx),
-            children: child
-          },
-          slotKey
-        );
-      })
-    }
-  );
-};
+import { I, I as I2 } from "../../InputGroup-D5pXKGjZ.js";
 export {
-  InputGroup,
-  InputGroup as default
+  I as InputGroup,
+  I2 as default
 };
 //# sourceMappingURL=InputGroup.js.map

package/components/InputGroup/InputGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputGroup.js","sources":["../../../src/components/InputGroup/InputGroup.tsx"],"sourcesContent":["import React, { Children, isValidElement } from 'react';\nimport { Box, type SxProps, type Theme } from '@mui/material';\n\nimport { mergeSx } from '../_shared/mergeSx';\nimport { LABEL_MARGIN_TOP } from '../../theme/tokens';\n\nexport interface InputGroupProps {\n  children: React.ReactNode;\n  /**\n   * sx aplicado al contenedor raíz del grupo. Se mergea sobre los defaults.\n   */\n  sx?: SxProps<Theme>;\n  /**\n   * sx aplicado a cada slot individual. Útil para controlar flex/gap entre\n   * los hijos del grupo.\n   */\n  slotSx?: SxProps<Theme>;\n  /**\n   * Radio del borde del grupo. Default: 10.\n   */\n  borderRadius?: number | string;\n  /**\n   * Desactiva visualmente el grupo (no cascada lógica — los hijos deben\n   * manejar su propio `disabled`).\n   */\n  disabled?: boolean;\n  /**\n   * Orientación del grupo. Default: 'horizontal'.\n   */\n  orientation?: 'horizontal' | 'vertical';\n  className?: string;\n}\n\n/**\n * Agrupa visualmente varios componentes de entrada (Input / Select / DatePicker /\n * Button, etc.) compartiendo un solo borde y con separadores internos.\n *\n * El grupo respeta el espacio que Input/Select reservan para su label `outside`\n * (`LABEL_MARGIN_TOP`) moviendo ese reservado al contenedor externo y\n * cancelándolo en los hijos. Los labels siguen flotando por encima del borde\n * del grupo con la misma animación que fuera del grupo.\n *\n * No inspecciona el tipo de cada hijo; aplica los overrides a través de\n * descendant selectors por CSS para funcionar con cualquier wrapper / memoizado.\n */\nexport const InputGroup: React.FC<InputGroupProps> = ({\n  children,\n  sx,\n  slotSx,\n  borderRadius = 10,\n  disabled,\n  orientation = 'horizontal',\n  className,\n}) => {\n  const radius = typeof borderRadius === 'number' ? `${borderRadius}px` : borderRadius;\n  const slots = Children.toArray(children).filter(isValidElement);\n  const isHorizontal = orientation === 'horizontal';\n\n  const baseSx: SxProps<Theme> = {\n    // Respeta el label \"outside\" de Input/Select: los hijos pierden su marginTop\n    // (ver más abajo) y el grupo reserva el mismo espacio arriba para que los\n    // labels floten por encima del borde del grupo.\n    marginTop: LABEL_MARGIN_TOP,\n\n    display: 'flex',\n    flexDirection: isHorizontal ? 'row' : 'column',\n    alignItems: 'stretch',\n    width: '100%',\n    border: (theme) => `1px solid ${theme.palette.divider}`,\n    borderRadius: radius,\n    backgroundColor: 'background.paper',\n    transition:\n      'border-color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms, box-shadow 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms',\n    '&:focus-within': {\n      borderColor: 'primary.main',\n      boxShadow: (theme) => `0 0 0 1px ${theme.palette.primary.main}`,\n    },\n    opacity: disabled ? 0.6 : 1,\n    pointerEvents: disabled ? 'none' : 'auto',\n\n    // Cancelar el marginTop que Input/Select reservan en labelPosition=\"outside\".\n    // El grupo ya lo reservó en su nivel externo.\n    '& .MuiFormControl-root, & > [data-input-group-slot] > .MuiTextField-root, & > [data-input-group-slot] > .MuiFormControl-root':\n      {\n        marginTop: 0,\n      },\n\n    // Quitar el borde del notched outline interno: el borde visible es el del\n    // grupo, los separadores son los borderRight/borderBottom de cada slot.\n    '& .MuiOutlinedInput-notchedOutline': {\n      border: 'none',\n    },\n\n    // Forzar que todos los campos pinten sus esquinas cuadradas (las esquinas\n    // redondeadas se aplican solo al primer/último slot más abajo).\n    '& .MuiInputBase-root, & .MuiChip-root': {\n      borderRadius: 0,\n    },\n\n    // Botones integrados: sin radius propio, altura completa, sin sombra.\n    '& .MuiButton-root': {\n      borderRadius: 0,\n      height: '100%',\n      boxShadow: 'none',\n      border: 'none',\n    },\n\n    // Slots: cada hijo vive en un slot neutro que lo centra verticalmente.\n    '& > [data-input-group-slot]': {\n      flex: 1,\n      display: 'flex',\n      alignItems: 'center',\n      minWidth: 0,\n      // Separador entre slots (horizontal: borderRight / vertical: borderBottom),\n      // usando el color de divider del theme.\n      ...(isHorizontal\n        ? { borderRight: (theme: Theme) => `1px solid ${theme.palette.divider}` }\n        : { borderBottom: (theme: Theme) => `1px solid ${theme.palette.divider}` }),\n      '&:last-of-type': {\n        borderRight: 'none',\n        borderBottom: 'none',\n      },\n    },\n\n    // Esquinas redondeadas: primer slot (izquierda o arriba).\n    '& > [data-input-group-slot]:first-of-type .MuiInputBase-root, & > [data-input-group-slot]:first-of-type .MuiButton-root, & > [data-input-group-slot]:first-of-type .MuiChip-root':\n      isHorizontal\n        ? {\n            borderTopLeftRadius: radius,\n            borderBottomLeftRadius: radius,\n          }\n        : {\n            borderTopLeftRadius: radius,\n            borderTopRightRadius: radius,\n          },\n\n    // Esquinas redondeadas: último slot (derecha o abajo).\n    '& > [data-input-group-slot]:last-of-type .MuiInputBase-root, & > [data-input-group-slot]:last-of-type .MuiButton-root, & > [data-input-group-slot]:last-of-type .MuiChip-root':\n      isHorizontal\n        ? {\n            borderTopRightRadius: radius,\n            borderBottomRightRadius: radius,\n          }\n        : {\n            borderBottomLeftRadius: radius,\n            borderBottomRightRadius: radius,\n          },\n  };\n\n  const baseSlotSx: SxProps<Theme> = {\n    flex: 1,\n    display: 'flex',\n    alignItems: 'center',\n    minWidth: 0,\n  };\n\n  return (\n    <Box\n      data-testid=\"input-group\"\n      className={className}\n      aria-disabled={disabled ? 'true' : undefined}\n      sx={mergeSx(baseSx, sx)}\n    >\n      {slots.map((child, i) => {\n        const slotKey = (child as React.ReactElement).key ?? i;\n        return (\n          <Box\n            key={slotKey}\n            data-input-group-slot\n            sx={mergeSx(baseSlotSx, slotSx)}\n          >\n            {child}\n          </Box>\n        );\n      })}\n    </Box>\n  );\n};\n\nexport default InputGroup;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AA6CO,MAAM,aAAwC,CAAC;AAAA,EACpD;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf;AAAA,EACA,cAAc;AAAA,EACd;AACF,MAAM;AACJ,QAAM,SAAS,OAAO,iBAAiB,WAAW,GAAG,YAAY,OAAO;AACxE,QAAM,QAAQ,SAAS,QAAQ,QAAQ,EAAE,OAAO,cAAc;AAC9D,QAAM,eAAe,gBAAgB;AAErC,QAAM,SAAyB;AAAA;AAAA;AAAA;AAAA,IAI7B,WAAW;AAAA,IAEX,SAAS;AAAA,IACT,eAAe,eAAe,QAAQ;AAAA,IACtC,YAAY;AAAA,IACZ,OAAO;AAAA,IACP,QAAQ,CAAC,UAAU,aAAa,MAAM,QAAQ,OAAO;AAAA,IACrD,cAAc;AAAA,IACd,iBAAiB;AAAA,IACjB,YACE;AAAA,IACF,kBAAkB;AAAA,MAChB,aAAa;AAAA,MACb,WAAW,CAAC,UAAU,aAAa,MAAM,QAAQ,QAAQ,IAAI;AAAA,IAAA;AAAA,IAE/D,SAAS,WAAW,MAAM;AAAA,IAC1B,eAAe,WAAW,SAAS;AAAA;AAAA;AAAA,IAInC,gIACE;AAAA,MACE,WAAW;AAAA,IAAA;AAAA;AAAA;AAAA,IAKf,sCAAsC;AAAA,MACpC,QAAQ;AAAA,IAAA;AAAA;AAAA;AAAA,IAKV,yCAAyC;AAAA,MACvC,cAAc;AAAA,IAAA;AAAA;AAAA,IAIhB,qBAAqB;AAAA,MACnB,cAAc;AAAA,MACd,QAAQ;AAAA,MACR,WAAW;AAAA,MACX,QAAQ;AAAA,IAAA;AAAA;AAAA,IAIV,+BAA+B;AAAA,MAC7B,MAAM;AAAA,MACN,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,UAAU;AAAA,OAGN,eACA,EAAE,aAAa,CAAC,UAAiB,aAAa,MAAM,QAAQ,OAAO,OACnE,EAAE,cAAc,CAAC,UAAiB,aAAa,MAAM,QAAQ,OAAO,GAAA,IAT3C;AAAA,MAU7B,kBAAkB;AAAA,QAChB,aAAa;AAAA,QACb,cAAc;AAAA,MAAA;AAAA,IAChB;AAAA;AAAA,IAIF,oLACE,eACI;AAAA,MACE,qBAAqB;AAAA,MACrB,wBAAwB;AAAA,IAAA,IAE1B;AAAA,MACE,qBAAqB;AAAA,MACrB,sBAAsB;AAAA,IAAA;AAAA;AAAA,IAI9B,iLACE,eACI;AAAA,MACE,sBAAsB;AAAA,MACtB,yBAAyB;AAAA,IAAA,IAE3B;AAAA,MACE,wBAAwB;AAAA,MACxB,yBAAyB;AAAA,IAAA;AAAA,EAC3B;AAGR,QAAM,aAA6B;AAAA,IACjC,MAAM;AAAA,IACN,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,UAAU;AAAA,EAAA;AAGZ,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,eAAY;AAAA,MACZ;AAAA,MACA,iBAAe,WAAW,SAAS;AAAA,MACnC,IAAI,QAAQ,QAAQ,EAAE;AAAA,MAErB,UAAA,MAAM,IAAI,CAAC,OAAO,MAAM;;AACvB,cAAM,WAAW,WAA6B,QAA7B,YAAoC;AACrD,eACE;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,yBAAqB;AAAA,YACrB,IAAI,QAAQ,YAAY,MAAM;AAAA,YAE7B,UAAA;AAAA,UAAA;AAAA,UAJI;AAAA,QAAA;AAAA,MAOX,CAAC;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"InputGroup.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/components/MenuButton/MenuButton.cjs

@@ -1,78 +1,5 @@
 "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;
+const MenuButton = require("../../MenuButton-C4s8rG05.cjs");
+exports.MenuButton = MenuButton.MenuButton;
 //# sourceMappingURL=MenuButton.cjs.map

package/components/MenuButton/MenuButton.cjs.map

@@ -1 +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;;"}
+{"version":3,"file":"MenuButton.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/components/MenuButton/MenuButton.d.ts

@@ -10,6 +10,12 @@ interface MenuButtonProps {
     buttonIcon?: ReactNode;
     options: MenuOption[];
     variant?: ButtonProps['variant'];
+    /**
+     * Nombre accesible del botón. Obligatorio en la práctica cuando el disparador
+     * es solo un ícono (`buttonText` vacío): sin esto el botón queda sin nombre
+     * para lectores de pantalla, que es el caso de los menús de acción por fila.
+     */
+    'aria-label'?: string;
 }
 export declare const MenuButton: React.FC<MenuButtonProps>;
 export default MenuButton;